Alexander Burdeiny
9 years ago
commit
60401fe4bf
8 changed files with 932 additions and 36 deletions
@ -0,0 +1,581 @@ |
||||
@font-face { |
||||
font-family: dindisplay_pro; |
||||
src: url(../../client/fonts/pfdindisplaypro-med-webfont.eot); |
||||
src: url(../../client/fonts/pfdindisplaypro-med-webfont.eot?#iefix) format('embedded-opentype'), url(../../client/fonts/pfdindisplaypro-med-webfont.woff) format('woff'), url(../../client/fonts/pfdindisplaypro-med-webfont.ttf) format('truetype'), url(../../client/fonts/pfdindisplaypro-med-webfont.svg#pf_dindisplay_promedium) format('svg'); |
||||
font-weight: 500; |
||||
font-style: normal |
||||
} |
||||
@font-face { |
||||
font-family: dindisplay_pro; |
||||
src: url(../../client/fonts/pfdindisplaypro-thin-webfont.eot); |
||||
src: url(../../client/fonts/pfdindisplaypro-thin-webfont.eot?#iefix) format('embedded-opentype'), url(../../client/fonts/pfdindisplaypro-thin-webfont.ttf) format('truetype'), url(../../client/fonts/pfdindisplaypro-thin-webfont.woff) format('woff'); |
||||
font-weight: 100; |
||||
font-style: normal |
||||
} |
||||
@font-face { |
||||
font-family: dindisplay_pro; |
||||
src: url(../../client/fonts/pfdindisplaypro-light-webfont.eot); |
||||
src: url(../../client/fonts/pfdindisplaypro-light-webfont.eot?#iefix) format('embedded-opentype'), url(../../client/fonts/pfdindisplaypro-light-webfont.woff) format('woff'), url(../../client/fonts/pfdindisplaypro-light-webfont.ttf) format('truetype'); |
||||
font-weight: 300; |
||||
font-style: normal |
||||
} |
||||
@font-face { |
||||
font-family: dindisplay_pro; |
||||
src: url(../../client/fonts/pfdindisplaypro-italic-webfont.eot); |
||||
src: url(../../client/fonts/pfdindisplaypro-italic-webfont.eot?#iefix) format('embedded-opentype'), url(../../client/fonts/pfdindisplaypro-italic-webfont.woff) format('woff'), url(../../client/fonts/pfdindisplaypro-italic-webfont.ttf) format('truetype'); |
||||
font-weight: 400; |
||||
font-style: italic |
||||
} |
||||
@font-face { |
||||
font-family: dindisplay_pro; |
||||
src: url(../../client/fonts/pfdindisplaypro-bold-webfont.eot); |
||||
src: url(../../client/fonts/pfdindisplaypro-bold-webfont.eot?#iefix) format('embedded-opentype'), url(../../client/fonts/pfdindisplaypro-bold-webfont.ttf) format('truetype'), url(../../client/fonts/pfdindisplaypro-bold-webfont.woff) format('woff'); |
||||
font-weight: 700; |
||||
font-style: normal |
||||
} |
||||
@font-face { |
||||
font-family: dindisplay_pro; |
||||
src: url(../../client/fonts/pfdindisplaypro-reg-webfont.eot); |
||||
src: url(../../client/fonts/pfdindisplaypro-reg-webfont.eot?#iefix) format('embedded-opentype'), url(../../client/fonts/pfdindisplaypro-reg-webfont.woff) format('woff'), url(../../client/fonts/pfdindisplaypro-reg-webfont.ttf) format('truetype'); |
||||
font-weight: 400; |
||||
font-style: normal |
||||
} |
||||
@font-face { |
||||
font-family: pt_sans; |
||||
src: url(../../client/fonts/pts75f-webfont.eot); |
||||
src: url(../../client/fonts/pts75f-webfont.eot?#iefix) format('embedded-opentype'), url(../../client/fonts/pts75f-webfont.woff) format('woff'), url(../../client/fonts/pts75f-webfont.ttf) format('truetype'); |
||||
font-weight: 700; |
||||
font-style: normal |
||||
} |
||||
@font-face { |
||||
font-family: pt_sans; |
||||
src: url(../../client/fonts/pts55f-webfont.eot); |
||||
src: url(../../client/fonts/pts55f-webfont.eot?#iefix) format('embedded-opentype'), url(../../client/fonts/pts55f-webfont.woff) format('woff'), url(../../client/fonts/pts55f-webfont.ttf) format('truetype'); |
||||
font-weight: 400; |
||||
font-style: normal |
||||
} |
||||
|
||||
*{ |
||||
margin: 0; |
||||
padding: 0; |
||||
font-family: dindisplay_pro, sans-serif; |
||||
box-sizing: border-box; |
||||
} |
||||
|
||||
.container{ |
||||
max-width: 1140px; |
||||
margin: 0 auto; |
||||
} |
||||
|
||||
.page_header{ |
||||
background: url(../images/header.jpg) no-repeat top fixed; |
||||
padding: 16px 0 88px; |
||||
} |
||||
|
||||
h1{ |
||||
color: #fff; |
||||
text-align: center; |
||||
font-size: 50px; |
||||
line-height: 50px; |
||||
font-weight: 400; |
||||
padding-top: 38px; |
||||
} |
||||
|
||||
h2{ |
||||
font-size: 30px; |
||||
font-weight: 400; |
||||
text-align: center; |
||||
margin-bottom: 50px; |
||||
} |
||||
|
||||
h3{ |
||||
font-size: 20px; |
||||
text-transform: uppercase; |
||||
} |
||||
|
||||
.back_to_site{ |
||||
float: right; |
||||
color: #FF6600; |
||||
text-decoration: none; |
||||
font-size: 18px; |
||||
margin-top: 10px; |
||||
} |
||||
|
||||
.back_to_site span{ |
||||
color: #fff; |
||||
transition: color .3s |
||||
} |
||||
|
||||
.back_to_site:hover span{ |
||||
color: #FF6600; |
||||
transition: color .3s; |
||||
} |
||||
|
||||
.themes_block, |
||||
.period_block{ |
||||
background-color: #fbfbfb; |
||||
border-top: 1px solid #ebebeb; |
||||
border-bottom: 1px solid #ebebeb; |
||||
padding-top: 50px; |
||||
} |
||||
|
||||
.subjects_block{ |
||||
padding: 50px 0; |
||||
} |
||||
|
||||
.page_footer{ |
||||
border-top: 1px solid #ebebeb; |
||||
border-bottom: 1px solid #ebebeb; |
||||
text-align: center; |
||||
line-height: 40px; |
||||
font-size: 16px; |
||||
color: #999; |
||||
} |
||||
|
||||
.columns{ |
||||
font-size: 0; |
||||
width: 1045px; |
||||
margin: 0 auto; |
||||
} |
||||
|
||||
.columns .column{ |
||||
display: inline-block; |
||||
} |
||||
|
||||
.themes_block .column{ |
||||
display: inline-block; |
||||
width: 50%; |
||||
vertical-align: top; |
||||
} |
||||
|
||||
.geo_filters{ |
||||
list-style: none; |
||||
background-color: #fff; |
||||
border: 1px solid #ebebeb; |
||||
border-radius: 3px; |
||||
padding: 30px; |
||||
font-size: 16px; |
||||
} |
||||
|
||||
.geo_filters li + li{ |
||||
margin-top: 34px; |
||||
} |
||||
|
||||
.geo_filters li a{ |
||||
font-size: 16px; |
||||
color: #333; |
||||
text-decoration: none; |
||||
display: inline-block; |
||||
border-bottom: 1px dashed #333; |
||||
margin-left: 40px; |
||||
} |
||||
|
||||
.geo_filters li a:hover{ |
||||
border-bottom-color: transparent; |
||||
} |
||||
|
||||
.geo_filters input{ |
||||
display: none; |
||||
} |
||||
|
||||
.geo_filters .moscow{ |
||||
color: #49d026; |
||||
} |
||||
|
||||
.geo_filters .moscow:hover, |
||||
.geo_filters input:checked + .moscow{ |
||||
border-color: #49d026; |
||||
box-shadow: 0 0 0 2px #49d026; |
||||
cursor: pointer; |
||||
} |
||||
|
||||
.geo_filters .rf{ |
||||
color: #ff6600; |
||||
} |
||||
|
||||
.geo_filters .rf:hover, |
||||
.geo_filters input:checked + .rf{ |
||||
border-color: #ff6600; |
||||
box-shadow: 0 0 0 2px #ff6600; |
||||
cursor: pointer; |
||||
} |
||||
|
||||
.geo_filters .foreign{ |
||||
color: #0099ff; |
||||
} |
||||
|
||||
.geo_filters .foreign:hover, |
||||
.geo_filters input:checked + .foreign{ |
||||
border-color: #0099ff; |
||||
box-shadow: 0 0 0 2px #0099ff; |
||||
cursor: pointer; |
||||
} |
||||
|
||||
.geo_filters input + .label{ |
||||
display: inline-block; |
||||
width: 283px; |
||||
padding: 6px 15px; |
||||
border: 1px solid #ebebeb; |
||||
font-size: 20px; |
||||
border-radius: 3px; |
||||
} |
||||
|
||||
.geo_filters input + .label + .geo_checkbox{ |
||||
display: inline-block; |
||||
height: 24px; |
||||
vertical-align: middle; |
||||
margin-left: 20px; |
||||
position: relative; |
||||
} |
||||
|
||||
.geo_filters input + .label + .geo_checkbox:before{ |
||||
content: ""; |
||||
display: inline-block; |
||||
width: 22px; |
||||
height: 22px; |
||||
border-radius: 50%; |
||||
border: 1px solid #e0e0e0; |
||||
position: absolute; |
||||
top: 0; |
||||
left:0; |
||||
transition: border-color .3s; |
||||
} |
||||
|
||||
.geo_filters input + .label + .geo_checkbox:after{ |
||||
content: ''; |
||||
display: block; |
||||
width: 23px; |
||||
height: 22px; |
||||
background: url(../images/checkbox.png); |
||||
position: absolute; |
||||
top: 1px; |
||||
left: 0; |
||||
opacity: 0; |
||||
transition: opacity .3s; |
||||
} |
||||
|
||||
.geo_filters input:checked + .label + .geo_checkbox:before{ |
||||
border-color: #FF6600; |
||||
transition: border-color .3s; |
||||
} |
||||
|
||||
.geo_filters input:checked + .label + .geo_checkbox:after{ |
||||
opacity: 1; |
||||
transition: opacity .3s; |
||||
} |
||||
|
||||
.subjects_block .column{ |
||||
vertical-align: top; |
||||
width: calc(100%/3); |
||||
font-size: 16px; |
||||
} |
||||
|
||||
.subjects_block input, |
||||
.periodic input, |
||||
.mailing_day input{ |
||||
display: none; |
||||
} |
||||
|
||||
.subjects_block input + label, |
||||
.periodic input + .radio{ |
||||
position: relative; |
||||
padding-left: 40px; |
||||
cursor: pointer; |
||||
font-size: 18px; |
||||
} |
||||
|
||||
.subjects_block input + label:before, |
||||
.periodic input + .radio:before, |
||||
.mailing_day input + .radio:before{ |
||||
content: ""; |
||||
display: inline-block; |
||||
width: 22px; |
||||
height: 22px; |
||||
border-radius: 50%; |
||||
border: 1px solid #e0e0e0; |
||||
position: absolute; |
||||
top: 0; |
||||
left:0; |
||||
transition: border-color .3s; |
||||
} |
||||
|
||||
.subjects_block input + label:after, |
||||
.periodic input + .radio:after, |
||||
.mailing_day input + .radio:after{ |
||||
content: ''; |
||||
display: block; |
||||
width: 23px; |
||||
height: 22px; |
||||
background: url(../images/checkbox.png); |
||||
position: absolute; |
||||
top: 1px; |
||||
left: 0; |
||||
opacity: 0; |
||||
transition: opacity .3s; |
||||
} |
||||
|
||||
.subjects_block input:checked + label:before, |
||||
.periodic input:checked + .radio:before, |
||||
.mailing_day input:checked + .radio:before{ |
||||
border-color: #FF6600; |
||||
transition: border-color .3s; |
||||
} |
||||
|
||||
.subjects_block input:checked + label:after, |
||||
.periodic input:checked + .radio:after, |
||||
.mailing_day input:checked + .radio:after{ |
||||
opacity: 1; |
||||
transition: opacity .3s; |
||||
} |
||||
|
||||
.periodic{ |
||||
width: 270px; |
||||
border-right: 1px solid #ebebeb; |
||||
padding-bottom: 45px; |
||||
} |
||||
|
||||
.periodic li{ |
||||
margin-bottom: 17px; |
||||
list-style: none; |
||||
} |
||||
|
||||
.mailing_day{ |
||||
padding-left: 110px; |
||||
padding-top: 20px; |
||||
vertical-align: top; |
||||
} |
||||
|
||||
|
||||
.mailing_day label{ |
||||
display: inline-block; |
||||
font-size: 25px; |
||||
font-weight: 300; |
||||
text-transform: uppercase; |
||||
width: 80px; |
||||
height: 80px; |
||||
background-color: #fff; |
||||
border-radius: 50%; |
||||
box-shadow: 0 7px 32px rgba(25, 25, 25, 0.1); |
||||
-moz-box-shadow: 0 7px 32px rgba(25, 25, 25, 0.1); |
||||
-webkit-box-shadow: 0 7px 32px rgba(25, 25, 25, 0.1); |
||||
-o-box-shadow: 0 7px 32px rgba(25, 25, 25, 0.1); |
||||
position: relative; |
||||
cursor: pointer; |
||||
} |
||||
|
||||
.mailing_day label + label{ |
||||
margin-left: 40px; |
||||
} |
||||
|
||||
.mailing_day input + .radio{ |
||||
display: block; |
||||
text-align: center; |
||||
cursor: pointer; |
||||
line-height: 80px; |
||||
} |
||||
|
||||
.mailing_day input + .radio:before{ |
||||
background-color: #fff; |
||||
} |
||||
|
||||
.mailing_day input + .radio:before, |
||||
.mailing_day input + .radio:after{ |
||||
left: auto; |
||||
right: 0; |
||||
} |
||||
|
||||
.button_block{ |
||||
padding: 62px 0; |
||||
text-align: center; |
||||
} |
||||
|
||||
.button_block button{ |
||||
display: block; |
||||
width: 265px; |
||||
height: 46px; |
||||
margin: 0 auto 26px; |
||||
border: 0; |
||||
background-color: #ff6600; |
||||
border-radius: 3px; |
||||
transition: background-color .3s; |
||||
color: #fff; |
||||
font-size: 19px; |
||||
font-weight: 300; |
||||
text-transform: uppercase; |
||||
cursor: pointer; |
||||
} |
||||
|
||||
.button_block button:hover{ |
||||
background-color: #ff9900; |
||||
transition: background-color .3s; |
||||
} |
||||
|
||||
.button_block a{ |
||||
color: #999; |
||||
font-size: 16px; |
||||
} |
||||
|
||||
.button_block a:hover{ |
||||
text-decoration: none; |
||||
} |
||||
|
||||
.themes_trigger{ |
||||
display: block; |
||||
width: 190px; |
||||
height: 35px; |
||||
line-height: 35px; |
||||
background-color: #FF6600; |
||||
border-radius: 3px; |
||||
font-size: 19px; |
||||
color: #fff; |
||||
text-decoration: none; |
||||
text-align: center; |
||||
font-weight: 300; |
||||
} |
||||
|
||||
.selected{ |
||||
list-style: none; |
||||
font-size: 16px; |
||||
color: #333333; |
||||
font-weight: 100; |
||||
} |
||||
|
||||
.selected li{ |
||||
display: inline-block; |
||||
vertical-align: top; |
||||
border: 1px solid #FF6600; |
||||
border-radius: 3px; |
||||
padding: 6px 8px 6px 15px; |
||||
line-height: 16px; |
||||
margin-bottom: 10px; |
||||
margin-right: 10px; |
||||
} |
||||
|
||||
.selected li a{ |
||||
text-decoration: none; |
||||
margin-left: 15px; |
||||
color: #FF6600; |
||||
font-size: 22px; |
||||
} |
||||
|
||||
.popup-window{ |
||||
padding: 35px 50px 30px; |
||||
width: 640px; |
||||
font-size: 15px; |
||||
} |
||||
|
||||
.popup-window header{ |
||||
padding-bottom: 20px; |
||||
font-size: 35px; |
||||
line-height: 35px; |
||||
color: #f60; |
||||
font-weight: 100; |
||||
} |
||||
|
||||
.scroll-container{ |
||||
max-height: 230px; |
||||
overflow-y: scroll; |
||||
} |
||||
|
||||
.mCSB_scrollTools .mCSB_draggerRail { |
||||
width: 10px; |
||||
background: #dbdbdb; |
||||
border: 1px solid #ccc; |
||||
} |
||||
|
||||
.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { |
||||
width: 8px; |
||||
border: solid #dbdbdb; |
||||
border-width: 2px 1px; |
||||
} |
||||
|
||||
.themes_wrapper{ |
||||
position: relative; |
||||
border: 1px solid #bdbdbd; |
||||
outline: 0; |
||||
width: 100%; |
||||
padding: 3px; |
||||
font-family: dindisplay_pro,sans-serif; |
||||
font-size: 15px; |
||||
line-height: 19px; |
||||
border-radius: 3px; |
||||
box-shadow: inset 0 2px 2px -2px #aaa; |
||||
background-color: #fff; |
||||
} |
||||
|
||||
.wait-ajax{ |
||||
position: absolute; |
||||
top: 0; |
||||
left: 0; |
||||
right: 0; |
||||
bottom: 0; |
||||
background: rgba(191,191,191,.3) url('/static/client/img/ajax-loader.gif') no-repeat center; |
||||
display: none; |
||||
} |
||||
|
||||
.modal_checkboxes{ |
||||
list-style: none; |
||||
padding: 5px 10px; |
||||
} |
||||
|
||||
.modal_checkboxes li + li{ |
||||
margin-top: 4px; |
||||
} |
||||
|
||||
.modal_checkboxes .hidden_checkbox{ |
||||
display: none; |
||||
} |
||||
|
||||
.modal_checkboxes .hidden_checkbox + .custom_checkbox{ |
||||
display: inline-block; |
||||
vertical-align: middle; |
||||
width: 13px; |
||||
height: 13px; |
||||
line-height: 11px; |
||||
border-radius: 3px; |
||||
border: 1px solid #444; |
||||
} |
||||
|
||||
.modal_checkboxes .hidden_checkbox:checked + .custom_checkbox{ |
||||
border-color: #FF6600; |
||||
} |
||||
|
||||
.modal_checkboxes .hidden_checkbox:checked + .custom_checkbox:before{ |
||||
content: '∨'; |
||||
font-size: 10px; |
||||
height: 11px; |
||||
display: block; |
||||
text-align: center; |
||||
color: #FF6600; |
||||
} |
||||
|
||||
.modal_checkboxes .hidden{ |
||||
display: none; |
||||
} |
||||
|
||||
.modal_checkboxes .trigger{ |
||||
padding: 0 0 0 14px; |
||||
color: #464646; |
||||
position: relative; |
||||
} |
||||
|
||||
.modal_checkboxes .trigger:hover{ |
||||
color: #FF6600; |
||||
} |
||||
|
||||
.modal_checkboxes .trigger[data-sub="true"]:before{ |
||||
content: "›"; |
||||
color: #FF6600; |
||||
position: absolute; |
||||
left: 3px; |
||||
} |
||||
|
||||
.modal_checkboxes .sub{ |
||||
list-style: none; |
||||
margin-left: 1em; |
||||
margin-top: .5em; |
||||
} |
||||
|
||||
.modal_checkboxes .label{ |
||||
padding-left: 14px; |
||||
} |
||||
|
After Width: | Height: | Size: 1.3 KiB |
|
After Width: | Height: | Size: 81 KiB |
|
After Width: | Height: | Size: 7.7 KiB |
@ -0,0 +1,119 @@ |
||||
'use strict'; |
||||
|
||||
// Выбор тем
|
||||
(function () { |
||||
var $themes_modal = $('.popup-window.themes'), |
||||
user_choice = { |
||||
th: {}, |
||||
tg: {} |
||||
}, |
||||
|
||||
renderSublistItem = function (data) { |
||||
return '<li>' + |
||||
'<label>' + |
||||
'<input type="checkbox" class="hidden_checkbox" name="' + data.name + '" value="' + data.id + '" />' + |
||||
'<span class="custom_checkbox"></span>' + |
||||
'<span class="label">' + data.text + '</span>' + |
||||
'</label>' + |
||||
'</li>'; |
||||
}, |
||||
|
||||
renderSublist = function (url, $sub_list) { |
||||
var $loader = $themes_modal.find('.wait-ajax').show(); |
||||
|
||||
$.getJSON(url, function (data, status) { |
||||
if (status == 'success'){ |
||||
$.each(data, function (i) { |
||||
var $sub_item = $(renderSublistItem( data[i] )); |
||||
|
||||
$sub_list |
||||
.addClass('has_items') |
||||
.append($sub_item); |
||||
}); |
||||
|
||||
$loader.hide(); |
||||
} |
||||
}); |
||||
}, |
||||
|
||||
renderSelectedThemes = function (id, name, text) { |
||||
return '<li>' + |
||||
'<input type="hidden" name="' + name + '" value="' + id + '">' + |
||||
text + |
||||
'<a href="#">×</a>' + |
||||
'</li>' |
||||
}; |
||||
|
||||
// открываем список тегов в теме
|
||||
$themes_modal.on('click', '.trigger', function (e) { |
||||
e.preventDefault(); |
||||
|
||||
var $link = $(this), |
||||
$sub_list = $link.next('.sub'); |
||||
|
||||
// если теги подгружены, то открываем(закрываем) список
|
||||
// если нет, то подгружаем аяксом теги
|
||||
if ($sub_list.hasClass('has_items')){ |
||||
$sub_list.slideToggle(100); |
||||
} else { |
||||
renderSublist($link.attr('href'), $sub_list); |
||||
} |
||||
}); |
||||
|
||||
|
||||
$themes_modal.on('change', 'input[type="checkbox"]', function (e) { |
||||
e.preventDefault(); |
||||
var $checkbox = $(this); |
||||
|
||||
// записываем(удаляем) в объект user_choice отмеченные темы(теги)
|
||||
if($checkbox.is(':checked')){ |
||||
user_choice[$checkbox.attr('name')][$checkbox.val()] = $checkbox.parent().find('.label').text(); |
||||
} else { |
||||
delete user_choice[$checkbox.attr('name')][$checkbox.val()]; |
||||
} |
||||
}); |
||||
|
||||
|
||||
// Подтверждение выбранных тем
|
||||
$themes_modal.on('click', '.modal-approve', function (e) { |
||||
e.preventDefault(); |
||||
|
||||
var $selected_themes = $('#selected_themes'), |
||||
$selected_tags = $('#selected_tags'); |
||||
|
||||
$selected_themes.html(''); |
||||
|
||||
for (var theme_id in user_choice['th']) { |
||||
var $theme = $(renderSelectedThemes(theme_id, 'th', user_choice['th'][theme_id])); |
||||
$selected_themes.append($theme); |
||||
} |
||||
|
||||
for (var tag_id in user_choice['tg']) { |
||||
var $tag = $(renderSelectedThemes(tag_id, 'tg', user_choice['tg'][tag_id])); |
||||
$selected_tags.append($tag); |
||||
} |
||||
|
||||
$.fancybox.close(); |
||||
}) |
||||
})(); |
||||
|
||||
|
||||
// Выбор городов
|
||||
|
||||
|
||||
$(function () { |
||||
$('.back_to_site').on('click', function (event) { |
||||
event.preventDefault(); |
||||
window.history.back(); |
||||
}); |
||||
|
||||
$('.themes_trigger').on('click', function (event) { |
||||
event.preventDefault(); |
||||
$.fancybox.open({ |
||||
href: '#search-modal', |
||||
padding: 0 |
||||
}); |
||||
}); |
||||
|
||||
$('.scroll-container').mCustomScrollbar(); |
||||
}); |
||||
@ -1,29 +1,181 @@ |
||||
{% extends 'client/base_catalog.html' %} |
||||
{% load static %} |
||||
{% load i18n %} |
||||
|
||||
|
||||
{% block bread_scrumbs %} |
||||
<div class="bread-crumbs"> |
||||
<a href="/">{% trans 'Главная страница' %}</a> |
||||
<a href="/profile/">{% trans 'Личный кабинет' %}</a> |
||||
<strong>{% trans 'Настройки' %}</strong> |
||||
</div> |
||||
{% endblock %} |
||||
|
||||
{% block page_title %} |
||||
<div class="page-title"> |
||||
<h1>{% trans 'Настройки' %}</h1> |
||||
</div> |
||||
{% endblock %} |
||||
|
||||
|
||||
{% block content_list %} |
||||
<form action="." method="post"> |
||||
{% csrf_token %} |
||||
{{ form.as_p }} |
||||
<button type="submit">{% trans "Сохранить" %}</button> |
||||
</form> |
||||
|
||||
{% endblock %} |
||||
{% load static i18n %} |
||||
<!doctype html> |
||||
<html lang="ru"> |
||||
<head> |
||||
<meta charset="UTF-8"> |
||||
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"> |
||||
<meta http-equiv="X-UA-Compatible" content="ie=edge"> |
||||
<title>Document</title> |
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/fancybox/2.1.4/jquery.fancybox.min.css"> |
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/malihu-custom-scrollbar-plugin/3.1.5/jquery.mCustomScrollbar.min.css"> |
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.6.3/css/font-awesome.min.css"> |
||||
<link rel="stylesheet" href="{% static 'mailing_settings/css/main.css' %}"> |
||||
</head> |
||||
|
||||
<body> |
||||
<header class="page_header"> |
||||
<div class="container"> |
||||
<div class="logo_block"> |
||||
<a href="/"><img src="{% static 'mailing_settings/images/logo.png' %}" alt="Expomap"></a> |
||||
<a href="#" class="back_to_site">expomap.ru <span>›</span></a> |
||||
</div> |
||||
<h1>{% trans 'Настройте рассылку от Expomap' %}</h1> |
||||
</div> |
||||
</header> |
||||
|
||||
<form action="." method="post" id="mailing_settings_form"> |
||||
{% csrf_token %} |
||||
<div class="themes_block"> |
||||
<div class="container"> |
||||
<h2>{% trans 'Какие письма вы хотите получать от нас?' %}</h2> |
||||
|
||||
<div class="columns"> |
||||
<div class="column"> |
||||
<h3>{% trans 'Ваши темы:' %}</h3> |
||||
{{ form.themes.label_tag }} |
||||
{{ form.themes }} |
||||
<ul id="selected_themes" class="selected"></ul> |
||||
<a href="#" class="themes_trigger">{% trans 'Уточнить темы' %}</a> |
||||
|
||||
<h3>{% trans 'Теги' %}</h3> |
||||
{{ form.tags.label_tag }} |
||||
{{ form.tags }} |
||||
<ul id="selected_tags" class="selected"></ul> |
||||
</div> |
||||
|
||||
<div class="column"> |
||||
<h3>{% trans 'Ваши гео-фильтры:' %}</h3> |
||||
|
||||
<ul class="geo_filters"> |
||||
<li> |
||||
<label> |
||||
{{ form.moscow }} |
||||
<span class="label moscow"> |
||||
<i class="fa fa-map-marker"></i> |
||||
{{ form.moscow.label }} |
||||
</span> |
||||
<span class="geo_checkbox"></span> |
||||
</label> |
||||
</li> |
||||
|
||||
<li> |
||||
<label> |
||||
{{ form.russia }} |
||||
<span class="label rf"> |
||||
<i class="fa fa-map-marker"></i> |
||||
{{ form.russia.label }} |
||||
</span> |
||||
<span class="geo_checkbox"></span> |
||||
</label> |
||||
<a href="#">{% trans 'Выбрать города' %}</a> |
||||
</li> |
||||
|
||||
<li> |
||||
{{ form.r_cities.label_tag }} |
||||
{{ form.r_cities }} |
||||
</li> |
||||
|
||||
<li> |
||||
<label> |
||||
{{ form.foreign }} |
||||
<span class="label foreign"> |
||||
<i class="fa fa-map-marker"></i> |
||||
{{ form.foreign.label }} |
||||
</span> |
||||
<span class="geo_checkbox"></span> |
||||
</label> |
||||
<a href="#">{% trans 'Выбрать страны' %}</a> |
||||
</li> |
||||
|
||||
<li> |
||||
{{ form.f_countries.label_tag }} |
||||
{{ form.f_countries }} |
||||
</li> |
||||
</ul> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
|
||||
<div class="subjects_block"> |
||||
<div class="container"> |
||||
<h2>{% trans 'Включать ли новости / обзоры / статьи в письмо?' %}</h2> |
||||
|
||||
<div class="columns"> |
||||
<div class="column"> |
||||
{{ form.content_news }} |
||||
{{ form.content_news.label_tag }} |
||||
</div> |
||||
|
||||
<div class="column"> |
||||
{{ form.content_overview }} |
||||
{{ form.content_overview.label_tag }} |
||||
</div> |
||||
|
||||
<div class="column"> |
||||
{{ form.content_articles }} |
||||
{{ form.content_articles.label_tag }} |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
|
||||
<div class="period_block"> |
||||
<div class="container"> |
||||
<h2>{% trans 'Регулярность получения писем' %}</h2> |
||||
|
||||
<div class="columns"> |
||||
<div class="column periodic"> |
||||
<ul> |
||||
{% for field in form.periodic %} |
||||
<li> |
||||
<label> |
||||
{{ field.tag }} |
||||
<span class="radio"> |
||||
{{ field.choice_label }} |
||||
</span> |
||||
</label> |
||||
</li> |
||||
{% endfor %} |
||||
</ul> |
||||
</div> |
||||
|
||||
<div class="column mailing_day"> |
||||
{% for field in form.periodic_day %} |
||||
<label> |
||||
{{ field.tag }} |
||||
<span class="radio"> |
||||
{{ field.choice_label }} |
||||
</span> |
||||
</label> |
||||
{% endfor %} |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
|
||||
<div class="button_block"> |
||||
<div class="container"> |
||||
<button type="submit">{% trans "Сохранить" %}</button> |
||||
<a href="#">{% trans 'Не хочу быть в курсе событий (отписаться от всего)' %}</a> |
||||
</div> |
||||
</div> |
||||
</form> |
||||
|
||||
<footer class="page_footer">© Expomap {% now "Y" %}</footer> |
||||
|
||||
|
||||
<div class="modals"> |
||||
<div class="search-modal-overlay" id="search-modal"> |
||||
{% include 'client/popups/new_themes.html' %} |
||||
</div> |
||||
</div> |
||||
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js" defer></script> |
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/fancybox/2.1.4/jquery.fancybox.pack.min.js" defer></script> |
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/malihu-custom-scrollbar-plugin/3.1.5/jquery.mCustomScrollbar.min.js" defer></script> |
||||
<script src="{% static 'mailing_settings/js/main.js' %}" defer></script> |
||||
</body> |
||||
</html> |
||||
|
||||
|
||||
|
||||
@ -0,0 +1,40 @@ |
||||
{% load static %} |
||||
{% load i18n %} |
||||
{% load template_filters %} |
||||
|
||||
<div class="popup-window themes"> |
||||
<header> |
||||
<div class="title">{% trans 'Тематика' %}</div> |
||||
</header> |
||||
|
||||
<div class="body"> |
||||
<div class="themes_wrapper"> |
||||
<div class="scroll-container"> |
||||
<div class="scroll-content"> |
||||
<div class="topics-list"> |
||||
<ul class="modal_checkboxes"> |
||||
{% for value, text in search_form.th.field.choices %} |
||||
<li class="level1"> |
||||
<label> |
||||
<input type="checkbox" class="hidden_checkbox" name="th" id="tid_{{ prefix }}{{ value }}" value="{{ value }}" {% for option in search_form.th.value %}{% if option == value|slugify %}checked="checked"{% endif %}{% endfor %}/> |
||||
<span class="custom_checkbox"></span> |
||||
<span class="label hidden">{{ text }}</span> |
||||
</label> |
||||
<a href="/search-form/?name=th&id={{ value }}" data-sub="true" class="trigger">{{ text }}</a> |
||||
<ul class="sub"></ul> |
||||
</li> |
||||
{% endfor %} |
||||
</ul> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
|
||||
<div class="wait-ajax" style=""></div> |
||||
</div> |
||||
|
||||
<div class="buttons_block"> |
||||
<button class="modal-approve" type="button">{% trans 'Выбрать' %}</button> |
||||
<button class="modal-clear" type="button">{% trans 'Очистить' %}</button> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
Loading…
Reference in new issue