Move base stuff into elements and align green bar with logo

This commit is contained in:
benjamin melançon 2019-08-01 07:54:34 -04:00
parent 7b37c7e3f9
commit cf59b4c18e
2 changed files with 44 additions and 64 deletions

View file

@ -13,6 +13,13 @@
font-family: $family-geo;
}
// Prevent images from being larger than their Drupal-set size
.image.no-upscale img {
width: intrinsic; /* Safari/WebKit uses a non-standard name */
width: -moz-max-content; /* Firefox/Gecko */
width: -webkit-max-content; /* Chrome */
}
// Give us some color classes
.green {
color: $green;
@ -22,48 +29,5 @@
color: $yellow;
}
.geo-title {
display: block;
width: 6em;
position: relative;
bottom: 3.6rem;
overflow: visible;
height: 1rem;
}
// $navbar-item-img-max-height: 3rem;
.block-geofresco-branding {
margin-bottom: 0;
}
// Prevent images from being larger than their Drupal-set size
.image.no-upscale img {
width: intrinsic; /* Safari/WebKit uses a non-standard name */
width: -moz-max-content; /* Firefox/Gecko */
width: -webkit-max-content; /* Chrome */
}
// Add a gradient across only a portion of the vertical width of the navbar.
.navbar {
background: linear-gradient(
$body-background-color,
$body-background-color 20px,
$light-green 20px,
$green 40px,
$green 60px,
$body-background-color 60px,
$body-background-color
);
}
// Style the wordmark (logo)
.navbar-item .wordmark {
max-height: 3rem; // 4rem
}
$navbar-item-img-max-height: 3rem;
.navbar-item .wordmark img {
height: 100%;
width: auto;
}

View file

@ -1,27 +1,43 @@
@charset "UTF-8";
// Extend or override Bulma's elements ../../node_modules/bulma/sass/elements
// Style the slogan shown at the top of each page
/*
.slogan.title {
color: $red;
font-style: italic;
font-weight: normal;
.geo-title {
display: inline-block;
margin-top: 0.8rem; // 1.2rem
margin-left: 0.6rem; // 0.8rem
width: 6em;
}
.hero.is-primary .family-home-branding__front {
padding: .5rem .75rem;
background-color: white;
.column {
display: flex;
justify-content: center;
}
.slogan.title {
margin-top: 0;
color: $red;
}
.user-account-menu li {
display: inline-block;
padding: .1rem .6rem;
float: right;
}
.search-bar form {
float: right;
}
#block-geofresco-branding {
figure {
display: inline-block;
}
margin-bottom: 0;
}
.navbar-brand {
position: relative;
top: -36px;
}
// Add a gradient across only a portion of the vertical width of the navbar.
.navbar {
background: linear-gradient(
$body-background-color,
$body-background-color 38px,
$light-green 38px,
$green 60px,
$green 84px,
$body-background-color 84px,
$body-background-color
);
}
*/