Merge pull request #29 from ascribe/fix/footer
Refactor all the typography things and more
@ -1,9 +1,9 @@
|
||||
<?php
|
||||
get_header();
|
||||
get_template_part( 'template', 'blogheader' );
|
||||
echo '<div class="centered-content-padding">';
|
||||
echo '<div class="column-container">';
|
||||
echo '<div class="blog-column">';
|
||||
|
||||
echo '<div class="blog-column row row--content">';
|
||||
|
||||
if ( have_posts() ) {
|
||||
while ( have_posts() ) {
|
||||
the_post();
|
||||
@ -17,9 +17,6 @@ else {
|
||||
}
|
||||
|
||||
echo '</div>';
|
||||
//get_sidebar('blog');
|
||||
|
||||
echo '</div>';
|
||||
echo '</div>';
|
||||
get_footer();
|
||||
?>
|
||||
|
@ -1,16 +1,12 @@
|
||||
|
||||
//=include ajax-pagination.js
|
||||
|
||||
$(document).ready(function(){
|
||||
|
||||
imgAttrRemover();
|
||||
slider();
|
||||
featuredFAQ();
|
||||
marketplaces();
|
||||
tourNav();
|
||||
mobileNav();
|
||||
stickyNav();
|
||||
colourHover();
|
||||
|
||||
function tourNav() {
|
||||
|
||||
@ -58,49 +54,28 @@ $(document).ready(function(){
|
||||
|
||||
});
|
||||
}
|
||||
function mobileNav() {
|
||||
$('.hamburger').click(function(){
|
||||
console.log('hi');
|
||||
$('.mobile-nav').toggleClass('active');
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
|
||||
function stickyNav() {
|
||||
var didScroll = false;
|
||||
var sticky = $('.sticky');
|
||||
|
||||
$(window).scroll(function () {
|
||||
didScroll = true;
|
||||
});
|
||||
|
||||
setInterval(function () {
|
||||
if (didScroll) {
|
||||
didScroll = false;
|
||||
|
||||
$(window).on('load resize scroll', function() {
|
||||
if ( $(window).width() > 768 ) {
|
||||
if ( $(window).scrollTop() > 100 ) {
|
||||
sticky.addClass('stuck');
|
||||
}
|
||||
else {
|
||||
} else {
|
||||
sticky.removeClass('stuck');
|
||||
}
|
||||
}
|
||||
}, 250);
|
||||
}
|
||||
function colourHover() {
|
||||
$('.team-member img').hover(
|
||||
function(){
|
||||
var hover = $(this).data('hover');
|
||||
$(this).attr('src',hover);
|
||||
},
|
||||
function(){
|
||||
var normal = $(this).data('regular');
|
||||
$(this).attr('src',normal);
|
||||
});
|
||||
}
|
||||
function imgAttrRemover() {
|
||||
$('img').each(function(){
|
||||
$(this).removeAttr('width');
|
||||
$(this).removeAttr('height');
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
function mobileNav() {
|
||||
$('.hamburger').click(function() {
|
||||
$('.mobile-nav').toggleClass('active');
|
||||
});
|
||||
}
|
869
assets/_src/less/ascribe.less
Normal file
@ -0,0 +1,869 @@
|
||||
//
|
||||
// Ascribe
|
||||
// -----------------
|
||||
// Main collection file
|
||||
//
|
||||
|
||||
@node_modules: '../../../node_modules';
|
||||
|
||||
// Normalize all the things
|
||||
@import (inline) '@{node_modules}/normalize-css/normalize.css';
|
||||
@import (inline) '@{node_modules}/normalize-opentype.css/normalize-opentype.css';
|
||||
|
||||
// Variables & Mixins
|
||||
@import 'ascribe/_variables';
|
||||
//@import "ascribe/_mixins';
|
||||
|
||||
@import 'ascribe/_typography.less';
|
||||
@import 'ascribe/_branding.less';
|
||||
@import 'ascribe/_helpers.less';
|
||||
@import 'ascribe/_buttons.less';
|
||||
@import 'ascribe/_media.less';
|
||||
|
||||
@import 'ascribe/_grid.less';
|
||||
@import 'ascribe/_footer.less';
|
||||
|
||||
@import 'ascribe/_hero.less';
|
||||
@import 'ascribe/_header.less';
|
||||
@import 'ascribe/_subtemplates.less';
|
||||
@import 'ascribe/_feature-circles.less';
|
||||
@import 'ascribe/_team.less';
|
||||
@import 'ascribe/_blog.less';
|
||||
|
||||
@import 'vendor/print.less';
|
||||
|
||||
|
||||
|
||||
// MAIN
|
||||
.above-chevron {
|
||||
margin-top: -160px;
|
||||
margin-bottom: -160px;
|
||||
position: relative;
|
||||
z-index: 3;
|
||||
}
|
||||
|
||||
// SUBTEMPLATES
|
||||
.four-oh-four {
|
||||
font-size: 34px;
|
||||
line-height: 41px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.case-studies {
|
||||
height: 685px;
|
||||
position: relative;
|
||||
|
||||
.case-study {
|
||||
position: absolute;
|
||||
top:0;
|
||||
left:0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-size: cover;
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
transition: .3s ease-out;
|
||||
visibility: visible;
|
||||
opacity: 1;
|
||||
|
||||
&.hidden {
|
||||
visibility: hidden;
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
.slide-container {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: relative;
|
||||
left: 0px;
|
||||
}
|
||||
.description {
|
||||
white-space: normal;
|
||||
width: 60%;
|
||||
background: fade(@black,64);
|
||||
padding: 25px;
|
||||
position: absolute;
|
||||
bottom: 35px;
|
||||
right:0;
|
||||
.caseStudyText;
|
||||
}
|
||||
p {
|
||||
margin:0;
|
||||
}
|
||||
.slider-action {
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
background-color: @white;
|
||||
cursor: pointer;
|
||||
position: absolute;
|
||||
top: calc(~"50% - 40px");
|
||||
z-index: 2;
|
||||
|
||||
span {
|
||||
background-repeat: no-repeat;
|
||||
display: block;
|
||||
position:relative;
|
||||
top:15px;
|
||||
margin:0 auto;
|
||||
background-image: url(../../../images/leftright.png);
|
||||
width: 25px;
|
||||
height: 50px;
|
||||
}
|
||||
}
|
||||
#back {
|
||||
left:0;
|
||||
|
||||
span {
|
||||
background-position: 0 0;
|
||||
}
|
||||
}
|
||||
#forward {
|
||||
right:0;
|
||||
span {
|
||||
background-position: 0 -50px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: @tabletWidth) {
|
||||
height: 500px;
|
||||
|
||||
.description {
|
||||
font-size: 17px;
|
||||
line-height: 20px;
|
||||
width: 70%;
|
||||
}
|
||||
.slider-action {
|
||||
transform: scale(0.7);
|
||||
}
|
||||
#back {
|
||||
transform-origin: left;
|
||||
}
|
||||
#forward {
|
||||
transform-origin: right;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: @phoneWidth) {
|
||||
height: 400px;
|
||||
background-color: black;
|
||||
|
||||
.case-study {
|
||||
background-size: 100%;
|
||||
background-position: top;
|
||||
}
|
||||
.description {
|
||||
width: 100%;
|
||||
background-color: black;
|
||||
bottom: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
.old-new {
|
||||
padding-top: 130px;
|
||||
padding-bottom: 175px;
|
||||
|
||||
h1 {
|
||||
.sectionHeader;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
th {
|
||||
.oldWayNewWayTH;
|
||||
text-transform: uppercase;
|
||||
padding-bottom: 15px;
|
||||
}
|
||||
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
}
|
||||
|
||||
td {
|
||||
border: 1px solid @blueLight;
|
||||
vertical-align: middle;
|
||||
.copyTextSmall;
|
||||
width: 50%;
|
||||
padding: 45px 0;
|
||||
p {
|
||||
width: 60%;
|
||||
margin: 0 auto;
|
||||
}
|
||||
}
|
||||
.new {
|
||||
border-bottom-color: @white;
|
||||
position: relative;
|
||||
background-color: @blueLight;
|
||||
|
||||
&:before {
|
||||
position: absolute;
|
||||
left:-30px;
|
||||
top: calc(~"50% - 30px");
|
||||
content: '';
|
||||
display: block;
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
background-image: url(../../../images/icon-arrow.png);
|
||||
background-size:60px;
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
}
|
||||
tr {
|
||||
&:last-of-type {
|
||||
.new {
|
||||
border-bottom-color: @blueLight;
|
||||
}
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: @tabletWidth) {
|
||||
padding-top: 20px;
|
||||
|
||||
td {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
}
|
||||
@media screen and (max-width: @phoneWidth) {
|
||||
.new {
|
||||
&:before {
|
||||
left:-20px;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
background-size: 40px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.product-overview {
|
||||
&:extend(.text-center, .subtemplate);
|
||||
border-top: 0;
|
||||
border-bottom: 25px solid @greyBg;
|
||||
|
||||
h1 { font-size: @font-size-h3; }
|
||||
|
||||
.grid,
|
||||
p { margin-bottom: 0; }
|
||||
|
||||
.row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-wrap: wrap;
|
||||
|
||||
@media (@screen-sm) {
|
||||
flex-wrap: no-wrap;
|
||||
}
|
||||
}
|
||||
|
||||
.grid { }
|
||||
|
||||
@media (@screen-sm) {
|
||||
&:nth-of-type(odd) {
|
||||
.grid {
|
||||
flex-direction: row-reverse;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
.blue-box {
|
||||
&:extend(.text-center);
|
||||
padding: @spacer 0;
|
||||
background-color: @greyBg;
|
||||
|
||||
@media (min-width: @tabletWidth) {
|
||||
padding: (@spacer * 2) 0;
|
||||
}
|
||||
|
||||
&,
|
||||
h1 {
|
||||
color: #fff;
|
||||
font-size: 180%;
|
||||
line-height: 120%;
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.button {
|
||||
margin-top: (@spacer/2)
|
||||
}
|
||||
|
||||
> .row { background: transparent; }
|
||||
}
|
||||
|
||||
.blue-copy {
|
||||
margin: auto;
|
||||
background-color: @blueBright;
|
||||
padding: @spacer;
|
||||
|
||||
@media (@screen-sm) {
|
||||
padding: (@spacer * 2);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
//
|
||||
// Component: CTA section
|
||||
//
|
||||
.cta {
|
||||
padding: @spacer 0;
|
||||
min-height: 300px;
|
||||
text-align: center;
|
||||
background-size: cover;
|
||||
background-repeat: no-repeat;
|
||||
background-position: 55% 50%;
|
||||
|
||||
// centering from the future
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
@media (min-width: @phoneWidth) {
|
||||
padding: (@spacer * 2) 0;
|
||||
min-height: 520px;
|
||||
background-position: center;
|
||||
}
|
||||
|
||||
// TODO: this should be the generic layout container for everything
|
||||
.cta__container {
|
||||
padding: 0 4%;
|
||||
margin: auto;
|
||||
max-width: 960px;
|
||||
}
|
||||
|
||||
.cta__title {
|
||||
color: #fff;
|
||||
margin: 0 0 48px 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.cta__button {
|
||||
margin: 0 auto;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
.galleries-marketplaces {
|
||||
padding: @spacer 0;
|
||||
text-align: center;
|
||||
|
||||
h1 {
|
||||
.galleriesPressTitle;
|
||||
}
|
||||
img {
|
||||
display:block;
|
||||
}
|
||||
|
||||
@media (min-width: @tabletWidth) {
|
||||
padding: (@spacer * 2) 0;
|
||||
|
||||
h1 {
|
||||
font-size: 27px;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.faq {
|
||||
.copyTextMedium;
|
||||
dl,dt,dd {
|
||||
margin:0;
|
||||
padding:0;
|
||||
}
|
||||
.featured-faqs {
|
||||
margin-bottom:75px;
|
||||
|
||||
dt {
|
||||
&:extend(.fontRegular);
|
||||
font-size: 25px;
|
||||
line-height: 32px;
|
||||
color: @pink;
|
||||
cursor: pointer;
|
||||
}
|
||||
dd {
|
||||
max-height:0;
|
||||
overflow-y:hidden;
|
||||
transition: .2s ease-out;
|
||||
margin-bottom: 5px;
|
||||
|
||||
&.open {
|
||||
max-height: 800px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.regular-faqs {
|
||||
dt {
|
||||
&:extend(.fontRegular);
|
||||
}
|
||||
dd {
|
||||
margin-bottom: 60px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.values {
|
||||
padding-bottom: @spacer;
|
||||
}
|
||||
|
||||
.value {
|
||||
h1 {
|
||||
&:extend(.fontRegular);
|
||||
color: @black;
|
||||
font-size: 25px;
|
||||
line-height: 1;
|
||||
margin-top: 0;
|
||||
text-align: left;
|
||||
}
|
||||
p { margin-bottom: 0 }
|
||||
}
|
||||
|
||||
.careers {
|
||||
&:extend(.text-center);
|
||||
background-color: @greyBg;
|
||||
|
||||
> .row { background: none; }
|
||||
|
||||
a {
|
||||
&:extend(.h3);
|
||||
color: @black;
|
||||
|
||||
&:hover {
|
||||
color: @pink;
|
||||
}
|
||||
}
|
||||
li {
|
||||
margin-bottom: 35px;
|
||||
|
||||
}
|
||||
ul {
|
||||
&:extend(.list-unstyled all);
|
||||
}
|
||||
}
|
||||
.contact {
|
||||
label {
|
||||
&:extend(.small);
|
||||
|
||||
&.required {
|
||||
&:after {
|
||||
content: '*';
|
||||
color: @pink;
|
||||
}
|
||||
}
|
||||
}
|
||||
input, textarea {
|
||||
margin-bottom: 20px;
|
||||
padding: 10px;
|
||||
color: @greyText;
|
||||
width: 80%;
|
||||
margin-top: 5px;
|
||||
border: 1px solid @greyHr;
|
||||
outline: none;
|
||||
|
||||
&[aria-invalid=true] {
|
||||
border: 1px solid @pink;
|
||||
}
|
||||
}
|
||||
input[type=submit] {
|
||||
&:extend(.button, .button.blue);
|
||||
width: auto;
|
||||
}
|
||||
.contact-point {
|
||||
|
||||
h1 {
|
||||
&:extend(.fontRegular);
|
||||
font-size: 19px;
|
||||
color: @pink;
|
||||
text-align: left;
|
||||
margin-bottom:0;
|
||||
}
|
||||
}
|
||||
.required-info {
|
||||
.copyTextSmall;
|
||||
color: @pink;
|
||||
}
|
||||
.wpcf7-not-valid-tip {
|
||||
.copyTextSmall;
|
||||
color: @pink;
|
||||
margin-top: -20px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
div.wpcf7-validation-errors {
|
||||
border: none;
|
||||
padding:0;
|
||||
margin:0;
|
||||
}
|
||||
div.wpcf7-response-output, div.wpcf7-display-none, div.wpcf7-mail-sent-ok {
|
||||
border: 0!important;
|
||||
}
|
||||
}
|
||||
.press-articles {
|
||||
text-align: center;
|
||||
|
||||
.press-article {
|
||||
text-align: left;
|
||||
margin-bottom: 35px;
|
||||
padding-bottom: 35px;
|
||||
border-bottom: 1px solid @greyHr;
|
||||
h1 {
|
||||
.teamName;
|
||||
margin-bottom:0;
|
||||
text-align: left;
|
||||
a {
|
||||
color: @black;
|
||||
|
||||
&:hover {
|
||||
color: @blueBright;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.downloads {
|
||||
.left {
|
||||
float: left;
|
||||
}
|
||||
.right {
|
||||
float: right;
|
||||
}
|
||||
}
|
||||
.upcoming-events,
|
||||
.past-events {
|
||||
.event-container {
|
||||
width: 70%;
|
||||
float:left;
|
||||
}
|
||||
.event-archives {
|
||||
width: 30%;
|
||||
float: right;
|
||||
padding-left: 10%;
|
||||
padding-top: 50px;
|
||||
|
||||
h1 {
|
||||
text-align: left;
|
||||
font-size: 19px;
|
||||
color: @pink;
|
||||
font-weight: 400;
|
||||
|
||||
a {
|
||||
color:@pink;
|
||||
|
||||
&:hover {
|
||||
color: @black;
|
||||
}
|
||||
}
|
||||
}
|
||||
ul {
|
||||
list-style: none;
|
||||
margin:0;
|
||||
margin-bottom: 40px;
|
||||
padding:0;
|
||||
|
||||
li {
|
||||
font-size: 18px;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
a {
|
||||
color: @black;
|
||||
|
||||
&:hover {
|
||||
color: @pink;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
h2 {
|
||||
text-align: center;
|
||||
position:relative;
|
||||
font-size: 19px;
|
||||
|
||||
span {
|
||||
background-color: white;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
padding: 0 20px;
|
||||
}
|
||||
|
||||
&:after {
|
||||
content: '';
|
||||
display:block;
|
||||
height: 1px;
|
||||
background-color: @greyHr;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 0;
|
||||
right: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.event {
|
||||
.copyText;
|
||||
|
||||
h1 {
|
||||
.h4;
|
||||
text-align:left;
|
||||
margin-bottom:0;
|
||||
font-size: 19px;
|
||||
a {
|
||||
color: @black;
|
||||
|
||||
&:hover {
|
||||
color: @pink;
|
||||
}
|
||||
}
|
||||
}
|
||||
time {
|
||||
.copyTextMedium;
|
||||
margin-bottom: 5px;
|
||||
display: block;
|
||||
}
|
||||
border-top: 1px solid @greyHr;
|
||||
padding-bottom:30px;
|
||||
margin-bottom:30px;
|
||||
}
|
||||
h2 + .event {
|
||||
border-top: 0;
|
||||
}
|
||||
|
||||
& + .chevron-divider {
|
||||
height: 280px;
|
||||
margin-top: -100px;
|
||||
margin-bottom: -135px;
|
||||
position: relative;
|
||||
z-index:-1;
|
||||
}
|
||||
|
||||
|
||||
@media screen and (max-width: 550px) {
|
||||
.event-container, .event-archives {
|
||||
width: 100%;
|
||||
float: none;
|
||||
}
|
||||
.event-archives {
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
//
|
||||
// Component: Short Descriptions
|
||||
//
|
||||
.short-descriptions {
|
||||
&:extend(.text-center);
|
||||
padding-bottom: @spacer;
|
||||
}
|
||||
|
||||
.short-description {
|
||||
p { margin-bottom: 0 }
|
||||
}
|
||||
|
||||
.short-description__title {
|
||||
font-size: @font-size-h4;
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.short-description__description {
|
||||
&:extend(.small);
|
||||
}
|
||||
|
||||
|
||||
.content-boxed {
|
||||
background-color: @greyBg;
|
||||
}
|
||||
|
||||
.existing-new {
|
||||
background-color: @greyBg;
|
||||
padding: 90px 0 120px;
|
||||
|
||||
> .row { background: none; }
|
||||
|
||||
.top-tab {
|
||||
div {
|
||||
padding: 25px 0;
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
text-transform: uppercase;
|
||||
.oldWayNewWayTH;
|
||||
color: @black;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
&.active {
|
||||
|
||||
div {
|
||||
border: 1px solid @pink;
|
||||
border-bottom: 0;
|
||||
background-color: @white;
|
||||
color: @pink;
|
||||
}
|
||||
}
|
||||
}
|
||||
.content {
|
||||
text-align: center;
|
||||
display: none;
|
||||
background-color: @white;
|
||||
border: 1px solid @pink;
|
||||
padding: 60px 10%;
|
||||
margin-top: -1px;
|
||||
|
||||
&.active {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
.content > ul {
|
||||
text-align: left;
|
||||
list-style: none;
|
||||
|
||||
li {
|
||||
margin-bottom: 35px;
|
||||
}
|
||||
ul {
|
||||
margin-left: 10%;
|
||||
text-align: left;
|
||||
list-style-type: disc;
|
||||
|
||||
li {
|
||||
margin-bottom:0;
|
||||
}
|
||||
}
|
||||
}
|
||||
.button {
|
||||
&:extend(.button.pink);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.page-template-template-tour .subtemplate.content {
|
||||
text-align: center;
|
||||
|
||||
&.grey {
|
||||
background-color: @greyBg;
|
||||
h1 {
|
||||
margin-top: 55px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.get-started {
|
||||
&:extend(.text-center);
|
||||
|
||||
h1:not(.subtemplate__title) {
|
||||
font-size: @font-size-h3;
|
||||
}
|
||||
}
|
||||
|
||||
.pricing {
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
height: 470px;
|
||||
padding-top: 80px;
|
||||
text-align: center;
|
||||
color: @white;
|
||||
font-weight: 400;
|
||||
|
||||
h1 {
|
||||
color: @white;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.pricing-detail {
|
||||
.ttl-columns.column-2;
|
||||
margin-bottom: 30px;
|
||||
|
||||
div {
|
||||
height: 135px;
|
||||
text-align: center;
|
||||
background-color: @white;
|
||||
.h1;
|
||||
color: @pink;
|
||||
|
||||
p {
|
||||
position: relative;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
}
|
||||
small {
|
||||
color: @black;
|
||||
font-size: 16px;
|
||||
display: block;
|
||||
margin-top: 7px;
|
||||
}
|
||||
}
|
||||
a {
|
||||
color: @white;
|
||||
&:hover {
|
||||
color:@pink;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: @phoneWidth) {
|
||||
padding-top:0;
|
||||
|
||||
.pricing-detail {
|
||||
div {
|
||||
height:80px;
|
||||
font-size: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// ASCRIBE CHANGES
|
||||
.page-template-template-tour header .sticky.stuck {
|
||||
top: 0;
|
||||
}
|
||||
|
||||
.page-template-template-tour header .sticky {
|
||||
top: 30px;
|
||||
}
|
||||
|
||||
.case-studies #forward, .case-studies #back {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.old-new p,
|
||||
.get-started .description p {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
h1 > a,
|
||||
.press-articles .press-article h1 a {
|
||||
color: #d8127d;
|
||||
}
|
||||
|
||||
.press-articles .press-article h1 a {
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
.press-articles .press-article h1 {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.press-articles .press-article time {
|
||||
font-size: 14px;
|
||||
margin-bottom: 6px;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.subtemplate.press-articles > div > div > img {
|
||||
margin-bottom: 70px;
|
||||
}
|
||||
|
||||
.subtemplate.downloads a[href=''] {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.subtemplate.downloads a[href=''] + a:not([href='']) {
|
||||
float: none;
|
||||
display: inline-block;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.subtemplate.downloads .centered-content {
|
||||
text-align: center;
|
||||
}
|
113
assets/_src/less/ascribe/_blog.less
Normal file
@ -0,0 +1,113 @@
|
||||
|
||||
.hentry {
|
||||
&:extend(.subtemplate);
|
||||
border-bottom: 2px solid @blueLight;
|
||||
|
||||
&:last-child { border: none }
|
||||
}
|
||||
|
||||
.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);
|
||||
}
|
||||
|
||||
|
||||
//
|
||||
// Pagination
|
||||
//
|
||||
.pagination {
|
||||
background: @white;
|
||||
margin-top: (@spacer/2);
|
||||
padding-bottom: (@spacer/2);
|
||||
|
||||
a {
|
||||
&:extend(.button all, .button.small);
|
||||
}
|
||||
}
|
||||
|
||||
.pagination__next {
|
||||
&:extend(.text-right);
|
||||
}
|
||||
|
||||
|
||||
//
|
||||
// Blog header
|
||||
//
|
||||
.blog-categories {
|
||||
background-color: @blueBright;
|
||||
border-top: 2px solid fade(@white,50);
|
||||
|
||||
ul {
|
||||
&:extend(.list-unstyled all);
|
||||
display: table;
|
||||
padding: 0 10px;
|
||||
width: 100%;
|
||||
}
|
||||
li {
|
||||
width: 20%;
|
||||
display: table;
|
||||
text-align: center;
|
||||
vertical-align: middle;
|
||||
padding: 0;
|
||||
height: 88px;
|
||||
float: left;
|
||||
transition: .2s ease-out;
|
||||
|
||||
&:hover,
|
||||
&:focus {
|
||||
background-color: fade(@white,50);
|
||||
}
|
||||
}
|
||||
a {
|
||||
&:extend(.text-center, .small);
|
||||
display: table-cell;
|
||||
color: @white;
|
||||
height: 88px;
|
||||
width: 100%;
|
||||
vertical-align: middle;
|
||||
padding: 0 10px;
|
||||
|
||||
&:hover,
|
||||
&:focus {
|
||||
color: @blueMedium;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 450px) {
|
||||
li {
|
||||
width: 50%;
|
||||
}
|
||||
}
|
||||
}
|
122
assets/_src/less/ascribe/_branding.less
Normal file
@ -0,0 +1,122 @@
|
||||
|
||||
|
||||
// FONTS
|
||||
.fontLight {
|
||||
font-family: @font-family-base;
|
||||
font-weight: @font-weight-light;
|
||||
}
|
||||
.fontRegular {
|
||||
font-family: @font-family-base;
|
||||
font-weight: @font-weight-normal;
|
||||
}
|
||||
|
||||
// GENERAL TEXT STYLES
|
||||
.sectionHeader {
|
||||
&:extend(.fontLight);
|
||||
font-size: 34px;
|
||||
color: @blueBright;
|
||||
line-height: 1.2;
|
||||
margin: 35px 0;
|
||||
text-align: center;
|
||||
|
||||
@media screen and (max-width: @tabletWidth) {
|
||||
font-size: 30px;
|
||||
}
|
||||
}
|
||||
.subsectionHeader {
|
||||
&:extend(.fontLight);
|
||||
font-size: 31px;
|
||||
color: @black;
|
||||
line-height: 37px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
// SPECIALIZED TEXT STYLES
|
||||
.heroText {
|
||||
&:extend(.fontLight);
|
||||
font-size: 37px;
|
||||
color: @white;
|
||||
line-height: 44px;
|
||||
}
|
||||
.tourNavText {
|
||||
&:extend(.fontLight);
|
||||
font-size: 25px;
|
||||
line-height: 30px;
|
||||
color: @blueBright;
|
||||
|
||||
}
|
||||
.signInUpText {
|
||||
&:extend(.fontLight);
|
||||
font-size: 17px;
|
||||
line-height: 20px;
|
||||
color: @white;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
.caseStudyText {
|
||||
&:extend(.fontRegular);
|
||||
font-size: 23px;
|
||||
color: @white;
|
||||
line-height: 28px;
|
||||
}
|
||||
.oldWayNewWayTH {
|
||||
&:extend(.fontLight);
|
||||
font-size: 24px;
|
||||
color: @pink;
|
||||
line-height: 29px;
|
||||
}
|
||||
|
||||
.galleriesPressTitle {
|
||||
&:extend(.fontLight);
|
||||
font-size: 30px;
|
||||
color: @black;
|
||||
line-height: 36px;
|
||||
margin-bottom: 50px;
|
||||
}
|
||||
.featureBlogDesc {
|
||||
&:extend(.fontLight);
|
||||
font-size: 13px;
|
||||
color: @blueBright;
|
||||
line-height: 22.79px;
|
||||
}
|
||||
.featureBlogTitle {
|
||||
&:extend(.fontLight);
|
||||
font-size: 17px;
|
||||
color: @greyText;
|
||||
line-height: 22.79px;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
.teamName {
|
||||
&:extend(.fontRegular);
|
||||
color: @black;
|
||||
font-size: 19px;
|
||||
}
|
||||
|
||||
.chevron-divider {
|
||||
background-image: url(../../../images/svg/ascribe-chevron.svg);
|
||||
background-position: bottom;
|
||||
width: 100%;
|
||||
background-size: 100%;
|
||||
height: 150px;
|
||||
|
||||
@media screen and (max-width: @tabletWidth) {
|
||||
background-size: 120%;
|
||||
}
|
||||
}
|
||||
|
||||
.social-icon {
|
||||
width: 21px;
|
||||
height: 21px;
|
||||
padding: 1px;
|
||||
fill: @white;
|
||||
background-color: @greySocial;
|
||||
border-radius: 5px;
|
||||
|
||||
&:hover {
|
||||
background-color: fade(@greySocial,40);
|
||||
}
|
||||
}
|
||||
|
||||
.blueGradient {
|
||||
background-color: @blueBright;
|
||||
background: linear-gradient(to bottom, rgba(81,156,173,1) 0%,rgba(103,196,218,1) 100%); /* W3C */
|
||||
}
|
84
assets/_src/less/ascribe/_buttons.less
Normal file
@ -0,0 +1,84 @@
|
||||
|
||||
.button {
|
||||
&:extend(.fontRegular);
|
||||
display: block;
|
||||
padding: (@spacer / 2) @spacer;
|
||||
border: 1px solid;
|
||||
font-size: 22px;
|
||||
line-height: 26px;
|
||||
text-decoration: none;
|
||||
text-align: center;
|
||||
transition: .2s ease-out;
|
||||
|
||||
@media (@screen-sm) {
|
||||
display: inline-block;
|
||||
min-width: 265px;
|
||||
}
|
||||
|
||||
&.blue {
|
||||
@bgColor: @blueBright;
|
||||
color: @white;
|
||||
background-color: @bgColor;
|
||||
border-color: @bgColor;
|
||||
&:hover,
|
||||
&:focus {
|
||||
background-color: fade(@bgColor,50);
|
||||
}
|
||||
}
|
||||
|
||||
&.pink {
|
||||
@bgColor: @pink;
|
||||
color: @white;
|
||||
background-color: @bgColor;
|
||||
border-color: @bgColor;
|
||||
&:hover,
|
||||
&:focus {
|
||||
background-color: fade(@bgColor,50);
|
||||
}
|
||||
}
|
||||
|
||||
&.blue-overPic {
|
||||
@bgColor: @blueBright;
|
||||
color: @white;
|
||||
background-color: @bgColor;
|
||||
border-color: @bgColor;
|
||||
|
||||
&:hover,
|
||||
&:focus {
|
||||
background-color: @white;
|
||||
color: @bgColor;
|
||||
}
|
||||
}
|
||||
|
||||
&.pink-overPic {
|
||||
@bgColor: @pink;
|
||||
color: @white;
|
||||
background-color: @bgColor;
|
||||
border-color: @bgColor;
|
||||
|
||||
&:hover,
|
||||
&:focus {
|
||||
background-color: @white;
|
||||
color: @bgColor;
|
||||
}
|
||||
}
|
||||
|
||||
&.white-blue {
|
||||
@bgColor: @white;
|
||||
color: @blueBright;
|
||||
background-color: @bgColor;
|
||||
border-color: @blueBright;
|
||||
|
||||
&:hover,
|
||||
&:focus {
|
||||
background-color: fade(@blueBright,50);
|
||||
color: @white;
|
||||
}
|
||||
}
|
||||
|
||||
&.small {
|
||||
padding: (@spacer / 4) (@spacer / 2);
|
||||
font-size: @font-size-small;
|
||||
min-width: 0;
|
||||
}
|
||||
}
|
84
assets/_src/less/ascribe/_feature-circles.less
Normal file
@ -0,0 +1,84 @@
|
||||
|
||||
.feature-circles {
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
//
|
||||
// Feature circle component
|
||||
//
|
||||
.feature-circle {
|
||||
&:extend(.text-center);
|
||||
}
|
||||
|
||||
.feature-circle__image {
|
||||
width: 50%;
|
||||
max-width: 200px;
|
||||
margin: auto;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.feature-circle__title {
|
||||
font-size: @font-size-h3;
|
||||
}
|
||||
|
||||
.feature-circle__description {}
|
||||
|
||||
|
||||
//
|
||||
// Surround circle component
|
||||
//
|
||||
.surround-circle {
|
||||
&:extend(.text-center);
|
||||
|
||||
.feature-circle__title {
|
||||
|
||||
}
|
||||
|
||||
.feature-circle__description {
|
||||
&:extend(.small);
|
||||
}
|
||||
|
||||
.circle {
|
||||
text-align: center;
|
||||
position: relative;
|
||||
border-radius: 100%;
|
||||
background-clip: padding-box;
|
||||
&:after {
|
||||
display: block;
|
||||
padding-bottom: 100%;
|
||||
width: 100%;
|
||||
height: 0;
|
||||
border-radius: 50%;
|
||||
background-color: white;
|
||||
content: "";
|
||||
border: 2px solid transparent;
|
||||
}
|
||||
&:before {
|
||||
content: '';
|
||||
position:absolute;
|
||||
z-index:-1;
|
||||
left:-2px;right:-2px;
|
||||
top:-2px;bottom:-2px;
|
||||
border-radius: 50%;
|
||||
background: linear-gradient(@blueBright,@pink);
|
||||
}
|
||||
}
|
||||
.container {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.wrapper {
|
||||
display: table;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.inner {
|
||||
display: table-cell;
|
||||
padding: 1em;
|
||||
vertical-align: middle;
|
||||
}
|
||||
}
|
153
assets/_src/less/ascribe/_footer.less
Normal file
@ -0,0 +1,153 @@
|
||||
//
|
||||
// FOOTER
|
||||
//
|
||||
.footer {
|
||||
&:extend(.small);
|
||||
color: @white;
|
||||
text-align: center;
|
||||
|
||||
@media (@screen-sm) {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
a { color: @white; }
|
||||
|
||||
.menu {
|
||||
&:extend(.list-unstyled all);
|
||||
}
|
||||
|
||||
.menu-item {
|
||||
display: inline;
|
||||
|
||||
a {
|
||||
display: inline-block;
|
||||
padding: 3px 15px;
|
||||
opacity: .85;
|
||||
|
||||
&:hover,
|
||||
&:focus {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.button {
|
||||
margin-bottom: (@spacer / 4);
|
||||
|
||||
&:hover {
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
//
|
||||
// Top footer
|
||||
//
|
||||
.footer__top {
|
||||
&:extend(.subtemplate);
|
||||
background: @greyFooter;
|
||||
|
||||
.menu {
|
||||
margin-bottom: @spacer;
|
||||
|
||||
@media (@screen-sm) {
|
||||
display: flex;
|
||||
flex-flow: row wrap;
|
||||
width: 70%;
|
||||
float: left;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.menu-item {
|
||||
@media (@screen-sm) {
|
||||
flex: 0 0 33%;
|
||||
|
||||
a { display: block; }
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
//
|
||||
// Bottom footer
|
||||
//
|
||||
.footer__bottom {
|
||||
&:extend(.mini);
|
||||
color: @greyText;
|
||||
padding: (@spacer / 2) 15px;
|
||||
|
||||
.menu {
|
||||
margin-bottom: (@spacer/2);
|
||||
|
||||
@media (@screen-sm) {
|
||||
float: left;
|
||||
margin-bottom: 0;
|
||||
margin-left: (@spacer/2);
|
||||
}
|
||||
}
|
||||
|
||||
.menu-item a {
|
||||
color: @greyText;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
//
|
||||
// Contact
|
||||
//
|
||||
.footer__contact {
|
||||
@media (@screen-sm) {
|
||||
width: 25%;
|
||||
float: right;
|
||||
|
||||
.button { width: 100%; }
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
//
|
||||
// Social links
|
||||
//
|
||||
.footer__social {
|
||||
&:extend(.list-unstyled all);
|
||||
margin-top: (@spacer/2);
|
||||
|
||||
@media (@screen-sm) {
|
||||
float: right;
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
li { display: inline-block; }
|
||||
}
|
||||
|
||||
.footer__social,
|
||||
.footer__copyright,
|
||||
.footer__bottom .menu {
|
||||
@media (@screen-sm) {
|
||||
margin-top: 10px
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.footer__eu {
|
||||
width: 150px;
|
||||
height: auto;
|
||||
margin: 0 auto (@spacer/2) auto;
|
||||
|
||||
@media (@screen-sm) {
|
||||
float: left;
|
||||
margin: 0 10px 0 0;
|
||||
}
|
||||
}
|
||||
|
||||
.footer__copyright {
|
||||
margin-bottom: (@spacer/2);
|
||||
|
||||
@media (@screen-sm) {
|
||||
margin-bottom: 0;
|
||||
float: left;
|
||||
padding: 3px 15px;
|
||||
}
|
||||
}
|
260
assets/_src/less/ascribe/_grid.less
Normal file
@ -0,0 +1,260 @@
|
||||
//
|
||||
// Grid
|
||||
// --------------
|
||||
// bigchain.io
|
||||
//
|
||||
// adapted from github.com/kremalicious/kremalicious3/blob/master/_src/_assets/styl/grid.styl
|
||||
//
|
||||
|
||||
|
||||
//
|
||||
// More sane box model
|
||||
//
|
||||
*,
|
||||
*:before,
|
||||
*:after {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
|
||||
//
|
||||
// Base
|
||||
//
|
||||
.grid {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.grid__col {
|
||||
flex: 1;
|
||||
// Firefox grid fix for whatever reason
|
||||
min-height: 0;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.row {
|
||||
.clearfix; // for legacy float usage reasons
|
||||
max-width: @screen-lg-min;
|
||||
margin: auto;
|
||||
padding-left: (@gutter-space/4);
|
||||
padding-right: (@gutter-space/4);
|
||||
|
||||
@media (@screen-sm) {
|
||||
padding-left: (@gutter-space/2);
|
||||
padding-right: (@gutter-space/2);
|
||||
}
|
||||
@media (@screen-md) {
|
||||
padding-left: @gutter-space;
|
||||
padding-right: @gutter-space;
|
||||
}
|
||||
}
|
||||
|
||||
// more narrow row for all long text content
|
||||
.row--content {
|
||||
max-width: (@screen-md-min - @gutter-space);
|
||||
}
|
||||
|
||||
|
||||
//
|
||||
// Alignment per row
|
||||
//
|
||||
.grid--top {
|
||||
align-items: flex-start
|
||||
}
|
||||
|
||||
.grid--bottom {
|
||||
align-items: flex-end
|
||||
}
|
||||
|
||||
.grid--center {
|
||||
align-items: center
|
||||
}
|
||||
|
||||
.grid--justifycenter {
|
||||
justify-content: center
|
||||
}
|
||||
|
||||
|
||||
//
|
||||
// Alignment per cell
|
||||
//
|
||||
.grid__col--top {
|
||||
align-self: flex-start
|
||||
}
|
||||
|
||||
.grid__col--bottom {
|
||||
align-self: flex-end
|
||||
}
|
||||
|
||||
.grid__col--center {
|
||||
align-self: center
|
||||
}
|
||||
|
||||
|
||||
//
|
||||
// Gutters
|
||||
//
|
||||
.grid--gutters {
|
||||
margin: -(@gutter-space/2) 0 @gutter-space (-(@gutter-space/2));
|
||||
|
||||
> .grid__col {
|
||||
padding: @gutter-space 0 0 @gutter-space;;
|
||||
}
|
||||
}
|
||||
|
||||
@media (@screen-sm) {
|
||||
.grid-small--gutters {
|
||||
margin: -(@gutter-space/2) 0 @gutter-space (-(@gutter-space/2));
|
||||
|
||||
> .grid__col {
|
||||
padding: @gutter-space 0 0 @gutter-space;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media (@screen-md) {
|
||||
.grid-medium--gutters {
|
||||
margin: -(@gutter-space/2) 0 @gutter-space (-(@gutter-space/2));
|
||||
|
||||
> .grid__col {
|
||||
padding: @gutter-space 0 0 @gutter-space;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media (@screen-lg) {
|
||||
.grid-large--gutters {
|
||||
margin: -(@gutter-space/2) 0 @gutter-space (-(@gutter-space/2));
|
||||
|
||||
> .grid__col {
|
||||
padding: @gutter-space 0 0 @gutter-space;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
//
|
||||
// Columns
|
||||
//
|
||||
.grid--fit {
|
||||
> .grid__col { flex: 1; }
|
||||
}
|
||||
|
||||
.grid--full {
|
||||
> .grid__col { flex: 0 0 100%; }
|
||||
}
|
||||
|
||||
.grid--1of6 {
|
||||
> .grid__col { flex: 0 0 16.5%; }
|
||||
}
|
||||
|
||||
.grid--2of6,
|
||||
.grid--third {
|
||||
> .grid__col { flex: 0 0 33%; }
|
||||
}
|
||||
|
||||
.grid--3of6,
|
||||
.grid--half {
|
||||
> .grid__col { flex: 0 0 50%; }
|
||||
}
|
||||
|
||||
.grid--4of6 {
|
||||
> .grid__col { flex: 0 0 66%; }
|
||||
}
|
||||
|
||||
.grid--5of6 {
|
||||
> .grid__col { flex: 0 0 82.5%; }
|
||||
}
|
||||
|
||||
@media (@screen-sm) {
|
||||
.grid-small--fit {
|
||||
> .grid__col { flex: 1; }
|
||||
}
|
||||
.grid-small--full{
|
||||
> .grid__col { flex: 0 0 100%; }
|
||||
}
|
||||
.grid-small--1of6 {
|
||||
> .grid__col { flex: 0 0 16.5%; }
|
||||
}
|
||||
.grid-small--2of6,
|
||||
.grid-small--third {
|
||||
> .grid__col { flex: 0 0 33%; }
|
||||
}
|
||||
.grid-small--3of6,
|
||||
.grid-small--half {
|
||||
> .grid__col { flex: 0 0 50%; }
|
||||
}
|
||||
.grid-small--4of6 {
|
||||
> .grid__col { flex: 0 0 66%; }
|
||||
}
|
||||
.grid-small--5of6 {
|
||||
> .grid__col { flex: 0 0 82.5%; }
|
||||
}
|
||||
}
|
||||
|
||||
@media (@screen-md) {
|
||||
.grid-medium--fit {
|
||||
> .grid__col { flex: 1 }
|
||||
}
|
||||
|
||||
.grid-medium--full {
|
||||
> .grid__col { flex: 0 0 100%; }
|
||||
}
|
||||
|
||||
.grid-medium--1of6 {
|
||||
> .grid__col { flex: 0 0 16.5%; }
|
||||
}
|
||||
|
||||
.grid-medium--2of6,
|
||||
.grid-medium--third {
|
||||
> .grid__col { flex: 0 0 33%; }
|
||||
}
|
||||
|
||||
.grid-medium--3of6,
|
||||
.grid-medium--half {
|
||||
> .grid__col { flex: 0 0 50%; }
|
||||
}
|
||||
|
||||
.grid-medium--4of6 {
|
||||
> .grid__col { flex: 0 0 66%; }
|
||||
}
|
||||
|
||||
.grid-medium--5of6 {
|
||||
> .grid__col { flex: 0 0 82.5%; }
|
||||
}
|
||||
}
|
||||
|
||||
@media (@screen-lg) {
|
||||
.grid-large--fit {
|
||||
> .grid__col { flex: 1; }
|
||||
}
|
||||
|
||||
.grid-large--full {
|
||||
> .grid__col { flex: 0 0 100%; }
|
||||
}
|
||||
|
||||
.grid-large--1of6 {
|
||||
> .grid__col { flex: 0 0 16.5%; }
|
||||
}
|
||||
|
||||
.grid-large--2of6,
|
||||
.grid-large--third {
|
||||
> .grid__col { flex: 0 0 33%; }
|
||||
}
|
||||
|
||||
.grid-large--3of6,
|
||||
.grid-large--half {
|
||||
> .grid__col { flex: 0 0 50%; }
|
||||
}
|
||||
|
||||
.grid-large--4of6 {
|
||||
> .grid__col { flex: 0 0 66%; }
|
||||
}
|
||||
|
||||
.grid-large--5of6 {
|
||||
> .grid__col { flex: 0 0 82.5%; }
|
||||
}
|
||||
}
|
233
assets/_src/less/ascribe/_header.less
Normal file
@ -0,0 +1,233 @@
|
||||
//
|
||||
// Ascribe
|
||||
// -----------------
|
||||
// The header
|
||||
//
|
||||
|
||||
.header {
|
||||
overflow: hidden;
|
||||
padding-bottom: 50px;
|
||||
|
||||
.chevron-divider {
|
||||
height: 175px;
|
||||
}
|
||||
|
||||
.logo {
|
||||
margin-top: 30px;
|
||||
position:relative;
|
||||
z-index:10;
|
||||
}
|
||||
nav {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
margin: 0;
|
||||
top: 20px;
|
||||
|
||||
ul {
|
||||
&:extend(.list-unstyled all, .small);
|
||||
}
|
||||
}
|
||||
|
||||
.menu-item {
|
||||
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%);
|
||||
}
|
||||
|
||||
&:hover {
|
||||
border: 1px solid @pink;
|
||||
|
||||
a {
|
||||
color: @pink;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 910px) {
|
||||
.menu-item {
|
||||
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
|
||||
//
|
||||
.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;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
.tour-switcher {
|
||||
.phone-and-up;
|
||||
}
|
||||
.logo {
|
||||
float:left;
|
||||
|
||||
&.phone-only {
|
||||
width: 30px;
|
||||
margin-left:10px;
|
||||
}
|
||||
}
|
||||
.app-links {
|
||||
float: right;
|
||||
margin-top: 35px;
|
||||
.signInUpText;
|
||||
color: @black;
|
||||
position:relative;
|
||||
z-index:3;
|
||||
|
||||
a {
|
||||
.signInUpText;
|
||||
color: @black;
|
||||
|
||||
&:hover {
|
||||
color: @pink;
|
||||
}
|
||||
}
|
||||
}
|
||||
.hamburger {
|
||||
cursor:pointer;
|
||||
width: 25px;
|
||||
margin-left: 15px;
|
||||
position: relative;
|
||||
top: 2px;
|
||||
z-index:50;
|
||||
|
||||
@media screen and (max-width: @phoneWidth) {
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
.mobile-nav {
|
||||
display: none;
|
||||
background-color: black;
|
||||
position: absolute;
|
||||
width: 120%;
|
||||
left: -10%;
|
||||
top: 0;
|
||||
text-align:center;
|
||||
z-index:4;
|
||||
|
||||
ul {
|
||||
padding: 40px 0 20px;
|
||||
}
|
||||
li {
|
||||
font-weight: 400;
|
||||
padding-bottom: 15px;
|
||||
font-size: 13px;
|
||||
|
||||
a {
|
||||
color: @white;
|
||||
|
||||
&:hover {
|
||||
color: @pink;
|
||||
}
|
||||
}
|
||||
&:nth-child(-n+3) {
|
||||
font-size: 16px;
|
||||
padding-bottom: 35px;
|
||||
}
|
||||
&:nth-child(3) {
|
||||
border-bottom:1px solid @white;
|
||||
margin-bottom:25px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: @phoneWidth) {
|
||||
display:none;
|
||||
&.active {
|
||||
display:block;
|
||||
}
|
||||
}
|
||||
}
|
@ -1,9 +1,3 @@
|
||||
// TERRITORIAL CSS HELPERS
|
||||
@tabletWidth: 768px;
|
||||
@middleWidth: 570px;
|
||||
@phoneWidth: 600px;
|
||||
@smallWidth: 400px;
|
||||
|
||||
// CLEARFIX
|
||||
// Apply .clearfix to a non-floated container element with floated elements in it
|
||||
// to ensure the container has a height. Use .no-clearfix to reset a clearfix
|
||||
@ -29,73 +23,6 @@
|
||||
}
|
||||
}
|
||||
|
||||
// CENTERED
|
||||
// Apply this class to an element to center it responsively in a container
|
||||
@centeredpadding: 10px;
|
||||
|
||||
.centered-header {
|
||||
.clearfix;
|
||||
max-width: 1120px + 2*@centeredpadding;
|
||||
padding: 0 @centeredpadding;
|
||||
width: 100%;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.centered-prodFeat {
|
||||
.clearfix;
|
||||
max-width: 930px + 2*@centeredpadding;
|
||||
padding: 0 @centeredpadding;
|
||||
width: 100%;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.centered-content {
|
||||
.clearfix;
|
||||
max-width: 770px + 2*@centeredpadding;
|
||||
padding: 0 @centeredpadding;
|
||||
width: 100%;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.centered-pricing {
|
||||
.clearfix;
|
||||
max-width: 880px + 2*@centeredpadding;
|
||||
padding: 0 @centeredpadding;
|
||||
width: 100%;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.centered-content-padding {
|
||||
.clearfix;
|
||||
max-width: 950px;
|
||||
padding: 0 @centeredpadding 50px;
|
||||
width: 100%;
|
||||
margin: 0 auto;
|
||||
background-color: @white;
|
||||
}
|
||||
|
||||
.centered-categories {
|
||||
.clearfix;
|
||||
max-width: 1000px;
|
||||
width: 100%;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.centered-footer {
|
||||
.clearfix;
|
||||
max-width: 650px + 2*@centeredpadding;
|
||||
padding: 0 @centeredpadding;
|
||||
width: 100%;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
// GENERAL LIST
|
||||
// TAKES AWAY PADDING AND LIST STYLE
|
||||
ul, ol {
|
||||
padding:0;
|
||||
margin:0;
|
||||
}
|
||||
|
||||
// COLUMN SECTIONS
|
||||
|
||||
.wrapper {
|
||||
@ -105,15 +32,12 @@ ul, ol {
|
||||
|
||||
@paddingForCols: 30px;
|
||||
.ttl-columns {
|
||||
font-size:0;
|
||||
width:100%;
|
||||
width: calc(~"100% +"@paddingForCols);
|
||||
.column {
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
padding-right: @paddingForCols;
|
||||
font-size: 15px;
|
||||
|
||||
}
|
||||
|
||||
.column-2 {
|
||||
@ -187,27 +111,6 @@ ul, ol {
|
||||
.ttl-columns;
|
||||
}
|
||||
|
||||
// BORDER-BOX
|
||||
// Changes the box model so that padding is included within width, rather than
|
||||
// outside of width
|
||||
*,
|
||||
*:before,
|
||||
*:after {
|
||||
-moz-box-sizing: border-box;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
// EMBED OBJECTS
|
||||
// Makes embed objects responsive
|
||||
img,
|
||||
embed,
|
||||
object,
|
||||
video {
|
||||
max-width: 100%;
|
||||
border: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
// MOBILE-ONLY
|
||||
// Use this to only display something on mobile- and tablet-width devices.
|
||||
@ -241,16 +144,6 @@ video {
|
||||
|
||||
// MIXINS
|
||||
|
||||
// TRANSITION
|
||||
// Applies a CSS transition between properties
|
||||
.transition(@property: all, @speed: 0.15s, @easing: ease-in-out) {
|
||||
-webkit-transition: @property @speed @easing;
|
||||
-moz-transition: @property @speed @easing;
|
||||
-ms-transition: @property @speed @easing;
|
||||
-o-transition: @property @speed @easing;
|
||||
transition: @property @speed @easing;
|
||||
}
|
||||
|
||||
///**
|
||||
// * Selection
|
||||
// *
|
159
assets/_src/less/ascribe/_hero.less
Normal file
@ -0,0 +1,159 @@
|
||||
|
||||
.hero {
|
||||
height: 815px;
|
||||
padding:0;
|
||||
padding-top: 30px;
|
||||
margin-bottom: @spacer;
|
||||
position: relative;
|
||||
background-size: cover;
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
overflow: visible;
|
||||
|
||||
.sticky {
|
||||
padding: 15px 0;
|
||||
width: 100%;
|
||||
position: fixed;
|
||||
background-color: fade(@black,0);
|
||||
transition: .2s ease-out;
|
||||
|
||||
&.stuck {
|
||||
background-color: fade(@black,100);
|
||||
z-index:800;
|
||||
|
||||
ul {
|
||||
&.active {
|
||||
background-color: @black;
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
nav {
|
||||
float: left;
|
||||
margin-top: 9px;
|
||||
.tourNavText;
|
||||
|
||||
ul {
|
||||
&:extend(.list-unstyled all);
|
||||
padding: 0 35px;
|
||||
position: absolute;
|
||||
|
||||
&.active {
|
||||
li {
|
||||
display: block;
|
||||
&.current-menu-item {
|
||||
a {
|
||||
&:after {
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
li {
|
||||
display: none;
|
||||
text-align: right;
|
||||
|
||||
&.current-menu-item {
|
||||
display: block;
|
||||
|
||||
a {
|
||||
position: relative;
|
||||
font-size: 25px;
|
||||
|
||||
&:before {
|
||||
content: 'for ';
|
||||
display: inline-block;
|
||||
margin-right: 6px;
|
||||
}
|
||||
&:after {
|
||||
content: '';
|
||||
background-image: url(../../img/arrow.png);
|
||||
background-repeat: no-repeat;
|
||||
width: 10px;
|
||||
height: 8px;
|
||||
display: inline-block;
|
||||
position: absolute;
|
||||
top: 10px;
|
||||
right: -25px;
|
||||
font-size: 15px;
|
||||
}
|
||||
}
|
||||
}
|
||||
a {
|
||||
width: 100%;
|
||||
font-size: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
.description {
|
||||
clear: both;
|
||||
width: 80%;
|
||||
margin: 190px auto 0;
|
||||
text-align: center;
|
||||
}
|
||||
h1 {
|
||||
.heroText;
|
||||
margin-bottom: 160px;
|
||||
}
|
||||
.app-links {
|
||||
color: @white;
|
||||
margin-top: 10px;
|
||||
|
||||
a {
|
||||
color: @white;
|
||||
|
||||
&:hover {
|
||||
color: @pink;
|
||||
}
|
||||
}
|
||||
}
|
||||
.chevron-divider {
|
||||
position: absolute;
|
||||
bottom: -@spacer;
|
||||
height: 150px;
|
||||
}
|
||||
|
||||
@media screen and (max-width: @tabletWidth) {
|
||||
height: 600px;
|
||||
|
||||
h1 {
|
||||
margin-bottom: 80px;
|
||||
}
|
||||
|
||||
|
||||
.description {
|
||||
margin: 160px auto 0;
|
||||
font-size: 34px;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: @phoneWidth) {
|
||||
padding-top: 10px;
|
||||
.description {
|
||||
margin: 90px auto 0;
|
||||
font-size: 34px;
|
||||
width: 100%;
|
||||
}
|
||||
h1 {
|
||||
font-size:26px;
|
||||
line-height: 33px;
|
||||
margin-bottom:0;
|
||||
}
|
||||
.sticky {
|
||||
position: absolute;
|
||||
|
||||
&.stuck {
|
||||
background-color: fade(@black,0);
|
||||
}
|
||||
}
|
||||
.app-links {
|
||||
margin-top:5px;
|
||||
}
|
||||
}
|
||||
}
|
54
assets/_src/less/ascribe/_media.less
Normal file
@ -0,0 +1,54 @@
|
||||
|
||||
//
|
||||
// responsive media by default
|
||||
//
|
||||
figure, img, svg, video, audio, embed, canvas, picture,
|
||||
.wp-caption {
|
||||
max-width: 100%;
|
||||
height: auto;
|
||||
border: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
|
||||
//
|
||||
// Responsive video
|
||||
//
|
||||
.video-container {
|
||||
position: relative;
|
||||
padding-bottom: 56.25%;
|
||||
padding-top: 35px;
|
||||
height: 0;
|
||||
overflow: hidden;
|
||||
|
||||
> iframe {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
//
|
||||
// Responsive iframe
|
||||
//
|
||||
iframe {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.iframe-container {
|
||||
position: relative;
|
||||
padding-bottom: 75%;
|
||||
height: 0;
|
||||
overflow: hidden;
|
||||
|
||||
> iframe {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
42
assets/_src/less/ascribe/_subtemplates.less
Normal file
@ -0,0 +1,42 @@
|
||||
.subtemplate {
|
||||
position: relative;
|
||||
padding-top: @spacer;
|
||||
padding-bottom: @spacer;
|
||||
|
||||
@media (@screen-sm) {
|
||||
padding-top: (@spacer * 2);
|
||||
padding-bottom: (@spacer * 2);
|
||||
}
|
||||
|
||||
> .row { background-color: @white; }
|
||||
|
||||
&.content-boxed,
|
||||
&.grey {
|
||||
> .row { background-color: transparent; }
|
||||
}
|
||||
|
||||
&.case-studies {
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.subtemplate__title,
|
||||
.subtemplate__description {
|
||||
&:extend(.text-center);
|
||||
}
|
||||
|
||||
.subtemplate__title {
|
||||
margin-top: 0;
|
||||
margin-bottom: @spacer;
|
||||
|
||||
.above-chevron > .subtemplate:first-child & {
|
||||
margin-top: (@spacer * 2);
|
||||
}
|
||||
}
|
||||
|
||||
.subtemplate__description {
|
||||
&:extend(.large);
|
||||
color: @greyText;
|
||||
margin-top: -(@spacer/2);
|
||||
margin-bottom: (@spacer * 2);
|
||||
}
|
45
assets/_src/less/ascribe/_team.less
Normal file
@ -0,0 +1,45 @@
|
||||
.team {
|
||||
text-align: center;
|
||||
|
||||
.intro {
|
||||
margin-bottom: 60px;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
p {
|
||||
margin:0;
|
||||
}
|
||||
&.tour-page {
|
||||
padding: 70px 0;
|
||||
background-color: @greyBg;
|
||||
}
|
||||
@media screen and (max-width: @tabletWidth) {
|
||||
.intro {
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
//
|
||||
// Component: Team Member
|
||||
//
|
||||
.team-member {
|
||||
&:extend(.text-center);
|
||||
h1 {
|
||||
.teamName;
|
||||
margin-top: 20px;
|
||||
margin-bottom:0;
|
||||
}
|
||||
h2 {
|
||||
.copyText;
|
||||
margin-top:2px;
|
||||
}
|
||||
}
|
||||
|
||||
.team-member__image {
|
||||
border-radius: 50%;
|
||||
max-width: 200px;
|
||||
margin: auto;
|
||||
display: block;
|
||||
}
|
256
assets/_src/less/ascribe/_typography.less
Normal file
@ -0,0 +1,256 @@
|
||||
//
|
||||
// Typography
|
||||
//
|
||||
|
||||
//
|
||||
// Scaffolding
|
||||
//
|
||||
|
||||
// Root reset
|
||||
html {
|
||||
font-size: 10px;
|
||||
-webkit-tap-highlight-color: rgba(0,0,0,0);
|
||||
}
|
||||
|
||||
body {
|
||||
&:extend(.copyText);
|
||||
background-color: @body-bg;
|
||||
|
||||
text-rendering: optimizeLegibility;
|
||||
// Controversial! But prevents text flickering in
|
||||
// Safari/Firefox when animations are running
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
-moz-font-feature-settings: 'liga', 'kern';
|
||||
|
||||
// remove old style numerals
|
||||
font-feature-settings: "kern" 1, "liga" 1, "calt" 1, "pnum" 1, "tnum" 0, "onum" 0, "lnum" 0, "dlig" 1;
|
||||
}
|
||||
|
||||
// Legacy Text styles
|
||||
.copyText {
|
||||
font-family: @font-family-base;
|
||||
font-size: @font-size-base;
|
||||
font-weight: @font-weight-base;
|
||||
line-height: @line-height-base;
|
||||
color: @text-color;
|
||||
}
|
||||
.copyTextMedium {
|
||||
&:extend(.fontLight);
|
||||
color: @blueDeep;
|
||||
font-size: 17px;
|
||||
line-height: 21px;
|
||||
}
|
||||
.copyTextSmall {
|
||||
font-family: @font-family-base;
|
||||
font-size: @font-size-small;
|
||||
font-weight: @font-weight-base;
|
||||
line-height: @line-height-small;
|
||||
color: @text-color;
|
||||
}
|
||||
|
||||
|
||||
//
|
||||
// Links
|
||||
//
|
||||
a {
|
||||
color: @link-color;
|
||||
text-decoration: none;
|
||||
transition: .2s ease-out;
|
||||
|
||||
&:hover,
|
||||
&:focus {
|
||||
color: @link-hover-color;
|
||||
}
|
||||
|
||||
&:active {}
|
||||
}
|
||||
|
||||
|
||||
|
||||
//
|
||||
// Headings
|
||||
//
|
||||
h1, h2, h3, h4, h5, h6,
|
||||
.h1, .h2, .h3, .h4, .h5, .h6 {
|
||||
font-family: @headings-font-family;
|
||||
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;
|
||||
}
|
||||
|
||||
.h1, h1 {
|
||||
font-size: @font-size-h1;
|
||||
}
|
||||
.h2, h2 {
|
||||
font-size: @font-size-h2;
|
||||
}
|
||||
.h3, h3 {
|
||||
font-size: @font-size-h3;
|
||||
}
|
||||
.h4, h4 {
|
||||
font-size: @font-size-h4;
|
||||
color: @black;
|
||||
}
|
||||
.h5, h5 {
|
||||
color: @font-size-h5;
|
||||
color: @black;
|
||||
}
|
||||
.h6, h6 {
|
||||
font-size: @font-size-h6;
|
||||
color: @black;
|
||||
}
|
||||
|
||||
|
||||
|
||||
// Reset fonts for relevant elements
|
||||
input,
|
||||
button,
|
||||
select,
|
||||
textarea {
|
||||
font-family: inherit;
|
||||
font-size: inherit;
|
||||
line-height: inherit;
|
||||
}
|
||||
|
||||
//
|
||||
// Body text
|
||||
//
|
||||
p {
|
||||
margin: 0 0 @line-height-base;
|
||||
}
|
||||
|
||||
|
||||
//
|
||||
// Emphasis & misc
|
||||
//
|
||||
small,
|
||||
.small {
|
||||
font-size: @font-size-small;
|
||||
line-height: @line-height-small;
|
||||
}
|
||||
|
||||
.mini {
|
||||
font-size: @font-size-mini;
|
||||
line-height: @line-height-small;
|
||||
}
|
||||
|
||||
.large {
|
||||
font-size: @font-size-large;
|
||||
line-height: @line-height-large;
|
||||
}
|
||||
|
||||
strong,
|
||||
.strong,
|
||||
.bold {
|
||||
font-weight: @font-weight-bold;
|
||||
}
|
||||
|
||||
em,
|
||||
.italic {
|
||||
font-style: italic;
|
||||
font-weight: @font-weight-normal;
|
||||
}
|
||||
|
||||
// Alignment
|
||||
.text-left { text-align: left; }
|
||||
.text-right { text-align: right; }
|
||||
.text-center { text-align: center; }
|
||||
.text-justify { text-align: justify; }
|
||||
.text-nowrap { white-space: nowrap; }
|
||||
|
||||
// Transformation
|
||||
.text-lowercase { text-transform: lowercase; }
|
||||
.text-uppercase { text-transform: uppercase; }
|
||||
.text-capitalize { text-transform: capitalize; }
|
||||
|
||||
|
||||
//
|
||||
// Lists
|
||||
//
|
||||
// Unordered and Ordered lists
|
||||
ul,
|
||||
ol {
|
||||
margin-top: @line-height-base;
|
||||
margin-bottom: @line-height-base;
|
||||
padding-left: @line-height-base;
|
||||
|
||||
li {
|
||||
margin-bottom: (@line-height-base / 2);
|
||||
padding-left: (@line-height-base / 2);
|
||||
}
|
||||
ul,
|
||||
ol {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
// List options
|
||||
.list-unstyled {
|
||||
padding-left: 0;
|
||||
margin: 0;
|
||||
|
||||
li {
|
||||
list-style: none;
|
||||
margin-bottom: 0;
|
||||
padding-left: 0;
|
||||
}
|
||||
}
|
||||
|
||||
// Inline turns list items into inline-block
|
||||
.list-inline {
|
||||
.list-unstyled;
|
||||
margin-left: -5px;
|
||||
|
||||
> li {
|
||||
display: inline-block;
|
||||
padding-left: 5px;
|
||||
padding-right: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
//
|
||||
// Blockquotes
|
||||
//
|
||||
blockquote {
|
||||
border-left: 3px solid @greySocial;
|
||||
margin-left: 0;
|
||||
margin-top: @line-height-base;
|
||||
margin-bottom: @line-height-base;
|
||||
padding: (@line-height-base/2) @line-height-base;
|
||||
color: @greyHr;
|
||||
font-style: italic;
|
||||
|
||||
p,
|
||||
ul,
|
||||
ol {
|
||||
&:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
cite {
|
||||
&:extend(.bold, .small);
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
// Addresses
|
||||
address {
|
||||
margin-bottom: @line-height-base;
|
||||
font-style: normal;
|
||||
line-height: @line-height-base;
|
||||
}
|
||||
|
||||
|
||||
hr {
|
||||
border: 0;
|
||||
height: 2px;
|
||||
background: @blueLight;
|
||||
margin: @spacer 0;
|
||||
}
|
94
assets/_src/less/ascribe/_variables.less
Normal file
@ -0,0 +1,94 @@
|
||||
//
|
||||
// Ascribe
|
||||
// -----------------
|
||||
// Variables
|
||||
//
|
||||
|
||||
// COLORS
|
||||
@blueDeep: #121417;
|
||||
@blueMedium: #003C69;
|
||||
@blueBright: #67C4DA;
|
||||
@blueLight: #d7e9ef;
|
||||
@pink: #D8127D;
|
||||
|
||||
@white: #fff;
|
||||
@greyBg: #fbfbfb;
|
||||
@greySocial: #b8b8b8;
|
||||
@greyHr: #979797;
|
||||
@greyFooter: #8c8c8c;
|
||||
@greyText: #595959;
|
||||
@blackish: #1e1e1e;
|
||||
@black: #000;
|
||||
|
||||
|
||||
//
|
||||
// Typography
|
||||
//
|
||||
@font-size-base: 18px;
|
||||
@font-size-small: 16px;
|
||||
@font-size-mini: 13px;
|
||||
@font-size-large: 24px;
|
||||
|
||||
@font-size-h1: 42px;
|
||||
@font-size-h2: 32px;
|
||||
@font-size-h3: 26px;
|
||||
@font-size-h4: 22px;
|
||||
@font-size-h5: @font-size-base;
|
||||
@font-size-h6: @font-size-small;
|
||||
|
||||
@line-height-base: 24px;
|
||||
@line-height-small: 22px;
|
||||
@line-height-large: 28px;
|
||||
|
||||
@text-color: @greyText;
|
||||
|
||||
@font-family-base: "canada-type-gibson", sans-serif;
|
||||
@font-weight-light: 300;
|
||||
@font-weight-normal: 400;
|
||||
|
||||
@font-weight-base: @font-weight-light;
|
||||
@font-weight-bold: @font-weight-normal;
|
||||
|
||||
@body-bg: @white;
|
||||
|
||||
|
||||
@link-color: @blueBright;
|
||||
@link-hover-color: @pink;
|
||||
|
||||
|
||||
@headings-font-family: @font-family-base;
|
||||
@headings-font-weight: @font-weight-base;
|
||||
@headings-line-height: 1.2;
|
||||
@headings-color: @pink;
|
||||
|
||||
|
||||
//
|
||||
// Spacing
|
||||
//
|
||||
@spacer: 40px;
|
||||
|
||||
|
||||
//
|
||||
// Responsive breakpoints
|
||||
//
|
||||
@screen-xs-min: 400px;
|
||||
@screen-sm-min: 768px;
|
||||
@screen-md-min: 900px;
|
||||
@screen-lg-min: 1100px;
|
||||
|
||||
@screen-sm: ~'min-width: @{screen-sm-min}';
|
||||
@screen-md: ~'min-width: @{screen-md-min}';
|
||||
@screen-lg: ~'min-width: @{screen-lg-min}';
|
||||
|
||||
// LEGACY
|
||||
// mostly used in conjunction with max-width media queries
|
||||
@smallWidth: @screen-xs-min;
|
||||
@middleWidth: 570px;
|
||||
@phoneWidth: 600px;
|
||||
@tabletWidth: @screen-sm-min;
|
||||
|
||||
|
||||
//
|
||||
// Grid
|
||||
//
|
||||
@gutter-space: (@spacer * 1.5);
|
12
assets/css/ascribe.min.css
vendored
11
assets/dist/css/ascribe.css
vendored
Normal file
11
assets/dist/css/ascribe.min.css
vendored
Normal file
11
assets/dist/js/ascribe.js
vendored
Normal file
@ -0,0 +1,11 @@
|
||||
/**
|
||||
** ascribe v0.0.1
|
||||
** The best WordPress theme ever made!
|
||||
** http://ascribe.io
|
||||
**
|
||||
** Territorial <us@territorial.ca>
|
||||
**
|
||||
**
|
||||
** https://github.com/ascribe/wp-theme.git
|
||||
**/
|
||||
function stickyNav(){var e=$(".sticky");$(window).on("load resize scroll",function(){$(window).width()>768&&($(window).scrollTop()>100?e.addClass("stuck"):e.removeClass("stuck"))})}function mobileNav(){$(".hamburger").click(function(){$(".mobile-nav").toggleClass("active")})}$(document).ready(function(){function e(){$("body").hasClass("page-template-template-tour")&&$(".tour-switcher .menu").prepend($(".tour-switcher .current-menu-item")),$(".current-menu-item a").click(function(e){e.preventDefault(),$("#menu-landing-page-menu").toggleClass("active")})}function t(){$(".case-study:gt(0)").addClass("hidden"),$(".slider-action").click(function(){var e=$(this).attr("id");"back"===e?($(".case-study").addClass("hidden"),$(".case-study").last().prependTo(".slide-container").removeClass("hidden")):(displayed=$(".case-study").first(),displayed.addClass("hidden"),$(".case-study").eq(1).removeClass("hidden"),displayed.appendTo(".slide-container"))})}function a(){$(".featured-faqs dt").click(function(){$(this).next("dd").toggleClass("open")})}function s(){$(".top-tab").click(function(){$(".top-tab").removeClass("active"),$(this).addClass("active");var e=$(this).data("tab");$(".marketplace-info").removeClass("active"),$("#"+e).addClass("active")})}t(),a(),s(),e(),mobileNav(),stickyNav()});
|
11
assets/dist/js/ascribe.min.js
vendored
Normal file
@ -0,0 +1,11 @@
|
||||
/**
|
||||
** ascribe v0.0.1
|
||||
** The best WordPress theme ever made!
|
||||
** http://ascribe.io
|
||||
**
|
||||
** Territorial <us@territorial.ca>
|
||||
**
|
||||
**
|
||||
** https://github.com/ascribe/wp-theme.git
|
||||
**/
|
||||
function stickyNav(){var e=$(".sticky");$(window).on("load resize scroll",function(){$(window).width()>768&&($(window).scrollTop()>100?e.addClass("stuck"):e.removeClass("stuck"))})}function mobileNav(){$(".hamburger").click(function(){$(".mobile-nav").toggleClass("active")})}$(document).ready(function(){function e(){$("body").hasClass("page-template-template-tour")&&$(".tour-switcher .menu").prepend($(".tour-switcher .current-menu-item")),$(".current-menu-item a").click(function(e){e.preventDefault(),$("#menu-landing-page-menu").toggleClass("active")})}function t(){$(".case-study:gt(0)").addClass("hidden"),$(".slider-action").click(function(){var e=$(this).attr("id");"back"===e?($(".case-study").addClass("hidden"),$(".case-study").last().prependTo(".slide-container").removeClass("hidden")):(displayed=$(".case-study").first(),displayed.addClass("hidden"),$(".case-study").eq(1).removeClass("hidden"),displayed.appendTo(".slide-container"))})}function a(){$(".featured-faqs dt").click(function(){$(this).next("dd").toggleClass("open")})}function s(){$(".top-tab").click(function(){$(".top-tab").removeClass("active"),$(this).addClass("active");var e=$(this).data("tab");$(".marketplace-info").removeClass("active"),$("#"+e).addClass("active")})}t(),a(),s(),e(),mobileNav(),stickyNav()});
|
@ -1,12 +0,0 @@
|
||||
/**
|
||||
** ascribe v0.0.1
|
||||
** The best WordPress theme ever made!
|
||||
** http://ascribe.io
|
||||
**
|
||||
** Territorial <us@territorial.ca>
|
||||
**
|
||||
**
|
||||
** https://github.com/ascribe/wp-theme.git
|
||||
**/
|
||||
$(document).ready(function(){$("#more-articles").click(function(a){a.preventDefault(),$.ajax({url:ajaxpagination.ajaxurl,type:"post",data:{action:"ajax_pagination"},success:function(a){alert(a)}})})});
|
||||
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImFqYXgtcGFnaW5hdGlvbi5qcyJdLCJuYW1lcyI6WyIkIiwiZG9jdW1lbnQiLCJyZWFkeSIsImNsaWNrIiwiZSIsInByZXZlbnREZWZhdWx0IiwiYWpheCIsInVybCIsImFqYXhwYWdpbmF0aW9uIiwiYWpheHVybCIsInR5cGUiLCJkYXRhIiwiYWN0aW9uIiwic3VjY2VzcyIsInJlc3VsdCIsImFsZXJ0Il0sIm1hcHBpbmdzIjoiQUFBQUEsRUFBRUMsVUFBVUMsTUFBTSxXQUNkRixFQUFFLGtCQUFrQkcsTUFBTSxTQUFTQyxHQUMvQkEsRUFBRUMsaUJBQ0ZMLEVBQUVNLE1BQ0VDLElBQUtDLGVBQWVDLFFBQ3BCQyxLQUFNLE9BQ05DLE1BQ0lDLE9BQVEsbUJBRVpDLFFBQVMsU0FBVUMsR0FDZkMsTUFBT0QiLCJmaWxlIjoiYWpheC1wYWdpbmF0aW9uLmpzIiwic291cmNlc0NvbnRlbnQiOlsiJChkb2N1bWVudCkucmVhZHkoZnVuY3Rpb24oKXtcbiAgICAkKCcjbW9yZS1hcnRpY2xlcycpLmNsaWNrKGZ1bmN0aW9uKGUpe1xuICAgICAgICBlLnByZXZlbnREZWZhdWx0KCk7XG4gICAgICAgICQuYWpheCh7XG4gICAgICAgICAgICB1cmw6IGFqYXhwYWdpbmF0aW9uLmFqYXh1cmwsXG4gICAgICAgICAgICB0eXBlOiAncG9zdCcsXG4gICAgICAgICAgICBkYXRhOiB7XG4gICAgICAgICAgICAgICAgYWN0aW9uOiAnYWpheF9wYWdpbmF0aW9uJ1xuICAgICAgICAgICAgfSxcbiAgICAgICAgICAgIHN1Y2Nlc3M6IGZ1bmN0aW9uKCByZXN1bHQgKSB7XG4gICAgICAgICAgICAgICAgYWxlcnQoIHJlc3VsdCApO1xuICAgICAgICAgICAgfVxuICAgICAgICB9KVxuICAgIH0pO1xufSk7Il0sInNvdXJjZVJvb3QiOiIvc291cmNlLyJ9
|
12
assets/js/ajax-pagination.min.js
vendored
@ -1,12 +0,0 @@
|
||||
/**
|
||||
** ascribe v0.0.1
|
||||
** The best WordPress theme ever made!
|
||||
** http://ascribe.io
|
||||
**
|
||||
** Territorial <us@territorial.ca>
|
||||
**
|
||||
**
|
||||
** https://github.com/ascribe/wp-theme.git
|
||||
**/
|
||||
$(document).ready(function(){$("#more-articles").click(function(a){a.preventDefault(),$.ajax({url:ajaxpagination.ajaxurl,type:"post",data:{action:"ajax_pagination"},success:function(a){alert(a)}})})});
|
||||
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImFqYXgtcGFnaW5hdGlvbi5qcyJdLCJuYW1lcyI6WyIkIiwiZG9jdW1lbnQiLCJyZWFkeSIsImNsaWNrIiwiZSIsInByZXZlbnREZWZhdWx0IiwiYWpheCIsInVybCIsImFqYXhwYWdpbmF0aW9uIiwiYWpheHVybCIsInR5cGUiLCJkYXRhIiwiYWN0aW9uIiwic3VjY2VzcyIsInJlc3VsdCIsImFsZXJ0Il0sIm1hcHBpbmdzIjoiQUFBQUEsRUFBRUMsVUFBVUMsTUFBTSxXQUNkRixFQUFFLGtCQUFrQkcsTUFBTSxTQUFTQyxHQUMvQkEsRUFBRUMsaUJBQ0ZMLEVBQUVNLE1BQ0VDLElBQUtDLGVBQWVDLFFBQ3BCQyxLQUFNLE9BQ05DLE1BQ0lDLE9BQVEsbUJBRVpDLFFBQVMsU0FBVUMsR0FDZkMsTUFBT0QiLCJmaWxlIjoiYWpheC1wYWdpbmF0aW9uLmpzIiwic291cmNlc0NvbnRlbnQiOlsiJChkb2N1bWVudCkucmVhZHkoZnVuY3Rpb24oKXtcbiAgICAkKCcjbW9yZS1hcnRpY2xlcycpLmNsaWNrKGZ1bmN0aW9uKGUpe1xuICAgICAgICBlLnByZXZlbnREZWZhdWx0KCk7XG4gICAgICAgICQuYWpheCh7XG4gICAgICAgICAgICB1cmw6IGFqYXhwYWdpbmF0aW9uLmFqYXh1cmwsXG4gICAgICAgICAgICB0eXBlOiAncG9zdCcsXG4gICAgICAgICAgICBkYXRhOiB7XG4gICAgICAgICAgICAgICAgYWN0aW9uOiAnYWpheF9wYWdpbmF0aW9uJ1xuICAgICAgICAgICAgfSxcbiAgICAgICAgICAgIHN1Y2Nlc3M6IGZ1bmN0aW9uKCByZXN1bHQgKSB7XG4gICAgICAgICAgICAgICAgYWxlcnQoIHJlc3VsdCApO1xuICAgICAgICAgICAgfVxuICAgICAgICB9KVxuICAgIH0pO1xufSk7Il0sInNvdXJjZVJvb3QiOiIvc291cmNlLyJ9
|
12
assets/js/ascribe.min.js
vendored
@ -1,15 +0,0 @@
|
||||
$(document).ready(function(){
|
||||
$('#more-articles').click(function(e){
|
||||
e.preventDefault();
|
||||
$.ajax({
|
||||
url: ajaxpagination.ajaxurl,
|
||||
type: 'post',
|
||||
data: {
|
||||
action: 'ajax_pagination'
|
||||
},
|
||||
success: function( result ) {
|
||||
alert( result );
|
||||
}
|
||||
})
|
||||
});
|
||||
});
|
@ -1,349 +0,0 @@
|
||||
//GLOBALS
|
||||
body,
|
||||
html {
|
||||
.copyTextSmall;
|
||||
font-smoothing: antialiased;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
|
||||
&.page-template-template-companyblue {
|
||||
.copyText;
|
||||
}
|
||||
}
|
||||
|
||||
a {
|
||||
text-decoration: none;
|
||||
color: @blueBright;
|
||||
|
||||
&:hover {
|
||||
color: @pink;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
//FONTS
|
||||
.fontLight {
|
||||
font-family: "canada-type-gibson",sans-serif;
|
||||
font-weight: 200;
|
||||
}
|
||||
.fontRegular {
|
||||
font-family: "canada-type-gibson",sans-serif;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
// GENERAL TEXT STYLES
|
||||
.sectionHeader {
|
||||
&:extend(.fontLight);
|
||||
font-size: 34px;
|
||||
color: @blueBright;
|
||||
line-height: 1.2;
|
||||
margin: 35px 0;
|
||||
text-align: center;
|
||||
|
||||
@media screen and (max-width: @tabletWidth) {
|
||||
font-size: 30px;
|
||||
}
|
||||
}
|
||||
.subsectionHeader {
|
||||
&:extend(.fontLight);
|
||||
font-size: 31px;
|
||||
color: @black;
|
||||
line-height: 37px;
|
||||
text-align: center;
|
||||
}
|
||||
.h1, h1 {
|
||||
&:extend(.fontLight);
|
||||
font-size: 36px;
|
||||
color: @pink;
|
||||
line-height: 1.2;
|
||||
}
|
||||
.h2, h2 {
|
||||
&:extend(.fontRegular);
|
||||
font-size: 26px;
|
||||
color: @pink;
|
||||
line-height: 1.2;
|
||||
}
|
||||
.h3, h3 {
|
||||
&:extend(.fontLight);
|
||||
font-size: 27px;
|
||||
color: @pink;
|
||||
line-height: 1.2;
|
||||
}
|
||||
.h4, h4 {
|
||||
&:extend(.fontRegular);
|
||||
font-size: 26px;
|
||||
color: @black;
|
||||
line-height: 1.2;
|
||||
}
|
||||
.h5, h5 {
|
||||
&:extend(.fontLight);
|
||||
font-size: 26px;
|
||||
color: @black;
|
||||
line-height: 1.2;
|
||||
}
|
||||
.h6, h6 {
|
||||
&:extend(.fontRegular);
|
||||
color: @pink;
|
||||
font-size: 15px;
|
||||
line-height: 19px;
|
||||
}
|
||||
|
||||
.copyText {
|
||||
&:extend(.fontLight);
|
||||
color: @blueDeep;
|
||||
font-size: 18px;
|
||||
line-height: 22px;
|
||||
}
|
||||
.copyTextMedium {
|
||||
&:extend(.fontLight);
|
||||
color: @blueDeep;
|
||||
font-size: 17px;
|
||||
line-height: 21px;
|
||||
}
|
||||
.copyTextSmall {
|
||||
&:extend(.fontLight);
|
||||
color: @blueDeep;
|
||||
font-size: 15px;
|
||||
line-height: 19px;
|
||||
}
|
||||
|
||||
// SPECIALIZED TEXT STYLES
|
||||
.heroText {
|
||||
&:extend(.fontLight);
|
||||
font-size: 37px;
|
||||
color: @white;
|
||||
line-height: 44px;
|
||||
}
|
||||
.tourNavText {
|
||||
&:extend(.fontLight);
|
||||
font-size: 25px;
|
||||
line-height: 30px;
|
||||
color: @blueBright;
|
||||
|
||||
}
|
||||
.signInUpText {
|
||||
&:extend(.fontLight);
|
||||
font-size: 17px;
|
||||
line-height: 20px;
|
||||
color: @white;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
.featureCircleH1 {
|
||||
&:extend(.fontLight);
|
||||
font-size: 20px;
|
||||
color: @pink;
|
||||
letter-spacing: 1.11px;
|
||||
line-height: 24px;
|
||||
margin-bottom: 22px;
|
||||
}
|
||||
.caseStudyText {
|
||||
&:extend(.fontRegular);
|
||||
font-size: 23px;
|
||||
color: @white;
|
||||
line-height: 28px;
|
||||
}
|
||||
.oldWayNewWayTH {
|
||||
&:extend(.fontLight);
|
||||
font-size: 24px;
|
||||
color: @pink;
|
||||
line-height: 29px;
|
||||
}
|
||||
|
||||
.blueBoxTitle {
|
||||
&:extend(.fontRegular);
|
||||
font-size: 30px;
|
||||
color: @white;
|
||||
line-height: 52px;
|
||||
text-align: center;
|
||||
|
||||
@media (min-width: @phoneWidth) {
|
||||
font-size: 43px;
|
||||
}
|
||||
}
|
||||
.blueBoxCopy {
|
||||
&:extend(.fontLight);
|
||||
font-size: 24px;
|
||||
line-height: 31px;
|
||||
color: @white;
|
||||
|
||||
@media (min-width: @phoneWidth) {
|
||||
font-size: 43px;
|
||||
line-height: 52px;
|
||||
}
|
||||
}
|
||||
|
||||
.galleriesPressTitle {
|
||||
&:extend(.fontLight);
|
||||
font-size: 30px;
|
||||
color: @black;
|
||||
line-height: 36px;
|
||||
margin-bottom: 50px;
|
||||
}
|
||||
.featureBlogDesc {
|
||||
&:extend(.fontLight);
|
||||
font-size: 13px;
|
||||
color: @blueBright;
|
||||
line-height: 22.79px;
|
||||
}
|
||||
.featureBlogTitle {
|
||||
&:extend(.fontLight);
|
||||
font-size: 17px;
|
||||
color: @greyText;
|
||||
line-height: 22.79px;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
.teamName {
|
||||
&:extend(.fontRegular);
|
||||
color: @black;
|
||||
font-size: 19px;
|
||||
}
|
||||
.footerText {
|
||||
&:extend(.fontLight);
|
||||
font-size: 14px;
|
||||
color: @white;
|
||||
line-height: 25px;
|
||||
}
|
||||
.subfooterText {
|
||||
color: @blackish;
|
||||
font-size: 13px;
|
||||
line-height: 14px;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
// DEVICES
|
||||
.button {
|
||||
display: inline-block;
|
||||
padding: 25px 40px;
|
||||
&:extend(.fontRegular);
|
||||
border: 1px solid;
|
||||
font-size: 22px;
|
||||
line-height: 26px;
|
||||
text-decoration: none;
|
||||
min-width: 265px;
|
||||
text-align: center;
|
||||
|
||||
&.blue {
|
||||
@bgColor: @blueBright;
|
||||
color: @white;
|
||||
background-color: @bgColor;
|
||||
border-color: @bgColor;
|
||||
&:hover {
|
||||
background-color: fade(@bgColor,50);
|
||||
}
|
||||
}
|
||||
|
||||
&.pink {
|
||||
@bgColor: @pink;
|
||||
color: @white;
|
||||
background-color: @bgColor;
|
||||
border-color: @bgColor;
|
||||
&:hover {
|
||||
background-color: fade(@bgColor,50);
|
||||
}
|
||||
}
|
||||
|
||||
&.blue-overPic {
|
||||
@bgColor: @blueBright;
|
||||
color: @white;
|
||||
background-color: @bgColor;
|
||||
border-color: @bgColor;
|
||||
|
||||
&:hover {
|
||||
background-color: @white;
|
||||
color: @bgColor;
|
||||
}
|
||||
}
|
||||
|
||||
&.pink-overPic {
|
||||
@bgColor: @pink;
|
||||
color: @white;
|
||||
background-color: @bgColor;
|
||||
border-color: @bgColor;
|
||||
|
||||
&:hover {
|
||||
background-color: @white;
|
||||
color: @bgColor;
|
||||
}
|
||||
}
|
||||
|
||||
&.white-blue {
|
||||
@bgColor: @white;
|
||||
color: @blueBright;
|
||||
background-color: @bgColor;
|
||||
border-color: @blueBright;
|
||||
|
||||
&:hover {
|
||||
background-color: fade(@blueBright,50);
|
||||
color: @white;
|
||||
}
|
||||
}
|
||||
|
||||
&.small {
|
||||
&:extend(.fontLight);
|
||||
padding: 5px 15px;
|
||||
font-size: 14px;
|
||||
color: @white;
|
||||
background-color: transparent;
|
||||
border-color: @white;
|
||||
min-width: auto;
|
||||
|
||||
&:hover {
|
||||
background-color: fade(@white,40);
|
||||
border-color: fade(@white,40);
|
||||
color: @white;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: @smallWidth) {
|
||||
min-width: initial;
|
||||
}
|
||||
}
|
||||
|
||||
.chevron-divider {
|
||||
background-image: url(../../images/svg/ascribe-chevron.svg);
|
||||
background-position: bottom;
|
||||
width: 100%;
|
||||
background-size: 100%;
|
||||
height: 150px;
|
||||
|
||||
@media screen and (max-width: @tabletWidth) {
|
||||
background-size: 120%;
|
||||
}
|
||||
}
|
||||
|
||||
.social-icon {
|
||||
width: 21px;
|
||||
height: 21px;
|
||||
padding: 1px;
|
||||
fill: @white;
|
||||
background-color: @greySocial;
|
||||
border-radius: 5px;
|
||||
|
||||
&:hover {
|
||||
background-color: fade(@greySocial,40);
|
||||
}
|
||||
}
|
||||
|
||||
hr {
|
||||
border: 0;
|
||||
height: 2px;
|
||||
background: @greyHr;
|
||||
margin: 40px 0;
|
||||
}
|
||||
|
||||
.blueGradient {
|
||||
background-color: @blueBright;
|
||||
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#519cad+0,67c4da+100 */
|
||||
/* IE9 SVG, needs conditional override of 'filter' to 'none' */
|
||||
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzUxOWNhZCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM2N2M0ZGEiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
|
||||
background: -moz-linear-gradient(top, rgba(81,156,173,1) 0%, rgba(103,196,218,1) 100%); /* FF3.6+ */
|
||||
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(81,156,173,1)), color-stop(100%,rgba(103,196,218,1))); /* Chrome,Safari4+ */
|
||||
background: -webkit-linear-gradient(top, rgba(81,156,173,1) 0%,rgba(103,196,218,1) 100%); /* Chrome10+,Safari5.1+ */
|
||||
background: -o-linear-gradient(top, rgba(81,156,173,1) 0%,rgba(103,196,218,1) 100%); /* Opera 11.10+ */
|
||||
background: -ms-linear-gradient(top, rgba(81,156,173,1) 0%,rgba(103,196,218,1) 100%); /* IE10+ */
|
||||
background: linear-gradient(to bottom, rgba(81,156,173,1) 0%,rgba(103,196,218,1) 100%); /* W3C */
|
||||
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#519cad', endColorstr='#67c4da',GradientType=0 ); /* IE6-8 */
|
||||
|
||||
}
|
@ -1,25 +0,0 @@
|
||||
//
|
||||
// Ascribe
|
||||
// -----------------
|
||||
// Variables
|
||||
//
|
||||
|
||||
// COLORS
|
||||
@blueDeep: #121417;
|
||||
@blueMedium: #003C69;
|
||||
@blueBright: #67C4DA;
|
||||
@blueLight: #d7e9ef;
|
||||
@pink: #D8127D;
|
||||
|
||||
@white: #fff;
|
||||
@greyBg: #fbfbfb;
|
||||
@greySocial: #b8b8b8;
|
||||
@greyHr: #979797;
|
||||
@greyFooter: #8c8c8c;
|
||||
@greyText: #595959;
|
||||
@blackish: #1e1e1e;
|
||||
@black: #000;
|
||||
|
||||
|
||||
// SPACING
|
||||
@spacer: 40px;
|
423
assets/less/vendor/normalize.less
vendored
@ -1,423 +0,0 @@
|
||||
/*! normalize.css v3.0.1 | MIT License | git.io/normalize */
|
||||
|
||||
/**
|
||||
* 1. Set default font family to sans-serif.
|
||||
* 2. Prevent iOS text size adjust after orientation change, without disabling
|
||||
* user zoom.
|
||||
*/
|
||||
|
||||
html {
|
||||
font-family: sans-serif; /* 1 */
|
||||
-ms-text-size-adjust: 100%; /* 2 */
|
||||
-webkit-text-size-adjust: 100%; /* 2 */
|
||||
}
|
||||
|
||||
/**
|
||||
* Remove default margin.
|
||||
*/
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
html,
|
||||
body {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
/* HTML5 display definitions
|
||||
========================================================================== */
|
||||
|
||||
/**
|
||||
* Correct `block` display not defined for any HTML5 element in IE 8/9.
|
||||
* Correct `block` display not defined for `details` or `summary` in IE 10/11 and Firefox.
|
||||
* Correct `block` display not defined for `main` in IE 11.
|
||||
*/
|
||||
|
||||
article,
|
||||
aside,
|
||||
details,
|
||||
figcaption,
|
||||
figure,
|
||||
footer,
|
||||
header,
|
||||
hgroup,
|
||||
main,
|
||||
nav,
|
||||
section,
|
||||
summary {
|
||||
display: block;
|
||||
}
|
||||
|
||||
/**
|
||||
* 1. Correct `inline-block` display not defined in IE 8/9.
|
||||
* 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.
|
||||
*/
|
||||
|
||||
audio,
|
||||
canvas,
|
||||
progress,
|
||||
video {
|
||||
display: inline-block; /* 1 */
|
||||
vertical-align: baseline; /* 2 */
|
||||
}
|
||||
|
||||
/**
|
||||
* Prevent modern browsers from displaying `audio` without controls.
|
||||
* Remove excess height in iOS 5 devices.
|
||||
*/
|
||||
|
||||
audio:not([controls]) {
|
||||
display: none;
|
||||
height: 0;
|
||||
}
|
||||
|
||||
/**
|
||||
* Address `[hidden]` styling not present in IE 8/9/10.
|
||||
* Hide the `template` element in IE 8/9/11, Safari, and Firefox < 22.
|
||||
*/
|
||||
|
||||
[hidden],
|
||||
template {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* Links
|
||||
========================================================================== */
|
||||
|
||||
/**
|
||||
* Remove the gray background color from active links in IE 10.
|
||||
*/
|
||||
|
||||
a {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
/**
|
||||
* Improve readability when focused and also mouse hovered in all browsers.
|
||||
*/
|
||||
|
||||
a:active,
|
||||
a:hover {
|
||||
outline: 0;
|
||||
}
|
||||
|
||||
/* Text-level semantics
|
||||
========================================================================== */
|
||||
|
||||
/**
|
||||
* Address styling not present in IE 8/9/10/11, Safari, and Chrome.
|
||||
*/
|
||||
|
||||
abbr[title] {
|
||||
border-bottom: 1px dotted;
|
||||
}
|
||||
|
||||
/**
|
||||
* Address style set to `bolder` in Firefox 4+, Safari, and Chrome.
|
||||
*/
|
||||
|
||||
b,
|
||||
strong {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
/**
|
||||
* Address styling not present in Safari and Chrome.
|
||||
*/
|
||||
|
||||
dfn {
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
/**
|
||||
* Address variable `h1` font-size and margin within `section` and `article`
|
||||
* contexts in Firefox 4+, Safari, and Chrome.
|
||||
*/
|
||||
|
||||
h1 {
|
||||
font-size: 2em;
|
||||
margin: 0.67em 0;
|
||||
}
|
||||
|
||||
/**
|
||||
* Address styling not present in IE 8/9.
|
||||
*/
|
||||
|
||||
mark {
|
||||
background: #ff0;
|
||||
color: #000;
|
||||
}
|
||||
|
||||
/**
|
||||
* Address inconsistent and variable font size in all browsers.
|
||||
*/
|
||||
|
||||
small {
|
||||
font-size: 80%;
|
||||
}
|
||||
|
||||
/**
|
||||
* Prevent `sub` and `sup` affecting `line-height` in all browsers.
|
||||
*/
|
||||
|
||||
sub,
|
||||
sup {
|
||||
font-size: 75%;
|
||||
line-height: 0;
|
||||
position: relative;
|
||||
vertical-align: baseline;
|
||||
}
|
||||
|
||||
sup {
|
||||
top: -0.5em;
|
||||
}
|
||||
|
||||
sub {
|
||||
bottom: -0.25em;
|
||||
}
|
||||
|
||||
/* Embedded content
|
||||
========================================================================== */
|
||||
|
||||
/**
|
||||
* Remove border when inside `a` element in IE 8/9/10.
|
||||
*/
|
||||
|
||||
img {
|
||||
border: 0;
|
||||
}
|
||||
|
||||
|
||||
/* Grouping content
|
||||
========================================================================== */
|
||||
|
||||
/**
|
||||
* Address margin not present in IE 8/9 and Safari.
|
||||
*/
|
||||
|
||||
figure {
|
||||
margin: 1em 40px;
|
||||
}
|
||||
|
||||
/**
|
||||
* Address differences between Firefox and other browsers.
|
||||
*/
|
||||
|
||||
hr {
|
||||
-moz-box-sizing: content-box;
|
||||
box-sizing: content-box;
|
||||
height: 0;
|
||||
}
|
||||
|
||||
/**
|
||||
* Contain overflow in all browsers.
|
||||
*/
|
||||
|
||||
pre {
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
/**
|
||||
* Address odd `em`-unit font size rendering in all browsers.
|
||||
*/
|
||||
|
||||
code,
|
||||
kbd,
|
||||
pre,
|
||||
samp {
|
||||
font-family: monospace, monospace;
|
||||
font-size: 1em;
|
||||
}
|
||||
|
||||
/* Forms
|
||||
========================================================================== */
|
||||
|
||||
/**
|
||||
* Known limitation: by default, Chrome and Safari on OS X allow very limited
|
||||
* styling of `select`, unless a `border` property is set.
|
||||
*/
|
||||
|
||||
/**
|
||||
* 1. Correct color not being inherited.
|
||||
* Known issue: affects color of disabled elements.
|
||||
* 2. Correct font properties not being inherited.
|
||||
* 3. Address margins set differently in Firefox 4+, Safari, and Chrome.
|
||||
*/
|
||||
|
||||
button,
|
||||
input,
|
||||
optgroup,
|
||||
select,
|
||||
textarea {
|
||||
color: inherit; /* 1 */
|
||||
font: inherit; /* 2 */
|
||||
margin: 0; /* 3 */
|
||||
}
|
||||
|
||||
/**
|
||||
* Address `overflow` set to `hidden` in IE 8/9/10/11.
|
||||
*/
|
||||
|
||||
button {
|
||||
overflow: visible;
|
||||
}
|
||||
|
||||
/**
|
||||
* Address inconsistent `text-transform` inheritance for `button` and `select`.
|
||||
* All other form control elements do not inherit `text-transform` values.
|
||||
* Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera.
|
||||
* Correct `select` style inheritance in Firefox.
|
||||
*/
|
||||
|
||||
button,
|
||||
select {
|
||||
text-transform: none;
|
||||
}
|
||||
|
||||
/**
|
||||
* 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
|
||||
* and `video` controls.
|
||||
* 2. Correct inability to style clickable `input` types in iOS.
|
||||
* 3. Improve usability and consistency of cursor style between image-type
|
||||
* `input` and others.
|
||||
*/
|
||||
|
||||
button,
|
||||
html input[type="button"], /* 1 */
|
||||
input[type="reset"],
|
||||
input[type="submit"] {
|
||||
-webkit-appearance: button; /* 2 */
|
||||
cursor: pointer; /* 3 */
|
||||
}
|
||||
|
||||
/**
|
||||
* Re-set default cursor for disabled elements.
|
||||
*/
|
||||
|
||||
button[disabled],
|
||||
html input[disabled] {
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
/**
|
||||
* Remove inner padding and border in Firefox 4+.
|
||||
*/
|
||||
|
||||
button::-moz-focus-inner,
|
||||
input::-moz-focus-inner {
|
||||
border: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
/**
|
||||
* Address Firefox 4+ setting `line-height` on `input` using `!important` in
|
||||
* the UA stylesheet.
|
||||
*/
|
||||
|
||||
input {
|
||||
line-height: normal;
|
||||
}
|
||||
|
||||
/**
|
||||
* It's recommended that you don't attempt to style these elements.
|
||||
* Firefox's implementation doesn't respect box-sizing, padding, or width.
|
||||
*
|
||||
* 1. Address box sizing set to `content-box` in IE 8/9/10.
|
||||
* 2. Remove excess padding in IE 8/9/10.
|
||||
*/
|
||||
|
||||
input[type="checkbox"],
|
||||
input[type="radio"] {
|
||||
box-sizing: border-box; /* 1 */
|
||||
padding: 0; /* 2 */
|
||||
}
|
||||
|
||||
/**
|
||||
* Fix the cursor style for Chrome's increment/decrement buttons. For certain
|
||||
* `font-size` values of the `input`, it causes the cursor style of the
|
||||
* decrement button to change from `default` to `text`.
|
||||
*/
|
||||
|
||||
input[type="number"]::-webkit-inner-spin-button,
|
||||
input[type="number"]::-webkit-outer-spin-button {
|
||||
height: auto;
|
||||
}
|
||||
|
||||
/**
|
||||
* 1. Address `appearance` set to `searchfield` in Safari and Chrome.
|
||||
* 2. Address `box-sizing` set to `border-box` in Safari and Chrome
|
||||
* (include `-moz` to future-proof).
|
||||
*/
|
||||
|
||||
input[type="search"] {
|
||||
-webkit-appearance: textfield; /* 1 */
|
||||
-moz-box-sizing: content-box;
|
||||
-webkit-box-sizing: content-box; /* 2 */
|
||||
box-sizing: content-box;
|
||||
}
|
||||
|
||||
/**
|
||||
* Remove inner padding and search cancel button in Safari and Chrome on OS X.
|
||||
* Safari (but not Chrome) clips the cancel button when the search input has
|
||||
* padding (and `textfield` appearance).
|
||||
*/
|
||||
|
||||
input[type="search"]::-webkit-search-cancel-button,
|
||||
input[type="search"]::-webkit-search-decoration {
|
||||
-webkit-appearance: none;
|
||||
}
|
||||
|
||||
/**
|
||||
* Define consistent border, margin, and padding.
|
||||
*/
|
||||
|
||||
fieldset {
|
||||
border: 1px solid #c0c0c0;
|
||||
margin: 0 2px;
|
||||
padding: 0.35em 0.625em 0.75em;
|
||||
}
|
||||
|
||||
/**
|
||||
* 1. Correct `color` not being inherited in IE 8/9/10/11.
|
||||
* 2. Remove padding so people aren't caught out if they zero out fieldsets.
|
||||
*/
|
||||
|
||||
legend {
|
||||
border: 0; /* 1 */
|
||||
padding: 0; /* 2 */
|
||||
}
|
||||
|
||||
/**
|
||||
* Remove default vertical scrollbar in IE 8/9/10/11.
|
||||
*/
|
||||
|
||||
textarea {
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
/**
|
||||
* Don't inherit the `font-weight` (applied by a rule above).
|
||||
* NOTE: the default cannot safely be changed in Chrome and Safari on OS X.
|
||||
*/
|
||||
|
||||
optgroup {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
/* Tables
|
||||
========================================================================== */
|
||||
|
||||
/**
|
||||
* Remove most spacing between table cells.
|
||||
*/
|
||||
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
border-spacing: 0;
|
||||
}
|
||||
|
||||
td,
|
||||
th {
|
||||
padding: 0;
|
||||
}
|
@ -24,11 +24,14 @@ $url = get_the_permalink();
|
||||
|
||||
?>
|
||||
|
||||
<article <?php post_class(); ?>>
|
||||
<h2><?php echo get_the_category_list(); ?></h2>
|
||||
<?php echo "<h1><a href='{$url}'>{$title}</a></h1>" ?>
|
||||
<article <?php post_class( '', $post_id ); ?>>
|
||||
|
||||
<div class="image">
|
||||
<header>
|
||||
<?php echo get_the_category_list(); ?>
|
||||
<?php echo "<h1 class='entry-title'><a href='{$url}'>{$title}</a></h1>" ?>
|
||||
</header>
|
||||
|
||||
<div class="entry-image">
|
||||
<?php
|
||||
if ( has_post_thumbnail() ) { // check if the post has a Post Thumbnail assigned to it.
|
||||
|
||||
@ -38,17 +41,18 @@ $url = get_the_permalink();
|
||||
}
|
||||
?>
|
||||
</div>
|
||||
<div class="meta">
|
||||
|
||||
<div class="entry-meta">
|
||||
<?php echo get_avatar( get_the_author_email(), 'size here' ); ?>
|
||||
<span class="author">by <?php echo $full_name; ?></span>
|
||||
on <date><?php the_time( get_option( 'date_format' ) ); ?></date>
|
||||
</div>
|
||||
|
||||
<main class="entry">
|
||||
<main class="entry-content">
|
||||
<?php
|
||||
if ( ! is_singular() ) {
|
||||
the_excerpt();
|
||||
echo "<a href='{$url}'>Read More</a>";
|
||||
echo "<a class='button small' href='{$url}'>Read More</a>";
|
||||
} else {
|
||||
the_content();
|
||||
}
|
||||
|
@ -122,15 +122,15 @@ class Subtemplate {
|
||||
$icon = get_sub_field('icon')['url'];
|
||||
$description = get_sub_field('description');
|
||||
|
||||
$featureCircles .= "<article class='feature-circle'>
|
||||
<img src='{$icon}' alt='{$title} Icon'>
|
||||
<h1>{$title}</h1>
|
||||
<div class='description'>{$description}</div>
|
||||
$featureCircles .= "<article class='grid__col feature-circle'>
|
||||
<img class='feature-circle__image' src='{$icon}' alt='{$title} Icon'>
|
||||
<h1 class='feature-circle__title'>{$title}</h1>
|
||||
<div class='feature-circle__description'>{$description}</div>
|
||||
</article>";
|
||||
}
|
||||
}
|
||||
|
||||
$result = "<section class='subtemplate feature-circles'><div class='centered-header'><div class='column-container'>{$featureCircles}</div></div></section>";
|
||||
$result = "<section class='subtemplate feature-circles row'><div class='grid grid--gutters grid--full grid-small--half grid-medium--third'>{$featureCircles}</div></section>";
|
||||
|
||||
return $result;
|
||||
}
|
||||
@ -144,13 +144,13 @@ class Subtemplate {
|
||||
$title = get_sub_field('title');
|
||||
$description = get_sub_field('description');
|
||||
|
||||
$featureCircles .= "<article class='surround-circle'>
|
||||
$featureCircles .= "<article class='grid__col surround-circle'>
|
||||
<div class='circle'>
|
||||
<div class='container'>
|
||||
<div class='wrapper'>
|
||||
<div class='inner'>
|
||||
<h1>{$title}</h1>
|
||||
<div class='description'>{$description}</div>
|
||||
<h1 class='feature-circle__title'>{$title}</h1>
|
||||
<div class='feature-circle__description'>{$description}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -159,7 +159,7 @@ class Subtemplate {
|
||||
}
|
||||
}
|
||||
|
||||
$result = "<section class='subtemplate feature-circles'><div class='centered-header'>{$featureCircles}</div></section>";
|
||||
$result = "<section class='subtemplate feature-circles row'><div class='grid grid--gutters grid--full grid-small--third'>{$featureCircles}</div></section>";
|
||||
|
||||
return $result;
|
||||
}
|
||||
@ -175,14 +175,20 @@ class Subtemplate {
|
||||
$colTitle = get_sub_field('title');
|
||||
$colContent = get_sub_field('content');
|
||||
|
||||
$descriptiveColumns .= "<article class='short-description'>
|
||||
<h1>{$colTitle}</h1>
|
||||
<div class='description'>{$colContent}</div>
|
||||
$descriptiveColumns .= "<article class='grid__col short-description'>
|
||||
<h1 class='short-description__title'>{$colTitle}</h1>
|
||||
<div class='short-description__description'>{$colContent}</div>
|
||||
</article>";
|
||||
}
|
||||
}
|
||||
|
||||
$result = "<section class='subtemplate short-descriptions'><div class='centered-content'><h1>{$subtemplateTitle}</h1><div>{$content}</div><div class='column-container'>{$descriptiveColumns}</div></div></section>";
|
||||
$result = "<section class='subtemplate short-descriptions'>
|
||||
<div class='row'>
|
||||
<h1 class='subtemplate__title'>{$subtemplateTitle}</h1>
|
||||
<div class='subtemplate__description'>{$content}</div>
|
||||
<div class='grid grid--gutters grid--full grid-small--half grid-medium--third'>{$descriptiveColumns}</div>
|
||||
</div>
|
||||
</section>";
|
||||
|
||||
return $result;
|
||||
}
|
||||
@ -247,8 +253,8 @@ class Subtemplate {
|
||||
}
|
||||
|
||||
$result = "<section class='subtemplate old-new'>
|
||||
<div class='centered-content'>
|
||||
<h1>{$subtemplateTitle}</h1>
|
||||
<div class='row'>
|
||||
<h1 class='subtemplate__title'>{$subtemplateTitle}</h1>
|
||||
<table>
|
||||
<thead><tr><th>Old Way</th><th>New Way</th></tr></thead>
|
||||
<tbody>{$oldNewRows}</tbody>
|
||||
@ -266,13 +272,18 @@ class Subtemplate {
|
||||
|
||||
$content = get_sub_field('content');
|
||||
|
||||
$result = "<section class='subtemplate product-overview {$headingSize}'>
|
||||
<div class='centered-prodFeat'>
|
||||
$result = "<section class='subtemplate product-overview'>
|
||||
<div class='row'>
|
||||
<article class='grid grid--gutters grid--full grid-small--half'>
|
||||
<figure class='grid__col grid__col--center'>
|
||||
<img src='{$imageUrl}' alt='{$imageAlt}'>
|
||||
<div class='text-column'>
|
||||
</figure>
|
||||
|
||||
<div class='grid__col grid__col--center text-column'>
|
||||
<h1 class='{$headingSize}'>{$subtemplateTitle}</h1>
|
||||
<div>{$content}</div>
|
||||
</div>
|
||||
</article>
|
||||
</div>
|
||||
</section>";
|
||||
return $result;
|
||||
@ -284,7 +295,7 @@ class Subtemplate {
|
||||
$blueBoxCtaLink = get_sub_field('bluebox_cta_link');
|
||||
|
||||
$result = "<section class='subtemplate blue-box'>
|
||||
<div class='centered-content'>
|
||||
<div class='row row--content'>
|
||||
<article class='blue-copy'>
|
||||
<h1>{$subtemplateTitle}</h1>
|
||||
<div>{$content}</div>
|
||||
@ -326,8 +337,8 @@ class Subtemplate {
|
||||
|
||||
|
||||
$result = "<section class='subtemplate galleries-marketplaces'>
|
||||
<div class='centered-content'>
|
||||
<h1>{$subtemplateTitle}</h1>
|
||||
<div class='row'>
|
||||
<h1 class='subtemplate__title'>{$subtemplateTitle}</h1>
|
||||
<img src='{$galleriesImgUrl}' alt='{$galleriesImgAlt}'>
|
||||
{$galleryMarkup}
|
||||
</div>
|
||||
@ -371,8 +382,8 @@ class Subtemplate {
|
||||
|
||||
if ($page == "home") {
|
||||
$result = "<section class='subtemplate blog-features'>
|
||||
<div class='centered-content'>
|
||||
<h1>{$subtemplateTitle}</h1>
|
||||
<div class='row'>
|
||||
<h1 class='subtemplate__title'>{$subtemplateTitle}</h1>
|
||||
<div class='column-container'>
|
||||
{$blogFeatures}
|
||||
</div>
|
||||
@ -505,8 +516,8 @@ class Subtemplate {
|
||||
$website = "<a href='{$website}' target='_blank' class='twitter'>{$webIcon}</a>";
|
||||
}
|
||||
|
||||
$teamMemberMarkup .= "<article class='team-member'>
|
||||
<img src='{$image}' alt='Picture of {$name}' data-hover='{$hoverimage}' data-regular='{$image}'>
|
||||
$teamMemberMarkup .= "<article class='grid__col team-member'>
|
||||
<img class='team-member__image' src='{$image}' alt='Picture of {$name}' data-hover='{$hoverimage}' data-regular='{$image}'>
|
||||
<h1>{$name}</h1>
|
||||
<h2>{$role}</h2>
|
||||
{$facebook}
|
||||
@ -518,11 +529,11 @@ class Subtemplate {
|
||||
}
|
||||
}
|
||||
|
||||
$result = "<section class='subtemplate team tour-page'>
|
||||
<div class='centered-content'>
|
||||
<h1>{$subtemplateTitle}</h1>
|
||||
$result = "<section class='subtemplate team tour-page content'>
|
||||
<div class='row row--content'>
|
||||
<h1 class='subtemplate__title'>{$subtemplateTitle}</h1>
|
||||
<div class='intro'>{$content}</div>
|
||||
<div class='column-container'>{$teamMemberMarkup}</div>
|
||||
<div class='grid grid--gutters grid--full grid-small--half grid-medium--third'>{$teamMemberMarkup}</div>
|
||||
<a href='{$meetTeamLink}' class='button white-blue'>Meet the Team</a>
|
||||
</div>
|
||||
</section>";
|
||||
@ -574,8 +585,8 @@ class Subtemplate {
|
||||
$website = "<a href='{$website}' target='_blank' class='twitter'><img src='{$themeUrl}images/svg/website.svg' alt='Website' class='social-icon'></a>";
|
||||
}
|
||||
|
||||
$teamMemberMarkup .= "<article class='team-member'>
|
||||
<img src='{$image}' alt='Picture of {$name}'>
|
||||
$teamMemberMarkup .= "<article class='grid__col team-member'>
|
||||
<img class='team-member__image' src='{$image}' alt='Picture of {$name}'>
|
||||
<h1>{$name}</h1>
|
||||
<h2>{$role}</h2>
|
||||
{$facebook}
|
||||
@ -588,12 +599,10 @@ class Subtemplate {
|
||||
}
|
||||
|
||||
$result = "<section class='subtemplate team'>
|
||||
<div class='centered-content-padding'>
|
||||
<div class='centered-content'>
|
||||
<h1>{$subtemplateTitle}</h1>
|
||||
<div class='row row--content'>
|
||||
<h1 class='subtemplate__title'>{$subtemplateTitle}</h1>
|
||||
<div class='intro'>{$content}</div>
|
||||
<div class='column-container'>{$teamMemberMarkup}</div>
|
||||
</div>
|
||||
<div class='grid grid--gutters grid--full grid-small--half grid-medium--third'>{$teamMemberMarkup}</div>
|
||||
</div>
|
||||
</section>";
|
||||
|
||||
@ -606,12 +615,10 @@ class Subtemplate {
|
||||
$bgColor = get_sub_field('background_color');
|
||||
|
||||
$result = "<section class='subtemplate content {$bgColor}'>
|
||||
<div class='centered-content-padding'>
|
||||
<div class='centered-content'>
|
||||
<h1>{$subtemplateTitle}</h1>
|
||||
<div class='row row--content'>
|
||||
<h1 class='subtemplate__title'>{$subtemplateTitle}</h1>
|
||||
<div>{$content}</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>";
|
||||
|
||||
return $result;
|
||||
@ -621,12 +628,10 @@ class Subtemplate {
|
||||
$content = get_sub_field('content');
|
||||
|
||||
$result = "<section class='subtemplate content-boxed'>
|
||||
<div class='centered-content-padding'>
|
||||
<div class='centered-content'>
|
||||
<h1>{$subtemplateTitle}</h1>
|
||||
<div class='row row--content'>
|
||||
<h1 class='subtemplate__title'>{$subtemplateTitle}</h1>
|
||||
<div>{$content}</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>";
|
||||
|
||||
return $result;
|
||||
@ -637,12 +642,10 @@ class Subtemplate {
|
||||
$imageAlt = get_sub_field('image')['alt'];
|
||||
|
||||
$result = "<section class='subtemplate image'>
|
||||
<div class='centered-content-padding'>
|
||||
<div class='centered-content'>
|
||||
<h1>{$subtemplateTitle}</h1>
|
||||
<div class='row'>
|
||||
<h1 class='subtemplate__title'>{$subtemplateTitle}</h1>
|
||||
<div><img src='{$image}' alt='{$imageAlt}'></div>
|
||||
</div>
|
||||
</div>
|
||||
</section>";
|
||||
|
||||
return $result;
|
||||
@ -676,14 +679,12 @@ class Subtemplate {
|
||||
}
|
||||
$regularFAQ .= "</dl>";
|
||||
|
||||
$result = "<section class='subtemplate faq'>
|
||||
<div class='centered-content-padding'>
|
||||
<div class='centered-content'>
|
||||
$result = "<section class='subtemplate content faq'>
|
||||
<div class='row'>
|
||||
<h1>{$subtemplateTitle}</h1>
|
||||
{$featuredFAQ}
|
||||
{$regularFAQ}
|
||||
</div>
|
||||
</div>
|
||||
</section>";
|
||||
|
||||
return $result;
|
||||
@ -697,17 +698,17 @@ class Subtemplate {
|
||||
$title = get_sub_field('value_title');
|
||||
$description = get_sub_field('value_description');
|
||||
|
||||
$values .= "<article class='value'>
|
||||
$values .= "<article class='grid__col value'>
|
||||
<h1>{$title}</h1>
|
||||
<div class='description'>{$description}</div>
|
||||
</article>";
|
||||
}
|
||||
}
|
||||
|
||||
$result = "<section class='subtemplate values'><div class='centered-content-padding'><div class='centered-content'>
|
||||
<h1>{$subtemplateTitle}</h1>
|
||||
<div class='column-container'>{$values}</div>
|
||||
</div></div></section>";
|
||||
$result = "<section class='subtemplate values'><div class='row'>
|
||||
<h1 class='subtemplate__title'>{$subtemplateTitle}</h1>
|
||||
<main><div class='grid grid--gutters grid--full grid-small--half'>{$values}</div></main>
|
||||
</div></section>";
|
||||
|
||||
return $result;
|
||||
}
|
||||
@ -730,8 +731,8 @@ class Subtemplate {
|
||||
}
|
||||
|
||||
$result = "<section class='subtemplate careers'>
|
||||
<div class='centered-content'>
|
||||
<h1>{$subtemplateTitle}</h1>
|
||||
<div class='row'>
|
||||
<h1 class='subtemplate__title'>{$subtemplateTitle}</h1>
|
||||
<ul>{$careerMarkup}</ul>
|
||||
</div>
|
||||
</section>";
|
||||
@ -768,15 +769,11 @@ class Subtemplate {
|
||||
}
|
||||
}
|
||||
|
||||
$result = "<section class='subtemplate press-articles'>
|
||||
<div class='centered-content-padding'>
|
||||
<div class='centered-content'>
|
||||
<h1>{$subtemplateTitle}</h1>
|
||||
$result = "<section class='subtemplate press-articles row'>
|
||||
<h1 class='subtemplate__title'>{$subtemplateTitle}</h1>
|
||||
<img src='{$image}' alt='Media Companies'>
|
||||
<div>{$pressMarkup}</div>
|
||||
<!--<a href='#' id='more-articles' class='button blue'>Show More</a>-->
|
||||
</div>
|
||||
</div>
|
||||
</section>";
|
||||
|
||||
return $result;
|
||||
@ -785,12 +782,8 @@ class Subtemplate {
|
||||
$buttonUrl = get_sub_field('button_url');
|
||||
$buttonText = get_sub_field('button_text');
|
||||
|
||||
$result = "<section class='subtemplate downloads'>
|
||||
<div class='centered-content-padding'>
|
||||
<div class='centered-content'>
|
||||
$result = "<section class='subtemplate downloads row'>
|
||||
<a href='{$buttonUrl}' download class='button blue'>{$buttonText}</a>
|
||||
</div>
|
||||
</div>
|
||||
</section>";
|
||||
|
||||
return $result;
|
||||
@ -815,13 +808,12 @@ class Subtemplate {
|
||||
}
|
||||
|
||||
$result = "<section class='subtemplate contact'>
|
||||
<div class='centered-content-padding'>
|
||||
<div class='centered-content'>
|
||||
<h1>{$subtemplateTitle}</h1>
|
||||
<div class='column-container'>
|
||||
<div class='form'>{$content}</div>
|
||||
<aside class='contact-points'>{$contactPoints}</aside>
|
||||
</div>
|
||||
<div class='row row--content'>
|
||||
<h1 class='subtemplate__title'>{$subtemplateTitle}</h1>
|
||||
|
||||
<div class='grid grid--gutters grid--fit grid-small--half'>
|
||||
<div class='grid__col form'>{$content}</div>
|
||||
<aside class='grid__col contact-points'>{$contactPoints}</aside>
|
||||
</div>
|
||||
</div>
|
||||
</section>";
|
||||
@ -918,15 +910,13 @@ class Subtemplate {
|
||||
$sidebar = $this->eventSidebar();
|
||||
|
||||
$result = "<section class='subtemplate upcoming-events'>
|
||||
<div class='centered-content-padding'>
|
||||
<div class='centered-content'>
|
||||
<div class='row'>
|
||||
<div class='event-container'>
|
||||
<h1>Events</h1>
|
||||
<div>{$eventMarkup}</div>
|
||||
</div>
|
||||
{$sidebar}
|
||||
</div>
|
||||
</div>
|
||||
</section>";
|
||||
|
||||
return $result;
|
||||
@ -941,11 +931,11 @@ class Subtemplate {
|
||||
$new = get_sub_field('new_marketplace_content');
|
||||
|
||||
$result = "<section class='subtemplate existing-new'>
|
||||
<div class='centered-content'>
|
||||
<h1>{$subtemplateTitle}</h1>
|
||||
<div class='column-container'>
|
||||
<div data-tab='existing' class='top-tab active'><div>Existing Marketplace</div></div>
|
||||
<div data-tab='new' class='top-tab'><div>New Marketplace</div></div>
|
||||
<div class='row'>
|
||||
<h1 class='subtemplate__title'>{$subtemplateTitle}</h1>
|
||||
<div class='grid grid--full grid-small--half'>
|
||||
<div data-tab='existing' class='grid__col top-tab active'><div>Existing Marketplace</div></div>
|
||||
<div data-tab='new' class='grid__col top-tab'><div>New Marketplace</div></div>
|
||||
</div>
|
||||
<div id='existing' class='content marketplace-info active'><h1 class='phone-only'>Existing Marketplace</h1>{$existing}</div>
|
||||
<div id='new' class='content marketplace-info'><h1 class='phone-only'>New Marketplace</h1>{$new}</div>
|
||||
@ -963,16 +953,17 @@ class Subtemplate {
|
||||
$whiteText = get_sub_field('white_label_text');
|
||||
|
||||
$result = "<section class='subtemplate get-started'>
|
||||
<div class='centered-content'>
|
||||
<h1>{$subtemplateTitle}</h1>
|
||||
<div class='description'>{$content}</div>
|
||||
<div class='column-container'>
|
||||
<div class='api methods-of-use'>
|
||||
<div class='row'>
|
||||
<h1 class='subtemplate__title'>{$subtemplateTitle}</h1>
|
||||
<div class='subtemplate__description'>{$content}</div>
|
||||
|
||||
<div class='grid grid--gutters grid--full grid-small--half'>
|
||||
<div class='grid__col api methods-of-use'>
|
||||
<h1>API</h1>
|
||||
<img src='{$apiImg}' alt='API'>
|
||||
{$apiText}
|
||||
</div>
|
||||
<div class='white-label methods-of-use'>
|
||||
<div class='grid__col white-label methods-of-use'>
|
||||
<h1>White Label Marketplace</h1>
|
||||
<img src='{$whiteImg}' alt='White Label Marketplace'>
|
||||
{$whiteText}
|
||||
@ -1081,26 +1072,22 @@ class Subtemplate {
|
||||
$sidebar = $this->eventSidebar();
|
||||
|
||||
$result = "<section class='subtemplate upcoming-events'>
|
||||
<div class='centered-content-padding'>
|
||||
<div class='centered-content'>
|
||||
<div class='row'>
|
||||
<div class='event-container'>
|
||||
<h1>Upcoming Events</h1>
|
||||
<div>{$futureMarkup}</div>
|
||||
</div>
|
||||
{$sidebar}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<div class='chevron-divider'></div>
|
||||
<section class='subtemplate past-events'>
|
||||
<div class='centered-content-padding'>
|
||||
<div class='centered-content'>
|
||||
<div class='row'>
|
||||
<div class='event-container'>
|
||||
<h1>Past Events</h1>
|
||||
<div>{$pastMarkup}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>";
|
||||
|
||||
return $result;
|
||||
|
53
footer.php
@ -5,10 +5,13 @@
|
||||
* @package ascribe
|
||||
* @since 0.1.0
|
||||
*/
|
||||
|
||||
$year = date("Y");
|
||||
$address = get_field('address', 'option');
|
||||
$email = get_field('email', 'option');
|
||||
$consultLink = get_field('request_consultation_link', 'option');
|
||||
$euLink = get_field('eu_logo_link', 'option');
|
||||
$footerContactButton = get_field('footer_contact_button', 'option');
|
||||
|
||||
$themeUrl = WPTHEME_TEMPLATE_URL . '/';
|
||||
|
||||
@ -160,24 +163,50 @@ if ($twitter) {
|
||||
|
||||
|
||||
?>
|
||||
|
||||
|
||||
<div class="chevron-divider"></div>
|
||||
<footer>
|
||||
<section class="top-footer">
|
||||
<div class="centered-footer">
|
||||
|
||||
|
||||
<footer class="footer">
|
||||
|
||||
<section class="footer__top">
|
||||
<div class="row">
|
||||
|
||||
|
||||
<?php wp_nav_menu( array( 'theme_location' => 'main-footer-menu', 'container' => false ) ); ?>
|
||||
<div class="contact">
|
||||
<a href="<?php echo $consultLink; ?>" class="button small">Request information</a>
|
||||
|
||||
<div class="footer__contact">
|
||||
|
||||
<?php if ($footerContactButton) { ?>
|
||||
<a href="<?php echo $consultLink; ?>" class="button small"><?php echo $footerContactButton ?></a>
|
||||
<?php } ?>
|
||||
|
||||
<div><?php echo $address; ?></div>
|
||||
<div><a href="mailto:<?php echo $email; ?>"><?php echo $email; ?></a></div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</section>
|
||||
<section class="bottom-footer">
|
||||
<div class="centered-footer">
|
||||
<div class="eu-fund"><img src="https://www.ascribe.io/wp-content/uploads/2015/11/eu-dev-fund.png" /></div>
|
||||
<div class="copyright"><?php echo $year; ?> © ascribe GmbH</div>
|
||||
|
||||
<section class="footer__bottom">
|
||||
<div class="row">
|
||||
|
||||
<div class="footer__eu">
|
||||
<?php if ($euLink) { ?>
|
||||
<a href="<?php echo $euLink ?>">
|
||||
<img width="150" src="https://www.ascribe.io/wp-content/uploads/2015/11/eu-dev-fund.png" />
|
||||
</a>
|
||||
<?php } else { ?>
|
||||
<img width="150" src="https://www.ascribe.io/wp-content/uploads/2015/11/eu-dev-fund.png" />
|
||||
<?php } ?>
|
||||
</div>
|
||||
|
||||
<div class="footer__copyright">© <?php echo $year; ?> ascribe GmbH</div>
|
||||
|
||||
<?php wp_nav_menu( array( 'theme_location' => 'lower-footer-menu', 'container' => false ) ); ?>
|
||||
<ul class="social">
|
||||
|
||||
<ul class="footer__social">
|
||||
<?php echo $facebook; ?>
|
||||
<?php echo $github; ?>
|
||||
<?php echo $instagram; ?>
|
||||
@ -187,9 +216,13 @@ if ($twitter) {
|
||||
<?php echo $tumblr; ?>
|
||||
<?php echo $twitter; ?>
|
||||
</ul>
|
||||
|
||||
</div>
|
||||
</section>
|
||||
|
||||
</footer>
|
||||
|
||||
|
||||
</div>
|
||||
<?php wp_footer(); ?>
|
||||
</body>
|
||||
|
22
gulpfile.js
@ -67,16 +67,14 @@ var PROXY = 'http://localhost:8888'
|
||||
// Styles
|
||||
//
|
||||
gulp.task('css', function() {
|
||||
return gulp.src(SRC + 'assets/less/ascribe.less')
|
||||
.pipe($.sourcemaps.init())
|
||||
return gulp.src(SRC + 'assets/_src/less/ascribe.less')
|
||||
.pipe($.less()).on('error', onError)
|
||||
.pipe($.autoprefixer({ browsers: COMPATIBILITY }))
|
||||
.pipe($.cssmin())
|
||||
.pipe($.sourcemaps.write())
|
||||
.pipe($.header(BANNER, { pkg: pkg }))
|
||||
.pipe(gulp.dest(DIST + 'assets/css/'))
|
||||
.pipe(gulp.dest(DIST + 'assets/dist/css/'))
|
||||
.pipe($.rename({ suffix: '.min' }))
|
||||
.pipe(gulp.dest(DIST + 'assets/css/'))
|
||||
.pipe(gulp.dest(DIST + 'assets/dist/css/'))
|
||||
.pipe(browser.stream());
|
||||
});
|
||||
|
||||
@ -85,15 +83,13 @@ gulp.task('css', function() {
|
||||
// JavaScript
|
||||
//
|
||||
gulp.task('js', function() {
|
||||
return gulp.src(SRC + 'assets/js/src/ascribe.js')
|
||||
.pipe($.sourcemaps.init())
|
||||
return gulp.src(SRC + 'assets/_src/js/ascribe.js')
|
||||
.pipe($.include())
|
||||
.pipe($.uglify()).on('error', onError)
|
||||
.pipe($.sourcemaps.write())
|
||||
.pipe($.header(BANNER, { pkg: pkg }))
|
||||
.pipe(gulp.dest(DIST + 'assets/js/'))
|
||||
.pipe(gulp.dest(DIST + 'assets/dist/js/'))
|
||||
.pipe($.rename({suffix: '.min'}))
|
||||
.pipe(gulp.dest(DIST + 'assets/js/'));
|
||||
.pipe(gulp.dest(DIST + 'assets/dist/js/'));
|
||||
});
|
||||
|
||||
|
||||
@ -104,9 +100,9 @@ gulp.task('serve', function() {
|
||||
browser.init({
|
||||
proxy: PROXY
|
||||
});
|
||||
gulp.watch([SRC + 'assets/less/**/*'], ['css']);
|
||||
gulp.watch([SRC + 'assets/js/src/**/*'], ['js']);
|
||||
gulp.watch(SRC + '**/*').on('change', browser.reload);
|
||||
gulp.watch([SRC + 'assets/_src/less/**/*'], ['css']);
|
||||
gulp.watch([SRC + 'assets/_src/js/**/*'], ['js']);
|
||||
gulp.watch(SRC + '**/*.{php,svg,png,jpg,gif}').on('change', browser.reload);
|
||||
});
|
||||
|
||||
|
||||
|
28
header.php
@ -20,12 +20,9 @@ if ( is_category() || is_tag() ) {
|
||||
}
|
||||
|
||||
?>
|
||||
|
||||
<!doctype html>
|
||||
<!--[if lt IE 7]> <html class="no-js ie6 oldie" lang="en" itemscope itemtype="https://schema.org/Organization"> <![endif]-->
|
||||
<!--[if IE 7]> <html class="no-js ie7 oldie" lang="en" itemscope itemtype="https://schema.org/Organization"> <![endif]-->
|
||||
<!--[if IE 8]> <html class="no-js ie8 oldie" lang="en" itemscope itemtype="https://schema.org/Organization"> <![endif]-->
|
||||
<!--[if gt IE 8]><!-->
|
||||
<html class="no-js " lang="en" itemscope itemtype="https://schema.org/Organization" xmlns="http://www.w3.org/1999/html"> <!--<![endif]-->
|
||||
<html class="no-js " lang="en" itemscope itemtype="https://schema.org/Organization" xmlns="http://www.w3.org/1999/html">
|
||||
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
@ -52,14 +49,6 @@ if ( is_category() || is_tag() ) {
|
||||
<meta itemprop="description" content="<?php echo $description ?>">
|
||||
<meta itemprop="image" content="<?php echo $shareimage; ?>">
|
||||
|
||||
<link rel="apple-touch-icon" sizes="57x57" href="<?php echo WPTHEME_TEMPLATE_URL; ?>/images/ico/apple-touch-icon-57x57.png">
|
||||
<link rel="apple-touch-icon" sizes="60x60" href="<?php echo WPTHEME_TEMPLATE_URL; ?>/images/ico/apple-touch-icon-60x60.png">
|
||||
<link rel="apple-touch-icon" sizes="72x72" href="<?php echo WPTHEME_TEMPLATE_URL; ?>/images/ico/apple-touch-icon-72x72.png">
|
||||
<link rel="apple-touch-icon" sizes="76x76" href="<?php echo WPTHEME_TEMPLATE_URL; ?>/images/ico/apple-touch-icon-76x76.png">
|
||||
<link rel="apple-touch-icon" sizes="114x114" href="<?php echo WPTHEME_TEMPLATE_URL; ?>/images/ico/apple-touch-icon-114x114.png">
|
||||
<link rel="apple-touch-icon" sizes="120x120" href="<?php echo WPTHEME_TEMPLATE_URL; ?>/images/ico/apple-touch-icon-120x120.png">
|
||||
<link rel="apple-touch-icon" sizes="144x144" href="<?php echo WPTHEME_TEMPLATE_URL; ?>/images/ico/apple-touch-icon-144x144.png">
|
||||
<link rel="apple-touch-icon" sizes="152x152" href="<?php echo WPTHEME_TEMPLATE_URL; ?>/images/ico/apple-touch-icon-152x152.png">
|
||||
<link rel="apple-touch-icon" sizes="180x180" href="<?php echo WPTHEME_TEMPLATE_URL; ?>/images/ico/apple-touch-icon-180x180.png">
|
||||
<link rel="icon" type="image/png" href="<?php echo WPTHEME_TEMPLATE_URL; ?>/images/ico/favicon-32x32.png" sizes="32x32">
|
||||
<link rel="icon" type="image/png" href="<?php echo WPTHEME_TEMPLATE_URL; ?>/images/ico/favicon-194x194.png" sizes="194x194">
|
||||
@ -72,9 +61,16 @@ if ( is_category() || is_tag() ) {
|
||||
<meta name="msapplication-config" content="<?php echo WPTHEME_TEMPLATE_URL; ?>/images/ico/browserconfig.xml">
|
||||
<meta name="theme-color" content="#ffffff">
|
||||
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/modernizr/2.8.3/modernizr.min.js"></script>
|
||||
<script src="https://use.typekit.net/gma2yhj.js"></script>
|
||||
<script>try{Typekit.load({ async: true });}catch(e){}</script>
|
||||
<!-- Typekit -->
|
||||
<script>
|
||||
(function(d) {
|
||||
var config = {
|
||||
kitId: 'gma2yhj',
|
||||
scriptTimeout: 3000
|
||||
},
|
||||
h=d.documentElement,t=setTimeout(function(){h.className=h.className.replace(/\bwf-loading\b/g,"")+" wf-inactive";},config.scriptTimeout),tk=d.createElement("script"),f=false,s=d.getElementsByTagName("script")[0],a;h.className+=" wf-loading";tk.src='//use.typekit.net/'+config.kitId+'.js';tk.async=true;tk.onload=tk.onreadystatechange=function(){a=this.readyState;if(f||a&&a!="complete"&&a!="loaded")return;f=true;clearTimeout(t);try{Typekit.load(config)}catch(e){}};s.parentNode.insertBefore(tk,s)
|
||||
})(document);
|
||||
</script>
|
||||
|
||||
<script>
|
||||
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
|
||||
|
17
home.php
@ -1,9 +1,9 @@
|
||||
<?php
|
||||
get_header();
|
||||
get_template_part( 'template', 'blogheader' );
|
||||
echo '<div class="centered-content-padding">';
|
||||
echo '<div class="column-container">';
|
||||
echo '<div class="blog-column">';
|
||||
|
||||
echo '<div class="blog-column row row--content">';
|
||||
|
||||
if ( have_posts() ) {
|
||||
while ( have_posts() ) {
|
||||
the_post();
|
||||
@ -16,13 +16,14 @@ else {
|
||||
get_template_part( 'content', 'noposts' );
|
||||
}
|
||||
?>
|
||||
<div class="nav-previous alignleft"><?php next_posts_link( 'Older posts' ); ?></div>
|
||||
<div class="nav-next alignright"><?php previous_posts_link( 'Newer posts' ); ?></div>
|
||||
|
||||
<nav class="pagination grid grid--gutters grid--half">
|
||||
<div class="grid__col pagination__previous"><?php next_posts_link( 'Older posts' ); ?></div>
|
||||
<div class="grid__col pagination__next"><?php previous_posts_link( 'Newer posts' ); ?></div>
|
||||
</nav>
|
||||
|
||||
<?php
|
||||
echo '</div>';
|
||||
//get_sidebar('blog');
|
||||
|
||||
echo '</div>';
|
||||
echo '</div>';
|
||||
get_footer();
|
||||
?>
|
||||
|
Before Width: | Height: | Size: 2.2 KiB |
Before Width: | Height: | Size: 2.4 KiB |
Before Width: | Height: | Size: 2.9 KiB |
Before Width: | Height: | Size: 3.1 KiB |
Before Width: | Height: | Size: 1.2 KiB |
Before Width: | Height: | Size: 1.2 KiB |
Before Width: | Height: | Size: 1.4 KiB |
Before Width: | Height: | Size: 1.5 KiB |
@ -16,7 +16,6 @@ function setup() {
|
||||
};
|
||||
|
||||
add_action( 'wp_enqueue_scripts', $n( 'scripts' ) );
|
||||
|
||||
add_action( 'wp_enqueue_scripts', $n( 'styles' ) );
|
||||
|
||||
}
|
||||
@ -32,27 +31,19 @@ function setup() {
|
||||
*/
|
||||
function scripts( $debug = false ) {
|
||||
|
||||
if (!is_admin()) {
|
||||
wp_deregister_script('jquery');
|
||||
wp_register_script('jquery', ("https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"), false, '1.3.2',true);
|
||||
wp_register_script('jquery', 'https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js', false, '2.2.0', true);
|
||||
wp_enqueue_script('jquery');
|
||||
}
|
||||
|
||||
wp_enqueue_script(
|
||||
'wptheme',
|
||||
WPTHEME_TEMPLATE_URL . "/assets/js/ascribe.min.js",
|
||||
array(),
|
||||
WPTHEME_TEMPLATE_URL . "/assets/dist/js/ascribe.min.js",
|
||||
array('jquery'),
|
||||
WPTHEME_VERSION,
|
||||
true
|
||||
);
|
||||
|
||||
wp_enqueue_script(
|
||||
'modernizr',
|
||||
"https://cdnjs.cloudflare.com/ajax/libs/modernizr/2.8.3/modernizr.min.js",
|
||||
array(),
|
||||
'2.8.3',
|
||||
false
|
||||
);
|
||||
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
@ -69,7 +60,7 @@ function styles( $debug = false ) {
|
||||
|
||||
wp_enqueue_style(
|
||||
'wptheme',
|
||||
WPTHEME_URL . "/assets/css/ascribe{$min}.css",
|
||||
WPTHEME_URL . "/assets/dist/css/ascribe{$min}.css",
|
||||
array(),
|
||||
WPTHEME_VERSION
|
||||
);
|
||||
|
@ -15,8 +15,6 @@
|
||||
"url": "http://territorial.ca"
|
||||
},
|
||||
"dependencies": {
|
||||
"bootstrap": "^3.3.6",
|
||||
"jquery": ">=2.1.4",
|
||||
"normalize-css": ">=2.3.1",
|
||||
"normalize-opentype.css": ">=0.2.4"
|
||||
},
|
||||
@ -33,7 +31,6 @@
|
||||
"gulp-less": "^3.0.5",
|
||||
"gulp-load-plugins": ">=0.10.0",
|
||||
"gulp-rename": ">=1.2.2",
|
||||
"gulp-sourcemaps": ">=1.6.0",
|
||||
"gulp-uglify": ">=1.2.0",
|
||||
"gulp-util": ">=3.0.6",
|
||||
"qunitjs": "~1.18.0"
|
||||
|
@ -1,7 +1,9 @@
|
||||
<?php
|
||||
get_header();
|
||||
get_template_part( 'template', 'blogheader' );
|
||||
echo '<div class="centered-content-padding">';
|
||||
|
||||
echo '<div class="blog-column row row--content">';
|
||||
|
||||
if ( have_posts() ) {
|
||||
while ( have_posts() ) {
|
||||
the_post();
|
||||
@ -15,5 +17,6 @@ else {
|
||||
}
|
||||
|
||||
echo '</div>';
|
||||
|
||||
get_footer();
|
||||
?>
|
||||
|
@ -9,8 +9,8 @@
|
||||
require 'controller/init.php';
|
||||
|
||||
?>
|
||||
<header class="blog">
|
||||
<div class="centered-header">
|
||||
<header class="header">
|
||||
<div class="row">
|
||||
<a href="<?php echo get_bloginfo('wpurl');?>"><img src="<?php echo WPTHEME_TEMPLATE_URL; ?>/images/logo/logo-white.png" class="logo phone-and-up"></a>
|
||||
<a href="<?php echo get_bloginfo('wpurl');?>"><img src="<?php echo WPTHEME_TEMPLATE_URL; ?>/images/logo/ascribeicon-white.svg" class="logo phone-only"></a>
|
||||
<div class="app-links">
|
||||
@ -25,15 +25,12 @@ require 'controller/init.php';
|
||||
<div class="mobile-nav">
|
||||
<?php wp_nav_menu( array( 'theme_location' => 'main-footer-menu', 'container' => false ) ); ?>
|
||||
</div>
|
||||
</div>
|
||||
<div class="centered-header">
|
||||
|
||||
</div>
|
||||
<div class="chevron-divider"></div>
|
||||
<h1><a href="/blog">ascribe blog</a></h1>
|
||||
</header>
|
||||
<nav class="blog-categories">
|
||||
<div class="centered-categories">
|
||||
<div class="row">
|
||||
<ul>
|
||||
<?php
|
||||
$args = array(
|
||||
|
@ -8,9 +8,10 @@
|
||||
|
||||
require 'controller/init.php';
|
||||
?>
|
||||
<header>
|
||||
|
||||
<header class="header">
|
||||
<div class="sticky">
|
||||
<div class="centered-header">
|
||||
<div class="row">
|
||||
<a href="<?php echo get_bloginfo('wpurl');?>"><img src="<?php echo WPTHEME_TEMPLATE_URL; ?>/images/logo/logo-black.png" class="logo phone-and-up"></a>
|
||||
<a href="<?php echo get_bloginfo('wpurl');?>"><img src="<?php echo WPTHEME_TEMPLATE_URL; ?>/images/logo/ascribeicon-black.svg" class="logo phone-only"></a>
|
||||
<div class="app-links">
|
||||
@ -26,7 +27,7 @@ require 'controller/init.php';
|
||||
</nav>
|
||||
</div>
|
||||
</div>
|
||||
<div class="centered-header">
|
||||
<div class="row">
|
||||
<div class="mobile-nav">
|
||||
<?php wp_nav_menu( array( 'theme_location' => 'main-footer-menu', 'container' => false ) ); ?>
|
||||
</div>
|
||||
|
@ -13,10 +13,9 @@ $buttonColour = get_field('header_button_colour');
|
||||
$controller = new Controller();
|
||||
?>
|
||||
|
||||
<header style="background-image:url(<?php echo $bgImage; ?>)">
|
||||
<header class="hero" style="background-image:url(<?php echo $bgImage; ?>)">
|
||||
<div class="sticky">
|
||||
<div class="centered-header">
|
||||
|
||||
<div class="row">
|
||||
<a href="<?php echo get_bloginfo('wpurl');?>"><img src="<?php echo WPTHEME_TEMPLATE_URL; ?>/images/logo/logo-white.png" class="logo phone-and-up"></a>
|
||||
<a href="<?php echo get_bloginfo('wpurl');?>"><img src="<?php echo WPTHEME_TEMPLATE_URL; ?>/images/logo/ascribeicon-white.svg" class="logo phone-only"></a>
|
||||
<div class="app-links">
|
||||
@ -30,7 +29,7 @@ $controller = new Controller();
|
||||
</nav>
|
||||
</div>
|
||||
</div>
|
||||
<div class="centered-header">
|
||||
<div class="row">
|
||||
<section class="description">
|
||||
<h1><?php echo $headerTagline; ?></h1>
|
||||
<a href="<?php echo $signUpLink; ?>" class="button <?php echo $buttonColour; ?>-overPic"><?php echo $buttonText; ?></a>
|
||||
|