hansot-clone/src/OwnerBanner.scss
2025-10-13 12:10:16 +00:00

53 lines
1 KiB
SCSS

@use "./shared.scss" as *;
.owner-wrapper {
display: flex;
max-width: $content-max-width;
width: 100%;
gap: 28px;
> *:not(.title-widget-outter) {
flex: 1 0 0;
}
@include point-tablet {
display: grid;
grid-template-columns: 1fr 1fr;
.title-widget-outter {
grid-column: 1 / span 2;
}
padding: 0 42px;
transition: padding 420ms ease 0s;
}
@include point-phone {
display: flex;
flex-direction: column;
> *:not(.title-widget-outter) {
margin: 0 12px;
}
.title-widget-outter {
margin-bottom: -30px;
}
}
.title-widget-outter {
position: relative;
&::after {
position: absolute;
content: '';
top: 0;
width: 100%;
height: 100%;
z-index: -1;
background-color: $brand-color;
@include point-phone {
height: calc(100% + 100px);
}
}
.title-widget {
@include text-widget(
$title-color: #333,
$content-color: #333,
$background-color: transparent,
)
}
}
}