polished template
This commit is contained in:
@@ -1,26 +1,34 @@
|
||||
.inverted-radius-wrapper:before {
|
||||
content: '';
|
||||
display: block;
|
||||
width: 40px;
|
||||
height: 25px;
|
||||
background-color: transparent;
|
||||
border-radius: 0 0 0 25px;
|
||||
box-shadow: calc(15px * -0.5) calc(15px * 0.5) 0 0 #f9f9f9;
|
||||
position: absolute;
|
||||
z-index: -1;
|
||||
left: -1px;
|
||||
bottom: 100%;
|
||||
|
||||
.pagination-item[data-active="true"] {
|
||||
flex: 2;
|
||||
}
|
||||
.inverted-radius-wrapper:after {
|
||||
content: '';
|
||||
display: block;
|
||||
width: 40px;
|
||||
height: 25px;
|
||||
background-color: transparent;
|
||||
border-radius: 0 0 0 25px;
|
||||
box-shadow: calc(15px * -0.5) calc(15px * 0.5) 0 0 #f9f9f9;
|
||||
position: absolute;
|
||||
z-index: -1;
|
||||
left: calc(100% - 1px);
|
||||
bottom: 0;
|
||||
|
||||
.pagination-item[data-active="false"] .pagination-line {
|
||||
background: #e0e0e0;
|
||||
}
|
||||
.pagination-item[data-active="true"] .pagination-line {
|
||||
background: #222;
|
||||
}
|
||||
|
||||
.dark .pagination-item[data-active="false"] .pagination-line {
|
||||
background: rgba(248, 248, 248, 0.15);
|
||||
}
|
||||
.dark .pagination-item[data-active="true"] .pagination-line {
|
||||
background: linear-gradient(90deg, rgba(250, 248, 245, 0.7) 0%, rgba(250, 248, 245, 0.7) 100%);
|
||||
}
|
||||
|
||||
.pagination-item[data-active="true"] .slide-text {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.inverted-radius{
|
||||
-webkit-mask: url('data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20648%20575%22%3E%3Cpath%20d%3D%22M0%2C0H648A0%2C0%200%2C0%2C1%20648%2C0V575A0%2C0%200%2C0%2C1%20648%2C575H130A20%2C20%200%2C0%2C1%20110%2C555L110%2C535A20%2C20%200%2C0%2C0%2090%2C515L20%2C515A20%2C20%200%2C0%2C1%200%2C495V0A0%2C0%200%2C0%2C1%200%2C0Z%22%20fill%3D%22%23fff%22%20%2F%3E%3C%2Fsvg%3E') no-repeat center / contain;
|
||||
mask: url('data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20648%20575%22%3E%3Cpath%20d%3D%22M0%2C0H648A0%2C0%200%2C0%2C1%20648%2C0V575A0%2C0%200%2C0%2C1%20648%2C575H130A20%2C20%200%2C0%2C1%20110%2C555L110%2C535A20%2C20%200%2C0%2C0%2090%2C515L20%2C515A20%2C20%200%2C0%2C1%200%2C495V0A0%2C0%200%2C0%2C1%200%2C0Z%22%20fill%3D%22%23fff%22%20%2F%3E%3C%2Fsvg%3E') no-repeat center / contain;
|
||||
width: 648px;
|
||||
background-color: #ffffff;
|
||||
aspect-ratio: 648 / 575;
|
||||
}
|
||||
|
||||
.radient-bg {
|
||||
background: linear-gradient(180deg, #f9f9f9 69.59%, #ededed 100%);
|
||||
}
|
||||
Reference in New Issue
Block a user