geo-coop/web/themes/custom/geofresco/src/global/_elements.scss

72 lines
1.6 KiB
SCSS

@charset "UTF-8";
/* Extend or override Bulma's elements ../../node_modules/bulma/sass/elements */
.site-title {
display: inline-block;
width: 4.6em;
word-break: keep-all; /* Shouldn't be needed but Chrome needs it. */
font-size: 37px;
line-height: 38px;
}
.user-account-menu li {
display: inline-block;
padding: .1rem .6rem;
}
/* Add a gradient across only a portion of the vertical width of the navbar. */
.header,
.sitename {
background: linear-gradient(
$body-background-color,
$body-background-color 74px,
$light-green 74px,
$green 120px,
$body-background-color 120px,
$body-background-color
);
}
#navbar-menu .navbar-item {
font-size: 22px;
}
.slogan {
box-shadow: 0 2px 0 0 whitesmoke;
margin-bottom: 2px; /* Needed to see the boxshadow when we have the featured image directly below. */
padding-bottom: 4px; /* Give just a little extra space at the bottom for the *appearance* of balance. */
.title {
color: $green-gray;
font-size: 1.2rem;
}
}
/* Give some space above the subtitle. */
.featured-image {
margin-bottom: 0.5rem;
}
// TODO consider if this would look better with margin only on the content side
// so somehow removing left margin if the inline style has float: left applied.
// Also to consider decreasing the margin on mobile sizes.
.image-inline {
margin: 1em;
}
.drum {
margin-bottom: 1.2rem;
}
/* Remove empty gap from featured homepage image, to match look of content. */
.block--highlighted {
margin-top: -1.5rem;
}
/* I know this is wrong but it seems to work flawlessly across sizes. */
.more-link {
float: right;
position: relative;
top: -0.333rem;
}