Cloonar/lena-schilling-website
2
0
Fork 0
Code Issues 1 Pull Requests 2 Actions Packages Projects Releases Wiki Activity

feat: initial design for hero
All checks were successful
Build / build (push) Successful in 2m27s
Details
Build / deploy-stage (push) Successful in 2m31s
Details
Build / switch-stage (push) Successful in 2m0s
Details

Browse Source
This commit is contained in:
Dominik Polakovics Polakovics
2024-12-12 17:23:29 +01:00
parent 2bac342a5e
commit 869df50c01
2 changed files with 97 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

72
packages/base/ContentBlocks/ContentElements/hero/assets/frontend.css
View File

@@ -1,3 +1,73 @@
.frame-type-cloonar_hero .container {
.frame-type-cloonar_hero {
position: relative;
display: flex;
flex-direction: column;
padding-bottom: 3rem; /* Space for overlap */
background: #f9f9f9;
}
.frame-type-cloonar_hero .hero-header {
text-align: center;
margin-bottom: 2rem;
font-size: 2.5rem;
color: #3c3c3c;
}
.frame-type-cloonar_hero .hero-content {
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
gap: 2rem;
}
.frame-type-cloonar_hero .hero-text {
flex: 1;
font-size: 1.2rem;
color: #3c3c3c;
line-height: 1.6;
}
.frame-type-cloonar_hero .hero-image-wrapper {
position: relative;
flex: 1;
}
.frame-type-cloonar_hero .hero-image {
max-width: 100%;
height: auto;
border-radius: 8px;
}
.frame-type-cloonar_hero .hero-social-icons {
position: absolute;
right: -10%;
top: 50%;
transform: translateY(-50%);
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.frame-type-cloonar_hero .social-icon {
display: inline-block;
width: 40px;
height: 40px;
background-color: #3c3c3c;
color: #fff;
text-align: center;
line-height: 40px;
border-radius: 50%;
text-decoration: none;
font-size: 1.2rem;
}
.frame-type-cloonar_hero .next-section-overlap {
position: absolute;
bottom: 2rem;
width: 100%;
height: 2rem;
background: #ffffff;
z-index: 10;
}