diff --git a/.travis.yml b/.travis.yml index f72aed2eb..c79f23911 100644 --- a/.travis.yml +++ b/.travis.yml @@ -75,7 +75,7 @@ before_script: # Create WordPress database. - mysql -e 'CREATE DATABASE wordpress_test;' -uroot # Install CodeSniffer for WordPress Coding Standards checks. - - git clone https://github.com/squizlabs/PHP_CodeSniffer.git php-codesniffer --depth=1 + - git clone -b 2.9 --single-branch https://github.com/squizlabs/PHP_CodeSniffer.git php-codesniffer --depth=1 # Install WordPress Coding Standards. - git clone https://github.com/WordPress-Coding-Standards/WordPress-Coding-Standards.git wordpress-coding-standards --depth=1 # Hop into CodeSniffer directory. diff --git a/404.php b/404.php index e9a57f941..1c039b71d 100644 --- a/404.php +++ b/404.php @@ -8,35 +8,34 @@ get_header(); ?> -
-
- -
id="post-"> -
-

-
-
-
-

-
-

-
    -
    • -
  • - home page', 'foundationpress' ), - home_url() - ); - ?> -
    • -
  • Back button', 'foundationpress' ); ?>
    • -
+
+
id="post-"> +
+

+
+
+
+

-
+

+
    +
    • +
  • + home page', 'foundationpress' ), + home_url() + ); + ?> +
    • +
  • Back button', 'foundationpress' ); ?>
    • +
+
+
+ + -
-
+ -
+
diff --git a/assets/javascript/custom/stickyfooter.js b/assets/javascript/custom/stickyfooter.js index 587cca454..701b13791 100644 --- a/assets/javascript/custom/stickyfooter.js +++ b/assets/javascript/custom/stickyfooter.js @@ -2,7 +2,7 @@ (function($) { - var $footer = $('#footer-container'); // only search once + var $footer = $('[data-sticky-footer]'); // only search once $(window).bind('load resize orientationChange', function () { diff --git a/assets/scss/components/_featured-image.scss b/assets/scss/components/_featured-image.scss index 8ddd68771..169743129 100644 --- a/assets/scss/components/_featured-image.scss +++ b/assets/scss/components/_featured-image.scss @@ -1,4 +1,4 @@ -#featured-hero { +.featured-hero { background-size: cover; background-position: center; background-repeat: no-repeat; diff --git a/assets/scss/foundation.scss b/assets/scss/foundation.scss index 3526c6791..2f525c52e 100644 --- a/assets/scss/foundation.scss +++ b/assets/scss/foundation.scss @@ -76,8 +76,8 @@ // Modules @import "modules/navigation"; +@import "modules/content"; @import "modules/footer"; -@import "modules/sidebar"; @import "modules/editor-style"; // Components @@ -90,7 +90,3 @@ // Templates @import "templates/front"; @import "templates/kitchen-sink"; -@import "templates/page-default"; -@import "templates/page-sidebar-left"; -@import "templates/page-full-width"; -@import "templates/single-post"; diff --git a/assets/scss/global/_settings.scss b/assets/scss/global/_settings.scss index 79db2f525..8eb193e97 100644 --- a/assets/scss/global/_settings.scss +++ b/assets/scss/global/_settings.scss @@ -61,10 +61,9 @@ $medium-gray: #cacaca; $dark-gray: #8a8a8a; $black: #0a0a0a; $white: #fefefe; -$outer-space: #2c3840; $body-background: $white; $body-font-color: $black; -$body-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif; +$body-font-family: 'Helvetica Neue', Helvetica, Roboto, Arial, sans-serif; $body-antialiased: true; $global-margin: 1rem; $global-padding: 1rem; @@ -434,7 +433,7 @@ $meter-fill-bad: $alert-color; $offcanvas-size: 250px; $offcanvas-vertical-size: 250px; -$offcanvas-background: $outer-space; +$offcanvas-background: $light-gray; $offcanvas-shadow: 0 0 10px rgba($black, 0.7); $offcanvas-push-zindex: 1; $offcanvas-overlap-zindex: 10; @@ -589,12 +588,12 @@ $thumbnail-radius: $global-radius; // 35. Title Bar // ------------- -$titlebar-background: $outer-space; -$titlebar-color: $white; +$titlebar-background: $light-gray; +$titlebar-color: $body-font-color; $titlebar-padding: 0.5rem; $titlebar-text-font-weight: bold; -$titlebar-icon-color: $white; -$titlebar-icon-color-hover: $medium-gray; +$titlebar-icon-color: $body-font-color; +$titlebar-icon-color-hover: $black; $titlebar-icon-spacing: 0.25rem; // 36. Tooltip @@ -613,9 +612,9 @@ $tooltip-radius: $global-radius; // 37. Top Bar // ----------- -$topbar-padding: 0; -$topbar-background: $outer-space; -$topbar-submenu-background: $outer-space; +$topbar-padding: 0.5rem; +$topbar-background: $light-gray; +$topbar-submenu-background: $topbar-background; $topbar-title-spacing: 0.5rem 1rem 0.5rem 0; $topbar-input-width: 200px; $topbar-unstack-breakpoint: medium; diff --git a/assets/scss/modules/_content.scss b/assets/scss/modules/_content.scss new file mode 100644 index 000000000..b80a0d526 --- /dev/null +++ b/assets/scss/modules/_content.scss @@ -0,0 +1,51 @@ +.main-wrap { + @include grid-row(); + margin-top: 1rem; + + @include breakpoint(medium) { + margin-top: 3rem; + } +} + +.main-content { + + // default 2 column + @include grid-column(12); + @include breakpoint(medium) { + @include grid-column(8); + } + + // 1 column + .full-width.main-wrap & { + @include breakpoint(medium) { + @include grid-column(12); + } + } + + // 2 column sidebar left + .sidebar-left.main-wrap & { + @include breakpoint(medium) { + @include grid-column(8); + @include grid-col-pos(4); + } + } +} + +.sidebar { + + // default 2 column + @include grid-column(12); + @include breakpoint(medium) { + @include grid-column(4); + margin-top: 1rem; + } + + // 2 column sidebar left + .sidebar-left.main-wrap & { + @include breakpoint(medium) { + @include grid-column(4); + @include grid-col-pos(-8); + margin-top: 1rem; + } + } +} \ No newline at end of file diff --git a/assets/scss/modules/_footer.scss b/assets/scss/modules/_footer.scss index 8be15fce1..028d85740 100644 --- a/assets/scss/modules/_footer.scss +++ b/assets/scss/modules/_footer.scss @@ -1,18 +1,18 @@ -#footer-container { +.footer-container { max-width: 100%; width: 100%; margin: 0 auto; - border-top: 1px solid #ccc; + border-top: 1px solid $medium-gray; margin-top: rem-calc(60); +} - #footer { - @include grid-row(); - padding: rem-calc(30) 0; +.footer { + @include grid-row(); + padding: rem-calc(30) 0; - ul { - list-style-type: none; - margin: 0; - padding: 0; - } + ul { + list-style-type: none; + margin: 0; + padding: 0; } -} +} \ No newline at end of file diff --git a/assets/scss/modules/_navigation.scss b/assets/scss/modules/_navigation.scss index e8e0e758e..35820b9ca 100644 --- a/assets/scss/modules/_navigation.scss +++ b/assets/scss/modules/_navigation.scss @@ -1,95 +1,85 @@ // Navigation breakpoints -.desktop-menu, .top-bar-left { - @include show-for(medium); -} - -#mobile-menu, .title-bar { +.mobile-menu, +.site-title-bar { @include hide-for(medium); } -// Mobile menu -.off-canvas { - > ul.menu { - height: 100vh; - padding: 1rem; - - a { - color: $white; - font-weight: 600; - font-size: rem-calc(18); - opacity: .75; - } +.desktop-menu, +.site-navigation .top-bar-left { + @include show-for(medium); +} - .is-accordion-submenu-parent > a::after { - display: block; - width: 0; - height: 0; - border: inset 6px; - content: ''; - border-bottom-width: 0; - border-top-style: solid; - border-color: $white transparent transparent; - position: absolute; - top: 50%; - margin-top: -3px; - right: 1rem; - } - } - .menu .active > a { background-color: lighten($outer-space, 10%); } +// Site title +.site-mobile-title a { + // placeholder +} +.site-desktop-title a { + font-weight: bold; } -.title-bar-title { - a { - font-size: 1rem; - color: #B9B9B9; - } + + +// Mobile menu +.mobile-menu { + display: none; // prevents repaint caused by JS hiding menu onload } -// Tablet and desktop menu -.top-bar { - .menu .home a { - font-size: 1rem; - color: #B9B9B9; + +.mobile-menu, +.mobile-off-canvas-menu { + + // submenu arrow + .is-accordion-submenu-parent { + > a::after { + border-color: $accordionmenu-arrow-color transparent transparent; + } + &.active > a::after { + border-color: $menu-item-color-active transparent transparent; + } } - .menu a { - color: #e6e6e6; - padding-top: 0; - padding-bottom: 0; + // current page + .current_page_item > a { font-weight: bold; - font-size: 0.8rem; - line-height: 1; + } +} + + - &:hover:not(.button) { - background-color: #42525D; +// Tablet and desktop menu +.desktop-menu { + + // submenu arrow + li.is-dropdown-submenu-parent { + > a::after { + border-color: $accordionmenu-arrow-color transparent transparent; + } + &.active > a::after { + border-color: $menu-item-color-active transparent transparent; } } +} - .menu .active > a { background-color: lighten($outer-space, 10%); } +.site-navigation { + @include breakpoint(small only) { + padding: 0; // prevents container visibility on small screens + } +} - .menu>li:not(.menu-text)>a { padding: 1rem; } - .menu li:not(:last-child) { border-right: 1px solid #4e4e4e; } - .dropdown.menu .submenu { border: 0; } - .dropdown.menu .has-submenu.is-down-arrow a { padding-right: 1rem; } - .dropdown.menu .has-submenu.is-down-arrow > a::after { border: 0; } - .dropdown.menu:first-child > li.is-dropdown-submenu-parent > a::after { display: none; } -} -// Basic styles for post navigation. Nicolas Gallagher's "Micro clearfix" -// https://css-tricks.com/snippets/css/clear-fix/ -.post-navigation:before, -.post-navigation:after { - content: ""; - display: table; +// WP post navigation +.post-navigation { + @include clearfix; } -.post-navigation:after { - clear:both; +.nav-previous { + float:left; } -.nav-previous { float:left; } -.nav-next { float:right; } +.nav-next { + float:right; +} \ No newline at end of file diff --git a/assets/scss/modules/_sidebar.scss b/assets/scss/modules/_sidebar.scss deleted file mode 100644 index cd7737a8d..000000000 --- a/assets/scss/modules/_sidebar.scss +++ /dev/null @@ -1,10 +0,0 @@ -.sidebar { - @include breakpoint(small) { - @include grid-column(12); - } - - @include breakpoint(medium) { - @include grid-column(4); - margin-top: 1rem; - } -} diff --git a/assets/scss/templates/_front.scss b/assets/scss/templates/_front.scss index bbafd57a1..382b2b430 100644 --- a/assets/scss/templates/_front.scss +++ b/assets/scss/templates/_front.scss @@ -1,5 +1,5 @@ // Page header -#front-hero { +.front-hero { .marketing { @include grid-row(); max-width: 55rem; @@ -24,7 +24,7 @@ margin: 0 0 rem-calc(72); } - #watch { + .watch { @include breakpoint(small) { @include grid-column(7); @include grid-column-position(-5); @@ -50,7 +50,7 @@ color: #fff; } - #stargazers { + .stargazers { :before { content: "\f09b"; font-family: FontAwesome; @@ -62,7 +62,7 @@ } } - #twitter { + .twitter { :before { content: "\f099"; font-family: FontAwesome; diff --git a/assets/scss/templates/_kitchen-sink.scss b/assets/scss/templates/_kitchen-sink.scss index f7e1bd48f..f9f5f6503 100644 --- a/assets/scss/templates/_kitchen-sink.scss +++ b/assets/scss/templates/_kitchen-sink.scss @@ -1,89 +1,79 @@ -#kitchen-sink { - @include grid-row(); - margin-top: 3rem; +.kitchen-sink-header { + @include grid-column(12); +} - header { - @include grid-column(12); - .lead { - font-size: 125%; - line-height: 1.6; - } +.kitchen-sink-components { + hr { + margin: 3rem 0; } - #components { - hr { - margin: 3rem 0; - } - - @include breakpoint(small) { - @include grid-column(12); - } - - @include breakpoint(large) { - @include grid-column(9); - } + @include breakpoint(small) { + @include grid-column(12); + } + @include breakpoint(large) { + @include grid-column(9); } +} - #kitchen-sink-nav { - @include breakpoint(small) { - display: none; - } +.kitchen-sink-nav { + @include breakpoint(small) { + display: none; + } - @include breakpoint(large) { - @include grid-column(3); - display: block; - float: right; + @include breakpoint(large) { + @include grid-column(3); + display: block; + float: right; - .docs-sub-menu { - font-size: 0.85rem; - margin-top: 1rem; - } + .docs-sub-menu { + font-size: 0.85rem; + margin-top: 1rem; + } - .docs-menu-title { - text-transform: uppercase; - font-size: 0.75rem; - color: #999; - font-weight: bold; - line-height: 1; - padding-left: 0.9rem; - margin-bottom: 0.5rem; - border-top: 1px solid #e9e9e9; - margin-top: 1rem; - padding-top: 1.5rem; - } + .docs-menu-title { + text-transform: uppercase; + font-size: 0.75rem; + color: $dark-gray; + font-weight: bold; + line-height: 1; + padding-left: 0.9rem; + margin-bottom: 0.5rem; + border-top: 1px solid $medium-gray; + margin-top: 1rem; + padding-top: 1.5rem; + } - .docs-toc { - width: 100%; - padding-left: 4rem; - padding-right: 1rem; - } + .docs-toc { + width: 100%; + padding-left: 4rem; + padding-right: 1rem; + } - .docs-toc .active { - background: #2199e8; - color: white; - } + .docs-toc .active { + background: #2199e8; + color: white; + } - .docs-toc .docs-sub-menu:first-child .docs-menu-title { - margin-top: 0; - border-top: 0; - padding-top: 0; - } + .docs-toc .docs-sub-menu:first-child .docs-menu-title { + margin-top: 0; + border-top: 0; + padding-top: 0; } } +} - .row.display { - background: #eee; - font-size: 11px; - margin-bottom: 10px; - line-height: 2rem; - border: solid 1px #c6c6c6; - margin-left: 0 !important; - margin-right: 0 !important; +.row.display { + background: #eee; + font-size: 11px; + margin-bottom: 10px; + line-height: 2rem; + border: solid 1px #c6c6c6; + margin-left: 0 !important; + margin-right: 0 !important; - .columns:nth-child(2), .columns.small-centered, .columns.large-centered { - background: #e1e1e1; - } + .columns:nth-child(2), .columns.small-centered, .columns.large-centered { + background: #e1e1e1; } -} +} \ No newline at end of file diff --git a/assets/scss/templates/_page-default.scss b/assets/scss/templates/_page-default.scss deleted file mode 100644 index 0db2589fa..000000000 --- a/assets/scss/templates/_page-default.scss +++ /dev/null @@ -1,14 +0,0 @@ -#page { - @include grid-row(); - margin-top: 3rem; - - .main-content { - @include breakpoint(small) { - @include grid-column(12); - } - - @include breakpoint(medium) { - @include grid-column(8); - } - } -} diff --git a/assets/scss/templates/_page-full-width.scss b/assets/scss/templates/_page-full-width.scss deleted file mode 100644 index 77639dad9..000000000 --- a/assets/scss/templates/_page-full-width.scss +++ /dev/null @@ -1,10 +0,0 @@ -#page-full-width { - @include grid-row(); - margin-top: 3rem; - - .main-content { - @include breakpoint(small) { - @include grid-column(12); - } - } -} diff --git a/assets/scss/templates/_page-sidebar-left.scss b/assets/scss/templates/_page-sidebar-left.scss deleted file mode 100644 index cf5fea419..000000000 --- a/assets/scss/templates/_page-sidebar-left.scss +++ /dev/null @@ -1,27 +0,0 @@ -#page-sidebar-left { - @include grid-row(); - margin-top: 3rem; - - .main-content { - @include breakpoint(small) { - @include grid-column(12); - } - - @include breakpoint(medium) { - @include grid-column(8); - @include grid-col-pos(4); - } - } - - .sidebar { - @include breakpoint(small) { - @include grid-column(12); - } - - @include breakpoint(medium) { - @include grid-column(4); - @include grid-col-pos(-8); - margin-top: 1rem; - } - } -} diff --git a/assets/scss/templates/_single-post.scss b/assets/scss/templates/_single-post.scss deleted file mode 100644 index 30a8e0b4b..000000000 --- a/assets/scss/templates/_single-post.scss +++ /dev/null @@ -1,14 +0,0 @@ -#single-post { - @include grid-row(); - margin-top: 3rem; - - .main-content { - @include breakpoint(small) { - @include grid-column(12); - } - - @include breakpoint(medium) { - @include grid-column(8); - } - } -} diff --git a/comments.php b/comments.php index e2dc2c606..18b79b8ef 100644 --- a/comments.php +++ b/comments.php @@ -31,8 +31,8 @@ 'reverse_children' => '', 'format' => 'html5', 'short_ping' => false, - 'echo' => true, - 'moderation' => __( 'Your comment is awaiting moderation.', 'foundationpress' ), + 'echo' => true, + 'moderation' => __( 'Your comment is awaiting moderation.', 'foundationpress' ), ) ); diff --git a/footer.php b/footer.php index 7c2a89ea1..277efc6fe 100644 --- a/footer.php +++ b/footer.php @@ -11,8 +11,8 @@ ?> -