Commit 6fa95a3d34838bf80d4fe69c9605640806d346ac

Authored by Dmitriy Zaporozhets
1 parent 0e33bf6e

CSS refactored

app/assets/stylesheets/common.scss
... ... @@ -22,217 +22,6 @@
22 22 float:right;
23 23 }
24 24  
25   -/**
26   - * Common header style
27   - *
28   - */
29   -header {
30   - /* Account box */
31   - .account-box {
32   - position: absolute;
33   - right: 0;
34   - top: 13px;
35   - z-index: 10000;
36   - width: 128px;
37   - font-size: 11px;
38   - float: right;
39   - display: block;
40   - cursor: pointer;
41   - img {
42   - border-radius: 4px;
43   - right: 0px;
44   - position: absolute;
45   - width: 33px;
46   - height: 33px;
47   - display: block;
48   - top: 0;
49   - &:after {
50   - content: " ";
51   - display: block;
52   - position: absolute;
53   - top: 0;
54   - right: 0;
55   - left: 0;
56   - bottom: 0;
57   - float: right;
58   - border-radius: 5px;
59   - border: 1px solid rgba(255, 255, 255, 0.1);
60   - border-bottom: 0;
61   - 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)));
62   - 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));
63   - 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));
64   - -webkit-background-origin: border-box;
65   - -moz-background-origin: border;
66   - background-origin: border-box; } } }
67   -
68   - .account-box {
69   - &.hover {
70   - height: 138px; }
71   - &:hover > .account-links {
72   - display: block; } }
73   -
74   - .account-links {
75   - background: #79C3E0;
76   - display: none;
77   - border-radius: 5px;
78   - width: 100px;
79   - margin-top: 0;
80   - float: right;
81   - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
82   - position: relative;
83   - &:before {
84   - content: ".";
85   - width: 0;
86   - height: 0;
87   - position: absolute;
88   - border: 5px solid transparent;
89   - border-color: rgba(255, 255, 255, 0);
90   - border-bottom-color: #333;
91   - text-indent: -9999px;
92   - top: -10px;
93   - line-height: 0;
94   - right: 10px;
95   - z-index: 10; }
96   - background: #333;
97   - display: none;
98   - z-index: 100000;
99   - border-radius: 5px;
100   - width: 100px;
101   - position: absolute;
102   - right: 10px;
103   - top: 46px;
104   - margin-top: 0;
105   - float: right;
106   - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
107   - a {
108   - color: #EEE;
109   - padding: 6px 10px;
110   - display: block;
111   - text-shadow: none;
112   - border-bottom: 1px solid #555;
113   - &:hover {
114   - color:#eee;
115   - background: #444;
116   - }
117   - }
118   - }
119   -
120   - .account-box.hover .arrow-up {
121   - top: 41px;
122   - right: 6px;
123   - position: absolute; }
124   -
125   - .account-links a {
126   - &:first-child {
127   - -webkit-border-top-left-radius: 5px;
128   - -webkit-border-top-right-radius: 5px;
129   - -moz-border-radius-topleft: 5px;
130   - -moz-border-radius-topright: 5px;
131   - border-top-left-radius: 5px;
132   - border-top-right-radius: 5px; }
133   - &:last-child {
134   - -webkit-border-bottom-right-radius: 5px;
135   - -webkit-border-bottom-left-radius: 5px;
136   - -moz-border-radius-bottomright: 5px;
137   - -moz-border-radius-bottomleft: 5px;
138   - border-bottom-right-radius: 5px;
139   - border-bottom-left-radius: 5px;
140   - border-bottom: 0; } }
141   -}
142   -
143   -/*
144   - * Main Menu of Application
145   - *
146   - */
147   -nav.main_menu {
148   - border-radius: 4px;
149   - margin: auto;
150   - margin:30px 0;
151   - background:#eee;
152   - border:1px solid #bbb;
153   - height:38px;
154   - background-image: -webkit-gradient(linear, 0 0, 0 30, color-stop(0.066, #eee), to(#dfdfdf));
155   - background-image: -webkit-linear-gradient(#eee 6.6%, #dfdfdf);
156   - background-image: -moz-linear-gradient(#eee 6.6%, #dfdfdf);
157   - background-image: -o-linear-gradient(#eee 6.6%, #dfdfdf);
158   - @include shade;
159   - .count {
160   - position: relative;
161   - top: -1px;
162   - display: inline-block;
163   - height: 15px;
164   - margin: 0 0 0 5px;
165   - padding: 0 8px 1px 8px;
166   - height: auto;
167   - font-size: 0.82em;
168   - line-height: 14px;
169   - text-align: center;
170   - color: #777;
171   - background: #f2f2f2;
172   - border-top: 1px solid #CCC;
173   - border-radius: 8px;
174   - -moz-border-radius: 8px;
175   - }
176   - .label {
177   - background:$hover;
178   - text-shadow:none;
179   - color:$style_color;
180   - }
181   - a {
182   - // Landscape phone to portrait tablet
183   - @media (max-width: 1080px) { min-width:35px; }
184   - // Portrait tablet to landscape and desktop
185   - @media (min-width: 1080px) and (max-width: 1200px) { min-width:40px; }
186   - // Large desktop
187   - @media (min-width: 1200px) { min-width:55px; }
188   -
189   - text-align:center;
190   - font-weight:bold;
191   - &:first-child{
192   - -webkit-border-top-left-radius: 4px;
193   - -webkit-border-bottom-left-radius: 4px;
194   - -moz-border-radius-topleft: 4px;
195   - -moz-border-radius-bottomleft: 4px;
196   - border-top-left-radius: 4px;
197   - border-bottom-left-radius: 4px;
198   - border-left: 0;
199   - }
200   - padding: 10px 25px;
201   - display: inline-block;
202   - color: $style_color;
203   - position: relative;
204   - margin: 0;
205   - float:left;
206   - text-shadow:0 1px 1px white;
207   - border-right: 1px solid #DDD;
208   - border-left: 1px solid #EEE;
209   -
210   - &.home {
211   - background: url(home_icon.PNG) no-repeat center center;
212   - text-indent:-9999px;
213   - //min-width:40px;
214   - img {
215   - position:relative;
216   - top:4px;
217   - }
218   - }
219   - &.current {
220   - background-color:#D5D5D5;
221   - border-bottom: 2px solid #474D57;
222   - border-right: 1px solid #BBB;
223   - border-left: 1px solid #BBB;
224   - border-radius: 0 0 1px 1px;
225   - &:first-child{
226   - border-bottom:none;
227   - }
228   - }
229   - }
230   -}
231   -/*
232   - * End of Main Menu
233   - *
234   - */
235   -
236 25 .profile_avatar_holder {
237 26 float:left;
238 27 width:60px;
... ...
app/assets/stylesheets/header.scss 0 → 100644
... ... @@ -0,0 +1,226 @@
  1 +/*
  2 + * Application Header
  3 + *
  4 + */
  5 +header {
  6 + width:100%;
  7 + padding:0;
  8 + margin:0;
  9 + top:1px;
  10 + left:0;
  11 + background: #F1F1F1; /* for non-css3 browsers */
  12 + border-bottom: 1px solid #ccc;
  13 + box-shadow: 0 -1px 0 white inset;
  14 + -moz-box-shadow: 0 -1px 0 white inset;
  15 + -webkit-box-shadow: 0 -1px 0 white inset;
  16 + z-index:10;
  17 + height:60px;
  18 +
  19 + /**
  20 + *
  21 + * Logo holder
  22 + *
  23 + */
  24 + .app_logo {
  25 + width:230px;
  26 + float:left;
  27 + position:relative;
  28 + top:-5px;
  29 +
  30 + a {
  31 + float:left;
  32 +
  33 + h1 {
  34 + text-indent:-9999px;
  35 + width:102px;
  36 + background: url('logo_text.png') no-repeat 0px -3px;
  37 + float:left;
  38 + margin-left:5px;
  39 + font-size:20px;
  40 + line-height:36px;
  41 + font-weight:bold;
  42 + color:#aaa;
  43 + text-shadow: 0 1px 1px #FFF;
  44 + padding-left:50px;
  45 + }
  46 + }
  47 + .separator {
  48 + margin-left:20px;
  49 + float: left;
  50 + height: 60px;
  51 + width: 1px;
  52 + background: white;
  53 + border-left: 1px solid #DDD;
  54 + margin-top: -10px;
  55 + }
  56 + }
  57 + .container {
  58 + .top_panel_content {
  59 + margin:auto;
  60 + position:relative;
  61 + padding:15px 0;
  62 + }
  63 + }
  64 +
  65 + /**
  66 + *
  67 + * Project / Area name
  68 + *
  69 + */
  70 + .project_name {
  71 + float:left;
  72 + margin:0;
  73 + margin-right:30px;
  74 + font-size:20px;
  75 + line-height:36px;
  76 + font-weight:bold;
  77 + color:$style_color;
  78 + text-shadow: 0 1px 1px #FFF;
  79 + }
  80 +
  81 + .fbtn {
  82 + float: right;
  83 + margin-right:10px;
  84 + .btn {
  85 + margin-left:8px;
  86 + }
  87 + }
  88 +
  89 +
  90 + /**
  91 + *
  92 + * Search box
  93 + *
  94 + */
  95 + .search {
  96 + float: right;
  97 + margin-right: 55px;
  98 +
  99 + .search-input {
  100 + width:130px;
  101 + background-image: url("icon-search.png");
  102 + background-repeat: no-repeat;
  103 + background-position: 10px;
  104 + padding-left:25px;
  105 + @include border-radius(5px);
  106 + border:1px solid #ccc;
  107 + }
  108 + }
  109 +
  110 + /**
  111 + *
  112 + * Account box
  113 + *
  114 + */
  115 + .account-box {
  116 + position: absolute;
  117 + right: 0;
  118 + top: 13px;
  119 + z-index: 10000;
  120 + width: 128px;
  121 + font-size: 11px;
  122 + float: right;
  123 + display: block;
  124 + cursor: pointer;
  125 + img {
  126 + border-radius: 4px;
  127 + right: 0px;
  128 + position: absolute;
  129 + width: 33px;
  130 + height: 33px;
  131 + display: block;
  132 + top: 0;
  133 + &:after {
  134 + content: " ";
  135 + display: block;
  136 + position: absolute;
  137 + top: 0;
  138 + right: 0;
  139 + left: 0;
  140 + bottom: 0;
  141 + float: right;
  142 + border-radius: 5px;
  143 + border: 1px solid rgba(255, 255, 255, 0.1);
  144 + border-bottom: 0;
  145 + 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)));
  146 + 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));
  147 + 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));
  148 + -webkit-background-origin: border-box;
  149 + -moz-background-origin: border;
  150 + background-origin: border-box; } } }
  151 +
  152 + .account-box {
  153 + &.hover {
  154 + height: 138px; }
  155 + &:hover > .account-links {
  156 + display: block; } }
  157 +
  158 + .account-links {
  159 + background: #79C3E0;
  160 + display: none;
  161 + border-radius: 5px;
  162 + width: 100px;
  163 + margin-top: 0;
  164 + float: right;
  165 + box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
  166 + position: relative;
  167 + &:before {
  168 + content: ".";
  169 + width: 0;
  170 + height: 0;
  171 + position: absolute;
  172 + border: 5px solid transparent;
  173 + border-color: rgba(255, 255, 255, 0);
  174 + border-bottom-color: #333;
  175 + text-indent: -9999px;
  176 + top: -10px;
  177 + line-height: 0;
  178 + right: 10px;
  179 + z-index: 10; }
  180 + background: #333;
  181 + display: none;
  182 + z-index: 100000;
  183 + border-radius: 5px;
  184 + width: 100px;
  185 + position: absolute;
  186 + right: 10px;
  187 + top: 46px;
  188 + margin-top: 0;
  189 + float: right;
  190 + box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
  191 + a {
  192 + color: #EEE;
  193 + padding: 6px 10px;
  194 + display: block;
  195 + text-shadow: none;
  196 + border-bottom: 1px solid #555;
  197 + &:hover {
  198 + color:#eee;
  199 + background: #444;
  200 + }
  201 + }
  202 + }
  203 +
  204 + .account-box.hover .arrow-up {
  205 + top: 41px;
  206 + right: 6px;
  207 + position: absolute; }
  208 +
  209 + .account-links a {
  210 + &:first-child {
  211 + -webkit-border-top-left-radius: 5px;
  212 + -webkit-border-top-right-radius: 5px;
  213 + -moz-border-radius-topleft: 5px;
  214 + -moz-border-radius-topright: 5px;
  215 + border-top-left-radius: 5px;
  216 + border-top-right-radius: 5px; }
  217 + &:last-child {
  218 + -webkit-border-bottom-right-radius: 5px;
  219 + -webkit-border-bottom-left-radius: 5px;
  220 + -moz-border-radius-bottomright: 5px;
  221 + -moz-border-radius-bottomleft: 5px;
  222 + border-bottom-right-radius: 5px;
  223 + border-bottom-left-radius: 5px;
  224 + border-bottom: 0; } }
  225 +}
  226 +
... ...
app/assets/stylesheets/main.scss
... ... @@ -64,14 +64,28 @@ $hover: #FDF5D9;
64 64 border-radius: $radius;
65 65 }
66 66  
  67 +
  68 +
  69 +/**
  70 + * Header of application.
  71 + * Contain application logo, search panel, profile icon
  72 + */
  73 +@import "header.scss";
  74 +
  75 +/**
  76 + * Navigation menu of application.
  77 + * Panel with links to pages depends on project, profile or admin area
  78 + */
  79 +@import "nav.scss";
  80 +
67 81 /**
68 82 * This file represent some UI that can be changed
69 83 * during web app restyle or theme select.
70 84 *
71 85 * Next items should be placed there
72   - * - link colors
73   - * - header styles
74   - * - main menu styles
  86 + * - link, button colors
  87 + * - header restyles
  88 + * - main menu restyles
75 89 *
76 90 */
77 91 @import "themes/ui_basic.scss";
... ...
app/assets/stylesheets/nav.scss 0 → 100644
... ... @@ -0,0 +1,93 @@
  1 +/*
  2 + * Main Menu of Application
  3 + *
  4 + */
  5 +nav.main_menu {
  6 + border-radius: 4px;
  7 + margin: auto;
  8 + margin:30px 0;
  9 + background:#eee;
  10 + border:1px solid #bbb;
  11 + height:38px;
  12 + background-image: -webkit-gradient(linear, 0 0, 0 30, color-stop(0.066, #eee), to(#dfdfdf));
  13 + background-image: -webkit-linear-gradient(#eee 6.6%, #dfdfdf);
  14 + background-image: -moz-linear-gradient(#eee 6.6%, #dfdfdf);
  15 + background-image: -o-linear-gradient(#eee 6.6%, #dfdfdf);
  16 + @include shade;
  17 + .count {
  18 + position: relative;
  19 + top: -1px;
  20 + display: inline-block;
  21 + height: 15px;
  22 + margin: 0 0 0 5px;
  23 + padding: 0 8px 1px 8px;
  24 + height: auto;
  25 + font-size: 0.82em;
  26 + line-height: 14px;
  27 + text-align: center;
  28 + color: #777;
  29 + background: #f2f2f2;
  30 + border-top: 1px solid #CCC;
  31 + border-radius: 8px;
  32 + -moz-border-radius: 8px;
  33 + }
  34 + .label {
  35 + background:$hover;
  36 + text-shadow:none;
  37 + color:$style_color;
  38 + }
  39 + a {
  40 + // Landscape phone to portrait tablet
  41 + @media (max-width: 1080px) { min-width:35px; }
  42 + // Portrait tablet to landscape and desktop
  43 + @media (min-width: 1080px) and (max-width: 1200px) { min-width:40px; }
  44 + // Large desktop
  45 + @media (min-width: 1200px) { min-width:55px; }
  46 +
  47 + text-align:center;
  48 + font-weight:bold;
  49 + &:first-child{
  50 + -webkit-border-top-left-radius: 4px;
  51 + -webkit-border-bottom-left-radius: 4px;
  52 + -moz-border-radius-topleft: 4px;
  53 + -moz-border-radius-bottomleft: 4px;
  54 + border-top-left-radius: 4px;
  55 + border-bottom-left-radius: 4px;
  56 + border-left: 0;
  57 + }
  58 + padding: 10px 25px;
  59 + display: inline-block;
  60 + color: $style_color;
  61 + position: relative;
  62 + margin: 0;
  63 + float:left;
  64 + text-shadow:0 1px 1px white;
  65 + border-right: 1px solid #DDD;
  66 + border-left: 1px solid #EEE;
  67 +
  68 + &.home {
  69 + background: url(home_icon.PNG) no-repeat center center;
  70 + text-indent:-9999px;
  71 + //min-width:40px;
  72 + img {
  73 + position:relative;
  74 + top:4px;
  75 + }
  76 + }
  77 + &.current {
  78 + background-color:#D5D5D5;
  79 + border-bottom: 2px solid #474D57;
  80 + border-right: 1px solid #BBB;
  81 + border-left: 1px solid #BBB;
  82 + border-radius: 0 0 1px 1px;
  83 + &:first-child{
  84 + border-bottom:none;
  85 + }
  86 + }
  87 + }
  88 +}
  89 +/*
  90 + * End of Main Menu
  91 + *
  92 + */
  93 +
... ...
app/assets/stylesheets/themes/ui_basic.scss
1 1 /**
2 2 * This file represent some UI that can be changed
3 3 * during web app restyle or theme select.
4   - *
5   - * Next items should be placed there
6   - * - link colors
7   - * - header styles
8   - * - main menu styles
9 4 *
10 5 */
11 6 .ui_basic {
... ... @@ -20,103 +15,4 @@
20 15 color: $blue_link;
21 16 }
22 17 }
23   -
24   -
25   - /*
26   - * Application Header
27   - *
28   - */
29   - header {
30   - width:100%;
31   - padding:0;
32   - margin:0;
33   - top:1px;
34   - left:0;
35   - background: #F1F1F1; /* for non-css3 browsers */
36   - border-bottom: 1px solid #ccc;
37   - box-shadow: 0 -1px 0 white inset;
38   - -moz-box-shadow: 0 -1px 0 white inset;
39   - -webkit-box-shadow: 0 -1px 0 white inset;
40   - z-index:10;
41   - height:60px;
42   -
43   - .app_logo {
44   - width:230px;
45   - float:left;
46   - position:relative;
47   - top:-5px;
48   -
49   - a {
50   - float:left;
51   -
52   - h1 {
53   - text-indent:-9999px;
54   - width:102px;
55   - background: url('logo_text.png') no-repeat 0px -3px;
56   - float:left;
57   - margin-left:5px;
58   - font-size:20px;
59   - line-height:36px;
60   - font-weight:bold;
61   - color:#aaa;
62   - text-shadow: 0 1px 1px #FFF;
63   - padding-left:50px;
64   - }
65   - }
66   - .separator {
67   - margin-left:20px;
68   - float: left;
69   - height: 60px;
70   - width: 1px;
71   - background: white;
72   - border-left: 1px solid #DDD;
73   - margin-top: -10px;
74   - }
75   - }
76   - .container {
77   - .top_panel_content {
78   - margin:auto;
79   - position:relative;
80   - padding:15px 0;
81   - }
82   - }
83   -
84   - .project_name {
85   - float:left;
86   - margin:0;
87   - margin-right:30px;
88   - font-size:20px;
89   - line-height:36px;
90   - font-weight:bold;
91   - color:$style_color;
92   - text-shadow: 0 1px 1px #FFF;
93   - }
94   -
95   - .fbtn {
96   - float: right;
97   - margin-right:10px;
98   - .btn {
99   - margin-left:8px;
100   - }
101   - }
102   -
103   - .search {
104   - float: right;
105   - margin-right: 55px;
106   -
107   - .search-input {
108   - width:130px;
109   - background-image: url("icon-search.png");
110   - background-repeat: no-repeat;
111   - background-position: 10px;
112   - padding-left:25px;
113   - @include border-radius(5px);
114   - border:1px solid #ccc;
115   - }
116   - }
117   - }
118   - /*
119   - * End of Application Header
120   - *
121   - */
122 18 }
... ...
app/assets/stylesheets/themes/ui_mars.scss
... ... @@ -4,8 +4,7 @@
4 4 *
5 5 * Next items should be placed there
6 6 * - link colors
7   - * - header styles
8   - * - main menu styles
  7 + * - header restyles
9 8 *
10 9 */
11 10 .ui_mars {
... ... @@ -15,18 +14,11 @@
15 14 *
16 15 */
17 16 header {
18   - width:100%;
19   - padding:0;
20   - margin:0;
21   - top:1px;
22   - left:0;
23 17 background: #474D57 url('bg-header.png') repeat-x bottom;
24   - z-index:10;
25   - height:60px;
  18 + box-shadow:none;
  19 + border-bottom: 1px solid #444;
26 20  
27 21 .fbtn {
28   - float: right;
29   - margin-right:10px;
30 22 .btn {
31 23 margin-left:8px;
32 24 background-image: -webkit-gradient(linear, 0 0, 0 30, color-stop(0.066, #595D63), to(#31363E));
... ... @@ -51,20 +43,10 @@
51 43 float: right;
52 44 margin-right: 55px;
53 45 .search-input {
54   - background-image:url("icon-search.png");
55   - float: right;
56   - text-shadow: none;
57   - width: 130px;
58   - background-image: url("icon-search.png");
59   - background-repeat: no-repeat;
60   - background-position: 10px;
61   - border-radius: 100px;
62 46 border: 1px solid rgba(0, 0, 0, 0.7);
63 47 box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2), 0 2px 2px rgba(0, 0, 0, 0.4) inset;
64 48 background-color: #D2D5DA;
65 49 background-color: rgba(255, 255, 255, 0.5);
66   - padding: 5px;
67   - padding-left: 26px;
68 50  
69 51 &:focus {
70 52 background-color: white;
... ... @@ -75,14 +57,7 @@
75 57 color: #666;
76 58 }
77 59 .app_logo {
78   - width:230px;
79   - float:left;
80   - position:relative;
81   - top:-5px;
82   -
83 60 a {
84   - float:left;
85   -
86 61 h1 {
87 62 background: url('images.png') no-repeat -3px -6px;
88 63 width: 65px;
... ... @@ -94,25 +69,17 @@
94 69 float:left;
95 70 }
96 71 }
  72 + .separator {
  73 + border-color:#444;
  74 + background:#31363E;
  75 + }
  76 +
97 77 }
98 78 .project_name {
99   - float:left;
100   - margin:0;
101   - margin-right:30px;
102   - font-size:20px;
103 79 line-height:38px;
104   - font-weight:bold;
105 80 color:#fff;
106 81 text-shadow: 0 1px 1px #111;
107 82 }
108   -
109   - .container {
110   - .top_panel_content {
111   - margin:auto;
112   - position:relative;
113   - padding:15px 0;
114   - }
115   - }
116 83 }
117 84 /*
118 85 * End of Application Header
... ...
app/assets/stylesheets/themes/ui_modern.scss
... ... @@ -9,37 +9,21 @@
9 9 *
10 10 */
11 11 .ui_modern {
12   -
13   - background:#eee;
14   -
15   - > .container {
16   - background:#FFF;
17   - border: 1px solid #ccc;
18   - padding:20px;
19   - margin-top:30px;
20   - -moz-box-shadow: 0 0 1px 1px #E3E3E3;
21   - -webkit-box-shadow: 0 0 1px 1px #E3E3E3;
22   - box-shadow: 0 0 1px 1px #E3E3E3;
23   - }
24   -
25 12 nav.main_menu {
26   - position: absolute;
27   - width: 100%;
28   - left: 0;
29   - top: 35px;
  13 + background:none;
  14 + box-shadow:none;
30 15 @include border-radius(0px);
  16 + border:none;
  17 + border-bottom:2px solid #456;
31 18  
32   - a.current {
33   - border-bottom:none;
34   - }
35   - }
36   -
37   - .commit-box, .issue_form_box {
38   - margin-top: 0px;
39   - }
  19 + a {
  20 + border:none;
40 21  
41   - .ui-box {
42   - @include border-radius(0px);
  22 + &.current {
  23 + border-bottom:2px solid #f90;
  24 + background-color:#fff;
  25 + }
  26 + }
43 27 }
44 28  
45 29 /*
... ... @@ -47,97 +31,30 @@
47 31 *
48 32 */
49 33 a {
50   - color: $link_color;
  34 + color: #FA8B2A;
51 35 &:hover {
52 36 text-decoration:none;
53   - color: $blue_link;
  37 + color: #f90;
54 38 }
55 39 }
56 40  
  41 + .btn {
  42 + &.primary,
  43 + &.btn-primary {
  44 + border-color:#C60;
  45 + background:#D70;
57 46  
58   - /*
59   - * Application Header
60   - *
61   - */
62   - header {
63   - width:100%;
64   - padding:0;
65   - margin:0;
66   - top:1px;
67   - left:0;
68   - background: #FFF; /* for non-css3 browsers */
69   - z-index:10;
70   - height:100px;
71   -
72   - .app_logo {
73   - float:left;
74   - position:relative;
75   - top:-5px;
76   -
77   - a {
78   - float:left;
79   -
80   - h1 {
81   -
82   - left: -30px;
83   - position: relative;
84   - text-indent:-9999px;
85   - width:112px;
86   - background: url('logo_text_tr.png') no-repeat 0px 0;
87   - float:left;
88   - font-size:20px;
89   - line-height:36px;
90   - font-weight:bold;
91   - color:#aaa;
92   - text-shadow: 0 1px 1px #FFF;
93   - padding-left:50px;
94   - }
95   - }
96   - }
97   - .container {
98   - .top_panel_content {
99   - margin:auto;
100   - position:relative;
101   - padding:15px 0;
  47 + &:hover {
  48 + background:#F90;
102 49 }
103 50 }
  51 + }
104 52  
105   - .project_name {
106   - float:left;
107   - margin:0;
108   - margin-right:30px;
109   - font-size:20px;
110   - line-height:36px;
111   - font-weight:bold;
112   - color:$style_color;
113   - text-shadow: 0 1px 1px #FFF;
114   - }
115   -
116   - .fbtn {
117   - float: right;
118   - margin-right:10px;
119   - .btn {
120   - margin-left:8px;
121   - }
122   - }
123   -
124   - .search {
125   - float: right;
126   - margin-right: 55px;
127   -
128   - .search-input {
129   - width:130px;
130   - background-image: url("icon-search.png");
131   - background-repeat: no-repeat;
132   - background-position: 10px;
133   - padding-left:25px;
134   - @include border-radius(5px);
135   - border:1px solid #ccc;
136   - }
  53 + .alert {
  54 + &.alert-info {
  55 + border-color:#FDA;
  56 + background:#FED;
  57 + color:#D70;
137 58 }
138 59 }
139   - /*
140   - * End of Application Header
141   - *
142   - */
143 60 }
... ...
app/views/projects/index.html.haml
... ... @@ -12,8 +12,7 @@
12 12 - if @events.any?
13 13 = render @events
14 14 - else
15   - .padded
16   - %strong.cgray Projects activity will be displayed here
  15 + %h4.nothing_here_message Projects activity will be displayed here
17 16 .side
18 17 .projects_box
19 18 %h5
... ...