Pavel Popeskul

new design

...@@ -38,7 +38,7 @@ ...@@ -38,7 +38,7 @@
38 38
39 <br> 39 <br>
40 40
41 - <button type="button" class="btn btn-default">Как проголосовать</button> 41 + <button type="button" class="btn btn-default btn__attention">Как проголосовать</button>
42 </div> 42 </div>
43 </div> 43 </div>
44 </div> 44 </div>
......
...@@ -19,7 +19,7 @@ ...@@ -19,7 +19,7 @@
19 </div> 19 </div>
20 20
21 <div class="header__do"> 21 <div class="header__do">
22 - <button type="button" class="btn btn-default">Поддержать</button> 22 + <button type="button" class="btn btn-default btn__attention">Поддержать</button>
23 </div> 23 </div>
24 </div> 24 </div>
25 </div> 25 </div>
......
...@@ -33,7 +33,7 @@ ...@@ -33,7 +33,7 @@
33 </div> 33 </div>
34 34
35 <div class="header__do"> 35 <div class="header__do">
36 - <button type="button" class="btn btn-default">Поддержать</button> 36 + <button type="button" class="btn btn-default btn__attention">Поддержать</button>
37 </div> 37 </div>
38 </div> 38 </div>
39 </div> 39 </div>
...@@ -100,7 +100,7 @@ ...@@ -100,7 +100,7 @@
100 100
101 <br> 101 <br>
102 102
103 - <button type="button" class="btn btn-default">Как проголосовать</button> 103 + <button type="button" class="btn btn-default btn__attention">Как проголосовать</button>
104 </div> 104 </div>
105 </div> 105 </div>
106 </div> 106 </div>
......
...@@ -33,7 +33,7 @@ ...@@ -33,7 +33,7 @@
33 </div> 33 </div>
34 34
35 <div class="header__do"> 35 <div class="header__do">
36 - <button type="button" class="btn btn-default">Поддержать</button> 36 + <button type="button" class="btn btn-default btn__attention">Поддержать</button>
37 </div> 37 </div>
38 </div> 38 </div>
39 </div> 39 </div>
...@@ -58,7 +58,7 @@ ...@@ -58,7 +58,7 @@
58 <input type="text" class="form-control" placeholder="Ваш адрес"> 58 <input type="text" class="form-control" placeholder="Ваш адрес">
59 59
60 <span class="input-group-btn"> 60 <span class="input-group-btn">
61 - <button class="btn btn-default" type="button">Найти</button> 61 + <button class="btn btn-default btn__attention" type="button">Найти</button>
62 </span> 62 </span>
63 </div> 63 </div>
64 </div> 64 </div>
...@@ -655,7 +655,7 @@ ...@@ -655,7 +655,7 @@
655 655
656 <br> 656 <br>
657 657
658 - <button type="button" class="btn btn-default">Как проголосовать</button> 658 + <button type="button" class="btn btn-default btn__attention">Как проголосовать</button>
659 </div> 659 </div>
660 </div> 660 </div>
661 </div> 661 </div>
......
...@@ -7596,8 +7596,70 @@ label { ...@@ -7596,8 +7596,70 @@ label {
7596 .btn:active:focus { 7596 .btn:active:focus {
7597 outline: none; 7597 outline: none;
7598 } 7598 }
7599 +.btn__attention {
7600 + background-color: #fb1e42;
7601 + border: 1px solid #fb1e42;
7602 + color: white;
7603 +}
7604 +.btn__attention:hover,
7605 +.btn__attention:focus {
7606 + background-color: #fb1e42;
7607 + border: 1px solid #fb1e42;
7608 + color: white;
7609 +}
7610 +.btn__attention:hover:active,
7611 +.btn__attention:focus:active {
7612 + background-color: #fb1e42;
7613 + color: white;
7614 +}
7615 +.btn__attention--blue {
7616 + background-color: #125f8e;
7617 + border: 1px solid #125f8e;
7618 +}
7619 +.btn__attention--blue:hover,
7620 +.btn__attention--blue:focus {
7621 + background-color: #125f8e;
7622 + border: 1px solid #125f8e;
7623 + color: white;
7624 +}
7625 +.btn__attention--blue:hover:active,
7626 +.btn__attention--blue:focus:active {
7627 + background-color: #125f8e;
7628 + color: white;
7629 +}
7630 +.btn__big {
7631 + line-height: 24px;
7632 + font-size: 19px;
7633 + font-weight: 700;
7634 + color: #fff;
7635 + background-color: #125f8e;
7636 + border: 1px solid #125f8e;
7637 + padding: 18px 40px 18px;
7638 + letter-spacing: 0.09em;
7639 + transition: all 0.2s ease;
7640 + text-transform: uppercase;
7641 +}
7642 +.btn__big:hover {
7643 + background-color: rgba(18, 95, 142, 0.8);
7644 + color: white;
7645 +}
7646 +.btn__big:focus {
7647 + text-decoration: none;
7648 + background-color: #125f8e;
7649 + color: white;
7650 +}
7651 +.btn__big:active {
7652 + background-color: rgba(18, 95, 142, 0.8);
7653 + color: white;
7654 +}
7655 +.btn__big:active:focus {
7656 + background-color: rgba(18, 95, 142, 0.8);
7657 + color: white;
7658 +}
7599 .header { 7659 .header {
7600 - padding: 11px 0px 35px 0px; 7660 + padding: 20px 0px 20px 0px;
7661 + background: #125f8e;
7662 + color: white;
7601 } 7663 }
7602 .header__container { 7664 .header__container {
7603 margin-right: auto; 7665 margin-right: auto;
...@@ -7676,15 +7738,20 @@ label { ...@@ -7676,15 +7738,20 @@ label {
7676 } 7738 }
7677 .nav--promo li { 7739 .nav--promo li {
7678 display: inline-block; 7740 display: inline-block;
7741 + margin: 0px 10px;
7679 } 7742 }
7680 .nav--promo li a { 7743 .nav--promo li a {
7681 - text-decoration: underline; 7744 + color: #125f8e;
7682 - color: #000; 7745 + font-size: 19px;
7746 + border-bottom: 1px rgba(18, 95, 142, 0.5) dashed;
7747 + text-decoration: none;
7748 + padding: 0px;
7749 + line-height: normal;
7683 } 7750 }
7684 .nav--promo li a:focus, 7751 .nav--promo li a:focus,
7685 .nav--promo li a:hover { 7752 .nav--promo li a:hover {
7686 - color: #000; 7753 + color: #125f8e;
7687 - text-decoration: underline; 7754 + text-decoration: none;
7688 background: transparent; 7755 background: transparent;
7689 } 7756 }
7690 .nav--header { 7757 .nav--header {
...@@ -7700,17 +7767,18 @@ label { ...@@ -7700,17 +7767,18 @@ label {
7700 .nav--header li a { 7767 .nav--header li a {
7701 padding: 0; 7768 padding: 0;
7702 font-size: 16px; 7769 font-size: 16px;
7703 - color: #000; 7770 + color: white;
7704 } 7771 }
7705 .nav--header li a:focus, 7772 .nav--header li a:focus,
7706 .nav--header li a:hover { 7773 .nav--header li a:hover {
7707 - color: #000; 7774 + color: white;
7708 text-decoration: underline; 7775 text-decoration: underline;
7709 background: transparent; 7776 background: transparent;
7710 } 7777 }
7711 .footer { 7778 .footer {
7712 padding: 30px 0px; 7779 padding: 30px 0px;
7713 - background-color: #D7D7D7; 7780 + background: #125f8e;
7781 + color: white;
7714 } 7782 }
7715 .footer__container { 7783 .footer__container {
7716 margin-right: auto; 7784 margin-right: auto;
...@@ -7763,12 +7831,12 @@ label { ...@@ -7763,12 +7831,12 @@ label {
7763 margin-right: 0; 7831 margin-right: 0;
7764 } 7832 }
7765 .social a { 7833 .social a {
7766 - color: #000; 7834 + color: white;
7767 text-decoration: underline; 7835 text-decoration: underline;
7768 } 7836 }
7769 .content { 7837 .content {
7770 min-height: 500px; 7838 min-height: 500px;
7771 - padding-bottom: 30px; 7839 + padding: 30px 0px;
7772 } 7840 }
7773 .content__container { 7841 .content__container {
7774 margin-right: auto; 7842 margin-right: auto;
...@@ -7913,6 +7981,7 @@ label { ...@@ -7913,6 +7981,7 @@ label {
7913 .promo { 7981 .promo {
7914 text-align: center; 7982 text-align: center;
7915 padding: 30px 0px; 7983 padding: 30px 0px;
7984 + color: #125f8e;
7916 } 7985 }
7917 .promo__row { 7986 .promo__row {
7918 margin-left: -10px; 7987 margin-left: -10px;
......
...@@ -33,7 +33,7 @@ ...@@ -33,7 +33,7 @@
33 </div> 33 </div>
34 34
35 <div class="header__do"> 35 <div class="header__do">
36 - <button type="button" class="btn btn-default">Поддержать</button> 36 + <button type="button" class="btn btn-default btn__attention">Поддержать</button>
37 </div> 37 </div>
38 </div> 38 </div>
39 </div> 39 </div>
...@@ -223,7 +223,7 @@ ...@@ -223,7 +223,7 @@
223 223
224 <br> 224 <br>
225 225
226 - <button type="button" class="btn btn-default">Как проголосовать</button> 226 + <button type="button" class="btn btn-default btn__attention">Как проголосовать</button>
227 </div> 227 </div>
228 </div> 228 </div>
229 </div> 229 </div>
......
...@@ -29,7 +29,7 @@ ...@@ -29,7 +29,7 @@
29 29
30 <br> 30 <br>
31 31
32 - <button type="button" class="btn btn-default">Познакомится с кандидатами</button> 32 + <button type="button" class="btn btn-default btn__big">Познакомится с кандидатами</button>
33 33
34 <div class="promo__nav"> 34 <div class="promo__nav">
35 <ul class="nav nav--promo"> 35 <ul class="nav nav--promo">
...@@ -85,7 +85,7 @@ ...@@ -85,7 +85,7 @@
85 85
86 <br> 86 <br>
87 87
88 - <button type="button" class="btn btn-default">Как проголосовать</button> 88 + <button type="button" class="btn btn-default btn__attention">Как проголосовать</button>
89 </div> 89 </div>
90 </div> 90 </div>
91 </div> 91 </div>
......
...@@ -33,7 +33,7 @@ ...@@ -33,7 +33,7 @@
33 </div> 33 </div>
34 34
35 <div class="header__do"> 35 <div class="header__do">
36 - <button type="button" class="btn btn-default">Поддержать</button> 36 + <button type="button" class="btn btn-default btn__attention">Поддержать</button>
37 </div> 37 </div>
38 </div> 38 </div>
39 </div> 39 </div>
...@@ -122,7 +122,7 @@ ...@@ -122,7 +122,7 @@
122 122
123 <br> 123 <br>
124 124
125 - <button type="button" class="btn btn-default">Как проголосовать</button> 125 + <button type="button" class="btn btn-default btn__attention">Как проголосовать</button>
126 </div> 126 </div>
127 </div> 127 </div>
128 </div> 128 </div>
......
...@@ -33,7 +33,7 @@ ...@@ -33,7 +33,7 @@
33 </div> 33 </div>
34 34
35 <div class="header__do"> 35 <div class="header__do">
36 - <button type="button" class="btn btn-default">Поддержать</button> 36 + <button type="button" class="btn btn-default btn__attention">Поддержать</button>
37 </div> 37 </div>
38 </div> 38 </div>
39 </div> 39 </div>
...@@ -77,7 +77,7 @@ ...@@ -77,7 +77,7 @@
77 <input type="text" class="form-control" placeholder="Ваш телефон"> 77 <input type="text" class="form-control" placeholder="Ваш телефон">
78 78
79 <span class="input-group-btn"> 79 <span class="input-group-btn">
80 - <button class="btn btn-default" type="button">Напомнить о выборах</button> 80 + <button class="btn btn-default btn__attention btn__attention--blue" type="button">Напомнить о выборах</button>
81 </span> 81 </span>
82 </div> 82 </div>
83 </div> 83 </div>
...@@ -232,7 +232,7 @@ ...@@ -232,7 +232,7 @@
232 232
233 <br> 233 <br>
234 234
235 - <button type="button" class="btn btn-default">Как проголосовать</button> 235 + <button type="button" class="btn btn-default btn__attention">Как проголосовать</button>
236 </div> 236 </div>
237 </div> 237 </div>
238 </div> 238 </div>
......
...@@ -38,7 +38,7 @@ ...@@ -38,7 +38,7 @@
38 38
39 <br> 39 <br>
40 40
41 - <button type="button" class="btn btn-default">Как проголосовать</button> 41 + <button type="button" class="btn btn-default btn__attention">Как проголосовать</button>
42 </div> 42 </div>
43 </div> 43 </div>
44 </div> 44 </div>
......
...@@ -19,7 +19,7 @@ ...@@ -19,7 +19,7 @@
19 </div> 19 </div>
20 20
21 <div class="header__do"> 21 <div class="header__do">
22 - <button type="button" class="btn btn-default">Поддержать</button> 22 + <button type="button" class="btn btn-default btn__attention">Поддержать</button>
23 </div> 23 </div>
24 </div> 24 </div>
25 </div> 25 </div>
......
...@@ -21,7 +21,7 @@ ...@@ -21,7 +21,7 @@
21 <input type="text" class="form-control" placeholder="Ваш адрес"> 21 <input type="text" class="form-control" placeholder="Ваш адрес">
22 22
23 <span class="input-group-btn"> 23 <span class="input-group-btn">
24 - <button class="btn btn-default" type="button">Найти</button> 24 + <button class="btn btn-default btn__attention" type="button">Найти</button>
25 </span> 25 </span>
26 </div> 26 </div>
27 </div> 27 </div>
......
...@@ -17,7 +17,7 @@ ...@@ -17,7 +17,7 @@
17 17
18 <br> 18 <br>
19 19
20 - <button type="button" class="btn btn-default">Познакомится с кандидатами</button> 20 + <button type="button" class="btn btn-default btn__big">Познакомится с кандидатами</button>
21 21
22 <div class="promo__nav"> 22 <div class="promo__nav">
23 <ul class="nav nav--promo"> 23 <ul class="nav nav--promo">
......
...@@ -11,4 +11,71 @@ ...@@ -11,4 +11,71 @@
11 outline: none; 11 outline: none;
12 } 12 }
13 } 13 }
14 +
15 + &__attention {
16 + background-color: #fb1e42;
17 + border: 1px solid #fb1e42;
18 + color: white;
19 +
20 + &:hover, &:focus {
21 + background-color: #fb1e42;
22 + border: 1px solid #fb1e42;
23 + color: white;
24 +
25 + &:active {
26 + background-color: #fb1e42;
27 + color: white;
28 + }
29 + }
30 +
31 + &--blue {
32 + background-color: #125f8e;
33 + border: 1px solid #125f8e;
34 +
35 + &:hover, &:focus {
36 + background-color: #125f8e;
37 + border: 1px solid #125f8e;
38 + color: white;
39 +
40 + &:active {
41 + background-color: #125f8e;
42 + color: white;
43 + }
44 + }
45 + }
46 + }
47 +
48 + &__big {
49 + line-height: 24px;
50 + font-size: 19px;
51 + font-weight: 700;
52 + color: #fff;
53 + background-color: #125f8e;
54 + border: 1px solid #125f8e;
55 + padding: 18px 40px 18px;
56 + letter-spacing: 0.09em;
57 + transition: all 0.2s ease;
58 + text-transform: uppercase;
59 +
60 + &:hover {
61 + background-color: rgba(18, 95, 142, 0.8);
62 + color: white;
63 + }
64 +
65 + &:focus {
66 + text-decoration: none;
67 + background-color: #125f8e;
68 + color: white;
69 + }
70 +
71 + &:active {
72 + background-color: rgba(18, 95, 142, 0.8);
73 + color: white;
74 +
75 + &:focus {
76 + background-color: rgba(18, 95, 142, 0.8);
77 + color: white;
78 + }
79 + }
80 + }
14 } 81 }
...\ No newline at end of file ...\ No newline at end of file
......
1 1
2 .content { 2 .content {
3 min-height: 500px; 3 min-height: 500px;
4 - padding-bottom: 30px; 4 + padding: 30px 0px;
5 5
6 &__container { 6 &__container {
7 .container(); 7 .container();
......
...@@ -5,7 +5,9 @@ ...@@ -5,7 +5,9 @@
5 //width: 100%; 5 //width: 100%;
6 //height: 60px; 6 //height: 60px;
7 padding: 30px 0px; 7 padding: 30px 0px;
8 - background-color: #D7D7D7; 8 + //background-color: #D7D7D7;
9 + background: #125f8e;
10 + color: white;
9 11
10 &__container { 12 &__container {
11 .container(); 13 .container();
...@@ -18,6 +20,10 @@ ...@@ -18,6 +20,10 @@
18 &__right { 20 &__right {
19 float: right; 21 float: right;
20 } 22 }
23 +
24 + p {
25 + //color: ;
26 + }
21 } 27 }
22 28
23 .social { 29 .social {
...@@ -34,7 +40,7 @@ ...@@ -34,7 +40,7 @@
34 } 40 }
35 41
36 a { 42 a {
37 - color: #000; 43 + color: white;
38 text-decoration: underline; 44 text-decoration: underline;
39 } 45 }
40 } 46 }
...\ No newline at end of file ...\ No newline at end of file
......
1 1
2 .header { 2 .header {
3 - padding: 11px 0px 35px 0px; 3 + padding: 20px 0px 20px 0px;
4 + background: #125f8e;
5 + color: white;
4 6
5 &__container { 7 &__container {
6 .container(); 8 .container();
...@@ -43,14 +45,19 @@ ...@@ -43,14 +45,19 @@
43 45
44 li { 46 li {
45 display: inline-block; 47 display: inline-block;
48 + margin: 0px 10px;
46 49
47 a { 50 a {
48 - text-decoration: underline; 51 + color: #125f8e;
49 - color: #000; 52 + font-size: 19px;
53 + border-bottom: 1px rgba(18,95,142,0.5) dashed;
54 + text-decoration: none;
55 + padding: 0px;
56 + line-height: normal;
50 57
51 &:focus, &:hover { 58 &:focus, &:hover {
52 - color: #000; 59 + color: #125f8e;
53 - text-decoration: underline; 60 + text-decoration: none;
54 background: transparent; 61 background: transparent;
55 } 62 }
56 } 63 }
...@@ -71,10 +78,10 @@ ...@@ -71,10 +78,10 @@
71 a { 78 a {
72 padding: 0; 79 padding: 0;
73 font-size: 16px; 80 font-size: 16px;
74 - color: #000; 81 + color: white;
75 82
76 &:focus, &:hover { 83 &:focus, &:hover {
77 - color: #000; 84 + color: white;
78 text-decoration: underline; 85 text-decoration: underline;
79 background: transparent; 86 background: transparent;
80 } 87 }
......
...@@ -2,6 +2,7 @@ ...@@ -2,6 +2,7 @@
2 .promo { 2 .promo {
3 text-align: center; 3 text-align: center;
4 padding: 30px 0px; 4 padding: 30px 0px;
5 + color: #125f8e;
5 6
6 &__row { 7 &__row {
7 .row; 8 .row;
......
...@@ -40,7 +40,7 @@ ...@@ -40,7 +40,7 @@
40 <input type="text" class="form-control" placeholder="Ваш телефон"> 40 <input type="text" class="form-control" placeholder="Ваш телефон">
41 41
42 <span class="input-group-btn"> 42 <span class="input-group-btn">
43 - <button class="btn btn-default" type="button">Напомнить о выборах</button> 43 + <button class="btn btn-default btn__attention btn__attention--blue" type="button">Напомнить о выборах</button>
44 </span> 44 </span>
45 </div> 45 </div>
46 </div> 46 </div>
......