TPS
/
tps-site
4
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

about page new block

This commit is contained in:
Meylis Gazakow 2022-06-02 13:42:12 +03:00
parent c4fd63d19c
commit ebc91ed2a8
6 changed files with 319 additions and 68 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

185
about.html
View File

@ -175,7 +175,7 @@
<!-- Breadcrumb end ============================= -->
<!-- About ================================= -->
<section class="about page">
<section class="about page pb0">
<div class="auto_container">
<div class="about_wrap">
<p class="about_txt wow fadeInUp" data-wow-duration="1s" data-wow-delay=".1s">
@ -200,86 +200,176 @@
«Ашхабад», организация и оформление выставки нефтегазовых компаний, печать журнала «Лачин» и пр.
</p>
<!-- <ul class="about_list wow fadeInUp" data-wow-duration="1s" data-wow-delay=".3s">
<li>
<p>
<span>Уникальность.</span> Единственное агентство в стране, где предоставляются все
рекламные услуги в одном месте.
</p>
</li>
<li>
<p>
<span>20 лет опыта работы.</span> Мы выполнили более … проектов для разных секторов и
отраслей, в том числе зарубежных клиентов.
</p>
</li>
<li>
<p>
<span>Полный цикл работ.</span> Разработка, изготовление, размещение и обслуживание
конструкций, стендов, рекламных проектов.
</p>
</li>
<li>
<p>
<span>Большой охват.</span> Владеем наибольшим количеством рекламных площадей столицы и
крупных городов Туркменистана.
</p>
</li>
<li>
<p>
<span>Гарантия размещения.</span> Мы сотрудничаем с государственными органами и соблюдаем
законодательство.
</p>
</li>
<li>
<p>
<span>Рекламные носители.</span> Большой выбор от простых мобильных до технически сложных
мультимедийных конструкций.
</p>
</li>
</ul> -->
</div>
</div>
</section>
<!-- About end ============================= -->
<!-- About ============================= -->
<section class="about page p0">
<div class="auto_container">
<div class="about_wrap">
<h4 class="main_title">
Преимущества:
</h4>
</div>
</div>
<ul class="about_list wow fadeInUp" data-wow-duration="1s" data-wow-delay=".3s">
<li>
<p>
<span>Уникальность.</span> Единственное агентство в стране, где предоставляются все рекламные услуги в одном месте.
<div class="about_box">
<div class="auto_container">
<div class="about_box-inner">
<div class="about_box-item">
<h6 class="about_box-item-title">
Уникальность.
</h6>
<p class="about_box-item-txt">
Единственное агентство в стране, где предоставляются все рекламные услуги в одном месте.
</p>
</li>
<li>
<p>
<span>20 лет опыта работы.</span> Мы выполнили более … проектов для разных секторов и отраслей, в том числе зарубежных клиентов.
</div>
<div class="about_box-item">
<h6 class="about_box-item-title">
20 лет опыта работы.
</h6>
<p class="about_box-item-txt">
Мы выполнили более … проектов для разных секторов и отраслей, в том числе зарубежных
клиентов.
</p>
</li>
<li>
<p>
<span>Полный цикл работ.</span> Разработка, изготовление, размещение и обслуживание конструкций, стендов, рекламных проектов.
</div>
<div class="about_box-item">
<h6 class="about_box-item-title">
Полный цикл работ.
</h6>
<p class="about_box-item-txt">
Разработка, изготовление, размещение и обслуживание конструкций, стендов, рекламных
проектов.
</p>
</li>
<li>
<p>
<span>Большой охват.</span> Владеем наибольшим количеством рекламных площадей столицы и крупных городов Туркменистана.
</div>
<div class="about_box-item">
<h6 class="about_box-item-title">
Большой охват.
</h6>
<p class="about_box-item-txt">
Владеем наибольшим количеством рекламных площадей столицы и крупных городов Туркменистана.
</p>
</li>
<li>
<p>
<span>Гарантия размещения.</span> Мы сотрудничаем с государственными органами и соблюдаем законодательство.
</div>
<div class="about_box-item">
<h6 class="about_box-item-title">
Гарантия размещения.
</h6>
<p class="about_box-item-txt">
Мы сотрудничаем с государственными органами и соблюдаем законодательство.
</p>
</li>
<li>
<p>
<span>Рекламные носители.</span> Большой выбор от простых мобильных до технически сложных мультимедийных конструкций.
</div>
<div class="about_box-item">
<h6 class="about_box-item-title">
Рекламные носители.
</h6>
<p class="about_box-item-txt">
Большой выбор от простых мобильных до технически сложных мультимедийных конструкций.
</p>
</li>
</ul>
</div>
</div>
</div>
</div>
</section>
<!-- About end ============================= -->
<!-- About ============================= -->
<section class="about page pt0">
<div class="auto_container">
<div class="about_wrap">
<h4 class="main_title">
Почему стоит выбрать нашу компанию?
Почему стоит выбрать нашу компанию?
</h4>
<ul class="about_list wow fadeInUp" data-wow-duration="1s" data-wow-delay=".3s">
<li>
<p>
<span>Доверие партнеров</span> – мы - несомненный лидер в рекламной, маркетинговой и печатной индустрии Туркменистана.
<span>Доверие партнеров</span> – мы - несомненный лидер в рекламной, маркетинговой и
печатной индустрии Туркменистана.
</p>
</li>
<li>
<p>
<span>Индивидуальный подход</span> – работаем с клиентами разных ниш и с разными рекламными бюджетами.
<span>Индивидуальный подход</span> – работаем с клиентами разных ниш и с разными рекламными
бюджетами.
</p>
</li>
<li>
<p>
<span>Программа лояльности</span> – став нашим постоянным клиентом, вы получите скидки и специальные предложения.
<span>Программа лояльности</span> – став нашим постоянным клиентом, вы получите скидки и
специальные предложения.
</p>
</li>
<li>
<p>
<span>Лучшие цены на рекламу</span> – предлагаем самое выгодное соотношение цены и качества на рынке.
<span>Лучшие цены на рекламу</span> – предлагаем самое выгодное соотношение цены и качества
на рынке.
</p>
</li>
<li>
<p>
<span>Любая сложность исполнения</span> – большой опыт работы и сильная команда позволяет браться за любой проект.
<span>Любая сложность исполнения</span> – большой опыт работы и сильная команда позволяет
браться за любой проект.
</p>
</li>
<li>
<p>
<span>Инновации и успех</span> – используем современные технологии, адаптированные под конкретный проект или кампанию.
<span>Инновации и успех</span> – используем современные технологии, адаптированные под
конкретный проект или кампанию.
</p>
</li>
</ul>
@ -307,23 +397,6 @@
</p>
</li>
</ul>
<!-- <p class="about_txt wow fadeInUp" data-wow-duration="1s" data-wow-delay=".4s">
Рекламное агентство «TPS» сегодня является несомненным лидером в рекламной, маркетинговой и печатной
индустрии Туркменистана. Агентство выполняет полный цикл работ по различным видам наружной рекламы:
от дизайна до монтажа и обслуживания внешней и внутренней рекламы, оформления выставочных стендов.
Кроме того, мы предоставляем услуги по маркетинговым исследованиям и размещению рекламы в средствах
массовой информации, проведении мероприятий, запуску новой продукции и другим рекламным проектам.
</p>
<p class="about_txt wow fadeInUp" data-wow-duration="1s" data-wow-delay=".5s">
Индивидуальный подход к каждому клиенту обеспечил «TPS» крупными контрактами на дизайн, печать,
производство и установку выставочных павильонов ряду ведущих компаний на национальных и
международных выставках. Среди выполненных проектов – оформление международного аэропорта «Ашхабад»,
организация и оформление выставки нефтегазовых компаний, печать журнала «Лачин» и пр.
</p> -->
</div>
</div>
</section>

45
assets/css/components/2-layout/responsive.scss
View File

@ -393,6 +393,25 @@
height: 385px;
}
}
}
// About Page ====================
.about.page {
.about {
&_box {
&-item {
&-title {
font-size: 18px;
}
&-txt {
font-size: 14px;
}
}
}
}
}
// Contact ===============
@ -467,6 +486,17 @@
}
}
}
// About Page ====================
.about.page {
.about {
&_box {
&-item {
width: calc(50% - 82px);
}
}
}
}
}
// 750 ========================
@ -713,11 +743,11 @@
}
.main_title {
font-size: 18px;
font-size: 20px;
}
}
// 600 =======================
// 650 =======================
@include md-sm {
// Gallery ==============
@ -782,6 +812,17 @@
}
}
}
// About Page ====================
.about.page {
.about {
&_box {
&-item {
width: calc(100% - 82px);
}
}
}
}
}
// 400 ===========================

71
assets/css/components/3-page/about.scss
View File

@ -1,6 +1,6 @@
// About ================
.about.page {
padding: 50px 0 100px;
padding: 50px 0 0;
.about {
&_txt {
@ -11,16 +11,67 @@
margin-bottom: 30px;
}
&_box {
background: linear-gradient(0deg, rgba(0, 0, 0, .7), rgba(0, 0, 0, .7)), url("../images/blur-bg.jpg") no-repeat center;
background-size: cover;
margin-bottom: 50px;
position: relative;
padding: 80px 0;
&::after {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
backdrop-filter: blur(15px);
z-index: 1;
}
&-inner {
display: flex;
flex-wrap: wrap;
z-index: 5;
position: relative;
}
&-item {
width: calc(33.33% - 82px);
margin: 20px;
text-align: center;
padding: 30px 20px;
border: .5px solid hsla(0, 0%, 100%, .3);
;
border-radius: 12px;
color: #fff;
&-title {
font-size: 22px;
font-weight: 400;
line-height: 1.4;
}
&-txt {
margin-top: 20px;
font-size: 16px;
font-weight: 400;
line-height: 1.4;
}
}
}
}
}
.main_title {
padding-left: 25px;
position: relative;
font-size: 22px;
font-size: 25px;
font-weight: 500;
line-height: 1.4;
margin: 15px 0 25px;
margin: 45px 0 30px;
&::before {
content: '';
@ -29,7 +80,19 @@
left: 0;
width: 3px;
height: 100%;
max-height: 30px;
max-height: 35px;
background: $main-color;
}
}
.p0 {
padding: 0 !important;
}
.pt0 {
padding-top: 0 !important;
}
.pb0 {
padding-bottom: 0 !important;
}

1
assets/css/components/3-page/home.scss
View File

@ -282,7 +282,6 @@
&_box {
display: flex;
}
&_info {

85
assets/css/main.css
View File

@ -1760,7 +1760,7 @@ svg.active .svg-elem-21 {
}
.about.page {
padding: 50px 0 100px;
padding: 50px 0 0;
}
.about.page .about_txt {
font-weight: 400;
@ -1769,14 +1769,62 @@ svg.active .svg-elem-21 {
color: #000000;
margin-bottom: 30px;
}
.about.page .about_box {
background: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, 0.7)), to(rgba(0, 0, 0, 0.7))), url("../images/blur-bg.jpg") no-repeat center;
background: linear-gradient(0deg, rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)), url("../images/blur-bg.jpg") no-repeat center;
background-size: cover;
margin-bottom: 50px;
position: relative;
padding: 80px 0;
}
.about.page .about_box::after {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
-webkit-backdrop-filter: blur(15px);
backdrop-filter: blur(15px);
z-index: 1;
}
.about.page .about_box-inner {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
z-index: 5;
position: relative;
}
.about.page .about_box-item {
width: calc(33.33% - 82px);
margin: 20px;
text-align: center;
padding: 30px 20px;
border: 0.5px solid hsla(0deg, 0%, 100%, 0.3);
border-radius: 12px;
color: #fff;
}
.about.page .about_box-item-title {
font-size: 22px;
font-weight: 400;
line-height: 1.4;
}
.about.page .about_box-item-txt {
margin-top: 20px;
font-size: 16px;
font-weight: 400;
line-height: 1.4;
}
.main_title {
padding-left: 25px;
position: relative;
font-size: 22px;
font-size: 25px;
font-weight: 500;
line-height: 1.4;
margin: 15px 0 25px;
margin: 45px 0 30px;
}
.main_title::before {
content: "";
@ -1785,10 +1833,22 @@ svg.active .svg-elem-21 {
left: 0;
width: 3px;
height: 100%;
max-height: 30px;
max-height: 35px;
background: #2B72B6;
}
.p0 {
padding: 0 !important;
}
.pt0 {
padding-top: 0 !important;
}
.pb0 {
padding-bottom: 0 !important;
}
.gallery {
padding: 100px 0;
}
@ -2819,6 +2879,13 @@ svg.active .svg-elem-21 {
height: 385px;
}
.about.page .about_box-item-title {
font-size: 18px;
}
.about.page .about_box-item-txt {
font-size: 14px;
}
.contact_box {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
@ -2866,6 +2933,10 @@ svg.active .svg-elem-21 {
.service.page .service_box .slick-list {
padding: 0 170px 0 0 !important;
}
.about.page .about_box-item {
width: calc(50% - 82px);
}
}
@media (max-width: 750px) {
.header .logo_bg {
@ -3026,7 +3097,7 @@ svg.active .svg-elem-21 {
}
.main_title {
font-size: 18px;
font-size: 20px;
}
}
@media (max-width: 650px) {
@ -3075,6 +3146,10 @@ svg.active .svg-elem-21 {
.service.page .service_list li p {
line-height: 28px;
}
.about.page .about_box-item {
width: calc(100% - 82px);
}
}
@media (max-width: 400px) {
.auto_container {

BIN
assets/images/blur-bg.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 817 KiB