Download as
Browse Code »

Commit 3a4b4fb4cde7809f033822a171b9feae19d41fff

Authored by Dmitriy Zaporozhets
1 parent 065c200c
Exists in master and in 4 other branches 6-8-stable, 7-0-stable, 7-0-stable-spb, spb-stable

Moving ui styles to one scss file, Added ui class to body

Showing 9 changed files with 210 additions and 240 deletions   Show diff stats
app/assets/stylesheets/main.scss
  Diff comments   View file @3a4b4fb
@@ -58,9 +58,8 @@ $hover: #FDF5D9; @@ -58,9 +58,8 @@ $hover: #FDF5D9;
58 border-radius: $radius; 58 border-radius: $radius;
59 } 59 }
60 60
61 - 61 +@import "ui_basic.scss";
62 @import "common.scss"; 62 @import "common.scss";
63 -@import "top_panel.scss";  
64 63
65 @import "projects.css.scss"; 64 @import "projects.css.scss";
66 @import "commits.css.scss"; 65 @import "commits.css.scss";
app/assets/stylesheets/top_panel.scss
View file @065c200
@@ -1,232 +0,0 @@ @@ -1,232 +0,0 @@
1 -body header {  
2 - width:100%;  
3 - padding:0;  
4 - margin:0;  
5 - top:1px;  
6 - left:0;  
7 - background: #F1F1F1; /* for non-css3 browsers */  
8 - border-bottom: 1px solid #ccc;  
9 - box-shadow: 0 -1px 0 white inset;  
10 - -moz-box-shadow: 0 -1px 0 white inset;  
11 - -webkit-box-shadow: 0 -1px 0 white inset;  
12 -  
13 - z-index:10;  
14 - height:60px;  
15 -  
16 - .wrapper {  
17 - margin:auto;  
18 - min-width:$min_app_width;  
19 - max-width:$max_app_width;  
20 - position:relative;  
21 - padding:15px 0;  
22 -  
23 - .top_panel_content {  
24 - margin:0 $app_padding;  
25 - }  
26 - }  
27 -  
28 -  
29 -  
30 - .project_name {  
31 - float:left;  
32 - width:400px;  
33 - margin:0;  
34 - margin-right:30px;  
35 - font-size:20px;  
36 - line-height:34px;  
37 - font-weight:bold;  
38 - color:$style_color;  
39 - text-shadow: 0 1px 1px #FFF;  
40 - }  
41 -  
42 - .git_url_wrapper {  
43 - padding:0px;  
44 - margin:0px;  
45 - float:left;  
46 -  
47 - .git-url {  
48 - padding:0px;  
49 - margin:0px;  
50 - font-size: 12px;  
51 -  
52 - margin-right:10px;  
53 - border-radius: 4px;  
54 - -moz-border-radius: 4px;  
55 -  
56 -  
57 - color: #666;  
58 - border: 1px solid #AAA;  
59 - padding: 0 10px 0 30px;  
60 - background: transparent url('images.png') no-repeat 8px -42px;  
61 - width: 260px;  
62 - height:26px;  
63 - }  
64 - }  
65 -}  
66 -  
67 -.app_logo {  
68 - width:230px;  
69 - float:left;  
70 -  
71 - a {  
72 - float:left;  
73 -  
74 - h1 {  
75 - float:left;  
76 - margin-left:5px;  
77 - font-size:20px;  
78 - line-height:34px;  
79 - font-weight:bold;  
80 - color:#aaa;  
81 - text-shadow: 0 1px 1px #FFF;  
82 - }  
83 -  
84 - img {  
85 - float: left;  
86 - position: relative;  
87 - top: -9px;  
88 - width:46px;  
89 - }  
90 - }  
91 -}  
92 -  
93 -.dashboard_links {  
94 - padding:7px;  
95 - float:left;  
96 - a {  
97 - margin: 0 14px;  
98 - float: left;  
99 - font-size: 14px;  
100 -  
101 - &.active {  
102 - color:$active_link_color;  
103 - }  
104 - &:hover {  
105 - color:$active_link_color;  
106 - }  
107 - }  
108 -}  
109 -  
110 -.top-tabs {  
111 - margin: 0;  
112 - padding: 5px;  
113 - font-size: 14px;  
114 - padding-bottom:10px;  
115 - margin-bottom:20px;  
116 - height:26px;  
117 - border-bottom:1px solid #ccc;  
118 -  
119 - .tab {  
120 - font-weight: bold;  
121 - background:none;  
122 - padding: 10px;  
123 - float:left;  
124 - padding-left:0px;  
125 - padding-right:40px;  
126 -  
127 - &.active {  
128 - color: $active_link_color;  
129 - }  
130 - }  
131 -}  
132 -  
133 -  
134 -.rss-icon {  
135 - margin:0 15px;  
136 - padding:3px;  
137 - border-radius:3px;  
138 -}  
139 -  
140 -  
141 -  
142 -/* Account box */  
143 -header .account-box{  
144 - position: absolute;  
145 - right: 0;  
146 - top: 13px;  
147 - z-index: 10000;  
148 - width: 128px;  
149 - font-size: 11px;  
150 - float: right;  
151 - display: block;  
152 - cursor: pointer;}  
153 -header .account-box img{  
154 - border-radius: 4px;  
155 - right: 20px;  
156 - position: absolute;  
157 - width: 33px; height: 33px;  
158 - display: block; top:0;}  
159 -header .account-box img:after{  
160 - content: " ";  
161 - display: block;  
162 - position: absolute;  
163 - top: 0;  
164 - right: 0;  
165 -left: 0;  
166 - bottom: 0;  
167 -float: right;  
168 - border-radius: 5px;  
169 - border: 1px solid rgba(255, 255, 255, .1);  
170 - border-bottom: 0;  
171 - background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(255, 255, 255, .15)), to(rgba(0, 0, 0, .25))), -webkit-gradient(linear, left top, right bottom, color-stop(0, rgba(255, 255, 255, 0)), color-stop(0.5, rgba(255, 255, 255, .1)), color-stop(0.501, rgba(255, 255, 255, 0)), color-stop(1, rgba(255, 255, 255, 0)));  
172 - background: -moz-linear-gradient(top, rgba(255, 255, 255, .15), rgba(0, 0, 0, .25)), -moz-linear-gradient(left top, rgba(255, 255, 255, 0), rgba(255, 255, 255, .1) 50%, rgba(255, 255, 255, 0) 50%, rgba(255, 255, 255, 0));  
173 - background: linear-gradient(top, rgba(255, 255, 255, .15), rgba(0, 0, 0, .25)), linear-gradient(left top, rgba(255, 255, 255, 0), rgba(255, 255, 255, .1) 50%, rgba(255, 255, 255, 0) 50%, rgba(255, 255, 255, 0));  
174 - -webkit-background-origin: border-box;  
175 - -moz-background-origin: border;  
176 - background-origin: border-box;  
177 -}  
178 -  
179 -.account-box.hover{height: 138px;}  
180 -.account-box:hover > .account-links{display: block;}  
181 -header .account-links{ background: #79C3E0; display: none; border-radius: 5px; width: 100px; margin-top: 0; float: right; box-shadow: 0 1px 1px rgba(0,0,0,.2); position:relative;}  
182 -  
183 -header .account-links:before {  
184 - content: ".";  
185 - width:0;  
186 - height:0;  
187 - position:absolute;  
188 - border:5px solid transparent;  
189 - border-color:rgba(255,255,255,0);  
190 - border-bottom-color:#333;  
191 - text-indent:-9999px;  
192 - top:-10px;  
193 - line-height:0;  
194 - right:10px;  
195 - z-index:10;  
196 -}  
197 -  
198 -header .account-links{  
199 - background: #333;  
200 - display: none;  
201 - z-index: 100000;  
202 - border-radius: 5px;  
203 - width: 100px;  
204 - position: absolute;  
205 - right: 20px;  
206 - top: 46px;  
207 - margin-top: 0;  
208 - float: right;  
209 - box-shadow: 0 1px 1px rgba(0,0,0,.2);  
210 -}  
211 -  
212 -header .account-links a{color: #EEE; padding: 6px 10px; display: block; text-shadow: none; border-bottom: 1px solid #555}  
213 -header .account-links a:hover{ background: #444;}  
214 -.account-box.hover .arrow-up{top: 41px; right: 6px; position: absolute}  
215 -header .account-links a:first-child{  
216 - -webkit-border-top-left-radius: 5px;  
217 - -webkit-border-top-right-radius: 5px;  
218 - -moz-border-radius-topleft: 5px;  
219 - -moz-border-radius-topright: 5px;  
220 - border-top-left-radius: 5px;  
221 - border-top-right-radius: 5px;  
222 -}  
223 -  
224 -header .account-links a:last-child{  
225 - -webkit-border-bottom-right-radius: 5px;  
226 - -webkit-border-bottom-left-radius: 5px;  
227 - -moz-border-radius-bottomright: 5px;  
228 - -moz-border-radius-bottomleft: 5px;  
229 - border-bottom-right-radius: 5px;  
230 - border-bottom-left-radius: 5px;  
231 - border-bottom: 0;  
232 -}  
app/assets/stylesheets/ui_basic.scss 0 → 100644
  Diff comments   View file @3a4b4fb
@@ -0,0 +1,203 @@ @@ -0,0 +1,203 @@
  1 +.ui_basic {
  2 + /*
  3 + * Application Header
  4 + *
  5 + */
  6 + header {
  7 + width:100%;
  8 + padding:0;
  9 + margin:0;
  10 + top:1px;
  11 + left:0;
  12 + background: #F1F1F1; /* for non-css3 browsers */
  13 + border-bottom: 1px solid #ccc;
  14 + box-shadow: 0 -1px 0 white inset;
  15 + -moz-box-shadow: 0 -1px 0 white inset;
  16 + -webkit-box-shadow: 0 -1px 0 white inset;
  17 + z-index:10;
  18 + height:60px;
  19 +
  20 + .app_logo {
  21 + width:230px;
  22 + float:left;
  23 +
  24 + a {
  25 + float:left;
  26 +
  27 + h1 {
  28 + float:left;
  29 + margin-left:5px;
  30 + font-size:20px;
  31 + line-height:34px;
  32 + font-weight:bold;
  33 + color:#aaa;
  34 + text-shadow: 0 1px 1px #FFF;
  35 + }
  36 +
  37 + img {
  38 + float: left;
  39 + position: relative;
  40 + top: -9px;
  41 + width:46px;
  42 + }
  43 + }
  44 + }
  45 + .wrapper {
  46 + margin:auto;
  47 + min-width:$min_app_width;
  48 + max-width:$max_app_width;
  49 + position:relative;
  50 + padding:15px 0;
  51 +
  52 + .top_panel_content {
  53 + margin:0 $app_padding;
  54 + }
  55 + }
  56 +
  57 + .project_name {
  58 + float:left;
  59 + width:400px;
  60 + margin:0;
  61 + margin-right:30px;
  62 + font-size:20px;
  63 + line-height:34px;
  64 + font-weight:bold;
  65 + color:$style_color;
  66 + text-shadow: 0 1px 1px #FFF;
  67 + }
  68 +
  69 + .git_url_wrapper {
  70 + padding:0px;
  71 + margin:0px;
  72 + float:left;
  73 +
  74 + .git-url {
  75 + padding:0px;
  76 + margin:0px;
  77 + font-size: 12px;
  78 + margin-right:10px;
  79 + border-radius: 4px;
  80 + -moz-border-radius: 4px;
  81 + color: #666;
  82 + border: 1px solid #AAA;
  83 + padding: 0 10px 0 30px;
  84 + background: transparent url('images.png') no-repeat 8px -42px;
  85 + width: 260px;
  86 + height:26px;
  87 + }
  88 + }
  89 +
  90 + /* Account box */
  91 + .account-box {
  92 + position: absolute;
  93 + right: 0;
  94 + top: 13px;
  95 + z-index: 10000;
  96 + width: 128px;
  97 + font-size: 11px;
  98 + float: right;
  99 + display: block;
  100 + cursor: pointer;
  101 + img {
  102 + border-radius: 4px;
  103 + right: 20px;
  104 + position: absolute;
  105 + width: 33px;
  106 + height: 33px;
  107 + display: block;
  108 + top: 0;
  109 + &:after {
  110 + content: " ";
  111 + display: block;
  112 + position: absolute;
  113 + top: 0;
  114 + right: 0;
  115 + left: 0;
  116 + bottom: 0;
  117 + float: right;
  118 + border-radius: 5px;
  119 + border: 1px solid rgba(255, 255, 255, 0.1);
  120 + border-bottom: 0;
  121 + background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(255, 255, 255, 0.15)), to(rgba(0, 0, 0, 0.25))), -webkit-gradient(linear, left top, right bottom, color-stop(0, rgba(255, 255, 255, 0)), color-stop(0.5, rgba(255, 255, 255, 0.1)), color-stop(0.501, rgba(255, 255, 255, 0)), color-stop(1, rgba(255, 255, 255, 0)));
  122 + background: -moz-linear-gradient(top, rgba(255, 255, 255, 0.15), rgba(0, 0, 0, 0.25)), -moz-linear-gradient(left top, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.1) 50%, rgba(255, 255, 255, 0) 50%, rgba(255, 255, 255, 0));
  123 + background: linear-gradient(top, rgba(255, 255, 255, 0.15), rgba(0, 0, 0, 0.25)), linear-gradient(left top, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.1) 50%, rgba(255, 255, 255, 0) 50%, rgba(255, 255, 255, 0));
  124 + -webkit-background-origin: border-box;
  125 + -moz-background-origin: border;
  126 + background-origin: border-box; } } }
  127 +
  128 + .account-box {
  129 + &.hover {
  130 + height: 138px; }
  131 + &:hover > .account-links {
  132 + display: block; } }
  133 +
  134 + .account-links {
  135 + background: #79C3E0;
  136 + display: none;
  137 + border-radius: 5px;
  138 + width: 100px;
  139 + margin-top: 0;
  140 + float: right;
  141 + box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
  142 + position: relative;
  143 + &:before {
  144 + content: ".";
  145 + width: 0;
  146 + height: 0;
  147 + position: absolute;
  148 + border: 5px solid transparent;
  149 + border-color: rgba(255, 255, 255, 0);
  150 + border-bottom-color: #333;
  151 + text-indent: -9999px;
  152 + top: -10px;
  153 + line-height: 0;
  154 + right: 10px;
  155 + z-index: 10; }
  156 + background: #333;
  157 + display: none;
  158 + z-index: 100000;
  159 + border-radius: 5px;
  160 + width: 100px;
  161 + position: absolute;
  162 + right: 20px;
  163 + top: 46px;
  164 + margin-top: 0;
  165 + float: right;
  166 + box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
  167 + a {
  168 + color: #EEE;
  169 + padding: 6px 10px;
  170 + display: block;
  171 + text-shadow: none;
  172 + border-bottom: 1px solid #555;
  173 + &:hover {
  174 + background: #444; } } }
  175 +
  176 + .account-box.hover .arrow-up {
  177 + top: 41px;
  178 + right: 6px;
  179 + position: absolute; }
  180 +
  181 + .account-links a {
  182 + &:first-child {
  183 + -webkit-border-top-left-radius: 5px;
  184 + -webkit-border-top-right-radius: 5px;
  185 + -moz-border-radius-topleft: 5px;
  186 + -moz-border-radius-topright: 5px;
  187 + border-top-left-radius: 5px;
  188 + border-top-right-radius: 5px; }
  189 + &:last-child {
  190 + -webkit-border-bottom-right-radius: 5px;
  191 + -webkit-border-bottom-left-radius: 5px;
  192 + -moz-border-radius-bottomright: 5px;
  193 + -moz-border-radius-bottomleft: 5px;
  194 + border-bottom-right-radius: 5px;
  195 + border-bottom-left-radius: 5px;
  196 + border-bottom: 0; } }
  197 +
  198 + }
  199 + /*
  200 + * End of Application Header
  201 + *
  202 + */
  203 +}
app/views/layouts/admin.html.haml
  Diff comments   View file @3a4b4fb
1 !!! 5 1 !!! 5
2 %html{ :lang => "en"} 2 %html{ :lang => "en"}
3 = render "layouts/head" 3 = render "layouts/head"
4 - %body.admin 4 + %body.ui_basic.admin
5 = render "layouts/flash" 5 = render "layouts/flash"
6 = render "layouts/head_panel", :title => "Admin area" 6 = render "layouts/head_panel", :title => "Admin area"
7 .container 7 .container
app/views/layouts/application.html.haml
  Diff comments   View file @3a4b4fb
1 !!! 5 1 !!! 5
2 %html{ :lang => "en"} 2 %html{ :lang => "en"}
3 = render "layouts/head" 3 = render "layouts/head"
4 - %body.application 4 + %body.ui_basic.application
5 = render "layouts/flash" 5 = render "layouts/flash"
6 = render "layouts/head_panel", :title => "Dashboard" 6 = render "layouts/head_panel", :title => "Dashboard"
7 .container 7 .container
app/views/layouts/devise.html.haml
  Diff comments   View file @3a4b4fb
1 !!! 5 1 !!! 5
2 %html{ :lang => "en"} 2 %html{ :lang => "en"}
3 = render "layouts/head" 3 = render "layouts/head"
4 - %body.login-page 4 + %body.ui_basic.login-page
5 = render :partial => "layouts/flash" 5 = render :partial => "layouts/flash"
6 .container= yield 6 .container= yield
app/views/layouts/error.html.haml
  Diff comments   View file @3a4b4fb
1 !!! 5 1 !!! 5
2 %html{ :lang => "en"} 2 %html{ :lang => "en"}
3 = render "layouts/head" 3 = render "layouts/head"
4 - %body.application 4 + %body.ui_basic.application
5 = render "layouts/flash" 5 = render "layouts/flash"
6 = render "layouts/head_panel", :title => "" 6 = render "layouts/head_panel", :title => ""
7 .container 7 .container
app/views/layouts/profile.html.haml
  Diff comments   View file @3a4b4fb
1 !!! 5 1 !!! 5
2 %html{ :lang => "en"} 2 %html{ :lang => "en"}
3 = render "layouts/head" 3 = render "layouts/head"
4 - %body.profile 4 + %body.ui_basic.profile
5 = render "layouts/flash" 5 = render "layouts/flash"
6 = render "layouts/head_panel", :title => "Profile" 6 = render "layouts/head_panel", :title => "Profile"
7 .container 7 .container
app/views/layouts/project.html.haml
  Diff comments   View file @3a4b4fb
1 !!! 5 1 !!! 5
2 %html{ :lang => "en"} 2 %html{ :lang => "en"}
3 = render "layouts/head" 3 = render "layouts/head"
4 - %body.project 4 + %body.ui_basic.project
5 = render "layouts/flash" 5 = render "layouts/flash"
6 = render "layouts/head_panel", :title => @project.name 6 = render "layouts/head_panel", :title => @project.name
7 .container 7 .container