Merge branch '164-blog' of craft-in-america/vue-wp into dev

plugins/cia-post-types/includes/custom-taxonomies.php

@@ -1,7 +1,7 @@
 <?php
     function create_materials_taxonomy() {
         $post_types_that_show_materials = [
-            'artist', 'guide', 'short',
+            'artist', 'exhibition', 'event', 'guide', 'short',
             'object', 'publication', 'technique'
         ];
         register_taxonomy('material', $post_types_that_show_materials, ['label' => 'Materials']);

plugins/cia-post-types/includes/p2p-mappings.php

@@ -25,7 +25,7 @@ function register_all_one_offs() {
     register_connections_for('short', ['short', 'exhibition', 'event', 'object', 'guide', 'post', 'technique', 'publication']);
     register_connections_for('technique', ['technique', 'post', 'publication']);
     register_connections_for('guide', ['technique', 'exhibition', 'post', 'publication']);
-    register_connections_for('exhibition', ['technique', 'publication']);
+    register_connections_for('exhibition', ['exhibition','technique', 'publication']);
     register_connections_for('event', ['event', 'object', 'post', 'guide', 'technique', 'publication']);
     register_connections_for('episode', ['episode', 'object', 'guide', 'technique', 'publication']);
     register_connections_for('post', ['post']);

vue-theme/editor-style.css

@@ -41,7 +41,7 @@ a {
     /* leave underline to show links when editing */
     /* text-decoration: none; */
 }
-a &:hover {
+a:hover {
     cursor: pointer;
     color: black;
 }
@@ -97,17 +97,33 @@ ol {
 }
 
 /* separator types */
+.editor-styles-wrapper, .wp-block-separator {
+    border: none;
+    /* height: 0.8em; */
+    text-align: center
+}
+
 hr .wp-block-separator, .is-style-default {
-    height: 1px;
     width: 15vw;
+    border-top: 3px solid !important;
+    border-bottom: 0 !important;
 }
 
+
 hr .wp-block-separator, .is-style-wide {
-    height: 3px;
     width: 50vw;
+    border-top: 3px solid;
+    border-bottom: 0;
 }
 
 hr .wp-block-separator, .is-style-dots:before {
     letter-spacing: 4em;
     padding-left: 4em;
-}
+}
+    
+.wp-block-image figcaption {
+    position: inherit !important;
+    background: none !important;
+    color: black !important;
+}
+

vue-theme/functions.php

@@ -220,8 +220,8 @@ add_filter( 'manage_artist_posts_columns', 'set_custom_edit_artist_columns' );
 function set_custom_edit_artist_columns($columns) {
     $date = $columns['date'];
     unset( $columns['date'] );
-    $columns['artist_type'] = __('Artist Type', 'my-text-domain' );
-    $columns['material'] = __('Material', 'my-text-xx' );
+    $columns['artist_type'] = __('Artist Type' );
+    $columns['material'] = __('Material' );
     $columns['date'] = $date;
     return $columns;
 }
@@ -247,7 +247,8 @@ add_filter( 'manage_event_posts_columns', 'set_custom_edit_event_columns' );
 function set_custom_edit_event_columns($columns) {
     $date = $columns['date'];
     unset( $columns['date'] );
-    $columns['event_type'] = __('Event Type');
+    $columns['event_type'] = __('Event Type' );
+    $columns['material'] = __('Material' );
     $columns['date'] = $date;
     return $columns;
 }
@@ -259,6 +260,31 @@ function custom_event_column( $column, $post_id ) {
             $terms = get_the_term_list( $post_id , 'event_type' , '' , ', ' , '' );
             echo is_string( $terms ) ? $terms : '—';
             break;
+            // display a list of material terms assigned to the post 
+        case 'material' :
+            $terms = get_the_term_list( $post_id , 'material' , '' , ', ' , '' );
+            echo is_string( $terms ) ? $terms : '—';
+            break;
+    }
+}
+
+// Add the custom columns for EXHIBITION:
+add_filter( 'manage_exhibition_posts_columns', 'set_custom_edit_exhibition_columns' );
+function set_custom_edit_exhibition_columns($columns) {
+    $date = $columns['date'];
+    unset( $columns['date'] );
+    $columns['material'] = __('Material');
+    $columns['date'] = $date;
+    return $columns;
+}
+// Add the data to the custom columns for EXHIBITION:
+add_action( 'manage_exhibition_posts_custom_column' , 'custom_exhibition_column', 10, 2 );
+function custom_exhibition_column( $column, $post_id ) {
+    switch ( $column ) {
+        case 'material' :
+            $terms = get_the_term_list( $post_id , 'material' , '' , ', ' , '' );
+            echo is_string( $terms ) ? $terms : '—';
+            break;
     }
 }
 

vue-theme/src/components/card.vue

@@ -81,7 +81,7 @@ export default {
         padding: $ms--3
         margin: 0
     h1
-        font-size: $ms-0
+        font-size: $ms-1
         padding: 0
         line-height: initial
         display: -webkit-box

vue-theme/src/components/footer.vue

@@ -1,7 +1,7 @@
 <template lang="pug">
 .footer-wrapper.t-up.t-sans
     footer.main.w-max.f-row.between
-        ul.f-col.start
+        ul.f-col
             //- address contact   
             li
                 h4 Craft in America
@@ -50,10 +50,10 @@
                     a(href="https://visitor.r20.constantcontact.com/d.jsp?llr=fyb4y9cab&p=oi&m=fyb4y9cab&sit=olvymhdeb&f=ee3616e1-10de-4a59-b451-1a882111b1f5", target="_blank") Join email list
                             
         //- menu links
-        ul.f-col.start
+        ul.f-col
             li
                 h5 
-                router-link(to="/episode") PBS Series
+                    router-link(to="/episode") PBS Series
                 ul.f-col.start 
                     li 
                         router-link(to="/episode") &nbsp; Episodes
@@ -64,16 +64,16 @@
             li 
                 h5
                     router-link(to="/artist") Artists
-                    ul.f-col.start
-                        li
-                            router-link(to="/artist/sorted/by-alpha") &nbsp; A-Z
-                        li
-                            router-link(to="/artist/sorted/by-material") &nbsp; by Material
+                ul.f-col
+                    li
+                        router-link(to="/artist/sorted/by-alpha") &nbsp; A-Z
+                    li
+                        router-link(to="/artist/sorted/by-material") &nbsp; by Material
 
             li
                 h5 
-                router-link(to="/exhibition") Exhibitions
-                ul.f-col.start
+                    router-link(to="/exhibition") Exhibitions
+                ul.f-col
                     li
                         router-link(to="/exhibition/sorted/by-current-and-upcoming") &nbsp; Current/Upcoming
                     li
@@ -81,34 +81,38 @@
 
             li
                 h5
-                router-link(to="/event") Center 
-                ul.f-col.start
+                    router-link(to="/page/center") Center 
+                ul.f-col
+                    li
+                        router-link(to="/page/center") &nbsp; Info
                     li
                         router-link(to="/exhibition") &nbsp; Exhibitions
                     li 
                         router-link(to="/event/sorted/by-current-and-upcoming") &nbsp; Events 
                     li
-                        router-link(to="/event/sorted/by-type&talks") &nbsp; Talks &amp; Interviews
+                        router-link(to="/event?type=talks") &nbsp; Talks &amp; Interviews
             li
                 h5
-                router-link(to="") Education 
-                ul.f-col.start
+                    router-link(to="") Education 
+                ul.f-col
                     li
                         router-link(to="/guide") &nbsp; Guides 
                     li 
                         router-link(to="/publication") &nbsp; Publications 
+                    li 
+                        router-link(to="/page/library") &nbsp; Library 
 
 
             li
                 h5
-                router-link(to="") News
-                ul.f-col.start
+                    router-link(to="") News
+                ul.f-col
                     li
                         router-link(to="/blog") &nbsp; Blog Posts  
                     li 
-                        router-link(to="/blog/sorted/by-type&releases") &nbsp; Press Releases 
+                        router-link(to="/posts?type=releases") &nbsp; Press Releases 
                     li 
-                        router-link(to="/blog/sorted/by-type&articles") &nbsp; In the News 
+                        router-link(to="/posts?type=articles") &nbsp; In the News 
 
     .sub-footer.f-col.start
         h6 Craft in America &copy; 2010&ndash;{{ today }} 
@@ -138,6 +142,8 @@ export default {
     footer.main
         display: flex
         flex-wrap: wrap
+        align-items: flex-start 
+
         min-width: $min-width
         /* background-color: $cia_red */
         // ALL <ul> tags
@@ -148,15 +154,17 @@ export default {
                 width: 100%
         // OUTER <ul> tags
         > ul
-            padding: 0 $ms-0
+            padding: $ms-0
             &:nth-child(n+2)
-                padding: 0 $ms-0 $ms-3 $ms-0
+                /* padding: 0 $ms-0 $ms-3 $ms-0 */
             > li
                 color: $cia_white
-                padding: $ms-0 0 0
-                h5
-                    color: $cia_white
-                    margin: $ms-0 0 $ms--1
+                padding: 0 0 $ms--6
+                h4
+                    margin: $ms-0 0 $ms--3
+                h5 
+                    /* margin: $ms-0 0 $ms--1 */
+                    margin: $ms-0 0 0
                 a, a:link, a:visited
                     color: $cia_white
                     text-decoration: none
@@ -208,7 +216,7 @@ export default {
             /* background-color: rebeccapurple */
             background-color: $cia_red
             &:nth-child(n+2)
-                margin: 0 0 $ms-2 0
+                /* margin: 0 0 $ms-2 0 */
                 > li
                     width: 43%
     /* 1200px */

vue-theme/src/components/navigation/navigation.vue

@@ -51,7 +51,7 @@ nav.main.w-max
                     li
                         router-link(to="/event/sorted/by-current-and-upcoming") Events Current/Upcoming
                     li
-                        router-link(to="/event/sorted/by-type") Talks & Interviews
+                        router-link(to="/event?type=talks") Talks & Interviews
                     li
                         router-link(to="/page/library") Library
             li.f-grow

vue-theme/src/components/sidebars/sidebar.vue

@@ -5,15 +5,28 @@ aside.sidebar
         .shadow(v-if="shouldShowListSort.includes(type) && layout !== 'single'")
             h3.t-up sort {{ type }}
             ul.t-up
+                li 
+                    //- ?type=articles //
+                    router-link(v-if="type === 'post' " :to="`/${type}?type=articles`")
+                        p in the news
+                li 
+                    //- ?type=releases //
+                    router-link(v-if="type === 'post' " :to="`/${type}?type=releases`")
+                        p press releases 
+                li 
+                    //- ?type=talks //
+                    router-link(v-if="type === 'event' " :to="`/${type}?type=talks`")
+                        p talks 
+                    //- by type //
                 li(v-for="option in sortOptions")
                     router-link(:to="`/${type}/sorted/${sortTypes[option]}`")
                         p {{ option }}
                 li
-                    router-link(:to="`/${type}`")
-                        p by all
-                li
-                    router-link(v-if="shouldShowDateSort.includes(type) && layout !== 'single'" :to="`/${type}/sorted/by-current-and-upcoming`")
+                    router-link(v-if="shouldShowDateSort.includes(type) " :to="`/${type}/sorted/by-current-and-upcoming`")
                         p by current and upcoming
+                li
+                    router-link(:to="`/${type}/sorted/by-date`")
+                        p by all
         
         //- if {{type}} has sorted by-material show material options
         .shadow(v-if="shouldShowMaterialSort.includes(type) && layout !== 'single'")
@@ -28,10 +41,10 @@ aside.sidebar
         .shadow(v-if="['artist'].includes(type) && layout !== 'single'")
             h3.t-up {{ type }} alpha 
             ul.t-up
-                li
+                li.f-row.start.wrap
                     template(v-for="charaSet in charaSets") 
                         router-link(:to="`/${type}/sorted/by-alpha#${charaSet[0]}`")
-                            p {{ charaSet }}
+                            p.alpha {{ charaSet }}
 
         //- p2p types and related posts
         .shadow(v-if="layout === 'single' && Object.keys(related).length" v-for="p2pPostType in Object.keys(related)")
@@ -85,15 +98,20 @@ export default {
     data() {
         return {
             sortTypes: {
-                alphabetized: `${sortTypes.alpha}`,       //:0
-                'by material': `${sortTypes.material}`,   //:1
-                'by artist': `${sortTypes.artist}`,       //:2
-                'by episode': `${sortTypes.episode}`,     //:3
+                alphabetized: `${sortTypes.alpha}`,     //:0
+                'by material': `${sortTypes.material}`, //:1
+                'by artist': `${sortTypes.artist}`,     //:2
+                'by episode': `${sortTypes.episode}`,   //:3
+                'by type': `${sortTypes.subtype}`,      //:4
+                // 'by articles': `articles`,              //:5
+                subtype: 'by-type',
             },
             charaSets: [
-                '0 a b', 'c d e', 'f g h',
-                'i j k', 'l m n', 'o p q',
-                'r s t', 'u v w', 'x y z'
+                // '0 a b', 'c d e', 'f g h',
+                // 'i j k', 'l m n', 'o p q',
+                // 'r s t', 'u v w', 'x y z'
+                '9', 'a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j', 'k', 'l', 
+                'm', 'n', 'o', 'p', 'q', 'r', 's', 't', 'u', 'v', 'w', 'x', 'y', 'z'
             ],
             materials: materials,
             shouldShowListSort: [
@@ -102,7 +120,7 @@ export default {
                 'publication', 'technique', 'post'
             ],
             shouldShowMaterialSort: [
-                'artist', 
+                'artist', 'exhibition', 'event',
                 'short', 'guide', 'object',
                 'technique',
             ],
@@ -114,7 +132,7 @@ export default {
             ],
             shouldShowTypeSort: [
                 'short', 'guide', 'object',
-                'publication', 'technique', 'post'
+                'publication', 'technique', 'post', 'event'
             ]
         }
     },
@@ -127,12 +145,28 @@ export default {
                         Object.keys(this.sortTypes)[0],
                         Object.keys(this.sortTypes)[3],
                         Object.keys(this.sortTypes)[1],
-                        `by ${this.type} type`,
+                        Object.keys(this.sortTypes)[4],
+                        // `by ${this.type} type`,
+                    ]
+                    break
+                case 'exhibition':
+                    opts = [
+                        // Object.keys(this.sortTypes)[4],
+                        // Object.keys(this.sortTypes)[1],
+                    ]
+                    break
+                case 'event':
+                    opts = [
+                        // Object.keys(this.sortTypes)[4],
+                        // Object.keys(this.sortTypes)[1],
                     ]
                     break
                 case 'post':
                     opts = [
-                        `by ${this.type} type`,
+                        Object.keys(this.sortTypes)[4],
+                        // `by ${this.type} type`,
+                        // Object.keys(this.sortTypes)[5],
+                        // `by articles`
                     ]
                     break
                 case 'short':
@@ -176,7 +210,7 @@ export default {
 @import '../../sss/theme.sss'
 aside.sidebar
     /* need to solve for mobile as the sticky creates scroll issues */
-    /* position: sticky */
+    position: sticky
     top: 40px
     width: 100%
     p, h3
@@ -196,9 +230,13 @@ aside.sidebar
         flex-direction: column
         flex-wrap: wrap 
         li
-            padding: 0 0 $ms-0 0
+            /* padding: 0 0 $ms-0 0 */
             img
                 display: none
+                padding: $ms-0 0 $ms--4 0
+            p.alpha 
+                padding: 0 $ms--4
+
     .shadow
         background-color: white
 

vue-theme/src/pages/single.vue

@@ -248,7 +248,7 @@ export default {
         background-color: white
         padding: $ms-0
         h1
-            color: $cia_black
+            /* color: $cia_black */
             margin: 0 0 $ms--3 0
         > ul
             /* grid-gap: $ms-0 */
@@ -270,6 +270,16 @@ export default {
                 position: absolute
                 top: 100%
 
+        .wp-block-gallery
+            margin: 0 0 0.5em 0
+            grid-gap: $ms--5
+            
+            > .wp-block-image     
+                figcaption
+                    position: inherit
+                    background: none
+                    color: $cia_black
+
         /* iframe container 16:9 */
         [class^="iframe-container"]
             position: relative
@@ -291,10 +301,8 @@ export default {
             margin: $ms-2 auto
             &.is-style
                 &-default
-                    height: 1px
                     width: 15vw
                 &-wide
-                    height: 3px
                     width: 50vw
                 &-dots::before
                     outline-style: none

vue-theme/src/sss/_typography.sss

@@ -27,11 +27,11 @@
         font-family: $mono
 
 a
-    /* text-decoration: none,  leave for now to show links underlined */
+    text-decoration: none  // comment out to show underline
     &:hover
         cursor: pointer
 
-h1, h2, h3, h4, h5, h6 /* common */
+h1, h2, h3, h4, h5, h6 //common attributes
     /* font-weight: 400 */
     display: block
     margin-left: 0

vue-theme/src/sss/variables.sss

@@ -15,27 +15,26 @@ $base: 0.95em
 $max-card-img-height: 420px
 $card-line-clamp: 3
 
-$ratio: $minor-third
-/* $ratio = 1.2 from _ratios.sss */
-
-$ms-0: calc($base)
-$ms--1: calc($ms-0 / $ratio)
-$ms--2: calc($ms--1 / $ratio)
-$ms--3: calc($ms--2 / $ratio)
-$ms--4: calc($ms--3 / $ratio)
-$ms--5: calc($ms--4 / $ratio)
-$ms--6: calc($ms--5 / $ratio)
-$ms--7: calc($ms--6 / $ratio)
-
-$ms-1: calc($ms-0 * $ratio)
-$ms-2: calc($ms-1 * $ratio)
-$ms-3: calc($ms-2 * $ratio)
-$ms-4: calc($ms-3 * $ratio)
-$ms-5: calc($ms-4 * $ratio)
-$ms-6: calc($ms-5 * $ratio)
-$ms-7: calc($ms-6 * $ratio)
-$ms-8: calc($ms-7 * $ratio)
-$ms-9: calc($ms-8 * $ratio)
+$ratio: $minor-third // $ratio = 1.2 from _ratios.sss
+
+$ms-0: calc($base) // 0.95em
+$ms--1: calc($ms-0 / $ratio) // 0.79
+$ms--2: calc($ms--1 / $ratio) // 0.66
+$ms--3: calc($ms--2 / $ratio) // 0.55
+$ms--4: calc($ms--3 / $ratio) // 0.45
+$ms--5: calc($ms--4 / $ratio) // 0.38
+$ms--6: calc($ms--5 / $ratio) // 0.31
+$ms--7: calc($ms--6 / $ratio) // 0.27
+
+$ms-1: calc($ms-0 * $ratio) // 1.14
+$ms-2: calc($ms-1 * $ratio) // 1.368
+$ms-3: calc($ms-2 * $ratio) // 1.6416
+$ms-4: calc($ms-3 * $ratio) // 1.9699
+$ms-5: calc($ms-4 * $ratio) // 2.3639
+$ms-6: calc($ms-5 * $ratio) // 2.8366
+$ms-7: calc($ms-6 * $ratio) // 3.4040
+$ms-8: calc($ms-7 * $ratio) // 4.0848
+$ms-9: calc($ms-8 * $ratio) // 4.9018
 
 /* Fonts */
 $sans: 'Questrial', sans-serif

vue-theme/src/utils/helpers.js

@@ -7,7 +7,7 @@ const materials = ['clay', 'fiber', 'glass', 'metal', 'paper', 'wood']
 
 const sortTypes = {
     alpha: 'by-alpha',
-u    material: 'by-material',
+    material: 'by-material',
     artist: 'by-artist',
     episode: 'by-episode',
     upcoming: 'by-upcoming',