This commit is contained in:
Roman Pyrih
2025-05-06 15:59:30 +02:00
parent 8b30cda510
commit d758a68b06
3 changed files with 371 additions and 11 deletions

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@@ -1,5 +1,6 @@
@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&display=swap');
@import url('https://cdn.projectpro.pl/juicedupmotorcycles.pl/scandia/stylesheet.css');
@import url('https://cdn.projectpro.pl/juicedupmotorcycles.pl/Bebas-Neue-Pro/stylesheet.css');
@@ -19,6 +20,7 @@ $fScandia: 'Scandia', sans-serif;
$fPlayfair: 'Playfair Display', sans-serif;
$fBebasNeuePro: 'Bebas Neue Pro', sans-serif;
$fBebasNeueProExpanded: 'Bebas Neue Pro Expanded', sans-serif;
$fLato: 'Lato', sans-serif;
body {
color: $cTxtWhite !important;
@@ -90,6 +92,122 @@ p {
}
}
._btn3 {
margin: 0 !important;
padding: 0 !important;
border: none !important;
background: #c1994c !important;
border-radius: 10px;
transition: all 250ms ease-in-out;
&:hover {
background: #a2803e !important;
}
span {
display: inline-block;
color: #fff !important;
font-family: $fLato !important;
font-size: 14px !important;
font-weight: 700 !important;
line-height: 21px !important;
padding: 14px !important;
text-transform: capitalize;
}
}
.checkbox-wrap {
margin: 0 5px 0 0 !important;
padding: 0 !important;
width: 18px !important;
min-width: 18px;
height: 18px !important;
border-radius: 4px !important;
border: 1px solid #545454 !important;
background: #28282e !important;
overflow: hidden !important;
input[type='checkbox'] {
&:checked + label {
&::before {
top: 7px !important;
left: 5px !important;
}
&::after {
top: 9px !important;
left: 3px !important;
}
}
}
label {
position: relative !important;
margin: 0 !important;
padding: 0 !important;
width: 18px !important;
min-width: 18px !important;
height: 18px !important;
&::before {
content: '' !important;
position: absolute !important;
top: -6px !important;
left: 18px !important;
width: 9px !important;
height: 2px !important;
background: $cGolden !important;
transform: rotate(-45deg) !important;
transition: all 250ms ease-in-out !important;
}
&::after {
content: '' !important;
position: absolute !important;
top: -4px !important;
left: -10px !important;
width: 5px !important;
height: 2px !important;
border: none !important;
background: $cGolden !important;
transform: rotate(45deg) !important;
transition: all 250ms ease-in-out !important;
}
}
}
.radio-wrap {
display: inline-block !important;
height: 15px !important;
width: 15px !important;
min-width: 15px !important;
margin: 0 !important;
padding: 0 !important;
inset: 0 !important;
border: 1px solid #545454 !important;
background: #28282e !important;
border-radius: 100% !important;
input[type='radio'] {
height: 15px !important;
min-height: 15px !important;
width: 15px !important;
min-width: 15px !important;
margin: 0 !important;
padding: 0 !important;
&:checked + label::after {
background: $cGolden !important;
}
}
label {
&::after {
width: 10px !important;
height: 10px !important;
top: 50% !important;
left: 50% !important;
transform: translate(-50%, -50%) !important;
}
}
}
.alert {
border-width: 1px !important;
border-radius: 10px !important;
@@ -111,17 +229,42 @@ p {
}
table.table {
border-top: 2px solid #28282e !important;
border-left: 2px solid #28282e !important;
border-right: 2px solid #28282e !important;
border-top: 1px solid #545454 !important;
border-left: 1px solid #545454 !important;
border-right: 1px solid #545454 !important;
tbody {
border-bottom: 2px solid #28282e !important;
border-bottom: 1px solid #545454 !important;
}
td {
border-bottom: 2px solid #28282e !important;
border-right: 2px solid #28282e !important;
border-bottom: 1px solid #545454 !important;
border-right: 1px solid #545454 !important;
}
tbody {
td.name {
a {
color: $cTxtWhite;
font-family: $fLato;
font-size: 14px;
font-weight: 400;
text-decoration: none;
&:hover {
color: $cGold;
}
}
}
td.quantity {
input[type='number'] {
color: $cTxtWhite;
margin: 0;
border-radius: 5px;
border-color: #505050;
background: #28282e;
}
}
}
}
@@ -266,6 +409,19 @@ table.table {
position: relative;
padding: 100px 0;
&::before {
content: '';
position: absolute;
top: 0;
bottom: 0;
left: 50%;
right: auto;
height: 100%;
width: 100svw;
background: #141417;
transform: translateX(-50%);
}
.c-row {
position: relative;
display: flex;
@@ -554,7 +710,7 @@ footer.footer {
padding-top: 40px;
margin-bottom: 0;
background-color: $cOnyx;
border-top: 1px solid #747480;
border-top: 1px solid #545454;
.innerfooter {
ul {
@@ -1622,6 +1778,8 @@ body.shop_product {
// Koszyk
body.shop_basket {
#box_basketlist {
margin-top: 60px;
.boxhead {
margin-bottom: 40px;
border-bottom: none;
@@ -1630,8 +1788,210 @@ body.shop_basket {
position: relative;
color: $cTxtWhite;
font-size: 28px;
font-family: $fPlayfair;
font-weight: 500;
font-family: $fLato;
font-weight: 700;
}
}
.buttons {
margin-top: 20px;
.btn {
@extend ._btn3;
}
}
#cart-options {
margin-top: 30px;
h5 {
color: $cTxtWhite;
font-size: 21px;
font-family: $fLato;
line-height: 1;
font-weight: 700;
margin-bottom: 20px;
}
.delivery,
.payment {
padding: 10px;
background: #28282e;
border-radius: 5px;
display: flex;
justify-content: space-between;
align-items: center;
&:not(:last-child) {
margin-bottom: 5px;
}
.name {
display: flex;
flex-direction: row;
align-items: center;
column-gap: 10px;
}
}
.payment-container {
padding-right: 4%;
}
.summary-container {
.summary-container--wrapper {
border: 1px solid #505050;
border-radius: 5px;
padding: 10px;
> .sum {
.desc {
color: $cTxtWhite;
font-size: 18px;
font-family: $fLato;
font-weight: 400;
line-height: 1;
}
.value {
color: $cGold;
font-size: 18px;
font-family: $fLato;
font-weight: 800;
line-height: 1;
}
}
}
.promo-container {
margin-bottom: 20px;
.promocode {
.checkbox-input {
display: flex;
flex-direction: row;
align-items: center;
.input {
width: 100%;
.shaded_inputwrap {
width: 100%;
input {
width: 100%;
margin: 0;
top: 0;
min-height: unset;
background: #28282e;
border-color: $cGolden;
border-top-left-radius: 5px;
border-bottom-left-radius: 5px;
}
}
}
.action {
.btn {
margin: 0;
padding: 10px 20px;
border: none;
background: $cGolden;
display: inline-block;
color: #fff;
font-family: $fLato;
font-size: 14px;
font-weight: 700;
line-height: 21px;
text-transform: capitalize;
border-top-right-radius: 5px;
border-bottom-right-radius: 5px;
}
}
}
}
}
.recount,
.deliveryhead {
margin-bottom: 10px;
.desc {
em {
color: $cTxtWhite;
font-size: 14px;
font-family: $fLato;
font-weight: 400;
line-height: 1;
}
}
.sum {
.color {
color: $cTxtWhite;
font-size: 14px;
font-family: $fLato;
font-weight: 400;
line-height: 1;
}
}
}
}
}
}
}
.basket-steps {
ol {
li {
&::before {
border: 1px solid $cGolden;
width: 20px;
height: 20px;
padding: 12px !important;
background: #111 !important;
line-height: 1;
}
&.mark-green {
}
&.active-step {
&::before {
color: $cBlack;
background: $cGolden !important;
}
}
span {
color: $cTxtWhite !important;
font-size: 14px;
font-family: $fLato;
font-weight: 400;
line-height: 1;
}
}
}
}
#box_basketstep2 {
.basket-step-border {
border: 1px solid #505050;
border-radius: 5px;
padding: 30px;
h3 {
color: #fff;
font-size: 21px;
font-family: $fLato;
font-weight: 400;
line-height: 1;
margin-bottom: 20px;
}
.innerbox {
> div {
&:not(:last-child) {
border-right: 1px solid #505050;
}
}
}
}