aira-wordpress/assets/scss/_bootscore-custom.scss
2025-02-27 10:23:21 +00:00

155 lines
2.9 KiB
SCSS

/*!
* Bootscore custom styles
*/
// Add your own code here!
// Because this file is compiled after Bootstrap, you're also able to use Bootstrap mixins for better code.
// Some examples can be found here: https://bootscore.me/documentation/bootstrap-css-sass
/* NAVIGATION */
#nav-main {
height: 70px;
.container {
width: 1320px;
}
.nav-link {
text-transform: uppercase;
font-size: 13px;
}
}
/* Is required to show the svg logo */
.navbar-brand {
width: 150px;
}
/* CUSTOM BLOCK MOBILE SUPPORT */
@include media-breakpoint-up(md) {
body:not(.wp-admin) .wp-block-create-block-featured-image-block {
.call-to-action {
width: 350px;
margin-right: 100px;
}
}
}
/* DEFAULT BLOCK OVERRIDES */
:root :where(p.has-background) {
padding:.5em;
}
.wp-block-cover, .wp-block-cover-image {
min-height: auto;
}
/* COVER control the spacing on the left and right */
.wp-block-cover.is-light {
.has-text-align-left {
margin-left: 0 !important;
}
.has-text-align-right {
margin-right: 0 !important;
}
}
@include media-breakpoint-up(md) {
:root :where(p.has-background) {
padding:1.25em 2.375em;
}
}
/* HOMEPAGE SPECIFIC STYLING PER BLOCK */
/* Crane block */
.homepage-crane {
.wp-block-cover__image-background {
background-position: right 35% top 20% !important;
}
}
.home {
#content {
padding-top: 0 !important;
}
.entry-header {
display: none;
}
}
.footer-crane {
.wp-block-cover__image-background {
background-position: 760% 20% !important;
background-attachment: initial;
background-repeat: no-repeat;
background-size: auto;
}
}
/* Footer */
#footer {
.bootscore-footer-columns {
// background-color: black;
color: white;
a {
color: white;
}
}
}
/* Custom Style for core/cover block */
.is-style-fixed-height-272 {
height: 272px;
}
.is-style-fixed-height-300 {
height: 300px;
}
.is-style-fixed-height-400 {
height: 400px;
}
// /* FIXME: merge buttons to be bootstrap by amending the classes here in core/button. Then update theme.json */
// .wp-block-button__link {
// transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
// &:hover {
// color: #fff;
// background-color: #c20512;
// border-color: #b70511;
// }
// }
.is-style-bootstrap-primary > a,
.is-style-bootstrap-primary > div {
@extend .btn;
@extend .btn-primary;
@extend .btn-lg;
}
.is-style-bootstrap-dark > a,
.is-style-bootstrap-dark > div {
@extend .btn;
@extend .btn-dark;
@extend .btn-lg;
}
/* Page */
.featured-full-width-img {
height: 400px;
}
#secondary {
height: 100%;
}
#sidebar {
position: sticky;
a:not(.active) {
color: black;
}
li {
padding: 0.25rem 0;
}
}