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

Dodaj nowe style dla przycisków oraz sekcji z kafelkami, poprawiając responsywność i estetykę

Browse Source
This commit is contained in:
Roman Pyrih
2025-04-08 09:43:38 +02:00
parent a88a6f1bfd
commit 92a05118f6
3 changed files with 83 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

99
juicedupmotorcycles.pl/style.scss
View File

@@ -33,12 +33,6 @@ p {
}
}
// .container {
// @media (min-width: 1460px) {
// max-width: 1440px !important;
// }
// }
._sub_title {
color: $cGolden;
font-size: 16px;
@@ -55,6 +49,21 @@ p {
font-weight: 500;
}
._btn {
display: inline-block;
color: $cBlack;
font-size: 20px;
font-weight: 500;
padding: 16px 36px;
background: linear-gradient(119deg, #d0bf95 0%, #a48446 100%);
border-radius: 100px;
transition: all 250ms ease;
&:hover {
background: linear-gradient(119deg, #a48446 0%, #d0bf95 100%);
}
}
.box_custom#box-1 {
height: 600px;
background-image: url('https://sklep214936.shoparena.pl/skins/user/rwd_shoper_2/images/user/beard-quiz-home-hero-desktop.jpg');
@@ -97,18 +106,7 @@ p {
}
a {
display: inline-block;
color: $cBlack;
font-size: 20px;
font-weight: 500;
padding: 16px 36px;
background: linear-gradient(119deg, #d0bf95 0%, #a48446 100%);
border-radius: 100px;
transition: all 250ms ease;
&:hover {
background: linear-gradient(119deg, #a48446 0%, #d0bf95 100%);
}
@extend ._btn;
}
}
@@ -246,6 +244,71 @@ p {
}
}
.box_custom#box-5 {
position: relative;
padding: 100px 0;
.tiles {
position: relative;
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 20px;
.tile {
position: relative;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-end;
height: 370px;
padding: 20px 20px 32px;
border: 1px solid #28282e;
border-radius: 1rem;
overflow: hidden;
&::before {
content: '';
position: absolute;
inset: 0;
background: linear-gradient(#0000001a, #000);
z-index: 1;
}
.title__image {
position: absolute;
inset: 0;
img {
width: 100%;
height: 100%;
border-radius: 1rem;
object-fit: cover;
}
}
.tile__content {
position: relative;
z-index: 1;
text-align: center;
}
h2 {
color: $cTxtWhite;
font-size: 25px;
font-weight: 500;
margin: 0 0 10px 0;
}
p {
color: $cTxtWhite;
font-size: 16px;
font-weight: 400;
margin: 0 0 20px 0;
}
a {
@extend ._btn;
}
}
}
}
.box_custom#box-faq {
width: 100%;
max-width: 800px;