diff --git a/static/css/styles(boris).css b/static/css/styles(boris).css index e61ad49..af167ea 100644 --- a/static/css/styles(boris).css +++ b/static/css/styles(boris).css @@ -993,29 +993,56 @@ text-decoration: none; } + +.container_subscribe.second{ + display: inline-block; +} + +.container_subscribe.third{ + float: right; + margin-right: 0; +} + .container_subscribe{ - width: 31%; - background: #FFFFFF; + width: 26%; border-radius: 10px; padding: 2%; + box-shadow: -1px 4px 10px 0 rgba(198, 199, 203, 0.20), 0 -1px 10px 0 rgba(198, 199, 203, 0.20); + margin-right: 5%; } .container_subscribe.first{ float: left; } +.container_subscribe.light{ + background: #FFFFFF; +} + +.container_subscribe.dark{ + background: #272424; +} + +.container_subscribe.light .first-decr-subscribe{ + color: #000000; +} + .first-decr-subscribe{ width: 100%; text-align: center; font-size: 24px; font-weight: 700; - color: #000000; padding-bottom: 20px; border-bottom: 2px solid #FF613A; } +.container_subscribe.dark .first-decr-subscribe{ + color: #FFFFFF; +} + .price_subscribe{ color: #FF613A; + padding-top: 25px; } .period_subscribe{ @@ -1062,16 +1089,26 @@ list-style-image: url("/static/img/svg/galka.svg"); } -.items_subscribe.select{ +.container_subscribe.dark .items_subscribe.select{ + font-size: 16px; + color: #FFFFFF; +} + +.container_subscribe.light .items_subscribe.select{ font-size: 16px; color: #272424; } -.items_subscribe.unselected{ +.container_subscribe.light .items_subscribe.unselected{ color: #E6E6E6; font-size: 16px; } +.container_subscribe.dark .items_subscribe.unselected{ + color: #626262; + font-size: 16px; +} + .items_subscribe.select:before{ content: url(/static/img/svg/galka.svg); } @@ -1083,10 +1120,15 @@ vertical-align: top; } -.items_subscribe.unselected:before{ +.container_subscribe.light .items_subscribe.unselected:before{ content: url(/static/img/svg/cross.svg); } +.container_subscribe.dark .items_subscribe.unselected:before{ + content: url(/static/img/svg/cross.svg); + filter: brightness(0) saturate(100%) invert(29%) sepia(0%) saturate(6232%) hue-rotate(340deg) brightness(110%) contrast(60%); +} + .items_subscribe > text{ display: inline-block; padding-left: 4%; @@ -1094,5 +1136,15 @@ } .items_subscribe{ - padding-bottom: 5px; + padding-bottom: 10px; +} + +.arrange_subscribe{ + background: #FF613A; + height: 60px; + padding: 20px 35px 20px 35px; + color: #FFFFFF; + border-radius: 10px; + margin-top: 20px; + margin: 20px auto 0 auto; } \ No newline at end of file diff --git a/static/js/chat_sockets.js b/static/js/chat_sockets.js index a0b16e0..38f0bcd 100644 --- a/static/js/chat_sockets.js +++ b/static/js/chat_sockets.js @@ -61,7 +61,12 @@ chatSocket.onmessage = function (e) { } else if (data.type === "echo"){ console.log(data) } else if (data.type === "update_chat"){ - document.querySelector(".container-messages").innerHTML = data.message.html + document.querySelector(".container-messages").innerHTML = data.chat_html + if (data.required_beep === true){ + const beep = new Audio('/static/sounds/beep_2.mp3') + beep.play() + + } } } diff --git a/templates/blocks/profile/b_subscribe.html b/templates/blocks/profile/b_subscribe.html index 6f0451b..2cfd4d7 100644 --- a/templates/blocks/profile/b_subscribe.html +++ b/templates/blocks/profile/b_subscribe.html @@ -18,7 +18,7 @@
-
+
Лайт @@ -26,7 +26,7 @@
2 $
-
+
Период: 24 часа
@@ -45,6 +45,72 @@
+
+ +
+
+
+
+ Лайт +
+
+ 2 $ +
+
+ Период: 24 часа +
+
+
+
+ Опции: +
+
+
    +
  • Просмотр контактов
  • +
  • Размещение заявок
  • +
  • Уведомления на e-mail о появлении перевозчика по заданным критериям
  • +
  • Выделение объявления цветом + 30 поднятий
  • +
  • Push уведомления
  • +
  • СМС уведомления
  • +
+
+
+
+ +
+
+
+
+
+ Лайт +
+
+ 2 $ +
+
+ Период: 24 часа +
+
+
+
+ Опции: +
+
+
    +
  • Просмотр контактов
  • +
  • Размещение заявок
  • +
  • Уведомления на e-mail о появлении перевозчика по заданным критериям
  • +
  • Выделение объявления цветом + 30 поднятий
  • +
  • Push уведомления
  • +
  • СМС уведомления
  • +
+
+
+
+ +
+
+
\ No newline at end of file