update 6/5
This commit is contained in:
@@ -1,4 +1,3 @@
|
||||
@charset "UTF-8";
|
||||
:root {
|
||||
--color-global: #462f91;
|
||||
--color-title: #0d0d9c;
|
||||
@@ -22,7 +21,7 @@
|
||||
|
||||
html {
|
||||
font-size: 100%;
|
||||
font-family: "Shopee", sans-serif;
|
||||
font-family: "Roboto", sans-serif;
|
||||
}
|
||||
|
||||
.container {
|
||||
@@ -32,7 +31,7 @@ html {
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: "Shopee";
|
||||
font-family: "Roboto", sans-serif;
|
||||
font-size: 14px;
|
||||
background: #fff;
|
||||
min-width: 1400px;
|
||||
@@ -40,25 +39,7 @@ body {
|
||||
}
|
||||
|
||||
html {
|
||||
font-family: "Shopee";
|
||||
}
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6 {
|
||||
font-family: "Shopee Bold";
|
||||
}
|
||||
|
||||
b {
|
||||
font-family: "Shopee Bold";
|
||||
}
|
||||
|
||||
p,
|
||||
span {
|
||||
font-family: "Shopee Medium";
|
||||
font-family: "Roboto", sans-serif;
|
||||
}
|
||||
|
||||
.icon_2025 {
|
||||
@@ -202,6 +183,16 @@ span {
|
||||
background-position: -190px -133px;
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
.icon_2025.upload_image {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
background-position: -88px -70px;
|
||||
}
|
||||
.icon_2025.remove {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
background-position: -126px -124px;
|
||||
}
|
||||
|
||||
.icon-star {
|
||||
background: url(../images/icon_star.png) no-repeat;
|
||||
@@ -254,7 +245,7 @@ span {
|
||||
position: relative;
|
||||
background: transparent;
|
||||
cursor: pointer;
|
||||
font-family: "Shopee Bold";
|
||||
font-weight: 700;
|
||||
}
|
||||
.box-select .select:focus {
|
||||
outline: none;
|
||||
@@ -263,7 +254,6 @@ span {
|
||||
}
|
||||
.box-select .select option {
|
||||
background: var(--color-global);
|
||||
font-family: "Shopee";
|
||||
}
|
||||
.box-select::after {
|
||||
position: absolute;
|
||||
@@ -394,7 +384,6 @@ span {
|
||||
font-weight: 700;
|
||||
}
|
||||
.tabs-list .tabs-item {
|
||||
font-family: "Shopee Regular";
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
@@ -453,8 +442,13 @@ span {
|
||||
right: 0;
|
||||
top: 0;
|
||||
}
|
||||
.product-item .product-image .icon-remove {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 0;
|
||||
}
|
||||
.product-item .name-product {
|
||||
font-family: "Shopee Bold";
|
||||
font-weight: 700;
|
||||
font-size: 18px;
|
||||
color: #000;
|
||||
margin-bottom: 5px;
|
||||
@@ -463,7 +457,7 @@ span {
|
||||
color: var(--color-title);
|
||||
}
|
||||
.product-item .price {
|
||||
font-family: "Shopee Bold";
|
||||
font-weight: 700;
|
||||
font-size: 18px;
|
||||
color: #d80a00;
|
||||
margin-bottom: 5px;
|
||||
@@ -488,10 +482,12 @@ span {
|
||||
filter: brightness(0) invert(1);
|
||||
}
|
||||
.product-item .summary {
|
||||
font-family: "Shopee medium";
|
||||
margin-bottom: 5px;
|
||||
color: #595959;
|
||||
}
|
||||
.product-item.save .icon-save {
|
||||
right: 30px;
|
||||
}
|
||||
|
||||
.box-best-rated-products .swiper-button-next {
|
||||
right: -20px;
|
||||
@@ -501,7 +497,7 @@ span {
|
||||
}
|
||||
|
||||
.box-category-homepage .item p:hover {
|
||||
font-family: "Shopee Bold";
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.item-article {
|
||||
@@ -529,7 +525,7 @@ span {
|
||||
width: calc(100% - 100px);
|
||||
}
|
||||
.item-article .name-article {
|
||||
font-family: "Shopee Bold";
|
||||
font-weight: bold;
|
||||
font-size: 16px;
|
||||
color: #000;
|
||||
margin-bottom: 3px;
|
||||
@@ -539,7 +535,6 @@ span {
|
||||
}
|
||||
.item-article .summary {
|
||||
margin-bottom: 3px;
|
||||
font-family: "Shopee Regular";
|
||||
font-size: 16px;
|
||||
color: #161616;
|
||||
}
|
||||
@@ -564,7 +559,7 @@ span {
|
||||
border-radius: 4px;
|
||||
}
|
||||
.more-link span {
|
||||
font-family: "Shopee Bold";
|
||||
font-weight: 700;
|
||||
margin-right: 5px;
|
||||
}
|
||||
.more-link:hover {
|
||||
@@ -601,16 +596,15 @@ span {
|
||||
width: calc(100% - 100px);
|
||||
}
|
||||
.item-classifieds .summary {
|
||||
font-family: "shopee Regular";
|
||||
font-size: 15px;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
.item-classifieds .name-classifieds {
|
||||
font-family: "shopee Bold";
|
||||
font-weight: bold;
|
||||
font-size: 18px;
|
||||
}
|
||||
.item-classifieds .price {
|
||||
font-family: "shopee Bold";
|
||||
font-weight: bold;
|
||||
font-size: 20px;
|
||||
color: #d80a00;
|
||||
}
|
||||
@@ -676,14 +670,9 @@ span {
|
||||
|
||||
.breadcrumb span {
|
||||
font-size: 18px;
|
||||
font-family: "Shopee Medium";
|
||||
}
|
||||
|
||||
.page-category .list-cate a {
|
||||
font-family: "Shopee Regular";
|
||||
}
|
||||
.page-category .list-cate a.active {
|
||||
font-family: "Shopee Bold";
|
||||
font-weight: 600;
|
||||
}
|
||||
.page-category .list-cate a:hover {
|
||||
@@ -700,7 +689,6 @@ span {
|
||||
}
|
||||
|
||||
.box-filter label {
|
||||
font-family: "Shopee Light";
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
@@ -756,14 +744,13 @@ span {
|
||||
font-weight: 700;
|
||||
}
|
||||
.box-product-detail .box-summary {
|
||||
font-family: "Shopee Medium";
|
||||
font-size: 16px;
|
||||
}
|
||||
.box-product-detail .box-summary li {
|
||||
list-style: inside;
|
||||
}
|
||||
.box-product-detail .btn-more-review {
|
||||
font-family: "Shopee Bold";
|
||||
font-weight: bold;
|
||||
}
|
||||
.box-product-detail .box-desc .content {
|
||||
width: 100%;
|
||||
@@ -837,12 +824,11 @@ span {
|
||||
|
||||
.table td {
|
||||
padding: 14px 20px;
|
||||
font-family: "Shopee medium";
|
||||
}
|
||||
|
||||
.table td:first-child {
|
||||
width: 230px;
|
||||
font-family: "Shopee Bold";
|
||||
font-weight: bold;
|
||||
font-weight: inherit;
|
||||
}
|
||||
|
||||
@@ -869,33 +855,140 @@ span {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.star-rating {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
.rating-selection {
|
||||
float: left;
|
||||
display: inline;
|
||||
}
|
||||
|
||||
.star-rating input {
|
||||
display: none; /* Ẩn các input radio */
|
||||
}
|
||||
|
||||
.star-rating label {
|
||||
.rating-selection input {
|
||||
float: right;
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
padding: 0;
|
||||
margin: 0 0 0 -15px;
|
||||
opacity: 0;
|
||||
cursor: pointer;
|
||||
width: 45px;
|
||||
height: 45px;
|
||||
margin: 0 5px;
|
||||
background-size: cover;
|
||||
transition: background-image 0.3s ease-in-out;
|
||||
background-image: url("../images/icon-star-gray.png");
|
||||
}
|
||||
|
||||
/* Sao đã chọn, sử dụng hình ảnh ngôi sao màu vàng */
|
||||
.star-rating input:checked ~ label {
|
||||
background-image: url("../images/icon-star-active.png"); /* Đặt hình sao màu vàng khi chọn */
|
||||
.rating-selection .rating-star {
|
||||
position: relative;
|
||||
float: right;
|
||||
display: block;
|
||||
width: 28px;
|
||||
height: 26px;
|
||||
background: url(../images/star_min.png) 0 -33px;
|
||||
cursor: pointer;
|
||||
margin-right: 7px;
|
||||
}
|
||||
|
||||
/* Sao khi hover, thay đổi màu sắc của sao */
|
||||
.star-rating label:hover,
|
||||
.star-rating input:checked ~ label:hover {
|
||||
background-image: url("../images/icon-star-active.png"); /* Thay đổi hình sao khi hover */
|
||||
.rating-selection .rating-star:hover {
|
||||
background-position: 0 0;
|
||||
}
|
||||
|
||||
.rating-selection .rating-star:hover,
|
||||
.rating-star:hover ~ .rating-star {
|
||||
background-position: 0 0;
|
||||
}
|
||||
|
||||
.rating-selection .rating:hover .rating-star:hover,
|
||||
.rating:hover .rating-star:hover ~ .rating-star,
|
||||
.rating-input:checked ~ .rating-star {
|
||||
background-position: 0 0;
|
||||
}
|
||||
|
||||
.form-input input,
|
||||
.form-input textarea {
|
||||
width: 100%;
|
||||
height: 44px;
|
||||
padding: 0 20px;
|
||||
border-radius: 12px;
|
||||
border: 1px solid #c1c1c1;
|
||||
font-size: 13px;
|
||||
color: #9c9c9c;
|
||||
}
|
||||
.form-input input:focus,
|
||||
.form-input textarea:focus {
|
||||
outline: 2px solid var(--color-global);
|
||||
border: none;
|
||||
}
|
||||
.form-input textarea {
|
||||
height: 100px;
|
||||
padding: 15px 20px;
|
||||
resize: none;
|
||||
}
|
||||
|
||||
.padding {
|
||||
border: 1px solid #cdcdcd;
|
||||
width: -moz-fit-content;
|
||||
width: fit-content;
|
||||
margin: 20px auto 0 auto;
|
||||
border-radius: 4px;
|
||||
}
|
||||
.padding a {
|
||||
border-right: 1px solid #cdcdcd;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
text-align: center;
|
||||
line-height: 40px;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
}
|
||||
.padding a:last-child {
|
||||
border: 0;
|
||||
}
|
||||
.padding a:hover,
|
||||
.padding .active {
|
||||
border-radius: 4px;
|
||||
border: 1px solid #1877f2;
|
||||
color: #1877f2;
|
||||
}
|
||||
|
||||
.select-two-arrow {
|
||||
position: relative;
|
||||
background: #fff;
|
||||
height: 40px;
|
||||
border: 1px solid #d5d5d5;
|
||||
border-radius: 4px;
|
||||
line-height: 40px;
|
||||
}
|
||||
.select-two-arrow select {
|
||||
position: relative;
|
||||
-webkit-appearance: none;
|
||||
-moz-appearance: none;
|
||||
appearance: none;
|
||||
border: 0;
|
||||
background: transparent;
|
||||
outline: 0;
|
||||
width: 100%;
|
||||
padding: 0 30px 0 10px;
|
||||
z-index: 2;
|
||||
}
|
||||
.select-two-arrow::before {
|
||||
position: absolute;
|
||||
content: "";
|
||||
right: 7px;
|
||||
top: 5px;
|
||||
width: 11px;
|
||||
height: 17px;
|
||||
background: url(../images/icon_2025.png) no-repeat;
|
||||
background-size: 228px 175px;
|
||||
display: block;
|
||||
background-position: -212px -152px;
|
||||
transform: rotate(270deg);
|
||||
z-index: 1;
|
||||
}
|
||||
.select-two-arrow::after {
|
||||
position: absolute;
|
||||
content: "";
|
||||
right: 7px;
|
||||
bottom: 5px;
|
||||
width: 11px;
|
||||
height: 17px;
|
||||
background: url(../images/icon_2025.png) no-repeat;
|
||||
background-size: 228px 175px;
|
||||
display: block;
|
||||
background-position: -212px -152px;
|
||||
transform: rotate(90deg);
|
||||
z-index: 1;
|
||||
}/*# sourceMappingURL=style.css.map */
|
||||
File diff suppressed because one or more lines are too long
@@ -24,7 +24,7 @@
|
||||
}
|
||||
html {
|
||||
font-size: 100%;
|
||||
font-family: "Shopee", sans-serif;
|
||||
font-family: "Roboto", sans-serif;
|
||||
}
|
||||
|
||||
.container {
|
||||
@@ -33,29 +33,14 @@ html {
|
||||
width: 1400px !important;
|
||||
}
|
||||
body {
|
||||
font-family: "Shopee";
|
||||
font-family: "Roboto", sans-serif;
|
||||
font-size: 14px;
|
||||
background: #fff;
|
||||
min-width: 1400px;
|
||||
color: #303030;
|
||||
}
|
||||
html {
|
||||
font-family: "Shopee";
|
||||
}
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6 {
|
||||
font-family: "Shopee Bold";
|
||||
}
|
||||
b {
|
||||
font-family: "Shopee Bold";
|
||||
}
|
||||
p,
|
||||
span {
|
||||
font-family: "Shopee Medium";
|
||||
font-family: "Roboto", sans-serif;
|
||||
}
|
||||
.icon_2025 {
|
||||
background: url(../images/icon_2025.png) no-repeat;
|
||||
@@ -198,6 +183,16 @@ span {
|
||||
background-position: -190px -133px;
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
&.upload_image {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
background-position: -88px -70px;
|
||||
}
|
||||
&.remove {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
background-position: -126px -124px;
|
||||
}
|
||||
}
|
||||
|
||||
.icon-star {
|
||||
@@ -249,7 +244,7 @@ span {
|
||||
position: relative;
|
||||
background: transparent;
|
||||
cursor: pointer;
|
||||
font-family: "Shopee Bold";
|
||||
font-weight: 700;
|
||||
&:focus {
|
||||
outline: none;
|
||||
box-shadow: 0 0 0 2px rgba(70, 47, 145, 0.2);
|
||||
@@ -257,7 +252,6 @@ span {
|
||||
}
|
||||
option {
|
||||
background: var(--color-global);
|
||||
font-family: "Shopee";
|
||||
}
|
||||
}
|
||||
&::after {
|
||||
@@ -420,7 +414,6 @@ span {
|
||||
font-weight: 700;
|
||||
}
|
||||
.tabs-item {
|
||||
font-family: "Shopee Regular";
|
||||
font-weight: 400;
|
||||
}
|
||||
}
|
||||
@@ -479,9 +472,14 @@ span {
|
||||
right: 0;
|
||||
top: 0;
|
||||
}
|
||||
.icon-remove {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 0;
|
||||
}
|
||||
}
|
||||
.name-product {
|
||||
font-family: "Shopee Bold";
|
||||
font-weight: 700;
|
||||
font-size: 18px;
|
||||
color: #000;
|
||||
margin-bottom: 5px;
|
||||
@@ -490,7 +488,7 @@ span {
|
||||
}
|
||||
}
|
||||
.price {
|
||||
font-family: "Shopee Bold";
|
||||
font-weight: 700;
|
||||
font-size: 18px;
|
||||
color: #d80a00;
|
||||
margin-bottom: 5px;
|
||||
@@ -515,10 +513,14 @@ span {
|
||||
}
|
||||
}
|
||||
.summary {
|
||||
font-family: "Shopee medium";
|
||||
margin-bottom: 5px;
|
||||
color: #595959;
|
||||
}
|
||||
&.save {
|
||||
.icon-save {
|
||||
right: 30px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.box-best-rated-products {
|
||||
@@ -532,7 +534,7 @@ span {
|
||||
|
||||
.box-category-homepage {
|
||||
.item p:hover {
|
||||
font-family: "Shopee Bold";
|
||||
font-weight: 700;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -559,7 +561,7 @@ span {
|
||||
width: calc(100% - 100px);
|
||||
}
|
||||
.name-article {
|
||||
font-family: "Shopee Bold";
|
||||
font-weight: bold;
|
||||
font-size: 16px;
|
||||
color: #000;
|
||||
margin-bottom: 3px;
|
||||
@@ -569,7 +571,6 @@ span {
|
||||
}
|
||||
.summary {
|
||||
margin-bottom: 3px;
|
||||
font-family: "Shopee Regular";
|
||||
font-size: 16px;
|
||||
color: #161616;
|
||||
}
|
||||
@@ -594,7 +595,7 @@ span {
|
||||
border: 1px solid var(--color-global);
|
||||
border-radius: 4px;
|
||||
span {
|
||||
font-family: "Shopee Bold";
|
||||
font-weight: 700;
|
||||
margin-right: 5px;
|
||||
}
|
||||
&:hover {
|
||||
@@ -629,16 +630,15 @@ span {
|
||||
width: calc(100% - 100px);
|
||||
}
|
||||
.summary {
|
||||
font-family: "shopee Regular";
|
||||
font-size: 15px;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
.name-classifieds {
|
||||
font-family: "shopee Bold";
|
||||
font-weight: bold;
|
||||
font-size: 18px;
|
||||
}
|
||||
.price {
|
||||
font-family: "shopee Bold";
|
||||
font-weight: bold;
|
||||
font-size: 20px;
|
||||
color: #d80a00;
|
||||
}
|
||||
@@ -715,15 +715,12 @@ span {
|
||||
.breadcrumb {
|
||||
span {
|
||||
font-size: 18px;
|
||||
font-family: "Shopee Medium";
|
||||
}
|
||||
}
|
||||
|
||||
.page-category {
|
||||
.list-cate a {
|
||||
font-family: "Shopee Regular";
|
||||
&.active {
|
||||
font-family: "Shopee Bold";
|
||||
font-weight: 600;
|
||||
}
|
||||
&:hover {
|
||||
@@ -741,7 +738,6 @@ span {
|
||||
border-radius: 3px;
|
||||
}
|
||||
.box-filter label {
|
||||
font-family: "Shopee Light";
|
||||
cursor: pointer;
|
||||
}
|
||||
#js-slider-big {
|
||||
@@ -800,14 +796,13 @@ span {
|
||||
}
|
||||
}
|
||||
.box-summary {
|
||||
font-family: "Shopee Medium";
|
||||
font-size: 16px;
|
||||
li {
|
||||
list-style: inside;
|
||||
}
|
||||
}
|
||||
.btn-more-review {
|
||||
font-family: "Shopee Bold";
|
||||
font-weight: bold;
|
||||
}
|
||||
.box-desc {
|
||||
.content {
|
||||
@@ -889,11 +884,10 @@ span {
|
||||
}
|
||||
.table td {
|
||||
padding: 14px 20px;
|
||||
font-family: "Shopee medium";
|
||||
}
|
||||
.table td:first-child {
|
||||
width: 230px;
|
||||
font-family: "Shopee Bold";
|
||||
font-weight: bold;
|
||||
font-weight: inherit;
|
||||
}
|
||||
.table tr {
|
||||
@@ -917,33 +911,139 @@ span {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
.star-rating {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
.rating-selection {
|
||||
float: left;
|
||||
display: inline;
|
||||
}
|
||||
|
||||
.star-rating input {
|
||||
display: none; /* Ẩn các input radio */
|
||||
}
|
||||
|
||||
.star-rating label {
|
||||
.rating-selection input {
|
||||
float: right;
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
padding: 0;
|
||||
margin: 0 0 0 -15px;
|
||||
opacity: 0;
|
||||
cursor: pointer;
|
||||
width: 45px;
|
||||
height: 45px;
|
||||
margin: 0 5px;
|
||||
background-size: cover;
|
||||
transition: background-image 0.3s ease-in-out;
|
||||
background-image: url("../images/icon-star-gray.png");
|
||||
}
|
||||
|
||||
/* Sao đã chọn, sử dụng hình ảnh ngôi sao màu vàng */
|
||||
.star-rating input:checked ~ label {
|
||||
background-image: url("../images/icon-star-active.png"); /* Đặt hình sao màu vàng khi chọn */
|
||||
.rating-selection .rating-star {
|
||||
position: relative;
|
||||
float: right;
|
||||
display: block;
|
||||
width: 28px;
|
||||
height: 26px;
|
||||
background: url(../images/star_min.png) 0 -33px;
|
||||
cursor: pointer;
|
||||
margin-right: 7px;
|
||||
}
|
||||
|
||||
/* Sao khi hover, thay đổi màu sắc của sao */
|
||||
.star-rating label:hover,
|
||||
.star-rating input:checked ~ label:hover {
|
||||
background-image: url("../images/icon-star-active.png"); /* Thay đổi hình sao khi hover */
|
||||
.rating-selection .rating-star:hover {
|
||||
background-position: 0 0;
|
||||
}
|
||||
|
||||
.rating-selection .rating-star:hover,
|
||||
.rating-star:hover ~ .rating-star {
|
||||
background-position: 0 0;
|
||||
}
|
||||
|
||||
.rating-selection .rating:hover .rating-star:hover,
|
||||
.rating:hover .rating-star:hover ~ .rating-star,
|
||||
.rating-input:checked ~ .rating-star {
|
||||
background-position: 0 0;
|
||||
}
|
||||
|
||||
.form-input {
|
||||
input,
|
||||
textarea {
|
||||
width: 100%;
|
||||
height: 44px;
|
||||
padding: 0 20px;
|
||||
border-radius: 12px;
|
||||
border: 1px solid #c1c1c1;
|
||||
font-size: 13px;
|
||||
color: #9c9c9c;
|
||||
&:focus {
|
||||
outline: 2px solid var(--color-global);
|
||||
border: none;
|
||||
}
|
||||
}
|
||||
textarea {
|
||||
height: 100px;
|
||||
padding: 15px 20px;
|
||||
resize: none;
|
||||
}
|
||||
}
|
||||
|
||||
.padding {
|
||||
border: 1px solid #cdcdcd;
|
||||
width: fit-content;
|
||||
margin: 20px auto 0 auto;
|
||||
border-radius: 4px;
|
||||
a {
|
||||
border-right: 1px solid #cdcdcd;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
text-align: center;
|
||||
line-height: 40px;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
&:last-child {
|
||||
border: 0;
|
||||
}
|
||||
}
|
||||
a:hover,
|
||||
.active {
|
||||
border-radius: 4px;
|
||||
border: 1px solid #1877f2;
|
||||
color: #1877f2;
|
||||
}
|
||||
}
|
||||
|
||||
.select-two-arrow {
|
||||
position: relative;
|
||||
background: #fff;
|
||||
height: 40px;
|
||||
border: 1px solid #d5d5d5;
|
||||
border-radius: 4px;
|
||||
line-height: 40px;
|
||||
select {
|
||||
position: relative;
|
||||
appearance: none;
|
||||
border: 0;
|
||||
background: transparent;
|
||||
outline: 0;
|
||||
width: 100%;
|
||||
padding: 0 30px 0 10px;
|
||||
z-index: 2;
|
||||
}
|
||||
&::before {
|
||||
position: absolute;
|
||||
content: "";
|
||||
right: 7px;
|
||||
top: 5px;
|
||||
width: 11px;
|
||||
height: 17px;
|
||||
background: url(../images/icon_2025.png) no-repeat;
|
||||
background-size: 228px 175px;
|
||||
display: block;
|
||||
background-position: -212px -152px;
|
||||
transform: rotate(270deg);
|
||||
z-index: 1;
|
||||
}
|
||||
&::after {
|
||||
position: absolute;
|
||||
content: "";
|
||||
right: 7px;
|
||||
bottom: 5px;
|
||||
width: 11px;
|
||||
height: 17px;
|
||||
background: url(../images/icon_2025.png) no-repeat;
|
||||
background-size: 228px 175px;
|
||||
display: block;
|
||||
background-position: -212px -152px;
|
||||
transform: rotate(90deg);
|
||||
z-index: 1;
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user