delf/agroexpert
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

add landing

Browse Source
This commit is contained in:
AK Delfin
2025-06-19 16:12:53 +03:00
parent cd0c2b9f97
commit 0c4e403479
13 changed files with 469 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

33
frontend/src/styles/rfo/article.css
View File

@@ -28,7 +28,8 @@
flex-shrink: 0;
height: 409px;
width: 397px;
background: #f1f3eb; /* пример фона */
background: #f1f3eb; /* пример фона */
/* МАСКА через встроенный data URI */
-webkit-mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 387 409"><path fill-rule="evenodd" clip-rule="evenodd" d="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" fill="black"/></svg>');
@@ -40,6 +41,34 @@
mask-size: cover;
}
.item-rfo-zh{
fill: var(--zheltyy);
background: var(--zheltyy);
}
.item-rfo-zel{
fill: var(--zelenyy);
background: var(--zelenyy);
}
.item-rfo-orange{
position: relative;
flex-shrink: 0;
height: 409px;
width: 397px;
background: #f1f3eb; /* пример фона */
-webkit-mask-image: url('/wp-content/themes/agroexpert/frontend/img/orange-article.svg');
-webkit-mask-repeat: no-repeat;
-webkit-mask-size: cover;
mask-image: url('/wp-content/themes/agroexpert/frontend/img/orange-article.svg');
mask-repeat: no-repeat;
mask-size: cover;
}
.post-title__rfo{
font-family: var(--second-family);
font-weight: 700;
@@ -120,8 +149,6 @@
display: flex;
flex-direction: column;
justify-content: center; /* центрирование по горизонтали */
width: ;
}
.pagination__rfo {

133
frontend/src/styles/rfo/landing.css Normal file
View File

@@ -0,0 +1,133 @@
.header-rfo__landing{
width: 100%;
height: 728px;
background-image: url('https://agroexpert.press/wp-content/themes/agroexpert/frontend/img/rfo-landing.png');
background-size: cover; /* Заполняет весь блок, обрезая края */
background-repeat: no-repeat;
background-position: center;
}
.rfo-rubrics-line{
display: flex;
gap: 28px;
}
.end-interview__wrapper{
display: flex;
flex-direction: column;
gap: 20px;
}
.land-cart-title{
display: flex;
padding: 2px 12px;
}
.land-cart-title__text{
flex-grow: 1;
font-family: var(--second-family);
font-weight: 700;
font-size: 1.8em;
line-height: 150%;
text-transform: uppercase;
color: #000;
}
.land-cart-title__arrow{
width: 24px;
height: 24px;
margin-left: 16px;
background-image: url('https://agroexpert.press/wp-content/themes/agroexpert/frontend/img/lang-arrow.svg');
background-repeat: no-repeat;
background-position: center;
transition: transform 0.3s ease;
}
.land-title__arrow{
width: 24px;
height: 24px;
margin-left: 8px;
background-image: url('https://agroexpert.press/wp-content/themes/agroexpert/frontend/img/lang-arrow.svg');
}
.landing-block__rfo{
display: flex;
flex-direction: column;
gap: 22px;
}
.about-block__rfo{
display: flex;
width: 1200px;
justify-content: center; /* горизонтальное центрирование */
align-items: center; /* вертикальное центрирование * /* важно задать высоту */
margin: 25px 0;
}
.about-block_content__rfo{
display: flex;
flex-direction: column;
flex: 1;
gap: 28px;
margin: 22px 0;
max-width: 100%;
padding: 8px;
}
.about-block_title__rfo{
display: flex;
gap: 8px;
align-items: center;
}
.about-block_name__rfo{
font-family: var(--second-family);
font-weight: 700;
font-size: 2.2em;
line-height: 150%;
text-transform: uppercase;
color: #000;
}
.about-block-slogan__rfo{
flex: 0 0 30%;
font-family: var(--second-family);
font-weight: 700;
font-size: 1.6rem;
line-height: 150%;
text-transform: uppercase;
color: #006842;
margin-left: 28px;
}
@media (max-width: 768px) {
.header-rfo__landing{
width: 100%;
height: 289px;
background-image: url('https://agroexpert.press/wp-content/themes/agroexpert/frontend/img/rfo-landing-mob.png');
}
.rfo-rubrics-line{
flex-direction: column;
}
.about-block__rfo{
flex-direction: column;
}
.about-block_content__rfo,
.about-block-slogan__rfo{
flex: 1 1 100%; /* На всю ширину */
width: 100%; /* На всякий случай */
}
}

27
frontend/src/styles/rfo/rfo.css
View File

@@ -1,3 +1,15 @@
:root {
--belyy: #fff;
--zheltyy: #ffdb96;
--zelenyy: #c9fec8;
--zelenyy-2: #006842;
--oranzhevyy: #f18917;
--001: #101828;
--seryy: #c4d3d9;
--2: #f1f3eb;
--tekst: #2f2f2f;
}
.header-rfo {
width: 100%;
height: 400px;
@@ -54,6 +66,17 @@
/**width: 1200px;
max-width: 1200px;**/
}
.content-rfo-land{
display: flex;
flex-direction: column;
margin-top: -22px;
padding-bottom: 42px;
/**width: 1200px;
max-width: 1200px;**/
}
.content-rfo-min{
margin-top: -222px;
border: 0;
@@ -145,6 +168,10 @@
@media (max-width: 768px) {
.content-rfo-land{
margin-top: -22px;
}
.header__inner_rfo{
flex-direction: row;