Merge to release 2.0.5

digitoimistodude · Jun 9, 2022 · 22dc9f4 · 22dc9f4
2 parents f4647a5 + f9b355d
commit 22dc9f4
Show file tree

Hide file tree

Showing 3 changed files with 76 additions and 64 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,15 +1,35 @@
-### 2.0.1: 2022-06-09
+### 2.0.5: 2022-06-09
 
 * Reponsive fixes for demo site
 * Fix nav button on in-between resolutions
 * Disable air-light placeholder in demo page ("Build your website here! (Remove this bit in sass/layout/_site-header.scss)")
+* Add max-width for demo blocks
+
+### 2.0.4: 2022-05-26
+
+* Fix padding of the centered block without image
+
+### 2.0.3: 2022-05-26
+
+* Fix paddings on demo templates other than home
+* Add block name tags to single, blog and 404 views
+
+### 2.0.2: 2022-05-26
+
+* Fix placeholder for the upcoming Air-light v.9.0.1
+
+### 2.0.1: 2022-05-25
+
+* Fix typo in variable
+* Fix button links
 
 ### 2.0.0: 2022-05-25
 
 * Add phpcs.xml
 * Completely rewrite demo blocks
 * Completely rewrite new styles for demo site
 * Hide air-light "Start building here" placeholder on demo
+* Get ready for Air-light v9.0.0
 
 ### 1.0.6: 2022-05-12
 

diff --git a/air-light-demo-content.php b/air-light-demo-content.php
@@ -5,11 +5,11 @@
  *
  * Plugin URI: https://github.com/digitoimistodude/air-light-demo-content
  * Description: Provides the demo CSS and Gutenberg block for Air-light starter theme as presented in airwptheme.com/demo.
- * Version: 1.0.6
+ * Version: 2.0.4
  * Author: Digitoimisto Dude Oy
  * Author URI: https://www.dude.fi
  * Requires at least: 5.0
- * Tested up to: 5.9.3
+ * Tested up to: 6.0.0
  * License: GPL-3.0+
  * License URI: https://www.gnu.org/licenses/gpl-3.0.html
  *
@@ -87,6 +87,7 @@ function demo_css() { ?>
   --font-size-28: 28px;
   --color-background-nav-mobile-header: var(--color-black);
   --margin-body: 4.7rem;
+  --color-border-forms: #ccc;
 }
 
 /* Font */
@@ -104,7 +105,7 @@ function demo_css() { ?>
   background: var(--color-background-site);
 }
 
-.nav-container::after {
+.site-main::after {
   display: none !important;
 }
 
@@ -254,6 +255,16 @@ function demo_css() { ?>
   background-color: var(--color-valhalla);
 }
 
+/* Article view */
+.block-single .article-content {
+  padding-top: 0;
+}
+
+.comment-respond input,
+textarea {
+  border-radius: 0;
+}
+
 /* Block decorations from blocks.airwptheme.com */
 .block {
   background-image: linear-gradient(var(--color-black), var(--color-cyan-bright)), linear-gradient(var(--color-black), var(--color-cyan-bright));
@@ -262,9 +273,12 @@ function demo_css() { ?>
   background-size: 1px 100%;
   border-bottom: 1px solid var(--color-cyan-bright);
   border-top: 1px solid var(--color-black);
+  justify-self: center;
   margin: var(--margin-body);
+  max-width: 1900px;
   overflow: visible;
   padding: var(--margin-body);
+  width: calc(100% - 3rem);
   z-index: 4;
 }
 
@@ -274,6 +288,10 @@ function demo_css() { ?>
   }
 }
 
+/* Tags */
+.block-error-404::before,
+.block-blog::before,
+.block-single::before,
 .block-name-tag {
   left: 0;
   position: absolute;
@@ -282,6 +300,15 @@ function demo_css() { ?>
   z-index: 22;
 }
 
+.block-error-404::before,
+.block-blog::before,
+.block-single::before {
+  display: inline-block;
+}
+
+.block-error-404::before,
+.block-blog::before,
+.block-single::before,
 .block-name-tag p {
   background-color: var(--color-black);
   border-top-left-radius: 3px;
@@ -294,12 +321,27 @@ function demo_css() { ?>
   transform: translateX(1rem);
 }
 
+.block-single::before {
+  content: 'single';
+}
+
+.block-blog::before {
+  content: 'blog';
+}
+
+.block-error-404::before {
+  content: 'error-404';
+}
+
 /* Blocks */
 .block-demo-centered {
-  padding-bottom: 0;
   text-align: center;
 }
 
+.block-demo-centered.has-image {
+  padding-bottom: 0;
+}
+
 .block-demo-centered .has-lazyload {
   aspect-ratio: 16/6;
 }
@@ -308,6 +350,7 @@ function demo_css() { ?>
   object-position: top center;
 }
 
+.site-main .block-hero-big-image .container .button-wrapper .button,
 .site-main .block-demo-centered .container .button {
   font-size: var(--font-size-16);
   max-width: 100%;
@@ -658,53 +701,6 @@ function demo_css() { ?>
   margin-bottom: 0;
 }
 
-/* Fix article-content styles for demo pages without hero block */
-.block.block-blog .container,
-.block.block-single .article-content {
-  padding-top: calc( 5rem + var(--padding-block) );
-}
-
-/* Add article-content styles for demo pages
-   as they do not have Gutenberg blocks, only classic editor */
-body.page:not(.home) .site-main {
-  max-width: 100%;
-  padding-bottom: var(--padding-block);
-  padding-left: 0;
-  padding-right: 0;
-  padding-top: calc( 5rem + var(--padding-block) );
-}
-
-/* Faux "Gutenberg-magic" */
-body.page:not(.home) .site-main > * {
-  line-height: var(--line-height-paragraphs-blog);
-  margin-left: auto;
-  margin-right: auto;
-  max-width: 800px;
-  padding-left: 0;
-  padding-right: 0;
-  width: 100%;
-}
-
-@media (max-width: 840px) {
-  body.page:not(.home) .site-main > * {
-    padding-left: var(--padding-container-horizontal);
-    padding-right: var(--padding-container-horizontal);
-  }
-
-  body.page:not(.home) .site-main > .alignfull {
-    padding-left: var(--padding-container-horizontal);
-    padding-right: var(--padding-container-horizontal);
-    width: calc(100% - calc(var(--padding-container-horizontal) * 2));
-  }
-}
-
-body.page:not(.home) .site-main > ol:not([class]) li::before,
-body.page:not(.home) .site-main > ul:not([class]) li::before,
-body.page:not(.home) .site-main > ol:not([class]) li::marker,
-body.page:not(.home) .site-main > ul:not([class]) li::marker {
-  color: var(--color-link-text);
-}
-
 /* Mobile view styles */
 @media (max-width: 959px) {
   a.nav-link.is-external-link::after {

diff --git a/block-demo-content.php b/block-demo-content.php
@@ -5,7 +5,7 @@
  * @Author: Timi Wahalahti
  * @Date:   2021-05-17 13:34:52
  * @Last Modified by:   Roni Laukkarinen
- * @Last Modified time: 2022-05-25 19:57:01
+ * @Last Modified time: 2022-05-26 15:18:55
  *
  * @package air-light
  */
@@ -27,13 +27,9 @@
 
             <p>This demo has custom blocks enabled, but air-light doesn't ship with them. You'll need to build your blocks yourself.</p>
 
-            <ul class="multiple-buttons-wrapper">
-              <a class="button js-trigger" href="https://airwptheme.com">
-                Features
-              </a>
-
-              <a class="button js-trigger" href="https://blocks.airwptheme.com">
-                Block library
+            <p class="button-wrapper">
+              <a class="button button-large" href="https://airwptheme.com">
+                See all features
               </a>
             </ul>
           </div>
@@ -44,7 +40,7 @@
 <div class="block-name-tag" aria-hidden="true"><p>hero</p></div>
 </section>
 
-<section class="block block-demo-centered">
+<section class="block block-demo-centered has-image">
   <div class="container">
     <h2 class="has-text-gradient">Gutenberg blocks make the website easy to update</h2>
     <p>Air-light has 100% Gutenberg support. Get magical with custom ACF + Gutenberg blocks.</p>
@@ -68,7 +64,7 @@
     <div class="col col-content">
       <div class="wrapper">
         <h2 class="has-text-gradient">Modular SCSS + CSS custom properties for everything</h2>
-        <p>We've got you covered with styles. Air-light is bloat-free! Just open _colors.scss and you are good to go. Did you know that Air-light production-ready CSS weights only 99KB without compression?</p>
+        <p>When it comes to Cascading Style Sheets, we've got you covered. Air-light is bloat-free! Just open _colors.scss and you are good to go. Did you know that Air-light production-ready CSS weights only 99KB without compression?</p>
         <p class="button-wrapper">
           <a class="button no-external-link-indicator has-icon" href="https://github.com/digitoimistodude/air-light">
             <svg width="16" height="16" viewBox="0 0 1792 1792" fill="currentColor" xmlns="http://www.w3.org/2000/svg" aria-hidden="true"><path d="M1664 896q0 251-146.5 451.5T1139 1625q-27 5-39.5-7t-12.5-30v-211q0-97-52-142 57-6 102.5-18t94-39 81-66.5 53-105T1386 856q0-121-79-206 37-91-8-204-28-9-81 11t-92 44l-38 24q-93-26-192-26t-192 26q-16-11-42.5-27T578 459.5 492 446q-44 113-7 204-79 85-79 206 0 85 20.5 150t52.5 105 80.5 67 94 39 102.5 18q-40 36-49 103-21 10-45 15t-57 5-65.5-21.5T484 1274q-19-32-48.5-52t-49.5-24l-20-3q-21 0-29 4.5t-5 11.5 9 14 13 12l7 5q22 10 43.5 38t31.5 51l10 23q13 38 44 61.5t67 30 69.5 7 55.5-3.5l23-4q0 38 .5 89t.5 54q0 18-13 30t-40 7q-232-77-378.5-277.5T128 896q0-209 103-385.5T510.5 231 896 128t385.5 103T1561 510.5 1664 896z"></path></svg>
@@ -85,7 +81,7 @@
           <li>&ndash;<span class="spacer"></span>&ndash;<span class="spacer"></span>color-brand-twitter: <span class="color" style="background-color: #1da1f2"></span> #1da1f2</li>
           <li>&ndash;<span class="spacer"></span>&ndash;<span class="spacer"></span>color-pattens-blue: <span class="color" style="background-color: #eaf1f8;"></span> #eaf1f8;</li>
           <li>&ndash;<span class="spacer"></span>&ndash;<span class="spacer"></span>color-science-blue: <span class="color" style="background-color: #0049d1;"></span> #0049d1;</li>
-          <li>&ndash;<span class="spacer"></span>&ndash;<span class="spacer"></span>color-scropion: <span class="color" style="background-color: #5f5f5f;"></span> #5f5f5f;</li>
+          <li>&ndash;<span class="spacer"></span>&ndash;<span class="spacer"></span>color-scorpion: <span class="color" style="background-color: #5f5f5f;"></span> #5f5f5f;</li>
           <li>&ndash;<span class="spacer"></span>&ndash;<span class="spacer"></span>color-valhalla: <span class="color" style="background-color: #2a2d3e;"></span> #2a2d3e;</li>
         </ul>
       </div>
@@ -189,7 +185,7 @@
     <h2 class="has-text-gradient">...and more. But still less.</h2>
     <p>Air-light light weights only under 20 KB gzipped and is accessible-ready, gutenberg-ready and multilingual-ready.</p>
     <p class="button-wrapper">
-      <a class="button no-external-link-indicator has-icon" href="https://docs.airwptheme.com/air-blocks/block-library">
+      <a class="button no-external-link-indicator has-icon" href="https://airwptheme.com">
         Check out all the features
       </a>
     </p>