feat(main): Add base theme: This is the falcon theme out of the box.
This is falcon v3.1.2
This commit is contained in:
1
falcon/_dev/css/product/_index.scss
Normal file
1
falcon/_dev/css/product/_index.scss
Normal file
@ -0,0 +1 @@
|
||||
@import "components/index";
|
||||
3
falcon/_dev/css/product/components/_index.scss
Normal file
3
falcon/_dev/css/product/components/_index.scss
Normal file
@ -0,0 +1,3 @@
|
||||
@import "product-gallery/index";
|
||||
@import "product-customization/index";
|
||||
@import "product-variants/index";
|
||||
@ -0,0 +1 @@
|
||||
@import "product-customization";
|
||||
@ -0,0 +1,61 @@
|
||||
@use "sass:map";
|
||||
|
||||
.product-customization {
|
||||
margin: map.get($spacers, 5) 0;
|
||||
|
||||
.product-customization-item {
|
||||
margin: map.get($spacers, 3) 0;
|
||||
}
|
||||
|
||||
.product-message {
|
||||
width: 100%;
|
||||
height: 3.125rem;
|
||||
padding: 0.625rem;
|
||||
resize: none;
|
||||
background: $gray-100;
|
||||
border: none;
|
||||
|
||||
&:focus {
|
||||
background-color: #fff;
|
||||
outline: 0.1875rem solid $primary;
|
||||
}
|
||||
}
|
||||
|
||||
.file-input {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
z-index: 1;
|
||||
width: 100%;
|
||||
height: 2.625rem;
|
||||
overflow: hidden;
|
||||
cursor: pointer;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.customization-message{
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
.custom-file {
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 2.625rem;
|
||||
margin-top: map.get($spacers, 3);
|
||||
line-height: 2.625rem;
|
||||
color: $gray-600;
|
||||
text-indent: 0.625rem;
|
||||
background: $gray-100;
|
||||
|
||||
button {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
z-index: 0;
|
||||
}
|
||||
}
|
||||
|
||||
small {
|
||||
color: $gray-600;
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,2 @@
|
||||
@import "product-thumbs";
|
||||
@import "product-main-images";
|
||||
@ -0,0 +1,22 @@
|
||||
@use "sass:map";
|
||||
|
||||
.product-main-images {
|
||||
position: relative;
|
||||
|
||||
&__modal-trigger-layer {
|
||||
position: absolute;
|
||||
right: map.get($spacers, 2);
|
||||
bottom: map.get($spacers, 2);
|
||||
z-index: 2;
|
||||
|
||||
width: 1.6em;
|
||||
height: 1.6em;
|
||||
padding: 0;
|
||||
line-height: 1.6em;
|
||||
|
||||
border: 0;
|
||||
border-radius: 50%;
|
||||
|
||||
@include font-size(20px);
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,27 @@
|
||||
@use "sass:map";
|
||||
|
||||
.product-thumbs {
|
||||
margin-right: -#{map.get($spacers, 1)};
|
||||
margin-left: -#{map.get($spacers, 1)};
|
||||
|
||||
&__elem {
|
||||
padding: 0 map.get($spacers, 1);
|
||||
cursor: pointer;
|
||||
opacity: .3;
|
||||
transition: .3s ease opacity;
|
||||
@include make-col(4);
|
||||
|
||||
&:focus,
|
||||
&:hover {
|
||||
opacity: 0.6;
|
||||
}
|
||||
|
||||
&.swiper-slide-thumb-active {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
@include media-breakpoint-up(sm) {
|
||||
@include make-col(3);
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,43 @@
|
||||
@use "sass:map";
|
||||
|
||||
.attribute-radio {
|
||||
$self: &;
|
||||
|
||||
&__label {
|
||||
position: relative;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
&__input {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
cursor: pointer;
|
||||
opacity: 0;
|
||||
|
||||
&:checked ~ {
|
||||
#{$self} {
|
||||
&__text {
|
||||
color: $white;
|
||||
background-color: $primary;
|
||||
border-color: $primary;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&__text {
|
||||
display: block;
|
||||
min-width: rem-calc(35px);
|
||||
padding: map.get($spacers, 1) map.get($spacers, 2);
|
||||
font-size: $font-size-sm;
|
||||
font-weight: 700;
|
||||
text-align: center;
|
||||
border: 1px solid $border-color;
|
||||
border-radius: $border-radius;
|
||||
}
|
||||
}
|
||||
@ -0,0 +1 @@
|
||||
@import "attribute-radio";
|
||||
Reference in New Issue
Block a user