From fea2c31c2c6411fe2d5401e4f67299ca8497827f Mon Sep 17 00:00:00 2001 From: blue Date: Thu, 22 Aug 2019 16:37:58 +0300 Subject: [PATCH] =?UTF-8?q?=D1=80=D0=B0=D0=B7=D0=BC=D1=8B=D1=82=D1=8B?= =?UTF-8?q?=D0=B5=20=D0=BA=D0=B0=D1=80=D1=82=D0=BE=D1=87=D0=BA=D0=B8=20?= =?UTF-8?q?=D0=BF=D0=BE=D0=B4=20=D1=82=D0=B5=D0=BA=D1=81=D1=82=D0=BE=D0=BC?= =?UTF-8?q?=20=D0=BD=D0=B0=D0=B4=20=D0=B8=D0=B7=D0=BE=D0=B1=D1=80=D0=B0?= =?UTF-8?q?=D0=B6=D0=B5=D0=BD=D0=B8=D0=B5=D0=BC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- css/style.css | 67 +++++++++++++++++++++++++++++++++- index.html | 95 ++++++++++++++++++++++++++++++++++++++++++------- sass/style.scss | 67 +++++++++++++++++++++++++++++++++- 3 files changed, 215 insertions(+), 14 deletions(-) diff --git a/css/style.css b/css/style.css index 0e5d43b..32c302e 100755 --- a/css/style.css +++ b/css/style.css @@ -413,7 +413,7 @@ h1, h2, h3, h4, h5, h6, figure { #fh5co-hero .flexslider .slider-text > .slider-text-inner h1, #fh5co-hero .flexslider .slider-text > .slider-text-inner h2 { margin: 0; padding: 0; - color: black; + color: white; font-family: "Oxygen", sans-serif; } #fh5co-hero .flexslider .slider-text > .slider-text-inner h1 { @@ -1473,4 +1473,69 @@ input[type="text"] { font-weight: 400; } +.blurred-card { + width: 100%; + height: 100%; + position: relative; + box-shadow: 2px 2px 9px 2px black; + overflow: hidden; + color: white; + padding: 20px; +} + +.blurred-card > .background-faker { + position: absolute; + top: 0; + left: 0; + background: black; + width: 100%; + height: 100%; +} + +.blurred-card > .background-faker > div { + width: calc(100vw - 15px); + height: 500px; + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + background-repeat: no-repeat; + background-position: bottom center; + background-size: cover; + filter: blur(10px); + opacity: 0.6; + max-width: 1060px; +} + +.col-md-pull-3 .blurred-card > .background-faker > div { + left: calc(-1 * (15px + 2em)); + right: auto; + transform: translate(0, -50%); +} + +.col-md-push-3 .blurred-card > .background-faker > div { + right: calc(-1 * (15px + 2em)); + left: auto; + transform: translate(0, -50%); +} + +@media screen and (max-width: 992px) { + .col-md-push-3 .blurred-card > .background-faker > div, + .col-md-pull-3 .blurred-card > .background-faker > div + { + right: auto; + left: calc(-1 * (15px + 2em)); + transform: translate(0, -50%); + } +} + +.blurred-card > .card-content { + position: absolute; + width: 100%; + height: 100%; + top: 0; + left: 0; + padding: 20px; +} + /*# sourceMappingURL=style.css.map */ diff --git a/index.html b/index.html index f7d7246..b5b2b15 100755 --- a/index.html +++ b/index.html @@ -76,10 +76,28 @@
-

Огорчи силовика
— удаляйся из ВК!

-

Привычные централизованные соцсети не защитят вас от произвола и слежки

-

Сбежать - Узнать подробности

+
+ +

Огорчи силовика
— удаляйся из ВК!

+

Привычные централизованные соцсети не защитят вас от произвола и слежки

+

Сбежать + Узнать подробности

+
+
+
+
+

Огорчи силовика
— удаляйся из ВК!

+

Привычные централизованные соцсети не защитят вас от произвола и слежки

+

Сбежать + Узнать подробности

+
+
@@ -91,10 +109,28 @@
-

Надоело быть товаром?

+
+ +

Надоело быть товаром?

Вконтакте, Facebook, Instagram — цинично торгуют данными своих пользователей. Вы - товар!

-

Освободиться - Узнать подробности

+

Освободиться + Узнать подробности

+
+
+
+
+

Надоело быть товаром?

+

Вконтакте, Facebook, Instagram — цинично торгуют данными своих пользователей. Вы - товар!

+

Освободиться + Узнать подробности

+
+
@@ -106,10 +142,28 @@
-

Что делать с корпоративной слежкой?

-

Корпорации Mail.ru (ВК, OK, Mail), Facebook (Instagram, WhatsApp) - и Google следят за вами

+
+ +

Что делать с корпоративной слежкой?

+

Корпорации Mail.ru (ВК, OK, Mail), Facebook (Instagram, WhatsApp) + и Google следят за вами

Спрятаться Узнать больше

+
+
+
+
+

Что делать с корпоративной слежкой?

+

Корпорации Mail.ru (ВК, OK, Mail), Facebook (Instagram, WhatsApp) + и Google следят за вами

+

Спрятаться Узнать больше

+
+
@@ -121,9 +175,26 @@
-

Стать невидимкой, но только для Большого Брата

-

Общайтесь с друзьями, без цензуры и слежки!

+
+ +

Стать невидимкой, но только для Большого Брата

+

Общайтесь с друзьями, без цензуры и слежки!

Приступить Узнать больше

+
+
+
+
+

Стать невидимкой, но только для Большого Брата

+

Общайтесь с друзьями, без цензуры и слежки!

+

Приступить Узнать больше

+
+
diff --git a/sass/style.scss b/sass/style.scss index 877aaa1..303c29c 100755 --- a/sass/style.scss +++ b/sass/style.scss @@ -492,7 +492,7 @@ h1, h2, h3, h4, h5, h6, figure { h1, h2 { margin: 0; padding: 0; - color: rgba(0,0,0,1); + color: white; font-family: $font-primary; } h1 { @@ -1479,4 +1479,69 @@ input[type="text"] { } } } +} + +.blurred-card { + width: 100%; + height: 100%; + position: relative; + box-shadow: 2px 2px 9px 2px black; + overflow: hidden; + color: white; + padding: 20px; +} + +.blurred-card > .background-faker { + position: absolute; + top: 0; + left: 0; + background: black; + width: 100%; + height: 100%; +} + +.blurred-card > .background-faker > div { + width: calc(100vw - 15px); + height: 500px; + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + background-repeat: no-repeat; + background-position: bottom center; + background-size: cover; + filter: blur(10px); + opacity: 0.6; + max-width: 1060px; +} + +.col-md-pull-3 .blurred-card > .background-faker > div { + left: calc(-1 * (15px + 2em)); + right: auto; + transform: translate(0, -50%); +} + +.col-md-push-3 .blurred-card > .background-faker > div { + right: calc(-1 * (15px + 2em)); + left: auto; + transform: translate(0, -50%); +} + +@media screen and (max-width: 992px) { + .col-md-push-3 .blurred-card > .background-faker > div, + .col-md-pull-3 .blurred-card > .background-faker > div + { + right: auto; + left: calc(-1 * (15px + 2em)); + transform: translate(0, -50%); + } +} + +.blurred-card > .card-content { + position: absolute; + width: 100%; + height: 100%; + top: 0; + left: 0; + padding: 20px; } \ No newline at end of file