8.1.1

- Fixed rim not applying properly
hrsetyono · Nov 30, 2020 · d375266 · d375266
1 parent 827c496
commit d375266
Show file tree

Hide file tree

Showing 7 changed files with 62 additions and 73 deletions.
diff --git a/assets/dist/app.css b/assets/dist/app.css
@@ -93,7 +93,7 @@
   --siteWidth: 1120px;
   --blogWidth: 650px;
   --gridGap: 20px;
-  --gridRim: 10px;
+  --gridRim: 1rem;
   --tileGap: 20px;
   --gRadius: 4px;
   --gTransition: all .25s ease-in-out;
@@ -896,8 +896,6 @@ select {
 .the-content {
   letter-spacing: calc(0.01 * var(--fontSize));
   overflow-wrap: break-word; }
-  .the-content > .alignfull.has-background:first-child {
-    margin-top: calc(-1 * var(--groupSpacing)); }
   .the-content ul, .the-content ol {
     padding-left: 1.25rem; }
   .the-content h1, .the-content h2, .the-content h3, .the-content h4, .the-content h5, .the-content h6 {
@@ -915,7 +913,7 @@ select {
   max-width: var(--blogWidth); }
 
 @media (max-width: 1120px) {
-  .the-content,
+  body:not(.single-post) .the-content,
   .has-background .wp-block-group__inner-container,
   .wp-block-cover__inner-container {
     padding-right: var(--gridRim);
@@ -1049,7 +1047,8 @@ select {
   margin: 2.5rem auto;
   padding: 0;
   width: 120px;
-  line-height: 1; }
+  line-height: 1;
+  clear: both; }
   .wp-block-separator.is-style-wide {
     width: var(--siteWidth); }
   .wp-block-separator.is-style-dots {
@@ -1160,8 +1159,8 @@ p.has-background {
   margin-right: 0.25rem;
   font-family: var(--hFontFamily);
   font-weight: 700;
-  font-size: 3.5rem;
-  line-height: 3.5rem; }
+  font-size: 3.25rem;
+  line-height: 3.25rem; }
 
 .has-small-font-size {
   font-size: var(--smallFontSize); }
@@ -1240,7 +1239,8 @@ h1.has-background, h2.has-background, h3.has-background, h4.has-background, h5.h
     margin-bottom: 0;
     border-radius: var(--gRadius); }
   .wp-block-gallery a {
-    height: 100%; }
+    height: 100%;
+    width: 100%; }
   .wp-block-gallery .blocks-gallery-item__caption {
     border-bottom: 0;
     padding-bottom: 0;
@@ -1425,7 +1425,7 @@ ul.blocks-gallery-grid {
       position: absolute;
       top: 0;
       width: 100px;
-      height: 4px;
+      height: 3px;
       background-color: var(--text);
       transform: translateX(-50%); }
 
@@ -1450,11 +1450,6 @@ ul.blocks-gallery-grid {
   .wp-block-media-text.is-style-h-smaller-image {
     --mediaColumn: 2fr;
     --contentColumn: 3fr; }
-  @media (max-width: 1120px) {
-    .wp-block-media-text {
-      padding: 0;
-      margin-right: var(--gridRim);
-      margin-left: var(--gridRim); } }
   @media (max-width: 768px) {
     .wp-block-media-text {
       --columnGap: 1rem; } }
@@ -1529,8 +1524,10 @@ ul.blocks-gallery-grid {
 
 .wp-block-table.is-style-stripes {
   --tableBg: rgbA(var(--textDimRGB), 0.05); }
-  .wp-block-table.is-style-stripes tbody tr:nth-child(odd) {
-    background-color: white; }
+  .wp-block-table.is-style-stripes tbody {
+    background-color: transparent; }
+  .wp-block-table.is-style-stripes tbody tr:nth-child(even) {
+    background-color: var(--tableBg); }
 
 .wp-block-table .has-fixed-layout {
   width: 100%;

diff --git a/assets/dist/my-editor.css b/assets/dist/my-editor.css
@@ -91,7 +91,7 @@
   --siteWidth: 1120px;
   --blogWidth: 650px;
   --gridGap: 20px;
-  --gridRim: 10px;
+  --gridRim: 1rem;
   --tileGap: 20px;
   --gRadius: 4px;
   --gTransition: all .25s ease-in-out;
@@ -169,33 +169,33 @@ body.admin-bar {
   font-weight: var(--fontWeight); }
 
 .editor-post-title__block .editor-post-title__input,
-.editor-styles-wrapper h1.wp-block,
-.editor-styles-wrapper h2.wp-block,
-.editor-styles-wrapper h3.wp-block,
-.editor-styles-wrapper h4.wp-block,
-.editor-styles-wrapper h5.wp-block,
-.editor-styles-wrapper h6.wp-block,
+.editor-styles-wrapper h1,
+.editor-styles-wrapper h2,
+.editor-styles-wrapper h3,
+.editor-styles-wrapper h4,
+.editor-styles-wrapper h5,
+.editor-styles-wrapper h6,
 .editor-styles-wrapper .has-drop-cap:not(:focus)::first-letter {
   font-family: var(--hFontFamily);
   font-weight: var(--hFontWeight);
   text-transform: var(--hTextTransform); }
 
-.editor-styles-wrapper h1.wp-block {
+.editor-styles-wrapper h1 {
   font-size: var(--h1Size); }
 
-.editor-styles-wrapper h2.wp-block {
+.editor-styles-wrapper h2 {
   font-size: var(--h2Size); }
 
-.editor-styles-wrapper h3.wp-block {
+.editor-styles-wrapper h3 {
   font-size: var(--h3Size); }
 
-.editor-styles-wrapper h4.wp-block {
+.editor-styles-wrapper h4 {
   font-size: var(--h4Size); }
 
-.editor-styles-wrapper h5.wp-block {
+.editor-styles-wrapper h5 {
   font-size: var(--h5Size); }
 
-.editor-styles-wrapper h6.wp-block {
+.editor-styles-wrapper h6 {
   font-size: var(--h6Size); }
 
 .wp-block-quote.has-text-align-center {
@@ -244,8 +244,8 @@ body.admin-bar {
     --tableBg: rgbA(var(--greenRGB), 0.1);
     --tableBorder: var(--green); }
   .wp-block-table .has-subtle-pale-blue-background-color {
-    --tableHeader: rgbA(var(--blueRGB), 0.4);
-    --tableBg: rgbA(var(--blueRGB), 0.2);
+    --tableHeader: rgbA(var(--blueRGB), 0.2);
+    --tableBg: rgbA(var(--blueRGB), 0.1);
     --tableBorder: var(--blue); }
   .wp-block-table .has-subtle-pale-pink-background-color {
     --tableHeader: rgbA(var(--redRGB), 0.2);

diff --git a/assets/sass/_css-vars-and-fonts.sass b/assets/sass/_css-vars-and-fonts.sass
@@ -72,7 +72,7 @@
   --siteWidth : #{ $size-large }
   --blogWidth : 650px
   --gridGap   : 20px
-  --gridRim   : 10px
+  --gridRim   : 1rem
   --tileGap   : 20px
 
 

diff --git a/assets/sass/blocks/_core-static.sass b/assets/sass/blocks/_core-static.sass
@@ -12,10 +12,6 @@
   letter-spacing: calc(0.01 * var(--fontSize))
   overflow-wrap: break-word
 
-
-  > .alignfull.has-background:first-child
-    margin-top: calc(-1 * var(--groupSpacing))
-
   ul, ol
     padding-left: 1.25rem
 
@@ -36,7 +32,8 @@
     margin: 0 auto
     max-width: var(--blogWidth)
 
-.the-content,
+// Add rim to the side
+body:not(.single-post) .the-content,
 .has-background .wp-block-group__inner-container,
 .wp-block-cover__inner-container
   @media ($below-l)
@@ -215,6 +212,7 @@
   padding: 0
   width: 120px
   line-height: 1
+  clear: both
 
   &.is-style-wide
     width: var(--siteWidth)

diff --git a/assets/sass/blocks/_core.sass b/assets/sass/blocks/_core.sass
@@ -21,8 +21,8 @@ p.has-background
   margin-right: 0.25rem
   font-family: var(--hFontFamily)
   font-weight: 700
-  font-size: 3.5rem
-  line-height: 3.5rem
+  font-size: 3.25rem
+  line-height: 3.25rem
 
 .has-small-font-size
   font-size: var(--smallFontSize)
@@ -134,6 +134,7 @@ h1, h2, h3, h4, h5, h6
 
   a
     height: 100%
+    width: 100%
 
   .blocks-gallery-item__caption
     @extend %figcaption
@@ -349,7 +350,7 @@ ul.blocks-gallery-grid
       position: absolute
       top: 0
       width: 100px
-      height: 4px
+      height: 3px
       background-color: var(--text)
       transform: translateX(-50%)
 
@@ -384,11 +385,6 @@ ul.blocks-gallery-grid
   &.is-style-h-smaller-image
     --mediaColumn: 2fr
     --contentColumn: 3fr 
-
-  @media ($below-l)
-    padding: 0
-    margin-right: var(--gridRim)
-    margin-left: var(--gridRim)
 
   @media ($below-s)
     --columnGap: 1rem
@@ -492,8 +488,10 @@ ul.blocks-gallery-grid
   &.is-style-stripes
     --tableBg: #{ rgba(--textDim, .05) }
 
-    tbody tr:nth-child(odd)
-      background-color: white
+    tbody
+      background-color: transparent
+    tbody tr:nth-child(even)
+      background-color: var(--tableBg)
 
   .has-fixed-layout
     width: 100%

diff --git a/assets/sass/my-editor.sass b/assets/sass/my-editor.sass
@@ -23,34 +23,30 @@
   font-weight: var(--fontWeight)
 
 .editor-post-title__block .editor-post-title__input,
-.editor-styles-wrapper h1.wp-block,
-.editor-styles-wrapper h2.wp-block,
-.editor-styles-wrapper h3.wp-block,
-.editor-styles-wrapper h4.wp-block,
-.editor-styles-wrapper h5.wp-block,
-.editor-styles-wrapper h6.wp-block,
+.editor-styles-wrapper h1,
+.editor-styles-wrapper h2,
+.editor-styles-wrapper h3,
+.editor-styles-wrapper h4,
+.editor-styles-wrapper h5,
+.editor-styles-wrapper h6,
 .editor-styles-wrapper .has-drop-cap:not(:focus)::first-letter
   font-family: var(--hFontFamily)
   font-weight: var(--hFontWeight)
   text-transform: var(--hTextTransform)
 
-.editor-styles-wrapper h1.wp-block
-  font-size: var(--h1Size)
-
-.editor-styles-wrapper h2.wp-block
-  font-size: var(--h2Size)
-
-.editor-styles-wrapper h3.wp-block
-  font-size: var(--h3Size)
-
-.editor-styles-wrapper h4.wp-block
-  font-size: var(--h4Size)
-
-.editor-styles-wrapper h5.wp-block
-  font-size: var(--h5Size)
-
-.editor-styles-wrapper h6.wp-block
-  font-size: var(--h6Size)
+.editor-styles-wrapper
+  h1
+    font-size: var(--h1Size)
+  h2
+    font-size: var(--h2Size)
+  h3
+    font-size: var(--h3Size)
+  h4
+    font-size: var(--h4Size)
+  h5
+    font-size: var(--h5Size)
+  h6
+    font-size: var(--h6Size)
 
 
 ///// QUOTE
@@ -112,8 +108,8 @@
     --tableBorder: var(--green)
 
   .has-subtle-pale-blue-background-color
-    --tableHeader: #{ rgba(--blue, .4) }
-    --tableBg: #{ rgba(--blue, .2) }
+    --tableHeader: #{ rgba(--blue, .2) }
+    --tableBg: #{ rgba(--blue, .1) }
     --tableBorder: var(--blue)
 
   .has-subtle-pale-pink-background-color

diff --git a/style.css b/style.css
@@ -3,7 +3,7 @@ Theme Name: Edje Basic Theme
 Author: Pixel Studio
 Author URI: https://pixelstudio.id
 Description: Base theme for EDJE framework - Built using Timber and ACF
-Version: 8.1.0
+Version: 8.2.0
 Tags: private theme, timber, edje, acf, woocomemrce, custom-menu, editor-style
 */