img-style

5 files changed, 41 insertions, 5 deletions

diff --git a/assets/css/_ublogger.scss b/assets/css/_ublogger.scss
index 7195d52..5f53da6 100644
--- a/assets/css/_ublogger.scss
+++ b/assets/css/_ublogger.scss
@@ -267,6 +267,28 @@ a.post-tag-summary {
   line-height: 3.2rem;
 }
 
+.img-style {
+  margin: 1.5rem 0;
+}
+
+.img-center {
+  margin-left: auto;
+  margin-right: auto;
+}
+
+.img-size-30 {
+  width: 30%;
+}
+
+.img-size-50 {
+  width: 50%;
+}
+
+.img-right {
+  float: right;
+  margin-left: 10px;
+}
+
 .img-frame {
 
   margin-bottom: 1.5rem;
@@ -803,6 +825,7 @@ a.post-tag-summary {
 
 .block-media_right {
   float: right;
+  text-align: right;
   padding-right: 0;
   margin-left: 40px;
   margin-bottom: 10px;
@@ -1270,7 +1293,7 @@ code[class*="language-"], pre[class*="language-"] {
   font-size: 16px;
   line-height: 1.5rem;
 
-  p{
+  p {
     margin: .5rem 0 !important;
   }
 }
diff --git a/assets/css/_ublogger_media.scss b/assets/css/_ublogger_media.scss
index 1bfac25..228ac7f 100644
--- a/assets/css/_ublogger_media.scss
+++ b/assets/css/_ublogger_media.scss
@@ -157,6 +157,16 @@
     padding: 40px 60px 20px 60px;
   }
 
+  .img-right {
+    float: none;
+    margin-left: auto;
+    margin-right: auto;
+  }
+
+  .img-size-30, .img-size-50 {
+    width: 100%;
+  }
+
 }
 
 @media only screen and (max-width: 680px) {
diff --git a/layouts/shortcodes/block-media-right.html b/layouts/shortcodes/block-media-right.html
index e060bce..3146680 100644
--- a/layouts/shortcodes/block-media-right.html
+++ b/layouts/shortcodes/block-media-right.html
@@ -1,3 +1,4 @@
-<div class="block-media block-media_right">
+{{ $width := cond $.IsNamedParams ($.Get "width") "" }}
+<div class="block-media block-media_right" {{ with $width }}style="width:{{ . }}"{{ end }}>
     {{ .Inner | $.Page.RenderString }}
 </div>
\ No newline at end of file
diff --git a/layouts/shortcodes/img-style.html b/layouts/shortcodes/img-style.html
new file mode 100644
index 0000000..4f0dd7d
--- /dev/null
+++ b/layouts/shortcodes/img-style.html
@@ -0,0 +1,5 @@
+{{- $size := cond $.IsNamedParams ($.Get "size") "" | default "" -}}
+{{- $position := cond $.IsNamedParams ($.Get "position") "" | default "center" -}}
+<div class="img-style {{ with $position }}img-{{ . }}{{ end }} {{ if ($.Get `frame`) }}img-frame{{ end }} {{ with $size }}img-size-{{ . }}{{ end }} {{ if ($.Get `right`) }}img-right{{ end }}">
+        {{ .Inner }}
+</div>
\ No newline at end of file
diff --git a/layouts/shortcodes/pic-frame.html b/layouts/shortcodes/pic-frame.html
deleted file mode 100644
index 48d2047..0000000
--- a/layouts/shortcodes/pic-frame.html
+++ /dev/null
@@ -1,3 +0,0 @@
-<div class="img-frame">
-    {{ .Inner }}
-</div>
\ No newline at end of file