add styles interview
This commit is contained in:
@@ -23,6 +23,7 @@
|
||||
border-style: solid; /* Общий стиль для всех сторон */
|
||||
border-color: white; /* Общий цвет */
|
||||
border-radius: 14px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.article-short-wrapper__rfo{
|
||||
@@ -32,21 +33,23 @@
|
||||
border-style: solid; /* Общий стиль для всех сторон */
|
||||
border-color: white; /* Общий цвет */
|
||||
border-radius: 14px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.article-item-rfo{
|
||||
position: relative;
|
||||
|
||||
height: 409px;
|
||||
width: 397px;
|
||||
width: 390px;
|
||||
background: #f1f3eb; /* пример фона */
|
||||
/* clip-path: path('M8.79428 0L378.205 0C383.042 0 386.999 3.9499 386.999 8.77793V34.6476V374.353V400.222C386.999 405.05 383.042 409 378.205 409H225.707C219.54 409 218.385 405.144 215.499 400.222L209.392 389.805C207.382 386.378 203.127 383.509 199.559 383.13H8.79426C3.95665 383.13 0 379.181 0 374.352V8.77756C0 3.94952 3.95667 0 8.79428 0Z');*/
|
||||
-webkit-mask-image: var(--article-item-mask);
|
||||
clip-path: path('M6.79428 0L380.205 0C385.042 0 388.999 3.9499 388.999 8.77793V34.6476V374.353V400.222C388.999 405.05 385.042 409 380.205 409H227.707C221.54 409 220.385 405.144 217.499 400.222L211.392 389.805C209.382 386.378 205.127 383.509 201.559 383.13H6.79426C1.95665 383.13 -2 379.181 -2 374.352V8.77756C-2 3.94952 1.95667 0 6.79428 0Z'); /** -webkit-mask-image: var(--article-item-mask);
|
||||
-webkit-mask-repeat: no-repeat;
|
||||
-webkit-mask-size: cover;
|
||||
mask-image: var(--article-item-mask);
|
||||
mask-repeat: no-repeat;
|
||||
mask-size: cover;
|
||||
mask-size: cover;**/
|
||||
|
||||
|
||||
}
|
||||
|
||||
.article-short-rfo{
|
||||
@@ -65,6 +68,7 @@
|
||||
clip-path: inset(0 round 10px); Скругление углов (поддержка хуже) */
|
||||
}
|
||||
|
||||
|
||||
.item-rfo-zh{
|
||||
fill: var(--zheltyy);
|
||||
background: var(--zheltyy);
|
||||
|
||||
42
frontend/src/styles/rfo/interview.css
Normal file
42
frontend/src/styles/rfo/interview.css
Normal file
@@ -0,0 +1,42 @@
|
||||
.rfo-stack {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
max-width: 373px;
|
||||
height: 280px;
|
||||
overflow: hidden;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.rfo-svg-bg {
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
z-index: 1;
|
||||
pointer-events: none;
|
||||
background: url("data:image/svg+xml;utf8,<svg viewBox='0 0 373 205' xmlns='http://www.w3.org/2000/svg' preserveAspectRatio='none'><rect x='354.893' y='205' width='336.786' height='162' rx='10' transform='rotate(-180 354.893 205)' fill='%23D5D5D5' fill-opacity='0.3'/><rect x='362.136' y='193' width='351.272' height='170' rx='10' transform='rotate(-180 362.136 193)' fill='%23D5D5D5' fill-opacity='0.3'/><rect x='373' y='180' width='373' height='180' rx='10' transform='rotate(-180 373 180)' fill='%23D5D5D5' fill-opacity='0.3'/></svg>") no-repeat center / 100% 100%;
|
||||
}
|
||||
|
||||
.rfo-stack-img {
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
height: 210px;
|
||||
overflow: hidden;
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
.rfo-stack-img picture,
|
||||
.rfo-stack-img img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
display: block;
|
||||
}
|
||||
|
||||
@media (max-width: 480px) {
|
||||
.rfo-stack {
|
||||
height: 340px;
|
||||
}
|
||||
.rfo-stack-img {
|
||||
height: 250px;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -20,7 +20,7 @@
|
||||
|
||||
.land-cart-title{
|
||||
display: flex;
|
||||
padding: 2px 12px;
|
||||
padding: 12px 12px;
|
||||
}
|
||||
|
||||
|
||||
@@ -112,6 +112,7 @@
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
@media (min-width: 768px) and (max-width: 1024px) {
|
||||
|
||||
|
||||
Reference in New Issue
Block a user