Project-Pro/ostal.pl
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

first commit

Browse Source
This commit is contained in:
Jacek Pyziak
2024-12-20 12:48:12 +01:00
commit d9fb74972a
217 changed files with 26712 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

74
wp-content/themes/ostal_WP/sass/05-components/_hero-with-form.scss Normal file
View File

@@ -0,0 +1,74 @@
@use "../01-base/breakpoints" as *;
@use "../01-base/colors" as *;
@use "../02-abstracts/mixins" as *;
.hero-with-form{
height: 90vh;
width: 100%;
margin-bottom: 80px;
@include responsive(tablet){
margin-bottom: 0px;
}
@include responsive(desktop){
max-height: 780px;
}
.hero-wrapper{
position: relative;
height: 100%;
width: 100%!important;
background-repeat: no-repeat;
background-size: cover!important;
background-position: center;
display: flex;
flex-direction: column;
@include responsive(tablet){
flex-direction: row;
align-items: flex-end;
padding-bottom: 90px;
}
@include responsive(desktop){
padding: 102px;
}
}
.bg-filter{
@include bg-filter;
@include bg-filter--gradient;
}
.hero-content{
padding: 20px;
display: flex;
flex-direction: column;
align-content: flex-end;
gap: 20px;
flex: 0 1 50%;
z-index: 998;
@include responsive(tablet){
align-items: flex-start;
}
.hero-heading{
z-index: 99;
@include responsive(tablet){
max-width: 70%;
}
@include responsive(desktop){
max-width: inherit;
flex: 0 0 50%;
}
}
.hero-text{
text-shadow: 2px 2px 3px $dark-color;
}
}
.hero-form{
background-color: $dark-color;
padding: 22px;
clip-path: polygon(0% 4%, 4% 0%, 100% 0%, 100% 4%, 100% 100%, 0% 100%, 0% 4%);
flex: 0 0 50%;
@include responsive(tablet){
height: fit-content;
}
@include responsive(desktop){
padding: 28px;
}
}
}