feat: add columns to posts/pages, match bookmarks/file embed/callout styles

assets/css/screen.css

@@ -591,7 +591,7 @@ textarea::placeholder {
    –––––––––––––––––––––––––––––––––––––––––––––––––––– */
 .global-button {
    font-family: var(--font-family-three);
-   font-size: 2.4rem;
+   font-size: 1em;
    font-weight: var(--font-weight-three-medium);
    line-height: 1.3;
    position: relative;
@@ -1996,11 +1996,11 @@ textarea::placeholder {
 }
 
 .subscribe-form input {
-   font-size: 2.2rem;
+   font-size: 1em;
    display: block;
    flex: 1 1 auto;
    box-sizing: border-box;
-   max-width: 265px;
+   max-width: 80%;
    padding: 0 30px;
    transition: margin-right .25s ease;
    word-break: normal;
@@ -3327,7 +3327,7 @@ textarea::placeholder {
 
 .post-content .kg-file-card .kg-file-card-container:hover,
 .post-content .kg-bookmark-card .kg-bookmark-container:hover {
-   border-color: var(--color-border-three);
+   border-color: var(--color-border-three) !important;
 }
 
 .post-content img,
@@ -4488,6 +4488,7 @@ textarea::placeholder {
    –––––––––––––––––––––––––––––––––––––––––––––––––––– */
 .footer-description {
    font-size: 2rem;
+   padding-right: 1em;
    font-weight: var(--font-weight-three-medium);
    line-height: 1.4;
    max-width: 400px;
@@ -5699,12 +5700,16 @@ html:not(.dark-mode) .header-nav .theme-toggle .if-is-dark {
   margin: auto;
 }
 
-.kg-callout-card-white,
+.post-content .kg-callout-card.kg-callout-card-white,
-.kg-product-card-container,
+.post-content .kg-product-card .kg-product-card-container,
-.kg-file-card-container {
+.post-content .kg-bookmark-card .kg-bookmark-container,
+.post-content .kg-file-card .kg-file-card-container,
+.post-content .kg-cta-card.kg-cta-bg-white,
+.post-content table {
    background-color: var(--color-body-partial) !important;
-   border-color: var(--color-border-one) !important;
+   border: 1px solid var(--color-border-one) !important;
    color: var(--color-font-one) !important;
+   box-shadow: none !important;
 }
 .kg-file-card-container,
 .kg-file-card-icon {
@@ -5716,3 +5721,57 @@ html:not(.dark-mode) .header-nav .theme-toggle .if-is-dark {
 .kg-file-card-icon::before {
   display: none;
 }
+.kg-cta-sponsor-label span:not(a span) {
+  color: var(--color-font-three) !important;
+}
+.kg-cta-sponsor-label-wrapper {
+  border-bottom: 1px solid var(--color-border-one) !important;
+}
+
+.kg-button-card .kg-btn,
+.kg-product-card-button {
+  padding: 8px 12px !important;
+  height: auto !important;
+  text-align: center;
+  line-height: 1.2 !important;
+  justify-content: center;
+  display: inline;
+  width: 100%;
+}
+
+.cols {
+  display: flex;
+  gap: 1.2em;
+  margin-block-end: 30px;
+}
+.cols:last-child {
+  margin-block-end: calc(5vh + 30px);
+}
+@media screen and (min-width: 660px) {
+  .cols .kg-card {
+    margin: auto !important;
+  }
+  .cols .kg-button-card {
+    margin: 0 !important;
+  }
+  .cols .kg-btn {
+    height: 100% !important;
+  }
+  .cols .kg-product-card-container {
+    display: flex;
+    flex-direction: column;
+    align-items: start;
+    gap: 16px;
+  }
+  .cols .kg-product-card-description {
+    margin-bottom: 12px;
+  }
+  .cols .kg-product-card-button {
+    margin-top: auto !important;
+  }
+}
+@media screen and (max-width: 660px) {
+  .cols {
+    flex-direction: column;
+  }
+}

package.json

@@ -47,6 +47,9 @@
                 "options": ["Portrait", "Landscape", "Square", "Natural"],
                 "default": "Portrait"
             },
+            "secondary_navigation": {
+                "type": "text"
+            },
             "footer_copyright": {
                 "type": "text"
             },

partials/footer.hbs

@@ -24,6 +24,7 @@
 					</ul>
 				</div>
 				{{#if @site.secondary_navigation}}
+				{{#if @custom.secondary_navigation}}{{/if}}
 				{{navigation type="secondary"}}
 				{{/if}}
 			</div>

partials/navigation.hbs

@@ -33,7 +33,13 @@
 {{#foreach navigation limit="5"}}
 {{#if @first}}
 <div class="footer-nav-column">
-	<small>{{t "Column 1"}}</small>
+	<small>
+	{{#if @custom.secondary_navigation}}
+		{{@custom.secondary_navigation}}
+	{{else}}
+		{{t "Column 1"}}
+	{{/if}}
+	</small>
 	<ul>
 		{{/if}}
 		<li><a href="{{url absolute="true"}}">{{label}}</a></li>
@@ -46,7 +52,7 @@
 {{#foreach navigation limit="5" from="6"}}
 {{#if @first}}
 <div class="footer-nav-column">
-	<small>{{t "Column 2"}}</small>
+	<small>&nbsp;</small>
 	<ul>
 		{{/if}}
 		<li><a href="{{url absolute="true"}}">{{label}}</a></li>
@@ -59,7 +65,7 @@
 {{#foreach navigation from="11"}}
 {{#if @first}}
 <div class="footer-nav-column">
-	<small>{{t "Column 3"}}</small>
+	<small>&nbsp;</small>
 	<ul>
 		{{/if}}
 		<li><a href="{{url absolute="true"}}">{{label}}</a></li>