diff --git a/archive.php b/archive.php index 2e742dd..cfd3620 100644 --- a/archive.php +++ b/archive.php @@ -1,25 +1,22 @@ '; -echo '
'; -echo '
'; -if ( have_posts() ) { - while ( have_posts() ) { - the_post(); + get_header(); + get_template_part( 'template', 'blogheader' ); - get_template_part( 'content', 'blog' ); + echo '
'; + if ( have_posts() ) { + while ( have_posts() ) { + the_post(); + + get_template_part( 'content', 'blog' ); + + } + } + else { + get_template_part( 'content', 'noposts' ); } -} -else { - get_template_part( 'content', 'noposts' ); -} -echo '
'; -//get_sidebar('blog'); + echo '
'; -echo '
'; -echo ''; -get_footer(); + get_footer(); ?> diff --git a/assets/less/ascribe.less b/assets/less/ascribe.less index dc7a891..09392d1 100644 --- a/assets/less/ascribe.less +++ b/assets/less/ascribe.less @@ -27,204 +27,114 @@ @import 'ascribe/_subtemplates.less'; @import 'ascribe/_feature-circles.less'; @import 'ascribe/_team.less'; +@import 'ascribe/_blog.less'; @import 'vendor/print.less'; // HEADER @chevronOffsetHeader: 60px; -header { - overflow: hidden; - padding-bottom: 50px; -} -header + .chevron-divider { + +.header + .chevron-divider { height: 175px; } -.page-template-template-companywhite header, -.page-template-template-general header, -.page-template-default header, -.blog header, -.single-career header, -.error404 header, -.archive header, -.single-post header { +.header { + overflow: hidden; + padding-bottom: 50px; - .logo { - margin-top: 30px; - position:relative; - z-index:10; - } - nav { - position: relative; - width: 100%; - text-align: center; - margin: 0; - top: 20px; + .page-template-template-companywhite &, + .page-template-template-general &, + .page-template-default &, + .blog &, + .single-career &, + .error404 &, + .archive &, + .single-post & { - ul { - li { - display: inline-block; - border: 1px solid #b8b9b9; - margin: 0 15px 0 15px; - height: 60px; - padding: 0 30px; - width: 160px; - text-align: center; - vertical-align: top; - - a { - color: #000; - display: block; - font-size: 16px; - position: relative; - top: 50%; - transform: translateY(-50%); - - &:after { - content: ' Tour'; - } - } - - &:hover { - border: 1px solid @pink; - - a { - color: @pink; - } - } - } + .logo { + margin-top: 30px; + position:relative; + z-index:10; } - } - - @media screen and (max-width: 910px) { nav { + position: relative; + width: 100%; + text-align: center; + margin: 0; + top: 20px; + ul { + &:extend(.list-unstyled all, .small); li { - margin-right: 10px; - width: 120px; - padding: 0 10px; - } - } - } - } - @media screen and (max-width: 750px) { - .tour-switcher { - display: none; - } - .phone-and-up { - display: none; - } - .phone-only { - display: block; - } - .hamburger { - display: inline-block; - } - .mobile-nav { - display:none; - &.active { - display:block; - } - } - } -} -.blog header, .archive header, .single-post header { - &:extend(.blueGradient); - padding-bottom:0; - - nav { - - ul { - li { - border: 1px solid fade(@white,30); - - a { - color: @white; - } - - &:hover { - background-color: fade(@white,30); - border: 1px solid fade(@white,30); + display: inline-block; + border: 1px solid #b8b9b9; + margin: 0 15px 0 15px; + height: 60px; + padding: 0 30px; + width: 160px; + text-align: center; + vertical-align: top; a { - color: @white; + color: #000; + display: block; + font-size: 16px; + position: relative; + top: 50%; + transform: translateY(-50%); + + &:after { + content: ' Tour'; + } + } + + &:hover { + border: 1px solid @pink; + + a { + color: @pink; + } } } } } - } - .chevron-divider { - position: absolute; - top: 110px; - z-index: 1; - } - h1 { - color: @white; - font-size: 54px; - position: relative; - z-index: 2; - margin-top: 100px; - margin-bottom: 50px; - text-align: center; - a { - color: @white; - - &:hover { - color: @pink; + @media screen and (max-width: 910px) { + nav { + ul { + li { + margin-right: 10px; + width: 120px; + padding: 0 10px; + } + } } } - } - .app-links { - color: @white; - a { - color: @white; - - &:hover { - color: @pink; + @media screen and (max-width: 750px) { + .tour-switcher { + display: none; } - } - } - & + nav { - background-color: @blueBright; - border-top: 2px solid fade(@white,50); - - ul { - display:table; - padding: 0 10px; - width: 100%; - } - li { - width: 20%; - display: table; - text-align: center; - vertical-align: middle; - padding: 0; - height: 88px; - float: left; - - &:hover { - background-color: fade(@white,50); + .phone-and-up { + display: none; } - } - a { - display: table-cell; - text-align: center; - font-size: 16px; - color: #fff; - height: 88px; - width: 100%; - vertical-align: middle; - padding: 0 10px; - } - - @media screen and (max-width: 450px) { - li { - width: 50%; + .phone-only { + display: block; + } + .hamburger { + display: inline-block; + } + .mobile-nav { + display:none; + &.active { + display:block; + } } } } } + + + .tour-switcher { .phone-and-up; } @@ -1168,104 +1078,6 @@ header + .chevron-divider { } } -// BLOG -.blog .column-container { - width: calc(~"100% + 70px"); - -} -article.post { - padding-top: 40px; - padding-bottom: 50px; - border-bottom: 2px solid #e5e5e5; - h2 { - margin:0; - font-size: 12px; - &:extend(.fontLight); - } - .post-categories { - list-style: none; - font-size: 12px; - &:extend(.fontLight); - } - h1 { - margin-top:0; - } - .image { - width: 100%; - img { - display: block; - max-width: 100%; - width: 100%; - } - } - - .meta { - .chevron-divider; - opacity: 1; - line-height: 75px; - height: 75px; - padding-left: 15px; - margin-bottom: 35px; - font-weight: 500; - font-size: 16px; - } -} -.blog-column { - .ttl-columns.columnTwoThirds; - padding-right: 70px; - -} -.blog-sidebar { - .ttl-columns.column-3; - padding-right: 70px; - padding-top: 40px; - - img { - display:block; - margin-bottom: 60px; - } - - .sidebar-blog-features { - .copyText; - - h1 { - font-size: 19px; - &:extend(.fontRegular); - color: @pink; - margin-bottom:0; - } - time { - font-size:18px; - display:block; - margin-bottom: 5px; - } - a { - color: @black; - &:hover { - opacity: .3; - } - } - .blog { - margin-bottom: 70px; - - &:hover { - opacity: 0.3; - } - } - } - - @media screen and (max-width: @middleWidth) { - width: 50%; - min-width: 260px; - display: block; - margin:0 auto; - } -} -.single-post { - .article-post { - border-bottom:0; - } -} // ASCRIBE CHANGES .page-template-template-tour header .sticky.stuck { @@ -1287,10 +1099,6 @@ article.post { text-align: center; } -.blog-column { - width: auto; -} - h1 > a, .press-articles .press-article h1 a { color: #d8127d; diff --git a/assets/less/ascribe/_blog.less b/assets/less/ascribe/_blog.less new file mode 100644 index 0000000..2a011b7 --- /dev/null +++ b/assets/less/ascribe/_blog.less @@ -0,0 +1,144 @@ + +.hentry { + &:extend(.subtemplate); + border-bottom: 2px solid @blueLight; +} + +.entry-title { + margin-top: 0; +} + +.entry-image { + width: 100%; + + img { + display: block; + width: 100%; + } +} + +.entry-content { + +} + +.entry-meta { + .chevron-divider; + opacity: 1; + line-height: 75px; + height: 75px; + padding-left: 15px; + margin-bottom: 35px; + font-weight: 500; + font-size: 16px; +} + + +// +// Categories list +// +.post-categories { + &:extend(.list-unstyled all, .small); + margin-bottom: (@line-height-small / 2); +} + + +// +// Blog header +// +.header { + .blog &, .archive &, .single-post & { + &:extend(.blueGradient); + padding-bottom:0; + + .menu-item { + border: 1px solid fade(@white,30); + transition: .2s ease-out; + + a { + color: @white; + } + + &:hover { + background-color: fade(@white,30); + border: 1px solid fade(@white,30); + + a { + color: @white; + } + } + } + + .chevron-divider { + position: absolute; + top: 110px; + z-index: 1; + } + h1 { + color: @white; + font-size: 54px; + position: relative; + z-index: 2; + margin-top: 100px; + margin-bottom: 50px; + text-align: center; + a { + color: @white; + + &:hover { + color: @pink; + } + } + } + .app-links { + color: @white; + a { + color: @white; + + &:hover { + color: @pink; + } + } + } + } +} + +.blog-categories { + background-color: @blueBright; + border-top: 2px solid fade(@white,50); + + ul { + &:extend(.list-unstyled); + display: table; + padding: 0 10px; + width: 100%; + } + li { + width: 20%; + display: table; + text-align: center; + vertical-align: middle; + padding: 0; + height: 88px; + float: left; + + &:hover { + background-color: fade(@white,50); + } + } + a { + display: table-cell; + text-align: center; + font-size: 16px; + color: #fff; + height: 88px; + width: 100%; + vertical-align: middle; + padding: 0 10px; + } + + @media screen and (max-width: 450px) { + li { + width: 50%; + } + } +} diff --git a/assets/less/ascribe/_branding.less b/assets/less/ascribe/_branding.less index 99867a1..5e65c51 100644 --- a/assets/less/ascribe/_branding.less +++ b/assets/less/ascribe/_branding.less @@ -148,13 +148,6 @@ a { } } -hr { - border: 0; - height: 2px; - background: @greyHr; - margin: 40px 0; -} - .blueGradient { background-color: @blueBright; background: linear-gradient(to bottom, rgba(81,156,173,1) 0%,rgba(103,196,218,1) 100%); /* W3C */ diff --git a/assets/less/ascribe/_buttons.less b/assets/less/ascribe/_buttons.less index 57e2345..90b6507 100644 --- a/assets/less/ascribe/_buttons.less +++ b/assets/less/ascribe/_buttons.less @@ -77,23 +77,8 @@ } &.small { - &:extend(.fontLight); padding: (@spacer / 4) (@spacer / 2); font-size: @font-size-small; - color: @white; - background-color: transparent; - border-color: @white; min-width: 0; - - &:hover, - &:focus { - background-color: fade(@white,40); - border-color: fade(@white,40); - color: @white; - } - } - - @media screen and (max-width: @smallWidth) { - min-width: initial; } } diff --git a/assets/less/ascribe/_footer.less b/assets/less/ascribe/_footer.less index 504e2ad..dde0334 100644 --- a/assets/less/ascribe/_footer.less +++ b/assets/less/ascribe/_footer.less @@ -13,7 +13,7 @@ a { color: @white; } .menu { - &:extend(.list-unstyled); + &:extend(.list-unstyled all); } .menu-item { @@ -111,7 +111,7 @@ // Social links // .footer__social { - &:extend(.list-unstyled); + &:extend(.list-unstyled all); margin-top: (@spacer/2); @media (@screen-sm) { diff --git a/assets/less/ascribe/_hero.less b/assets/less/ascribe/_hero.less index b7634b0..f1be9f6 100644 --- a/assets/less/ascribe/_hero.less +++ b/assets/less/ascribe/_hero.less @@ -35,7 +35,7 @@ .tourNavText; ul { - &:extend(.list-unstyled); + &:extend(.list-unstyled all); padding: 0 35px; position: absolute; diff --git a/assets/less/ascribe/_typography.less b/assets/less/ascribe/_typography.less index 74e14e0..ca5d9ca 100644 --- a/assets/less/ascribe/_typography.less +++ b/assets/less/ascribe/_typography.less @@ -56,6 +56,7 @@ body { a { color: @link-color; text-decoration: none; + transition: .2s ease-out; &:hover, &:focus { @@ -76,6 +77,7 @@ h1, h2, h3, h4, h5, h6, font-weight: @headings-font-weight; line-height: @headings-line-height; color: @headings-color; + margin-bottom: @line-height-base; // remove old style numerals font-feature-settings: "kern" 1, "liga" 1, "calt" 1, "pnum" 1, "tnum" 0, "onum" 0, "lnum" 0, "dlig" 1; @@ -119,7 +121,7 @@ textarea { // Body text // p { - margin: 0 0 (@line-height-base / 2); + margin: 0 0 @line-height-base; } @@ -172,12 +174,12 @@ em, // Unordered and Ordered lists ul, ol { - margin-top: (@line-height-base / 2); - margin-bottom: (@line-height-base / 2); + margin-top: @line-height-base; + margin-bottom: @line-height-base; padding-left: @line-height-base; li { - margin-bottom: (@line-height-base / 4); + margin-bottom: (@line-height-base / 2); padding-left: (@line-height-base / 2); } ul, @@ -243,3 +245,11 @@ address { font-style: normal; line-height: @line-height-base; } + + +hr { + border: 0; + height: 2px; + background: @blueLight; + margin: @spacer 0; +} diff --git a/content-blog.php b/content-blog.php index a3f6000..9d92a79 100644 --- a/content-blog.php +++ b/content-blog.php @@ -24,11 +24,14 @@ $url = get_the_permalink(); ?> -
> -

- {$title}" ?> +
> -
+
+ + {$title}" ?> +
+ +
-
+ + -
+
Read More"; + echo "Read More"; } else { the_content(); } diff --git a/home.php b/home.php index 7148a2c..f0dee29 100644 --- a/home.php +++ b/home.php @@ -1,28 +1,26 @@ '; -echo '
'; -echo '
'; -if ( have_posts() ) { - while ( have_posts() ) { - the_post(); + get_header(); + get_template_part( 'template', 'blogheader' ); - get_template_part( 'content', 'blog' ); + echo '
'; + if ( have_posts() ) { + while ( have_posts() ) { + the_post(); + + get_template_part( 'content', 'blog' ); + + } } -} -else { - get_template_part( 'content', 'noposts' ); -} -?> - - -'; -//get_sidebar('blog'); + else { + get_template_part( 'content', 'noposts' ); + } + ?> + + -echo '
'; -echo '
'; -get_footer(); + '; + + get_footer(); ?> diff --git a/single-post.php b/single-post.php index 104944b..cdd9f2f 100644 --- a/single-post.php +++ b/single-post.php @@ -1,19 +1,22 @@ '; -if ( have_posts() ) { - while ( have_posts() ) { - the_post(); + get_header(); + get_template_part( 'template', 'blogheader' ); - get_template_part( 'content', 'blog' ); + echo '
'; + if ( have_posts() ) { + while ( have_posts() ) { + the_post(); + + get_template_part( 'content', 'blog' ); + + } + } + else { + get_template_part( 'content', 'noposts' ); } -} -else { - get_template_part( 'content', 'noposts' ); -} -echo '
'; -get_footer(); + echo '
'; + + get_footer(); ?> diff --git a/template-blogheader.php b/template-blogheader.php index 7d2940d..69063da 100644 --- a/template-blogheader.php +++ b/template-blogheader.php @@ -9,7 +9,7 @@ require 'controller/init.php'; ?> -
+