mitri4
/
zuykov
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

flexible and mobile layout

Browse Source
master
fefa4ka 10 years ago
parent 9fff2e54eb
commit 78bc32bd59
13 changed files with 309 additions and 79 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 17
      zsite/static/imgs/logo_en_mobile.svg
  2. 17
      zsite/static/imgs/logo_ru_mobile.svg
  3. 40
      zsite/static/less/about.less
  4. 35
      zsite/static/less/blog.less
  5. 11
      zsite/static/less/consultation.less
  6. 64
      zsite/static/less/footer.less
  7. 121
      zsite/static/less/header.less
  8. 5
      zsite/static/less/main.less
  9. 21
      zsite/static/less/mainpage.less
  10. 3
      zsite/static/less/service.less
  11. 35
      zsite/static/less/sub_content.less
  12. 5
      zsite/templates/base.html
  13. 2
      zsite/templates/menu_header.html

17
zsite/static/imgs/logo_en_mobile.svg
View File

File diff suppressed because one or more lines are too long
Side by Side

After

Width:  |  Height:  |  Size: 32 KiB

17
zsite/static/imgs/logo_ru_mobile.svg
View File

File diff suppressed because one or more lines are too long
Side by Side

After

Width:  |  Height:  |  Size: 31 KiB

40
zsite/static/less/about.less
Unescape View File

@ -36,7 +36,7 @@
}
.about-organizations, .about-clients {
.about-organizations {
.make-row();
li {
@ -62,6 +62,29 @@
}
.about-organizations {
@media (min-width: 0) {
li {
min-height: 100px;
}
p {
display: none;
}
a {
font-size: 11px;
}
}
@media (min-width: @screen-phone) {
p {
display: block;
}
a {
font-size: 12px;
}
}
li {
text-align: center;
p {
@ -70,14 +93,23 @@
vertical-align: middle;
}
a {
font-size: 12px;
}
}
}
.about-clients {
.make-row();
li {
@media (min-width: 0) {
.make-xs-column(6);
}
@media (min-width: @screen-phone) {
.make-xs-column(3);
.make-sm-column(2);
}
height: 190px;
h5 {

35
zsite/static/less/blog.less
Unescape View File

@ -16,26 +16,43 @@
.news-block {
padding: 0 15px;
}
.news-block .plugin-blog-category-all, .plugin-blog-category-cases {
.make-row();
@media (min-width: 0px) {
li {
width: 100%;
}
}
li {
.make-xs-column(6);
.make-sm-column(3);
@media (min-width: 0px) {
li {
.make-xs-column(12);
min-height: 140px;
font-size: 12px;
font-size: 12px;
vertical-align: top;
vertical-align: top;
.date {
font-size: 10px;
.date {
font-size: 10px;
margin-top: 2px;
}
}
}
@media (min-width: @screen-xs) {
li {
.make-xs-column(6);
.make-sm-column(3);
margin-top: 2px;
min-height: 140px;
}
}
}

11
zsite/static/less/consultation.less
Unescape View File

@ -63,7 +63,7 @@
@media (min-width: 0) {
.btn-xs;
}
@media (min-width: 530px) {
@media (min-width: 760px) {
.button-size(@padding-base-vertical; @padding-base-horizontal; @font-size-base; @line-height-base; @btn-border-radius-base);
}
}
@ -73,6 +73,15 @@
}
.consultation-person {
@media (min-width: 0) {
display: none;
}
@media (min-width: @screen-tablet) {
display: block;
}
.modal-form {
text-align: right;
}

64
zsite/static/less/footer.less
Unescape View File

@ -27,7 +27,16 @@ footer {
}
.about {
.make-xs-column(4);
@media (min-width: 0px) {
.make-xs-column(6);
}
@media (min-width: @screen-phone) {
.make-xs-column(4);
}
.make-sm-column(3);
.make-md-column(2);
@ -48,15 +57,32 @@ footer {
}
.menu {
.make-xs-column(4);
.make-xs-column(2);
@media (min-width: 0px) {
display: none;
margin-left: 30px;
width: 150px;
.footer-slogan {
display: none;
}
margin-top: 40px;
margin-left: 55px;
}
@media (min-width: 530px) {
@media (min-width: @screen-phone) {
display: block;
margin-left: initial;
.footer-slogan {
display: block;
}
margin-top: 0px;
margin-left: 0px;
}
@ -74,15 +100,15 @@ footer {
}
.content {
.make-xs-column(6);
.make-md-column(6);
@media (min-width: 0px) {
display: none;
}
display: none;
}
@media (min-width: 1024px) {
display: block;
}
@media (min-width: 1024px) {
display: block;
}
.footer-ratings {
margin-top: 39px;
@ -99,16 +125,20 @@ footer {
}
.contacts {
.make-sm-column(3);
.make-md-column(2);
@media (min-width: 0px) {
display: none;
}
white-space: nowrap;
@media (min-width: 530px) {
display: block;
}
@media (min-width: 0px) {
.make-xs-column(6);
}
@media (min-width: @screen-phone) {
display: block;
.make-xs-column(4);
.make-sm-column(3);
.make-md-column(2);
}
margin-top: 39px;

121
zsite/static/less/header.less
Unescape View File

@ -5,65 +5,109 @@
margin-bottom: -10px;
}
.header-logo {
@media (min-width: 0) {
.make-xs-column(12);
h2 {
font-size: 18px;
line-height: 19px;
margin-top: 5px;
opacity: 0.5;
}
.make-xs-column(6);
.make-sm-column(6);
.make-md-column(4);
.make-lg-column(4);
.header-logo-mobile {
display: block;
a, a:hover, a:focus {
border: 0 !important;
width: 100%
}
.header-logo-desktop {
display: none;
}
}
h2 {
position: absolute;
top: 58px;
left: 176px;
width: 160px;
@media (min-width: @screen-phone) {
.make-xs-column(6);
.make-sm-column(5);
.make-md-column(4);
opacity: 0.5;
h2 {
font-size: 14px;
line-height: 17px;
position: absolute;
line-height: 17px;
top: 58px;
left: 176px;
max-width: 160px;
font-size: 14px;
opacity: 0.5;
margin: 10px 0;
margin: 10px 0;
}
.header-logo-mobile {
display: none;
}
.header-logo-desktop {
display: block;
}
}
margin-bottom: 15px;
a, a:hover, a:focus {
border: 0 !important;
}
}
.header-content {
@media (min-width: 0) {
@media (min-width: 0) {
display: none;
}
@media (min-width: 1000px) {
display: inline-block;
}
}
@media (min-width: 980px) {
display: block;
}
.make-md-column(4);
.make-lg-column(4);
.make-sm-column(4);
strong {
white-space: nowrap;
}
}
.header-contacts {
.make-xs-column(6);
.make-sm-column(3);
.make-md-column(4);
.make-lg-column(4);
// .make-lg-column(4);
@media (min-width: 0px) {
display: none;
display: none;
}
@media (min-width: @screen-phone) {
display: block;
}
@media (min-width: @screen-phone) {
.make-sm-column-offset(4);
}
@media (min-width: 530px) {
display: block;
@media (min-width: 980px) {
.make-sm-column-offset(0);
}
height: 128px;
@ -72,6 +116,8 @@
margin-top: -4px;
white-space: nowrap;
ul {
margin-right: -5px;
margin-bottom: 0;
@ -116,6 +162,17 @@
.header-menu-font {
font-family: @font-family-monospace;
.header-menu-contacts {
margin-left: 15px;
@media (min-width: 0) {
display: inline-block;
}
@media (min-width: @screen-phone) {
display: none;
}
}
}
@ -140,8 +197,8 @@
margin-right: 10px;
}
@media (min-width: 1200px) {
width: 150px;
@media (min-width: 1070px) {
width: 13.5%;
margin: 0;
}
@ -177,14 +234,14 @@
display: none;
}
@media (min-width: 1200px) {
@media (min-width: 1070px) {
display: block;
}
li {
vertical-align: top;
font-size: 12px;
width: 150px;
width: 13.5%;
}
}

5
zsite/static/less/main.less
Unescape View File

@ -30,6 +30,11 @@
@import 'nice.less';
.container {
width: 100%;
padding-left: 25px;
padding-right: 30px;
}
a, a:hover, a:active, a:focus {
text-decoration: none;

21
zsite/static/less/mainpage.less
Unescape View File

@ -2,8 +2,25 @@
.make-row();
.department {
.make-xs-column(12);
.make-sm-column(3);
@media (min-width: 0px) {
.make-xs-column(12);
margin-bottom: 15px;
}
@media (min-width: @screen-phone) {
.make-xs-column(6);
min-height: 240px;
margin-bottom: 0;
}
@media (min-width: @screen-tablet) {
min-height: 1px;
}
.make-sm-column(6);
.make-md-column(3);
ul {
li {

3
zsite/static/less/service.less
Unescape View File

@ -442,6 +442,9 @@
.make-row();
li {
font-size: 12px;
overflow: hidden;
img {
margin-bottom: 5px;
}

35
zsite/static/less/sub_content.less
Unescape View File

@ -1,20 +1,45 @@
.sub-content {
.make-row();
.menu-xs {
.make-xs-column(12);
@media (min-width: 0) {
.make-xs-column(12);
width: 100%;
margin-top: -10px;
.header {
display: none;
}
margin-bottom: 10px;
}
@media (min-width: @screen-md-min) {
@media (min-width: @screen-tablet) {
width: 140px;
margin-top: 0;
.header {
display: block;
}
}
}
.menu {
.make-lg-column(3);
.make-md-column(3);
@media (min-width: 0) {
display: none;
}
@media (min-width: @screen-tablet) {
display: block;
}
}
.menu, .menu-xs {
// .make-sm-column(1);
@ -30,12 +55,12 @@
font-size: 12px;
@media (min-width: 320px) {
@media (min-width: 0) {
display: inline-block;
margin-right: 15px;
}
@media (min-width: @screen-md-min) {
@media (min-width: @screen-tablet) {
display: block;
margin-bottom: 5px;
}

5
zsite/templates/base.html
Unescape View File

@ -29,7 +29,8 @@
<div class="wrapper no-print">
<div class="header-logo">
<a href="/{{request.LANGUAGE_CODE}}/">
<img src="{% with 'imgs/logo_'|add:request.LANGUAGE_CODE|add:'.svg' as image_static %}{% static image_static %}{% endwith %}">
<img src="{% with 'imgs/logo_'|add:request.LANGUAGE_CODE|add:'.svg' as image_static %}{% static image_static %}{% endwith %}" class="header-logo-desktop">
<img src="{% with 'imgs/logo_'|add:request.LANGUAGE_CODE|add:'_mobile.svg' as image_static %}{% static image_static %}{% endwith %}" class="header-logo-mobile">
</a>
{% static_placeholder 'header-slogan-main-'|add:request.current_page.get_root.reverse_id %}
@ -76,7 +77,7 @@
</ul>
</div>
<div class="menu no-print">
<h5><nobr>{% trans "— There is nothing impossible. Almost nothing" %}</nobr></h5>
<h5 class="footer-slogan"><nobr>{% trans "— There is nothing impossible. Almost nothing" %}</nobr></h5>
{% show_menu 0 1 100 100 "menu_footer.html" %}
</div>
<div class="content no-print">

2
zsite/templates/menu_header.html
Unescape View File

@ -1,7 +1,7 @@
{% load i18n menu_tags cms_tags cache %}
{% if children|length > 1 %}
<h4 class="header-menu-font">{% trans 'Our Services' %}</h4>
<h4 class="header-menu-font">{% trans 'Our Services' %} <span class="header-menu-contacts"><a href="{% page_url "contacts" %}">{% page_attribute "page_title" "contacts" %}</a></span></h4>
<div class="background-line-pattern"></div>
<ul class="list-unstyled list-inline header-menu header-menu-font {% if current_page.is_home %}main{% endif %}">
{% for child in children %}

Write Preview
Loading…
Cancel
Save