Pavel Popeskul / savelovsky

Go to a project
Toggle navigation Toggle navigation pinning
Pavel Popeskul
dc074da1 1 parent 55028d9a

candidate 2

Inline Side-by-side
Showing 5 changed files with 518 additions and 3 deletions
...@@ -7656,6 +7656,22 @@ label { ...@@ -7656,6 +7656,22 @@ label {
7656 background-color: rgba(18, 95, 142, 0.8); 7656 background-color: rgba(18, 95, 142, 0.8);
7657 color: white; 7657 color: white;
7658 } 7658 }
7659 +.btn__thin {
7660 + font-weight: normal;
7661 + font-size: 14px;
7662 + text-transform: none;
7663 + letter-spacing: 0.4px;
7664 + padding: 4px 10px 5px 10px;
7665 + height: auto;
7666 + line-height: 14px;
7667 + border-radius: 8px;
7668 + background: #fb1e42;
7669 + color: white;
7670 +}
7671 +.btn__thin:hover,
7672 +.btn__thin:focus {
7673 + color: white;
7674 +}
7659 .header { 7675 .header {
7660 padding: 20px 0px 20px 0px; 7676 padding: 20px 0px 20px 0px;
7661 background: #125f8e; 7677 background: #125f8e;
...@@ -7978,6 +7994,64 @@ label { ...@@ -7978,6 +7994,64 @@ label {
7978 box-sizing: border-box; 7994 box-sizing: border-box;
7979 padding-left: 10px; 7995 padding-left: 10px;
7980 } 7996 }
7997 +.jumbotron {
7998 + background-color: #125f8e;
7999 + color: #fff;
8000 + padding: 30px 30px;
8001 +}
8002 +.signs-list {
8003 + margin-bottom: 10px;
8004 +}
8005 +.signs-list:last-child {
8006 + margin-bottom: 0;
8007 +}
8008 +.progress-item {
8009 + margin-bottom: 32px;
8010 + position: relative;
8011 +}
8012 +.progress-item:hover .progress-btn .btn {
8013 + display: block;
8014 +}
8015 +.progress-btn {
8016 + position: absolute;
8017 + right: 0;
8018 + top: 7px;
8019 +}
8020 +.progress-btn .btn {
8021 + font-weight: normal;
8022 + font-size: 14px;
8023 + text-transform: none;
8024 + letter-spacing: 0.4px;
8025 + padding: 4px 10px 5px 10px;
8026 + height: auto;
8027 + line-height: 14px;
8028 + display: none;
8029 + border-radius: 8px;
8030 +}
8031 +.progress-title {
8032 + font-size: 32px;
8033 + letter-spacing: 1px;
8034 +}
8035 +.progress-value {
8036 + font-size: 18px;
8037 + margin: 2px 0px 4px;
8038 +}
8039 +.progress-bar__colorful {
8040 + border-radius: 2px;
8041 + background-image: -webkit-linear-gradient(0deg, #ff0000 0%, #ff5700 19%, #ffae00 50%, #8cac00 80%, #18a900 100%);
8042 + position: relative;
8043 + overflow: hidden;
8044 + height: 10px;
8045 +}
8046 +.progress-bar__overlap {
8047 + position: absolute;
8048 + right: 0;
8049 + height: 10px;
8050 + background-color: #368dc3;
8051 + top: 0;
8052 + border-bottom-right-radius: 2px;
8053 + border-top-right-radius: 2px;
8054 +}
7981 .promo { 8055 .promo {
7982 text-align: center; 8056 text-align: center;
7983 padding: 30px 0px; 8057 padding: 30px 0px;
......
...@@ -60,7 +60,7 @@ ...@@ -60,7 +60,7 @@
60 <br> 60 <br>
61 61
62 <div class="row"> 62 <div class="row">
63 - <div class="col-xs-18"> 63 + <div class="col-xs-24">
64 <p>Реквизиты избирательного счета для перевода пожертвования</p> 64 <p>Реквизиты избирательного счета для перевода пожертвования</p>
65 <p>Банк получатель: ПАО «Сбербанк»</p> 65 <p>Банк получатель: ПАО «Сбербанк»</p>
66 66
...@@ -71,6 +71,178 @@ ...@@ -71,6 +71,178 @@
71 <p>(ИНН указывать при переводе не нужно. Указывайте его, только если банк не даёт вам провести платёж без него: 773709696309)</p> 71 <p>(ИНН указывать при переводе не нужно. Указывайте его, только если банк не даёт вам провести платёж без него: 773709696309)</p>
72 <p>Номер счета получателя: ------------</p> 72 <p>Номер счета получателя: ------------</p>
73 73
74 + <div class="jumbotron">
75 + <div class="row signs-list">
76 + <div class="col-xs-12">
77 + <div class="progress-item">
78 + <div class="progress-btn">
79 + <a href="#section-form" onclick="scrollToAdvanced('#section-form');return false;" class="btn btn__thin">Оставить подпись</a>
80 + </div>
81 +
82 + <div class="progress-title">Капотня</div>
83 +
84 + <div class="progress-value">10 000 рублей из 50 000</div>
85 +
86 + <div class="progress-bar__colorful">
87 + <div class="progress-bar__overlap" style="width: 96.4286%;"></div>
88 + </div>
89 + </div>
90 + </div>
91 +
92 + <div class="col-xs-12">
93 + <div class="progress-item">
94 + <div class="progress-btn">
95 + <a href="#section-form" onclick="scrollToAdvanced('#section-form');return false;" class="btn btn__thin">Оставить подпись</a>
96 + </div>
97 +
98 + <div class="progress-title">Капотня</div>
99 +
100 + <div class="progress-value">10 000 рублей из 50 000</div>
101 +
102 + <div class="progress-bar__colorful">
103 + <div class="progress-bar__overlap" style="width: 96.4286%;"></div>
104 + </div>
105 + </div>
106 + </div>
107 + </div>
108 +
109 + <div class="row signs-list">
110 + <div class="col-xs-12">
111 + <div class="progress-item">
112 + <div class="progress-btn">
113 + <a href="#section-form" onclick="scrollToAdvanced('#section-form');return false;" class="btn btn__thin">Оставить подпись</a>
114 + </div>
115 +
116 + <div class="progress-title">Капотня</div>
117 +
118 + <div class="progress-value">10 000 рублей из 50 000</div>
119 +
120 + <div class="progress-bar__colorful">
121 + <div class="progress-bar__overlap" style="width: 96.4286%;"></div>
122 + </div>
123 + </div>
124 + </div>
125 +
126 + <div class="col-xs-12">
127 + <div class="progress-item">
128 + <div class="progress-btn">
129 + <a href="#section-form" onclick="scrollToAdvanced('#section-form');return false;" class="btn btn__thin">Оставить подпись</a>
130 + </div>
131 +
132 + <div class="progress-title">Капотня</div>
133 +
134 + <div class="progress-value">10 000 рублей из 50 000</div>
135 +
136 + <div class="progress-bar__colorful">
137 + <div class="progress-bar__overlap" style="width: 96.4286%;"></div>
138 + </div>
139 + </div>
140 + </div>
141 + </div>
142 +
143 + <div class="row signs-list">
144 + <div class="col-xs-12">
145 + <div class="progress-item">
146 + <div class="progress-btn">
147 + <a href="#section-form" onclick="scrollToAdvanced('#section-form');return false;" class="btn btn__thin">Оставить подпись</a>
148 + </div>
149 +
150 + <div class="progress-title">Капотня</div>
151 +
152 + <div class="progress-value">10 000 рублей из 50 000</div>
153 +
154 + <div class="progress-bar__colorful">
155 + <div class="progress-bar__overlap" style="width: 96.4286%;"></div>
156 + </div>
157 + </div>
158 + </div>
159 +
160 + <div class="col-xs-12">
161 + <div class="progress-item">
162 + <div class="progress-btn">
163 + <a href="#section-form" onclick="scrollToAdvanced('#section-form');return false;" class="btn btn__thin">Оставить подпись</a>
164 + </div>
165 +
166 + <div class="progress-title">Капотня</div>
167 +
168 + <div class="progress-value">10 000 рублей из 50 000</div>
169 +
170 + <div class="progress-bar__colorful">
171 + <div class="progress-bar__overlap" style="width: 96.4286%;"></div>
172 + </div>
173 + </div>
174 + </div>
175 + </div>
176 +
177 + <div class="row signs-list">
178 + <div class="col-xs-12">
179 + <div class="progress-item">
180 + <div class="progress-btn">
181 + <a href="#section-form" onclick="scrollToAdvanced('#section-form');return false;" class="btn btn__thin">Оставить подпись</a>
182 + </div>
183 +
184 + <div class="progress-title">Капотня</div>
185 +
186 + <div class="progress-value">10 000 рублей из 50 000</div>
187 +
188 + <div class="progress-bar__colorful">
189 + <div class="progress-bar__overlap" style="width: 96.4286%;"></div>
190 + </div>
191 + </div>
192 + </div>
193 +
194 + <div class="col-xs-12">
195 + <div class="progress-item">
196 + <div class="progress-btn">
197 + <a href="#section-form" onclick="scrollToAdvanced('#section-form');return false;" class="btn btn__thin">Оставить подпись</a>
198 + </div>
199 +
200 + <div class="progress-title">Капотня</div>
201 +
202 + <div class="progress-value">10 000 рублей из 50 000</div>
203 +
204 + <div class="progress-bar__colorful">
205 + <div class="progress-bar__overlap" style="width: 96.4286%;"></div>
206 + </div>
207 + </div>
208 + </div>
209 + </div>
210 +
211 + <div class="row signs-list">
212 + <div class="col-xs-12">
213 + <div class="progress-item">
214 + <div class="progress-btn">
215 + <a href="#section-form" onclick="scrollToAdvanced('#section-form');return false;" class="btn btn__thin">Оставить подпись</a>
216 + </div>
217 +
218 + <div class="progress-title">Капотня</div>
219 +
220 + <div class="progress-value">10 000 рублей из 50 000</div>
221 +
222 + <div class="progress-bar__colorful">
223 + <div class="progress-bar__overlap" style="width: 96.4286%;"></div>
224 + </div>
225 + </div>
226 + </div>
227 +
228 + <div class="col-xs-12">
229 + <div class="progress-item">
230 + <div class="progress-btn">
231 + <a href="#section-form" onclick="scrollToAdvanced('#section-form');return false;" class="btn btn__thin">Оставить подпись</a>
232 + </div>
233 +
234 + <div class="progress-title">Капотня</div>
235 +
236 + <div class="progress-value">10 000 рублей из 50 000</div>
237 +
238 + <div class="progress-bar__colorful">
239 + <div class="progress-bar__overlap" style="width: 96.4286%;"></div>
240 + </div>
241 + </div>
242 + </div>
243 + </div>
244 + </div>
245 +
74 <div class="recipient"> 246 <div class="recipient">
75 <div class="recipient__row"> 247 <div class="recipient__row">
76 <span class="recipient__text" id="basic-addon3"> 248 <span class="recipient__text" id="basic-addon3">
......
...@@ -23,7 +23,7 @@ ...@@ -23,7 +23,7 @@
23 <br> 23 <br>
24 24
25 <div class="row"> 25 <div class="row">
26 - <div class="col-xs-18"> 26 + <div class="col-xs-24">
27 <p>Реквизиты избирательного счета для перевода пожертвования</p> 27 <p>Реквизиты избирательного счета для перевода пожертвования</p>
28 <p>Банк получатель: ПАО «Сбербанк»</p> 28 <p>Банк получатель: ПАО «Сбербанк»</p>
29 29
...@@ -34,6 +34,178 @@ ...@@ -34,6 +34,178 @@
34 <p>(ИНН указывать при переводе не нужно. Указывайте его, только если банк не даёт вам провести платёж без него: 773709696309)</p> 34 <p>(ИНН указывать при переводе не нужно. Указывайте его, только если банк не даёт вам провести платёж без него: 773709696309)</p>
35 <p>Номер счета получателя: ------------</p> 35 <p>Номер счета получателя: ------------</p>
36 36
37 + <div class="jumbotron">
38 + <div class="row signs-list">
39 + <div class="col-xs-12">
40 + <div class="progress-item">
41 + <div class="progress-btn">
42 + <a href="#section-form" onclick="scrollToAdvanced('#section-form');return false;" class="btn btn__thin">Оставить подпись</a>
43 + </div>
44 +
45 + <div class="progress-title">Капотня</div>
46 +
47 + <div class="progress-value">10 000 рублей из 50 000</div>
48 +
49 + <div class="progress-bar__colorful">
50 + <div class="progress-bar__overlap" style="width: 96.4286%;"></div>
51 + </div>
52 + </div>
53 + </div>
54 +
55 + <div class="col-xs-12">
56 + <div class="progress-item">
57 + <div class="progress-btn">
58 + <a href="#section-form" onclick="scrollToAdvanced('#section-form');return false;" class="btn btn__thin">Оставить подпись</a>
59 + </div>
60 +
61 + <div class="progress-title">Капотня</div>
62 +
63 + <div class="progress-value">10 000 рублей из 50 000</div>
64 +
65 + <div class="progress-bar__colorful">
66 + <div class="progress-bar__overlap" style="width: 96.4286%;"></div>
67 + </div>
68 + </div>
69 + </div>
70 + </div>
71 +
72 + <div class="row signs-list">
73 + <div class="col-xs-12">
74 + <div class="progress-item">
75 + <div class="progress-btn">
76 + <a href="#section-form" onclick="scrollToAdvanced('#section-form');return false;" class="btn btn__thin">Оставить подпись</a>
77 + </div>
78 +
79 + <div class="progress-title">Капотня</div>
80 +
81 + <div class="progress-value">10 000 рублей из 50 000</div>
82 +
83 + <div class="progress-bar__colorful">
84 + <div class="progress-bar__overlap" style="width: 96.4286%;"></div>
85 + </div>
86 + </div>
87 + </div>
88 +
89 + <div class="col-xs-12">
90 + <div class="progress-item">
91 + <div class="progress-btn">
92 + <a href="#section-form" onclick="scrollToAdvanced('#section-form');return false;" class="btn btn__thin">Оставить подпись</a>
93 + </div>
94 +
95 + <div class="progress-title">Капотня</div>
96 +
97 + <div class="progress-value">10 000 рублей из 50 000</div>
98 +
99 + <div class="progress-bar__colorful">
100 + <div class="progress-bar__overlap" style="width: 96.4286%;"></div>
101 + </div>
102 + </div>
103 + </div>
104 + </div>
105 +
106 + <div class="row signs-list">
107 + <div class="col-xs-12">
108 + <div class="progress-item">
109 + <div class="progress-btn">
110 + <a href="#section-form" onclick="scrollToAdvanced('#section-form');return false;" class="btn btn__thin">Оставить подпись</a>
111 + </div>
112 +
113 + <div class="progress-title">Капотня</div>
114 +
115 + <div class="progress-value">10 000 рублей из 50 000</div>
116 +
117 + <div class="progress-bar__colorful">
118 + <div class="progress-bar__overlap" style="width: 96.4286%;"></div>
119 + </div>
120 + </div>
121 + </div>
122 +
123 + <div class="col-xs-12">
124 + <div class="progress-item">
125 + <div class="progress-btn">
126 + <a href="#section-form" onclick="scrollToAdvanced('#section-form');return false;" class="btn btn__thin">Оставить подпись</a>
127 + </div>
128 +
129 + <div class="progress-title">Капотня</div>
130 +
131 + <div class="progress-value">10 000 рублей из 50 000</div>
132 +
133 + <div class="progress-bar__colorful">
134 + <div class="progress-bar__overlap" style="width: 96.4286%;"></div>
135 + </div>
136 + </div>
137 + </div>
138 + </div>
139 +
140 + <div class="row signs-list">
141 + <div class="col-xs-12">
142 + <div class="progress-item">
143 + <div class="progress-btn">
144 + <a href="#section-form" onclick="scrollToAdvanced('#section-form');return false;" class="btn btn__thin">Оставить подпись</a>
145 + </div>
146 +
147 + <div class="progress-title">Капотня</div>
148 +
149 + <div class="progress-value">10 000 рублей из 50 000</div>
150 +
151 + <div class="progress-bar__colorful">
152 + <div class="progress-bar__overlap" style="width: 96.4286%;"></div>
153 + </div>
154 + </div>
155 + </div>
156 +
157 + <div class="col-xs-12">
158 + <div class="progress-item">
159 + <div class="progress-btn">
160 + <a href="#section-form" onclick="scrollToAdvanced('#section-form');return false;" class="btn btn__thin">Оставить подпись</a>
161 + </div>
162 +
163 + <div class="progress-title">Капотня</div>
164 +
165 + <div class="progress-value">10 000 рублей из 50 000</div>
166 +
167 + <div class="progress-bar__colorful">
168 + <div class="progress-bar__overlap" style="width: 96.4286%;"></div>
169 + </div>
170 + </div>
171 + </div>
172 + </div>
173 +
174 + <div class="row signs-list">
175 + <div class="col-xs-12">
176 + <div class="progress-item">
177 + <div class="progress-btn">
178 + <a href="#section-form" onclick="scrollToAdvanced('#section-form');return false;" class="btn btn__thin">Оставить подпись</a>
179 + </div>
180 +
181 + <div class="progress-title">Капотня</div>
182 +
183 + <div class="progress-value">10 000 рублей из 50 000</div>
184 +
185 + <div class="progress-bar__colorful">
186 + <div class="progress-bar__overlap" style="width: 96.4286%;"></div>
187 + </div>
188 + </div>
189 + </div>
190 +
191 + <div class="col-xs-12">
192 + <div class="progress-item">
193 + <div class="progress-btn">
194 + <a href="#section-form" onclick="scrollToAdvanced('#section-form');return false;" class="btn btn__thin">Оставить подпись</a>
195 + </div>
196 +
197 + <div class="progress-title">Капотня</div>
198 +
199 + <div class="progress-value">10 000 рублей из 50 000</div>
200 +
201 + <div class="progress-bar__colorful">
202 + <div class="progress-bar__overlap" style="width: 96.4286%;"></div>
203 + </div>
204 + </div>
205 + </div>
206 + </div>
207 + </div>
208 +
37 <div class="recipient"> 209 <div class="recipient">
38 <div class="recipient__row"> 210 <div class="recipient__row">
39 <span class="recipient__text" id="basic-addon3"> 211 <span class="recipient__text" id="basic-addon3">
......
...@@ -78,4 +78,21 @@ ...@@ -78,4 +78,21 @@
78 } 78 }
79 } 79 }
80 } 80 }
81 +
82 + &__thin {
83 + font-weight: normal;
84 + font-size: 14px;
85 + text-transform: none;
86 + letter-spacing: 0.4px;
87 + padding: 4px 10px 5px 10px;
88 + height: auto;
89 + line-height: 14px;
90 + border-radius: 8px;
91 + background: #fb1e42;
92 + color: white;
93 +
94 + &:hover, &:focus {
95 + color: white;
96 + }
97 + }
81 } 98 }
...\ No newline at end of file ...\ No newline at end of file
......
...@@ -104,4 +104,84 @@ ...@@ -104,4 +104,84 @@
104 box-sizing: border-box; 104 box-sizing: border-box;
105 padding-left: 10px; 105 padding-left: 10px;
106 } 106 }
107 -}
...\ No newline at end of file ...\ No newline at end of file
107 +}
108 +
109 +.jumbotron {
110 + background-color: #125f8e;
111 + color: #fff;
112 + padding: 30px 30px;
113 +}
114 +
115 +.signs-list {
116 + margin-bottom: 10px;
117 +
118 + &:last-child {
119 + margin-bottom: 0;
120 + }
121 +}
122 +
123 +.progress {
124 + &-item {
125 + margin-bottom: 32px;
126 + position: relative;
127 +
128 + &:hover {
129 + .progress-btn {
130 + .btn {
131 + display: block;
132 + }
133 + }
134 + }
135 + }
136 +
137 + &-btn {
138 + position: absolute;
139 + right: 0;
140 + top: 7px;
141 +
142 + .btn {
143 + font-weight: normal;
144 + font-size: 14px;
145 + text-transform: none;
146 + letter-spacing: 0.4px;
147 + padding: 4px 10px 5px 10px;
148 + height: auto;
149 + line-height: 14px;
150 + display: none;
151 + border-radius: 8px;
152 + }
153 + }
154 +
155 + &-title {
156 + font-size: 32px;
157 + letter-spacing: 1px;
158 + }
159 +
160 + &-value {
161 + font-size: 18px;
162 + margin: 2px 0px 4px;
163 + }
164 +
165 + &-bar {
166 + &__colorful {
167 + border-radius: 2px;
168 + background-image: -moz-linear-gradient( 0deg, rgb(255,0,0) 0%, rgb(255,87,0) 19%, rgb(255,174,0) 50%, rgb(140,172,0) 80%, rgb(24,169,0) 100%);
169 + background-image: -ms-linear-gradient( 0deg, rgb(255,0,0) 0%, rgb(255,87,0) 19%, rgb(255,174,0) 50%, rgb(140,172,0) 80%, rgb(24,169,0) 100%);
170 + background-image: -webkit-linear-gradient( 0deg, rgb(255,0,0) 0%, rgb(255,87,0) 19%, rgb(255,174,0) 50%, rgb(140,172,0) 80%, rgb(24,169,0) 100%);
171 + position: relative;
172 + overflow: hidden;
173 + height: 10px;
174 + }
175 +
176 + &__overlap {
177 + position: absolute;
178 + right: 0;
179 + height: 10px;
180 + background-color: #368dc3;
181 + top: 0;
182 + border-bottom-right-radius: 2px;
183 + border-top-right-radius: 2px;
184 + }
185 + }
186 +}
187 +
......