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

Make everything good (enough) #114 #126

Browse source
This commit is contained in:
benjamin melançon 2025-07-21 01:07:55 -04:00
parent fe6b0af8e1
commit cdcaf717af
6 changed files with 66 additions and 24 deletions
Download patch file Download diff file Expand all files Collapse all files

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

@ -4,18 +4,16 @@
* ../../node_modules/bulma/sass/components
*/
@use "variables" as *;
@use "variables" as local;
@use "../../node_modules/bulma/sass/utilities/mixins" as *;
@use "../../node_modules/bulma/sass/utilities/initial-variables" as *;
/**
* Make menu items slightly less far apart so we never entirely lose
* 'Community' on mid-size screens.
* See https://gitlab.com/drutopia/octavia/issues/52
*/
// Make menu items slightly less far apart so we never entirely lose 'Community'
// on mid-size screens. See https://gitlab.com/drutopia/octavia/issues/52
.navbar-item, .navbar-link {
padding-left: .75rem;
padding-right: .75rem;
padding-top: 1.5rem;
@include from($widescreen) {
padding-left: 1rem;
padding-right: 1rem;
@ -28,21 +26,33 @@
}
#navbar-menu {
a:hover {
background-color: local.$yellow !important;
}
display: flex;
// More modern Bulma has is-flex-wrap-wrap as a class for this.
flex-wrap: wrap;
@include until($tablet) {
width: 100%;
justify-content: space-around;
@include until($desktop) {
display: table;
// width: 100%;
// justify-content: space-around;
// Do not show the down arrow when it is already expanded.
.navbar-link::after {
display: none !important;
}
}
@include from($desktop) {
flex-wrap: nowrap;
margin-right: -1rem;
// Stay open as long as we are hovering; Bulma should be handling this but :shrug:
.navbar-dropdown:hover {
display: block;
}
}
}
/* Featured images on article pages */
// Featured images on article pages.
.featured-image figure.image {
width: 100vw;
position: relative;
@ -131,7 +141,7 @@
*/
.footer .views-field {
.field-content {
background-color: rgba($offwhite, 0.9);
background-color: rgba(local.$offwhite, 0.9);
padding: 0.2em;
border-radius: 0.3em;
}
@ -147,14 +157,14 @@
}
.page-title .title > span {
background-color: rgba($offwhite, 0.66);
background-color: rgba(local.$offwhite, 0.66);
padding: 0.4em 0.3em 0.3em 0.3em;
border-radius: 0.4em;
line-height: 1.8;
}
.block--footer_menus {
background-color: rgba($offwhite, 0.9);
background-color: rgba(local.$offwhite, 0.9);
padding: 0.2em;
border-radius: 0.3em;
}

10
web/themes/custom/geofresco/src/global/_content.scss
View file

@ -1,7 +1,4 @@
/**
* Styles related to contributor-added content on the site, such as embedded
* media.
*/
// Styles for contributor-added content on the site, such as embedded media.
iframe {
width: 100%;
@ -10,3 +7,8 @@ iframe {
height: revert-layer;
}
}
// Header tabs section is only shown to content editors for the Edit etc tabs.
.header-tabs {
padding: 0;
}

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

@ -26,11 +26,15 @@
.geo-logo-name {
display: flex !important;
padding-bottom: 0 !important; // Or else .column's padding takes precedence.
overflow: hidden;
width: 100%;
.logo, .sitename {
display: table-cell;
}
.sitename {
padding-top: 0.125rem; // 2px, better vertically-center "Organizing" in green stripe
}
.logo a {
display: block;
}
@ -52,6 +56,7 @@
.slogan {
box-shadow: 0 2px 0 0 whitesmoke;
margin-top: -1rem;
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 {

10
web/themes/custom/geofresco/src/global/_layout.scss
View file

@ -5,12 +5,12 @@
@use "../../node_modules/bulma/sass/utilities/mixins";
@use "../../node_modules/bulma/sass/utilities/initial-variables" as *;
// Center logo & sitename when they stack on tiny screens.
// Allow sitename to slide over the logo on tiny screens.
@include mixins.until(local.$mini) {
.geo-logo-name .sitename {
position: absolute;
left: calc(100vw - 14rem);
top: 0.5rem;
top: 0;
}
// .logo.column {
// width: 100%;
@ -18,10 +18,14 @@
.navigation.column .hamburger {
position: absolute;
right: 0;
top: 0.5rem;
top: 0;
}
}
.search-bar {
padding-top: 1.75rem;
}
.search-bar > .block,
.logo > .image {
display: inline-block;

11
web/themes/custom/geofresco/src/global/_paint.scss
View file

@ -63,3 +63,14 @@
.page--content-item--gleaning .page-title {
background-color: $gleaning;
}
:root {
--bulma-body-color: $geo-green;
--bulma-navbar-dropdown-background-color: white;
--bulma-navbar-dropdown-z: 999;
}
// Not figuring out the damn -l -h -s to make our primary color.
.button.is-primary {
background-color: $geo-green;
color: white;
}

18
web/themes/custom/geofresco/src/global/global.scss
View file

@ -6,6 +6,8 @@
@forward "../../node_modules/bulma/sass/utilities" with (
$background: white,
$green: $geo-green,
$blue: $blue,
);
@forward "fonts";
@forward "../../node_modules/bulma/sass/base/_index";
@ -15,18 +17,26 @@
@forward "../../node_modules/bulma/sass/form/_index";
@forward "form";
// $navbar-breakpoint: calc($mini/2);
@forward "../../node_modules/bulma/sass/components/_index";
@forward "../../node_modules/bulma/sass/components/_index" with (
$navbar-dropdown-background-color: white,
);
@forward "components";
@forward "../../node_modules/bulma/sass/grid/_index";
@forward "grid";
@forward "../../node_modules/bulma/sass/layout/_index";
@forward "layout";
// Import the themes so that all CSS variables have a value
@forward "../../node_modules/bulma/sass/themes";
// Stylesheets below will have access to all Bulma variables and mixins.
@forward "content";
@forward "paint";
// Import the themes so that all CSS variables have a value (not) but avoid dark mode.
@use "../../node_modules/bulma/sass/themes/light";
@use "../../node_modules/bulma/sass/themes/setup";
:root {
@include light.light-theme;
@include setup.setup-theme;
}
// @forward '../../node_modules/bulma-extensions/bulma-timeline/dist/bulma-timeline';