geo/geo-coop
geo/geo-coop
7
1
Fork 0
Code Issues 54 Pull requests Projects Releases Packages Wiki Activity Actions

Give up on linear gradient and do a 1px wide background

Browse source 
Also move more elementy stuff from components, and hope the weird
small-screen adjustments are not applicable anymore?

Ref #114 #126
This commit is contained in:
benjamin melançon 2025-07-15 22:47:51 -04:00
parent 161844eb8f
commit 0eaafd6208
3 changed files with 31 additions and 44 deletions
Download patch file Download diff file Expand all files Collapse all files

BIN
web/themes/custom/geofresco/images/green-stripe.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 142 B

36
web/themes/custom/geofresco/src/global/_components.scss
View file

@ -22,42 +22,6 @@
} }
} }
.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;
}
.geo-logo-name {
display: flex !important;
overflow: hidden;
width: 100%;
.logo, .sitename {
display: table-cell;
}
.logo a {
display: block;
// width: 199px;
}
.logo img {
height: 7.5rem;
}
@include from($tablet) {
width: fit-content;
}
@include until($mini) {
justify-content: flex-end;
}
}
@include until($desktop) {
.search-bar {
display: none !important;
}
}
// Mostly to reduce the impact of the ridiculous (mostly on Chrome) ghost mobile horizontal scroll. // Mostly to reduce the impact of the ridiculous (mostly on Chrome) ghost mobile horizontal scroll.
.search-icon { .search-icon {
padding-right: 1rem; padding-right: 1rem;

39
web/themes/custom/geofresco/src/global/_elements.scss
View file

@ -11,14 +11,37 @@
// Add a gradient across only a portion of the vertical height of the navbar. // Add a gradient across only a portion of the vertical height of the navbar.
.header { .header {
background: linear-gradient( background-image: url(../../images/green-stripe.png);
$background, }
$background 5.4375rem,
$light-green 5.4375rem, .site-title {
$green 8.4rem, display: inline-block;
$background 8.4rem, width: 4.6em;
$background word-break: keep-all; // Shouldn't be needed but Chrome needs it.
); font-size: 2.3125rem;
line-height: 2.375rem;
}
.geo-logo-name {
display: flex !important;
overflow: hidden;
width: 100%;
.logo, .sitename {
display: table-cell;
}
.logo a {
display: block;
width: 12.4375rem; // 199px
}
.logo img {
height: 7.5rem;
}
// @include from($tablet) {
// width: fit-content;
// }
// @include until($mini) {
// justify-content: flex-end;
// }
} }
#navbar-menu .navbar-item { #navbar-menu .navbar-item {