From 9cc5d2a38a5a65bbe469593e9f9c59398d3ec7e5 Mon Sep 17 00:00:00 2001 From: Andrew Misplon Date: Thu, 23 Nov 2017 13:16:42 +0200 Subject: [PATCH 01/18] Update theme settings CSS --- inc/settings.php | 23 ++++++++++++++--------- 1 file changed, 14 insertions(+), 9 deletions(-) diff --git a/inc/settings.php b/inc/settings.php index 36f66ee..e01d168 100644 --- a/inc/settings.php +++ b/inc/settings.php @@ -447,7 +447,6 @@ function siteorigin_corp_font_settings( $settings ) { function siteorigin_corp_settings_custom_css( $css ) { // Custom CSS. $css .= '/* style */ - /**** /private/var/folders/_s/htpl50fd5d70c9hb2nnvjnjh0000gn/T/B6bssz/sass/style.css ***/ body,button,input,select,optgroup,textarea { color: ${typography_text}; .font( ${typography_body_font} ); @@ -519,24 +518,30 @@ function siteorigin_corp_settings_custom_css( $css ) { a:hover,a:focus,a:active { color: ${typography_text}; } + .main-navigation ul ul li a { + background: ${navigation_drop_down_background}; + border-bottom: 1px solid ${navigation_drop_down_divider}; + color: ${navigation_drop_down_link}; + } .main-navigation ul ul li:hover > a { color: ${navigation_drop_down_link_hover}; } .main-navigation ul ul li:first-of-type { border-top: 2px solid ${navigation_link_accent}; } - .main-navigation ul ul a { - background: ${navigation_drop_down_background}; - border-bottom: 1px solid ${navigation_drop_down_divider}; - color: ${navigation_drop_down_link}; - } .main-navigation ul li { .font( ${typography_heading_font} ); } - .main-navigation ul a { + .main-navigation ul li a { border-bottom: 2px solid ${header_background}; color: ${navigation_link}; } + .main-navigation ul .menu-button a { + background: ${typography_accent}; + } + .main-navigation ul .menu-button a:hover { + background: .rgba( ${typography_accent}, .8); + } .main-navigation div > ul > li:hover > a { border-color: ${navigation_link_accent}; } @@ -647,10 +652,10 @@ function siteorigin_corp_settings_custom_css( $css ) { .widget #wp-calendar tfoot #prev a:hover,.widget #wp-calendar tfoot #next a:hover { color: ${typography_accent}; } - .widget_categories .cat-item { + .widget_archive li,.widget_categories li { color: ${typography_secondary_text}; } - .widget_categories .cat-item a { + .widget_archive li a,.widget_categories li a { color: ${typography_heading}; } .widget_recent_comments .recentcomments { From 0a4942a0613ea301e171dbd9db37d87174cb95fc Mon Sep 17 00:00:00 2001 From: Andrew Misplon Date: Fri, 24 Nov 2017 16:36:34 +0200 Subject: [PATCH 02/18] Finish styling the post format gallery slider --- inc/template-tags.php | 8 ++++---- sass/media/_flexslider.scss | 23 ++++++++++++----------- style.css | 22 +++++++++++++--------- 3 files changed, 29 insertions(+), 24 deletions(-) diff --git a/inc/template-tags.php b/inc/template-tags.php index 0427973..04c4e7a 100644 --- a/inc/template-tags.php +++ b/inc/template-tags.php @@ -142,8 +142,8 @@ function siteorigin_corp_display_icon( $type ) { - - + + - - + + Date: Fri, 24 Nov 2017 16:39:26 +0200 Subject: [PATCH 03/18] Finalise image caption styling --- sass/media/_captions.scss | 7 ++++--- style.css | 7 ++++--- 2 files changed, 8 insertions(+), 6 deletions(-) diff --git a/sass/media/_captions.scss b/sass/media/_captions.scss index ff3a5a2..5ec23ea 100644 --- a/sass/media/_captions.scss +++ b/sass/media/_captions.scss @@ -1,5 +1,6 @@ .wp-caption { - font-size: 14px; + color: $color__text-light; + font-size: 13px; max-width: 100%; img[class*="wp-image-"] { @@ -7,10 +8,10 @@ } .wp-caption-text { - margin: 12px 0; + margin: 14px 0; } } .wp-caption-text { - text-align: center; + text-align: left; } diff --git a/style.css b/style.css index 75dd7b2..e2f8ca4 100644 --- a/style.css +++ b/style.css @@ -2167,17 +2167,18 @@ object { ## Captions --------------------------------------------------------------*/ .wp-caption { - font-size: 14px; + color: #929292; + font-size: 13px; max-width: 100%; } .wp-caption img[class*="wp-image-"] { display: block; margin-left: auto; margin-right: auto; } .wp-caption .wp-caption-text { - margin: 12px 0; } + margin: 14px 0; } .wp-caption-text { - text-align: center; } + text-align: left; } /*-------------------------------------------------------------- ## - FlexSlider From 0c16a42798571e79758df5dd640724d558125081 Mon Sep 17 00:00:00 2001 From: Andrew Misplon Date: Fri, 24 Nov 2017 16:43:08 +0200 Subject: [PATCH 04/18] Improve blog loop description --- loops/loop-blog.php | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/loops/loop-blog.php b/loops/loop-blog.php index 5a74b16..9713d08 100644 --- a/loops/loop-blog.php +++ b/loops/loop-blog.php @@ -1,6 +1,6 @@ Date: Fri, 24 Nov 2017 19:40:31 +0200 Subject: [PATCH 05/18] Complete full posts slider application * Jetpack Featured Content slider. * Post Loop widget slider. * Final font size styling to follow. --- functions.php | 2 +- inc/extras.php | 7 +++- inc/jetpack.php | 9 +++++ inc/template-tags.php | 38 +++++++++++++++++++ loops/loop-slider.php | 46 ++++++++++++++++++++++ sass/media/_flexslider.scss | 4 ++ sass/media/_media.scss | 2 +- sass/media/_posts-slider.scss | 61 +++++++++++++----------------- style.css | 45 ++++++++++------------ template-parts/featured-slider.php | 54 ++++++++++++++++++++++++++ 10 files changed, 204 insertions(+), 64 deletions(-) create mode 100644 loops/loop-slider.php create mode 100644 template-parts/featured-slider.php diff --git a/functions.php b/functions.php index 6a52a62..08deb03 100644 --- a/functions.php +++ b/functions.php @@ -168,7 +168,7 @@ function siteorigin_corp_scripts() { // Flexslider. wp_register_script( 'jquery-flexslider', get_template_directory_uri() . '/js/jquery.flexslider' . SITEORIGIN_THEME_JS_PREFIX . '.js', array( 'jquery' ), '2.6.3', true ); - if ( is_single() && has_post_format( 'gallery' ) ) { + if ( is_home() && siteorigin_corp_has_featured_posts() ) { wp_enqueue_script( 'jquery-flexslider' ); } diff --git a/inc/extras.php b/inc/extras.php index b3c9c9c..5d1c21f 100644 --- a/inc/extras.php +++ b/inc/extras.php @@ -16,6 +16,11 @@ */ function siteorigin_corp_body_classes( $classes ) { + // Header margin. + if ( is_home() && siteorigin_corp_has_featured_posts() ) { + $classes[] = 'no-header-margin'; + } + // Mobile compatibility classes. $classes[] = 'css3-animations'; $classes[] = 'no-js'; @@ -33,7 +38,7 @@ function siteorigin_corp_body_classes( $classes ) { if ( ! empty( $page_settings['layout'] ) ) $classes[] = 'page-layout-' . $page_settings['layout']; if ( empty( $page_settings['header_margin'] ) ) $classes[] = 'no-header-margin'; if ( empty( $page_settings['footer_margin'] ) ) $classes[] = 'no-footer-margin'; - } + } // Responsive layout. $classes[] = 'responsive'; diff --git a/inc/jetpack.php b/inc/jetpack.php index a9fd9e9..4c46c88 100644 --- a/inc/jetpack.php +++ b/inc/jetpack.php @@ -15,6 +15,15 @@ * See: https://jetpack.me/support/responsive-videos/ */ function siteorigin_corp_jetpack_setup() { + /* + * Enable support for Jetpack Featured Content. + * See https://jetpack.com/support/featured-content/ + */ + add_theme_support( 'featured-content', array( + 'filter' => 'siteorigin_corp_get_featured_posts', + 'post_types' => array( 'post' ), + ) ); + /* * Enable support for Jetpack Infinite Scroll. * See https://jetpack.com/support/infinite-scroll/ diff --git a/inc/template-tags.php b/inc/template-tags.php index 04c4e7a..36fe114 100644 --- a/inc/template-tags.php +++ b/inc/template-tags.php @@ -365,6 +365,44 @@ function siteorigin_corp_footer_text() { } endif; +/** + * Add a filter for Jetpack Featured Content. + */ +function siteorigin_corp_get_featured_posts() { + return apply_filters( 'siteorigin_corp_get_featured_posts', array() ); +} + +/** + * Check the Jetpack Featured Content. + */ +function siteorigin_corp_has_featured_posts( $minimum = 1 ) { + if ( is_paged() ) + return false; + + $minimum = absint( $minimum ); + $featured_posts = apply_filters( 'siteorigin_corp_get_featured_posts', array() ); + + if ( ! is_array( $featured_posts ) ) + return false; + + if ( $minimum > count( $featured_posts ) ) + return false; + + return true; +} + +if ( ! function_exists( 'siteorigin_corp_display_featured_posts' ) ) : +/** + * Output the Jetpack Featured Content. + */ +function siteorigin_corp_display_featured_posts() { + if ( is_home() && siteorigin_corp_has_featured_posts() ) { + get_template_part( 'template-parts/featured', 'slider' ); + } +} +endif; +add_action( 'siteorigin_corp_content_before', 'siteorigin_corp_display_featured_posts' ); + if ( ! function_exists( 'siteorigin_corp_strip_gallery' ) ) : /** * Remove gallery. diff --git a/loops/loop-slider.php b/loops/loop-slider.php new file mode 100644 index 0000000..ae81cd4 --- /dev/null +++ b/loops/loop-slider.php @@ -0,0 +1,46 @@ + + +
+ +
    + + + + + +
  • > +
    +
    +
    + +
    + ', '' ); ?> +
    +
    • + + + +
+ +
    +
  • + +
    • +
  • + +
    • +
+ +
+ + diff --git a/sass/media/_flexslider.scss b/sass/media/_flexslider.scss index a97fcef..41f120c 100644 --- a/sass/media/_flexslider.scss +++ b/sass/media/_flexslider.scss @@ -73,6 +73,10 @@ text-align: center; width: 100%; + @media (max-width: 480px) { + display: none; + } + li { display: inline-block; margin: 0 5px; diff --git a/sass/media/_media.scss b/sass/media/_media.scss index 66258dc..277f848 100644 --- a/sass/media/_media.scss +++ b/sass/media/_media.scss @@ -7,7 +7,7 @@ padding: 0; } -/* Make sure embeds and iframes fit their containers. */ +// Make sure embeds and iframes fit their containers. embed, iframe, object { diff --git a/sass/media/_posts-slider.scss b/sass/media/_posts-slider.scss index 32f7d1d..acf39e9 100644 --- a/sass/media/_posts-slider.scss +++ b/sass/media/_posts-slider.scss @@ -9,7 +9,8 @@ background-color: $color__text-medium; background-position: center; background-size: cover; - height: 520px; + height: 500px; + position: relative; @media (max-width: 768px) { height: 380px; @@ -17,46 +18,54 @@ @media (max-width: 480px) { height: 155px; - } - + } + .overlay a { - background: rgba(0, 0, 0, .5); + background: rgba(0, 0, 0, .3); display: block; height: 100%; position: absolute; width: 100%; - } + } .slide-content { text-align: center; - padding: 160px 10% 0; + margin-top: -37.5px; position: absolute; + top: 50%; width: 100%; z-index: 3; - @media (max-width: 768px) { - padding-top: 80px; - } - @media (max-width: 480px) { - padding-top: 30px; - } + margin-top: -15.5px; + } @at-root .widget_siteorigin-panels-postloop & { - padding: 15% 10%; + + } + + .entry-meta span { + color: #fff; + margin-bottom: 20px; + + @media (max-width: 480px) { + display: none; + } + + a:hover { + color: #fff; + } } .entry-title { font-size: 46px; + font-weight: normal; margin-bottom: 0; position: relative; - text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5); z-index: 3; @media (max-width: 768px) { font-size: 41px; - line-height: 1.1; - margin-bottom: 10px; } @media (max-width: 480px) { @@ -65,26 +74,8 @@ a { color: #fff; - - &:hover { - color: rgba(255, 255, 255, .8); - } } - } - - .entry-excerpt { - color: rgba(255, 255, 255, .9); - font-size: 18px; - text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5); - - @media (max-width: 768px) { - font-size: 16px; - } - - @media (max-width: 480px) { - display: none; - } - } + } } } } diff --git a/style.css b/style.css index e2f8ca4..b416a03 100644 --- a/style.css +++ b/style.css @@ -2157,7 +2157,6 @@ body:not(.single) .hentry { margin-top: 0; padding: 0; } -/* Make sure embeds and iframes fit their containers. */ embed, iframe, object { @@ -2234,6 +2233,9 @@ object { position: absolute; text-align: center; width: 100%; } + @media (max-width: 480px) { + .flexslider .flex-control-nav { + display: none; } } .flexslider .flex-control-nav li { display: inline-block; margin: 0 5px; } @@ -2299,7 +2301,8 @@ object { background-color: #626262; background-position: center; background-size: cover; - height: 520px; } + height: 500px; + position: relative; } @media (max-width: 768px) { .featured-posts-slider .slides .slide { height: 380px; } } @@ -2307,52 +2310,42 @@ object { .featured-posts-slider .slides .slide { height: 155px; } } .featured-posts-slider .slides .slide .overlay a { - background: rgba(0, 0, 0, 0.5); + background: rgba(0, 0, 0, 0.3); display: block; height: 100%; position: absolute; width: 100%; } .featured-posts-slider .slides .slide .slide-content { text-align: center; - padding: 160px 10% 0; + margin-top: -37.5px; position: absolute; + top: 50%; width: 100%; z-index: 3; } - @media (max-width: 768px) { - .featured-posts-slider .slides .slide .slide-content { - padding-top: 80px; } } @media (max-width: 480px) { .featured-posts-slider .slides .slide .slide-content { - padding-top: 30px; } } - .widget_siteorigin-panels-postloop .featured-posts-slider .slides .slide .slide-content { - padding: 15% 10%; } + margin-top: -15.5px; } } + .featured-posts-slider .slides .slide .slide-content .entry-meta span { + color: #fff; + margin-bottom: 20px; } + @media (max-width: 480px) { + .featured-posts-slider .slides .slide .slide-content .entry-meta span { + display: none; } } + .featured-posts-slider .slides .slide .slide-content .entry-meta span a:hover { + color: #fff; } .featured-posts-slider .slides .slide .slide-content .entry-title { font-size: 46px; + font-weight: normal; margin-bottom: 0; position: relative; - text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5); z-index: 3; } @media (max-width: 768px) { .featured-posts-slider .slides .slide .slide-content .entry-title { - font-size: 41px; - line-height: 1.1; - margin-bottom: 10px; } } + font-size: 41px; } } @media (max-width: 480px) { .featured-posts-slider .slides .slide .slide-content .entry-title { font-size: 26px; } } .featured-posts-slider .slides .slide .slide-content .entry-title a { color: #fff; } - .featured-posts-slider .slides .slide .slide-content .entry-title a:hover { - color: rgba(255, 255, 255, 0.8); } - .featured-posts-slider .slides .slide .slide-content .entry-excerpt { - color: rgba(255, 255, 255, 0.9); - font-size: 18px; - text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5); } - @media (max-width: 768px) { - .featured-posts-slider .slides .slide .slide-content .entry-excerpt { - font-size: 16px; } } - @media (max-width: 480px) { - .featured-posts-slider .slides .slide .slide-content .entry-excerpt { - display: none; } } /*# sourceMappingURL=sass/maps/style.css.map */ diff --git a/template-parts/featured-slider.php b/template-parts/featured-slider.php new file mode 100644 index 0000000..1260657 --- /dev/null +++ b/template-parts/featured-slider.php @@ -0,0 +1,54 @@ + + +
+ +
    + + + + + +
  • > +
    +
    +
    + +
    + ', '' ); ?> +
    +
    • + + + +
+ +
    +
  • + +
    • +
  • + +
    • +
+ +
+ + From f86e03b79ac85516e8404092e8002cd9715a9e8b Mon Sep 17 00:00:00 2001 From: Andrew Misplon Date: Sat, 25 Nov 2017 12:56:22 +0200 Subject: [PATCH 06/18] Add the new calendar widget styling --- sass/site/secondary/_widgets.scss | 32 +++++++++++++++-------- sass/variables-site/_colors.scss | 6 ++--- style.css | 42 ++++++++++++++++++------------- 3 files changed, 48 insertions(+), 32 deletions(-) diff --git a/sass/site/secondary/_widgets.scss b/sass/site/secondary/_widgets.scss index 8d0a1f7..5968266 100644 --- a/sass/site/secondary/_widgets.scss +++ b/sass/site/secondary/_widgets.scss @@ -14,7 +14,7 @@ // Set the font size of elements below the widget title to 14px. ~ * { - font-size: .9333em; + font-size: 14px; } } @@ -43,15 +43,22 @@ /*-------------------------------------------------------------- ## Calendar Widgets --------------------------------------------------------------*/ +.calendar_wrap { + background: #fff; + border: 1px solid $color__background-hr; + padding-left: 6px; +} + .widget #wp-calendar { border: 0; + font-size: 13px; margin: 0; caption { color: $color__text-dark; - font-weight: bold; + font-size: 14px; font-weight: 600; - text-align: left; + padding-top: 14px; } tr:nth-child(2n+2) { @@ -65,14 +72,13 @@ } thead { - border-bottom: 2px solid $color__background-hr; tr { background: none; } th { - padding: 8px 0; + padding: 13px 0 8px; text-align: center; } } @@ -83,21 +89,25 @@ background: none; } - tr:first-of-type td { - padding-top: 8px; - } - td { padding-bottom: 8px; text-align: center; - } + + a { + color: $color__accent; + + &:hover { + color: $color__text-medium; + } + } + } } tfoot { #prev, #next { - padding-top: 4px; + padding: 4px 20px 17px; a { color: $color__text-dark; diff --git a/sass/variables-site/_colors.scss b/sass/variables-site/_colors.scss index cf53f4a..f8da439 100644 --- a/sass/variables-site/_colors.scss +++ b/sass/variables-site/_colors.scss @@ -25,7 +25,7 @@ $color__navigation_link_accent: #f14e4e; $color__navigation-drop-down-background: #262627; $color__navigation-drop-down-divider: #353538; $color__navigation-drop-down-link: #b2b2b2; -$color__navigation-drop-down-link-hover: #ffffff; +$color__navigation-drop-down-link-hover: #fff; $color__navigation-search-overlay_text: #b2b2b2; $color__navigation-search-overlay-background: #090d14; @@ -34,12 +34,12 @@ $color__site_title: #2d2d2d; $color__site_tagline: #929292; // Footer. -$color__footer-widget-title: #ffffff; +$color__footer-widget-title: #fff; $color__footer-widget-text: #b4b5b8; $color__footer-widget-link: #ffffff; $color__footer-widget-link-hover: #b4b5b8; $color__footer-background: #363a43; $color__bottom-bar-text: #b4b5b8; $color__bottom-bar-link: #b4b5b8; -$color__bottom-bar-link-hover: #ffffff; +$color__bottom-bar-link-hover: #fff; $color__bottom-bar-background: #2f333b; diff --git a/style.css b/style.css index b416a03..3226810 100644 --- a/style.css +++ b/style.css @@ -554,7 +554,7 @@ a { padding: 12px 20px; white-space: nowrap; } .main-navigation ul ul li:hover > a { - color: #ffffff; } + color: #fff; } .main-navigation ul ul li:hover > ul, .main-navigation ul ul li.focus > ul { left: 100%; } @@ -710,7 +710,7 @@ a { text-transform: uppercase; width: 100% !important; } #mobile-navigation ul li a:hover { - color: #ffffff; } + color: #fff; } #mobile-navigation ul li.menu-item-has-children > a { padding-right: 40px; } #mobile-navigation ul li .dropdown-toggle { @@ -723,7 +723,7 @@ a { top: -2px; transition: none; } #mobile-navigation ul li .dropdown-toggle:hover { - color: #ffffff; } + color: #fff; } #mobile-navigation ul li .dropdown-toggle.toggle-open { transform: rotate(-180deg); } #mobile-navigation ul ul { @@ -1119,7 +1119,7 @@ a { text-transform: uppercase; } .widget-area .widget .widget-title ~ *, .site-footer .widget .widget-title ~ * { - font-size: .9333em; } + font-size: 14px; } .widget-area .widget a, .site-footer .widget a { @@ -1143,37 +1143,43 @@ a { /*-------------------------------------------------------------- ## Calendar Widgets --------------------------------------------------------------*/ +.calendar_wrap { + background: #fff; + border: 1px solid #e6e6e6; + padding-left: 6px; } + .widget #wp-calendar { border: 0; + font-size: 13px; margin: 0; } .widget #wp-calendar caption { color: #2d2d2d; - font-weight: bold; + font-size: 14px; font-weight: 600; - text-align: left; } + padding-top: 14px; } .widget #wp-calendar tr:nth-child(2n+2) { background: none; } .widget #wp-calendar th, .widget #wp-calendar td { border: 0; padding: 0; } - .widget #wp-calendar thead { - border-bottom: 2px solid #e6e6e6; } - .widget #wp-calendar thead tr { - background: none; } - .widget #wp-calendar thead th { - padding: 8px 0; - text-align: center; } + .widget #wp-calendar thead tr { + background: none; } + .widget #wp-calendar thead th { + padding: 13px 0 8px; + text-align: center; } .widget #wp-calendar tbody .pad { background: none; } - .widget #wp-calendar tbody tr:first-of-type td { - padding-top: 8px; } .widget #wp-calendar tbody td { padding-bottom: 8px; text-align: center; } + .widget #wp-calendar tbody td a { + color: #f14e4e; } + .widget #wp-calendar tbody td a:hover { + color: #626262; } .widget #wp-calendar tfoot #prev, .widget #wp-calendar tfoot #next { - padding-top: 4px; } + padding: 4px 20px 17px; } .widget #wp-calendar tfoot #prev a, .widget #wp-calendar tfoot #next a { color: #2d2d2d; } @@ -2107,7 +2113,7 @@ body:not(.single) .hentry { margin: 0 2.75% 95px 0; float: left; } .site-footer .widgets .widget .widget-title { - color: #ffffff; + color: #fff; font-size: 1.0666em; font-weight: 500; } .site-footer .widgets .widget ~ * { @@ -2144,7 +2150,7 @@ body:not(.single) .hentry { .site-footer .bottom-bar a { color: #b4b5b8; } .site-footer .bottom-bar a:hover { - color: #ffffff; } + color: #fff; } /*-------------------------------------------------------------- # Media From 12890830946003e2a55fcb1a2a02a186c2f99312 Mon Sep 17 00:00:00 2001 From: Andrew Misplon Date: Sat, 25 Nov 2017 13:00:45 +0200 Subject: [PATCH 07/18] Update settings CSS --- inc/settings.php | 13 +++++++++++-- 1 file changed, 11 insertions(+), 2 deletions(-) diff --git a/inc/settings.php b/inc/settings.php index e01d168..2ce3cb3 100644 --- a/inc/settings.php +++ b/inc/settings.php @@ -640,11 +640,17 @@ function siteorigin_corp_settings_custom_css( $css ) { .widget-area .widget a:hover,.site-footer .widget a:hover { color: ${typography_accent}; } + .calendar_wrap { + border: 1px solid ${typography_border}; + } .widget #wp-calendar caption { color: ${typography_heading}; } - .widget #wp-calendar thead { - border-bottom: 2px solid ${typography_border}; + .widget #wp-calendar tbody td a { + color: ${typography_accent}; + } + .widget #wp-calendar tbody td a:hover { + color: ${typography_text}; } .widget #wp-calendar tfoot #prev a,.widget #wp-calendar tfoot #next a { color: ${typography_heading}; @@ -879,6 +885,9 @@ function siteorigin_corp_settings_custom_css( $css ) { .site-footer .bottom-bar a:hover { color: ${footer_bottom_bar_link_hover}; } + .wp-caption { + color: ${typography_secondary_text}; + } .featured-posts-slider .slides .slide { background-color: ${typography_text}; }'; From 95131de3a0ef865e02586dea4f4156c47584d2e0 Mon Sep 17 00:00:00 2001 From: Andrew Misplon Date: Sat, 25 Nov 2017 14:15:41 +0200 Subject: [PATCH 08/18] Add bottom bar footer social widget * Redo layout structure for bottom bar --- footer.php | 12 ++++++++- inc/settings.php | 8 ++++++ sass/navigation/_menus.scss | 7 +++--- sass/site/_footer.scss | 49 ++++++++++++++++++++++++++++++------- style.css | 42 ++++++++++++++++++++++--------- 5 files changed, 94 insertions(+), 24 deletions(-) diff --git a/footer.php b/footer.php index 46db334..6ef19fd 100644 --- a/footer.php +++ b/footer.php @@ -53,7 +53,17 @@ } ?> - 'menu-2', 'container_class' => 'footer-menu', 'depth' => 1, 'fallback_cb' => '' ) ); ?> + +
+ 'menu-2', 'depth' => 1, 'fallback_cb' => '' ) ); ?> + +
+ diff --git a/inc/settings.php b/inc/settings.php index 2ce3cb3..107f622 100644 --- a/inc/settings.php +++ b/inc/settings.php @@ -331,6 +331,14 @@ function siteorigin_corp_settings_init() { 'description' => esc_html__( 'Hide the SiteOrigin link in your footer.', 'siteorigin-corp' ), 'teaser' => true, ), + 'social_widget' => array( + 'type' => 'widget', + 'widget_class' => 'SiteOrigin_Widget_SocialMediaButtons_Widget', + 'bundle_widget' => 'social-media-buttons', + 'plugin' => 'so-widgets-bundle', + 'plugin_name' => esc_html__( 'SiteOrigin Widgets Bundle', 'siteorigin-corp' ), + 'description' => esc_html__( 'Add social icons to bottom bar menu.', 'siteorigin-corp' ), + ), 'widget_title' => array( 'type' => 'color', 'label' => esc_html__( 'Widget Title Color', 'siteorigin-corp' ), diff --git a/sass/navigation/_menus.scss b/sass/navigation/_menus.scss index 4778e1e..3f74500 100644 --- a/sass/navigation/_menus.scss +++ b/sass/navigation/_menus.scss @@ -499,18 +499,19 @@ $sel: ''; ## Footer Menu --------------------------------------------------------------*/ .footer-menu { - float: right; font-size: 13px; text-align: right; - width: 70%; @media (max-width: 768px) { - float: none; padding-top: 15px; text-align: center; width: 100%; } + > div { + display: inline-block; + } + .menu { list-style: none; margin: 0; diff --git a/sass/site/_footer.scss b/sass/site/_footer.scss index dfb4ee0..10384f1 100644 --- a/sass/site/_footer.scss +++ b/sass/site/_footer.scss @@ -53,10 +53,8 @@ } .site-info { - float: left; font-size: 13px; text-align: left; - width: 30%; @media (max-width: 768px) { float: none; @@ -69,13 +67,7 @@ background: $color__bottom-bar-background; color: $color__bottom-bar-text; overflow: auto; - padding: 25px 0; - - div:only-of-type { - float: none; - text-align: center; - width: 100%; - } + padding: 25px 0; a { color: $color__bottom-bar-link; @@ -84,5 +76,44 @@ color: $color__bottom-bar-link-hover; } } + + .corp-container { + -ms-flex-align: center; + -webkit-align-items: center; + -webkit-box-align: center; + align-items: center; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + -webkit-justify-content: space-between; + justify-content: space-between; + width: 100%; + + @media (max-width: 768px) { + flex-direction: column; + } + + div:only-of-type { + float: none; + text-align: center; + width: 100%; + } + } + + .widget { + display: inline-block; + margin: 0 0 0 15px; + + @media (max-width: 768px) { + margin: 0; + padding-top: 15px; + text-align: center; + width: 100%; + } + + a { + + } + } } } diff --git a/style.css b/style.css index 3226810..dcae92b 100644 --- a/style.css +++ b/style.css @@ -874,16 +874,15 @@ a { ## Footer Menu --------------------------------------------------------------*/ .footer-menu { - float: right; font-size: 13px; - text-align: right; - width: 70%; } + text-align: right; } @media (max-width: 768px) { .footer-menu { - float: none; padding-top: 15px; text-align: center; width: 100%; } } + .footer-menu > div { + display: inline-block; } .footer-menu .menu { list-style: none; margin: 0; @@ -2129,10 +2128,8 @@ body:not(.single) .hentry { float: none; width: 100% !important; } } .site-footer .site-info { - float: left; font-size: 13px; - text-align: left; - width: 30%; } + text-align: left; } @media (max-width: 768px) { .site-footer .site-info { float: none; @@ -2143,14 +2140,37 @@ body:not(.single) .hentry { color: #b4b5b8; overflow: auto; padding: 25px 0; } - .site-footer .bottom-bar div:only-of-type { - float: none; - text-align: center; - width: 100%; } .site-footer .bottom-bar a { color: #b4b5b8; } .site-footer .bottom-bar a:hover { color: #fff; } + .site-footer .bottom-bar .corp-container { + -ms-flex-align: center; + -webkit-align-items: center; + -webkit-box-align: center; + align-items: center; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + -webkit-justify-content: space-between; + justify-content: space-between; + width: 100%; } + @media (max-width: 768px) { + .site-footer .bottom-bar .corp-container { + flex-direction: column; } } + .site-footer .bottom-bar .corp-container div:only-of-type { + float: none; + text-align: center; + width: 100%; } + .site-footer .bottom-bar .widget { + display: inline-block; + margin: 0 0 0 15px; } + @media (max-width: 768px) { + .site-footer .bottom-bar .widget { + margin: 0; + padding-top: 15px; + text-align: center; + width: 100%; } } /*-------------------------------------------------------------- # Media From 56bb0b69efb3acbccdcf9f85e86776ba20213405 Mon Sep 17 00:00:00 2001 From: Andrew Misplon Date: Sat, 25 Nov 2017 14:21:52 +0200 Subject: [PATCH 09/18] Fix indenting --- footer.php | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/footer.php b/footer.php index 6ef19fd..bb138ee 100644 --- a/footer.php +++ b/footer.php @@ -58,7 +58,7 @@ if ( has_nav_menu( 'menu-2' ) || ! empty( $widget['networks'] ) ) : ?>
'menu-2', 'depth' => 1, 'fallback_cb' => '' ) ); ?> - From 4a674d76d42cd89789acf97e949797a1165d9b2a Mon Sep 17 00:00:00 2001 From: Andrew Misplon Date: Sat, 25 Nov 2017 16:58:55 +0200 Subject: [PATCH 10/18] Add the header overlap setting * Looks awesome! --- inc/extras.php | 1 + inc/settings.php | 13 ++++++++++++- sass/navigation/_menus.scss | 16 ++++++++++++++-- sass/site/_header.scss | 12 +++++++++++- style.css | 14 +++++++++++++- 5 files changed, 51 insertions(+), 5 deletions(-) diff --git a/inc/extras.php b/inc/extras.php index 5d1c21f..3e5c35f 100644 --- a/inc/extras.php +++ b/inc/extras.php @@ -36,6 +36,7 @@ function siteorigin_corp_body_classes( $classes ) { if ( ! empty( $page_settings ) ) { if ( ! empty( $page_settings['layout'] ) ) $classes[] = 'page-layout-' . $page_settings['layout']; + if ( ! empty( $page_settings['overlap'] ) ) $classes[] = 'overlap-' . $page_settings['overlap']; if ( empty( $page_settings['header_margin'] ) ) $classes[] = 'no-header-margin'; if ( empty( $page_settings['footer_margin'] ) ) $classes[] = 'no-footer-margin'; } diff --git a/inc/settings.php b/inc/settings.php index 107f622..26a87c2 100644 --- a/inc/settings.php +++ b/inc/settings.php @@ -1046,12 +1046,22 @@ function siteorigin_corp_page_settings( $settings, $type, $id ) { ), ); + $settings['overlap'] = array( + 'type' => 'select', + 'label' => esc_html__( 'Header Overlap', 'siteorigin-corp' ), + 'options' => array( + 'disabled' => esc_html__( 'Disabled', 'siteorigin-corp' ), + 'light' => esc_html__( 'Enabled - Light Text', 'siteorigin-corp' ), + 'dark' => esc_html__( 'Enabled - Dark Text', 'siteorigin-corp' ), + ), + ); + $settings['header_margin'] = array( 'type' => 'checkbox', 'label' => esc_html__( 'Header Bottom Margin', 'siteorigin-corp' ), 'checkbox_label' => esc_html__( 'Enable', 'siteorigin-corp' ), 'description' => esc_html__( 'Display the margin below the header.', 'siteorigin-corp' ) - ); + ); $settings['page_title'] = array( 'type' => 'checkbox', @@ -1083,6 +1093,7 @@ function siteorigin_corp_page_settings( $settings, $type, $id ) { */ function siteorigin_corp_setup_page_setting_defaults( $defaults, $type, $id ) { $defaults['layout'] = 'default'; + $defaults['overlap'] = 'default'; $defaults['header_margin'] = true; $defaults['page_title'] = true; $defaults['footer_margin'] = true; diff --git a/sass/navigation/_menus.scss b/sass/navigation/_menus.scss index 3f74500..144e232 100644 --- a/sass/navigation/_menus.scss +++ b/sass/navigation/_menus.scss @@ -40,7 +40,7 @@ font-weight: normal; max-width: 100%; padding: 12px 20px; - white-space: nowrap; + white-space: nowrap; } &:hover > a { @@ -88,11 +88,15 @@ } a { - border-bottom: 2px solid $color__header-background; + border-bottom: 2px solid transparent; color: $color__navigation-link; display: block; font-weight: bold; letter-spacing: 1px; + + .overlap-light & { + color: #fff; + } } } @@ -206,6 +210,10 @@ path { fill: $color__navigation-link; + + .overlap-light & { + fill: #fff; + } } } } @@ -246,6 +254,10 @@ path { fill: $color__navigation-link; + + .overlap-light & { + fill: #fff; + } } } } diff --git a/sass/site/_header.scss b/sass/site/_header.scss index 0a1c762..a36b4c1 100644 --- a/sass/site/_header.scss +++ b/sass/site/_header.scss @@ -7,6 +7,12 @@ width: 100%; z-index: 999; + body[class*="overlap-"] & { + background: transparent; + border: none; + position: absolute; + } + .no-header-margin & { margin-bottom: 0; } @@ -65,7 +71,11 @@ margin: 0; a { - color: $color__site_title; + color: $color__site_title; + + .overlap-light & { + color: #fff; + } } } diff --git a/style.css b/style.css index dcae92b..7ff27b0 100644 --- a/style.css +++ b/style.css @@ -580,11 +580,13 @@ a { .main-navigation ul li:last-of-type { margin-right: 0; } .main-navigation ul li a { - border-bottom: 2px solid #fff; + border-bottom: 2px solid transparent; color: #2d2d2d; display: block; font-weight: bold; letter-spacing: 1px; } + .overlap-light .main-navigation ul li a { + color: #fff; } .main-navigation ul .left .sub-menu, .main-navigation ul .left .children { right: 0; } @@ -653,6 +655,8 @@ a { width: 17px; } .main-navigation .search-toggle .open svg path { fill: #2d2d2d; } + .overlap-light .main-navigation .search-toggle .open svg path { + fill: #fff; } .main-navigation .search-toggle .close { display: none; } .main-navigation .search-toggle.close-search .open { @@ -676,6 +680,8 @@ a { width: 23px; } #mobile-menu-button svg path { fill: #2d2d2d; } + .overlap-light #mobile-menu-button svg path { + fill: #fff; } #mobile-navigation { background: #262627; @@ -1365,6 +1371,10 @@ a { position: relative; width: 100%; z-index: 999; } + body[class*="overlap-"] .site-header { + background: transparent; + border: none; + position: absolute; } .no-header-margin .site-header { margin-bottom: 0; } .topbar-out .site-header { @@ -1406,6 +1416,8 @@ a { margin: 0; } .site-header .site-branding .site-title a { color: #2d2d2d; } + .overlap-light .site-header .site-branding .site-title a { + color: #fff; } .site-header .site-branding img { display: inline-block; vertical-align: middle; } From a285d59a877d92cbfbc21988bed520398ec23b93 Mon Sep 17 00:00:00 2001 From: Andrew Misplon Date: Mon, 27 Nov 2017 16:15:17 +0200 Subject: [PATCH 11/18] Adjust the sub-menu spacing * Fix indentation. --- inc/settings.php | 2 +- sass/navigation/_menus.scss | 3 ++- style.css | 5 +++-- 3 files changed, 6 insertions(+), 4 deletions(-) diff --git a/inc/settings.php b/inc/settings.php index 26a87c2..68f23d5 100644 --- a/inc/settings.php +++ b/inc/settings.php @@ -1094,7 +1094,7 @@ function siteorigin_corp_page_settings( $settings, $type, $id ) { function siteorigin_corp_setup_page_setting_defaults( $defaults, $type, $id ) { $defaults['layout'] = 'default'; $defaults['overlap'] = 'default'; - $defaults['header_margin'] = true; + $defaults['header_margin'] = true; $defaults['page_title'] = true; $defaults['footer_margin'] = true; $defaults['footer_widgets'] = true; diff --git a/sass/navigation/_menus.scss b/sass/navigation/_menus.scss index 144e232..b44296a 100644 --- a/sass/navigation/_menus.scss +++ b/sass/navigation/_menus.scss @@ -14,7 +14,7 @@ opacity: 0; position: absolute; text-align: left; - top: 16px; + top: 20px; transform: scale(0.95); transition: all 0.15s ease-in; transform-origin: center top; @@ -93,6 +93,7 @@ display: block; font-weight: bold; letter-spacing: 1px; + padding-bottom: 4px; .overlap-light & { color: #fff; diff --git a/style.css b/style.css index 7ff27b0..f9a76af 100644 --- a/style.css +++ b/style.css @@ -530,7 +530,7 @@ a { opacity: 0; position: absolute; text-align: left; - top: 16px; + top: 20px; transform: scale(0.95); transition: all 0.15s ease-in; transform-origin: center top; @@ -584,7 +584,8 @@ a { color: #2d2d2d; display: block; font-weight: bold; - letter-spacing: 1px; } + letter-spacing: 1px; + padding-bottom: 4px; } .overlap-light .main-navigation ul li a { color: #fff; } .main-navigation ul .left .sub-menu, From 4c5f236481e37e64bb644b3df4ee80066025e32c Mon Sep 17 00:00:00 2001 From: Andrew Misplon Date: Mon, 27 Nov 2017 20:35:31 +0200 Subject: [PATCH 12/18] Fix several issues with the header overlap setting --- inc/extras.php | 2 +- inc/settings.php | 3 ++- sass/navigation/_menus.scss | 37 ++++++++++++++++++++++--------------- sass/site/_header.scss | 6 +++++- style.css | 28 +++++++++++++++++----------- 5 files changed, 47 insertions(+), 29 deletions(-) diff --git a/inc/extras.php b/inc/extras.php index 3e5c35f..c7b0510 100644 --- a/inc/extras.php +++ b/inc/extras.php @@ -36,7 +36,7 @@ function siteorigin_corp_body_classes( $classes ) { if ( ! empty( $page_settings ) ) { if ( ! empty( $page_settings['layout'] ) ) $classes[] = 'page-layout-' . $page_settings['layout']; - if ( ! empty( $page_settings['overlap'] ) ) $classes[] = 'overlap-' . $page_settings['overlap']; + if ( ! empty( $page_settings['overlap'] ) && ( $page_settings['overlap'] != 'disabled' ) ) $classes[] = 'overlap-' . $page_settings['overlap']; if ( empty( $page_settings['header_margin'] ) ) $classes[] = 'no-header-margin'; if ( empty( $page_settings['footer_margin'] ) ) $classes[] = 'no-footer-margin'; } diff --git a/inc/settings.php b/inc/settings.php index 68f23d5..e551e2a 100644 --- a/inc/settings.php +++ b/inc/settings.php @@ -1050,7 +1050,8 @@ function siteorigin_corp_page_settings( $settings, $type, $id ) { 'type' => 'select', 'label' => esc_html__( 'Header Overlap', 'siteorigin-corp' ), 'options' => array( - 'disabled' => esc_html__( 'Disabled', 'siteorigin-corp' ), + 'disabled' => esc_html__( 'Disabled', 'siteorigin-corp' ), + 'enabled' => esc_html__( 'Enabled', 'siteorigin-corp' ), 'light' => esc_html__( 'Enabled - Light Text', 'siteorigin-corp' ), 'dark' => esc_html__( 'Enabled - Dark Text', 'siteorigin-corp' ), ), diff --git a/sass/navigation/_menus.scss b/sass/navigation/_menus.scss index b44296a..5e30e20 100644 --- a/sass/navigation/_menus.scss +++ b/sass/navigation/_menus.scss @@ -16,7 +16,7 @@ text-align: left; top: 20px; transform: scale(0.95); - transition: all 0.15s ease-in; + transition: all .15s ease-in; transform-origin: center top; visibility: hidden; z-index: 99999; @@ -34,7 +34,8 @@ a { background: $color__navigation-drop-down-background; - border-bottom: 1px solid $color__navigation-drop-down-divider; + border-bottom: 1px solid; + border-color: $color__navigation-drop-down-divider; color: $color__navigation-drop-down-link; font-size: 12px; font-weight: normal; @@ -93,13 +94,9 @@ display: block; font-weight: bold; letter-spacing: 1px; - padding-bottom: 4px; - - .overlap-light & { - color: #fff; - } + padding-bottom: 4px; } - } + } // If a class of 'left' is added to a menu item, break drop down menu items to the left. .left { @@ -148,7 +145,7 @@ } // If a class of .menu-button is added to a menu item, style it as a button. - .menu-button { + @at-root #site-navigation#{&} .menu-button { margin-bottom: 0; padding-bottom: 0; @@ -165,6 +162,7 @@ &:hover { background: rgba($color__accent, .8); + border: none; color: #fff; } } @@ -174,13 +172,18 @@ // First level items. div > ul > li { - &:hover > a { - border-color: $color__navigation_link_accent; + // Page Settings: Overlap with colors. + .overlap-light & > a { + color: #fff; } - &.menu-item-has-children:hover > a, - &.page_item_has_children:hover > a { - border-color: $color__header-background; + .overlap-dark & > a { + color: #2d2d2d; + } + + &:hover > a { + border-bottom: 2px solid; + border-color: $color__navigation_link_accent; } &.current a, @@ -214,7 +217,11 @@ .overlap-light & { fill: #fff; - } + } + + .overlap-dark & { + fill: #2d2d2d; + } } } } diff --git a/sass/site/_header.scss b/sass/site/_header.scss index a36b4c1..b50c768 100644 --- a/sass/site/_header.scss +++ b/sass/site/_header.scss @@ -7,7 +7,7 @@ width: 100%; z-index: 999; - body[class*="overlap-"] & { + body[class*="overlap-"] &:not(.stuck) { background: transparent; border: none; position: absolute; @@ -107,6 +107,10 @@ .masthead-sentinel { margin-bottom: 60px; + body[class*="overlap-"] & { + display: none; + } + .no-header-margin & { margin-bottom: 0; } diff --git a/style.css b/style.css index f9a76af..12a57ad 100644 --- a/style.css +++ b/style.css @@ -532,7 +532,7 @@ a { text-align: left; top: 20px; transform: scale(0.95); - transition: all 0.15s ease-in; + transition: all .15s ease-in; transform-origin: center top; visibility: hidden; z-index: 99999; } @@ -546,7 +546,8 @@ a { min-width: 100%; } .main-navigation ul ul li a { background: #262627; - border-bottom: 1px solid #353538; + border-bottom: 1px solid; + border-color: #353538; color: #b2b2b2; font-size: 12px; font-weight: normal; @@ -586,8 +587,6 @@ a { font-weight: bold; letter-spacing: 1px; padding-bottom: 4px; } - .overlap-light .main-navigation ul li a { - color: #fff; } .main-navigation ul .left .sub-menu, .main-navigation ul .left .children { right: 0; } @@ -615,10 +614,10 @@ a { left: initial; left: auto; right: 100%; } - .main-navigation ul .menu-button { + #site-navigation.main-navigation ul .menu-button { margin-bottom: 0; padding-bottom: 0; } - .main-navigation ul .menu-button a { + #site-navigation.main-navigation ul .menu-button a { background: #f14e4e; border: 0; border-radius: 0; @@ -628,14 +627,17 @@ a { padding: 11px 25px; text-transform: uppercase; transition: .3s; } - .main-navigation ul .menu-button a:hover { + #site-navigation.main-navigation ul .menu-button a:hover { background: rgba(241, 78, 78, 0.8); + border: none; color: #fff; } + .overlap-light .main-navigation div > ul > li > a { + color: #fff; } + .overlap-dark .main-navigation div > ul > li > a { + color: #2d2d2d; } .main-navigation div > ul > li:hover > a { + border-bottom: 2px solid; border-color: #f14e4e; } - .main-navigation div > ul > li.menu-item-has-children:hover > a, - .main-navigation div > ul > li.page_item_has_children:hover > a { - border-color: #fff; } .main-navigation div > ul > li.current a, .main-navigation div > ul > li.current_page_item > a, .main-navigation div > ul > li.current-menu-item > a, @@ -658,6 +660,8 @@ a { fill: #2d2d2d; } .overlap-light .main-navigation .search-toggle .open svg path { fill: #fff; } + .overlap-dark .main-navigation .search-toggle .open svg path { + fill: #2d2d2d; } .main-navigation .search-toggle .close { display: none; } .main-navigation .search-toggle.close-search .open { @@ -1372,7 +1376,7 @@ a { position: relative; width: 100%; z-index: 999; } - body[class*="overlap-"] .site-header { + body[class*="overlap-"] .site-header:not(.stuck) { background: transparent; border: none; position: absolute; } @@ -1436,6 +1440,8 @@ a { .masthead-sentinel { margin-bottom: 60px; } + body[class*="overlap-"] .masthead-sentinel { + display: none; } .no-header-margin .masthead-sentinel { margin-bottom: 0; } From 2a757232bde693c4cb86bb6737bcb029ea3daeab Mon Sep 17 00:00:00 2001 From: Andrew Misplon Date: Tue, 28 Nov 2017 12:59:03 +0200 Subject: [PATCH 13/18] Correct page setting overlap default --- inc/settings.php | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/inc/settings.php b/inc/settings.php index e551e2a..aa67f6c 100644 --- a/inc/settings.php +++ b/inc/settings.php @@ -1093,12 +1093,12 @@ function siteorigin_corp_page_settings( $settings, $type, $id ) { * Add the default Page Settings. */ function siteorigin_corp_setup_page_setting_defaults( $defaults, $type, $id ) { - $defaults['layout'] = 'default'; - $defaults['overlap'] = 'default'; + $defaults['layout'] = 'default'; + $defaults['overlap'] = 'disabled'; $defaults['header_margin'] = true; - $defaults['page_title'] = true; - $defaults['footer_margin'] = true; - $defaults['footer_widgets'] = true; + $defaults['page_title'] = true; + $defaults['footer_margin'] = true; + $defaults['footer_widgets'] = true; return $defaults; } From ddb05bf9ff02bc25306882a1b7f3008bcf6cef55 Mon Sep 17 00:00:00 2001 From: Andrew Misplon Date: Tue, 28 Nov 2017 12:59:27 +0200 Subject: [PATCH 14/18] Add overlap color settings for site title and tag --- sass/site/_header.scss | 41 +++++++++++++++++++++++++---------------- style.css | 6 ++++++ 2 files changed, 31 insertions(+), 16 deletions(-) diff --git a/sass/site/_header.scss b/sass/site/_header.scss index b50c768..031e93a 100644 --- a/sass/site/_header.scss +++ b/sass/site/_header.scss @@ -17,23 +17,20 @@ margin-bottom: 0; } - @at-root { - - .topbar-out & { - @include clearfix; - top: 0; - left: 0; - width: 100%; - } + .topbar-out & { + @include clearfix; + top: 0; + left: 0; + width: 100%; + } - .topbar-out.admin-bar & { - top: 32px; + .topbar-out.admin-bar & { + top: 32px; - @media (max-width: 782px) { - top: 46px; - } - } - } + @media (max-width: 782px) { + top: 46px; + } + } @media (max-width: 600px) { @@ -75,7 +72,11 @@ .overlap-light & { color: #fff; - } + } + + .overlap-dark & { + color: #2d2d2d; + } } } @@ -95,6 +96,14 @@ font-size: 13px; line-height: normal; margin: -3px 0 0; + + .overlap-light & { + color: #fff; + } + + .overlap-dark & { + color: #2d2d2d; + } } > * { diff --git a/style.css b/style.css index 12a57ad..4aa09c6 100644 --- a/style.css +++ b/style.css @@ -1423,6 +1423,8 @@ a { color: #2d2d2d; } .overlap-light .site-header .site-branding .site-title a { color: #fff; } + .overlap-dark .site-header .site-branding .site-title a { + color: #2d2d2d; } .site-header .site-branding img { display: inline-block; vertical-align: middle; } @@ -1435,6 +1437,10 @@ a { font-size: 13px; line-height: normal; margin: -3px 0 0; } + .overlap-light .site-header .site-branding .site-description { + color: #fff; } + .overlap-dark .site-header .site-branding .site-description { + color: #2d2d2d; } .site-header .site-branding > * { transform-origin: left center; } From 5c68abda6d18f17f9ad768eaf4fb1ec1e4e778e3 Mon Sep 17 00:00:00 2001 From: Andrew Misplon Date: Tue, 28 Nov 2017 13:03:14 +0200 Subject: [PATCH 15/18] Transition the sticky header --- sass/site/_header.scss | 4 ++++ style.css | 2 ++ 2 files changed, 6 insertions(+) diff --git a/sass/site/_header.scss b/sass/site/_header.scss index 031e93a..00aa7cb 100644 --- a/sass/site/_header.scss +++ b/sass/site/_header.scss @@ -39,6 +39,10 @@ } } + @at-root .topbar-out#{&} { + transition: background 500ms ease; + } + // A class added after scroll. &.stuck { box-shadow: 0 1px 1px rgba(0, 0, 0, .075); diff --git a/style.css b/style.css index 4aa09c6..453893a 100644 --- a/style.css +++ b/style.css @@ -1398,6 +1398,8 @@ a { @media (max-width: 600px) { .admin-bar .site-header.sticky.stuck { top: 0; } } + .topbar-out.site-header { + transition: background 500ms ease; } .site-header.stuck { box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075); } .site-header .site-header-inner { From c0e964ccc7818c22d89e7f99d586c2249d610972 Mon Sep 17 00:00:00 2001 From: Andrew Misplon Date: Tue, 28 Nov 2017 13:03:48 +0200 Subject: [PATCH 16/18] Update Customizer settings --- inc/settings.php | 10 +++------- 1 file changed, 3 insertions(+), 7 deletions(-) diff --git a/inc/settings.php b/inc/settings.php index aa67f6c..da369aa 100644 --- a/inc/settings.php +++ b/inc/settings.php @@ -528,7 +528,7 @@ function siteorigin_corp_settings_custom_css( $css ) { } .main-navigation ul ul li a { background: ${navigation_drop_down_background}; - border-bottom: 1px solid ${navigation_drop_down_divider}; + border-color: ${navigation_drop_down_divider}; color: ${navigation_drop_down_link}; } .main-navigation ul ul li:hover > a { @@ -541,21 +541,17 @@ function siteorigin_corp_settings_custom_css( $css ) { .font( ${typography_heading_font} ); } .main-navigation ul li a { - border-bottom: 2px solid ${header_background}; color: ${navigation_link}; } - .main-navigation ul .menu-button a { + #site-navigation.main-navigation ul .menu-button a { background: ${typography_accent}; } - .main-navigation ul .menu-button a:hover { + #site-navigation.main-navigation ul .menu-button a:hover { background: .rgba( ${typography_accent}, .8); } .main-navigation div > ul > li:hover > a { border-color: ${navigation_link_accent}; } - .main-navigation div > ul > li.menu-item-has-children:hover > a,.main-navigation div > ul > li.page_item_has_children:hover > a { - border-color: ${header_background}; - } .main-navigation div > ul > li.current a,.main-navigation div > ul > li.current_page_item > a,.main-navigation div > ul > li.current-menu-item > a,.main-navigation div > ul > li.current_page_ancestor > a,.main-navigation div > ul > li.current-menu-ancestor > a { border-color: ${navigation_link_accent}; } From 722caa0252c95ebb129b96d7aa579a054c8d9b42 Mon Sep 17 00:00:00 2001 From: Andrew Misplon Date: Tue, 28 Nov 2017 13:21:34 +0200 Subject: [PATCH 17/18] Readme update --- readme.txt | 1 + 1 file changed, 1 insertion(+) diff --git a/readme.txt b/readme.txt index d9ee697..4dac6b5 100644 --- a/readme.txt +++ b/readme.txt @@ -34,6 +34,7 @@ A modern business theme from SiteOrigin. Corp is versatile and quick to customiz SiteOrigin Corp includes support for the following plugins: * [Breadcrumb NavXT](https://wordpress.org/plugins/breadcrumb-navxt/) +* [Jetpack Featured Content](https://jetpack.com/support/featured-content/) * [Jetpack Infinite Scroll](https://jetpack.com/support/infinite-scroll/) * [Jetpack Responsive Videos](https://jetpack.com/support/responsive-videos/) * [Page Builder by SiteOrigin](https://wordpress.org/plugins/siteorigin-panels/) From 69573cf8f9291aa1f8163d6e9a34fae19a438684 Mon Sep 17 00:00:00 2001 From: Andrew Misplon Date: Tue, 28 Nov 2017 13:21:40 +0200 Subject: [PATCH 18/18] Changelog prep --- changelog.txt | 9 +++++++++ 1 file changed, 9 insertions(+) diff --git a/changelog.txt b/changelog.txt index 4d63dca..f069b1f 100644 --- a/changelog.txt +++ b/changelog.txt @@ -1,5 +1,14 @@ == Changelog == += 1.1 - 28 November 2017 = +* Additional styling for the post format gallery slider. +* Updated image caption styling. +* Updated Calendar widget styling. +* Added a posts slider loop for use in the Page Builder Post Loop widget. +* Added posts slider support for Jetpack Featured Content. +* Added bottom bar social widget support. +* Added a header overlap page setting. + = 1.0 - 22 November 2017 = * Added additional page settings. * Added post format support for Gallery, Image, Video.