Skip to content

G
gitlab-ce
Commit 3a4b4fb4 authored by Dmitriy Zaporozhets's avatar Dmitriy Zaporozhets
Browse files
Options

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

parent 065c200c
Show whitespace changes
Inline Side-by-side
Showing with 210 additions and 240 deletions
app/assets/stylesheets/main.scss
View file @ 3a4b4fb4
......@@ -58,9 +58,8 @@ $hover: #FDF5D9;
border-radius: $radius;
}
@import "ui_basic.scss";
@import "common.scss";
@import "top_panel.scss";
@import "projects.css.scss";
@import "commits.css.scss";
......
app/assets/stylesheets/top_panel.scss deleted 100644 → 0
View file @ 065c200c
body header {
width:100%;
padding:0;
margin:0;
top:1px;
left:0;
background: #F1F1F1; /* for non-css3 browsers */
border-bottom: 1px solid #ccc;
box-shadow: 0 -1px 0 white inset;
-moz-box-shadow: 0 -1px 0 white inset;
-webkit-box-shadow: 0 -1px 0 white inset;
z-index:10;
height:60px;
.wrapper {
margin:auto;
min-width:$min_app_width;
max-width:$max_app_width;
position:relative;
padding:15px 0;
.top_panel_content {
margin:0 $app_padding;
}
}
.project_name {
float:left;
width:400px;
margin:0;
margin-right:30px;
font-size:20px;
line-height:34px;
font-weight:bold;
color:$style_color;
text-shadow: 0 1px 1px #FFF;
}
.git_url_wrapper {
padding:0px;
margin:0px;
float:left;
.git-url {
padding:0px;
margin:0px;
font-size: 12px;
margin-right:10px;
border-radius: 4px;
-moz-border-radius: 4px;
color: #666;
border: 1px solid #AAA;
padding: 0 10px 0 30px;
background: transparent url('images.png') no-repeat 8px -42px;
width: 260px;
height:26px;
}
}
}
.app_logo {
width:230px;
float:left;
a {
float:left;
h1 {
float:left;
margin-left:5px;
font-size:20px;
line-height:34px;
font-weight:bold;
color:#aaa;
text-shadow: 0 1px 1px #FFF;
}
img {
float: left;
position: relative;
top: -9px;
width:46px;
}
}
}
.dashboard_links {
padding:7px;
float:left;
a {
margin: 0 14px;
float: left;
font-size: 14px;
&.active {
color:$active_link_color;
}
&:hover {
color:$active_link_color;
}
}
}
.top-tabs {
margin: 0;
padding: 5px;
font-size: 14px;
padding-bottom:10px;
margin-bottom:20px;
height:26px;
border-bottom:1px solid #ccc;
.tab {
font-weight: bold;
background:none;
padding: 10px;
float:left;
padding-left:0px;
padding-right:40px;
&.active {
color: $active_link_color;
}
}
}
.rss-icon {
margin:0 15px;
padding:3px;
border-radius:3px;
}
/* Account box */
header .account-box{
position: absolute;
right: 0;
top: 13px;
z-index: 10000;
width: 128px;
font-size: 11px;
float: right;
display: block;
cursor: pointer;}
header .account-box img{
border-radius: 4px;
right: 20px;
position: absolute;
width: 33px; height: 33px;
display: block; top:0;}
header .account-box img:after{
content: " ";
display: block;
position: absolute;
top: 0;
right: 0;
left: 0;
bottom: 0;
float: right;
border-radius: 5px;
border: 1px solid rgba(255, 255, 255, .1);
border-bottom: 0;
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)));
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));
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));
-webkit-background-origin: border-box;
-moz-background-origin: border;
background-origin: border-box;
}
.account-box.hover{height: 138px;}
.account-box:hover > .account-links{display: block;}
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;}
header .account-links:before {
content: ".";
width:0;
height:0;
position:absolute;
border:5px solid transparent;
border-color:rgba(255,255,255,0);
border-bottom-color:#333;
text-indent:-9999px;
top:-10px;
line-height:0;
right:10px;
z-index:10;
}
header .account-links{
background: #333;
display: none;
z-index: 100000;
border-radius: 5px;
width: 100px;
position: absolute;
right: 20px;
top: 46px;
margin-top: 0;
float: right;
box-shadow: 0 1px 1px rgba(0,0,0,.2);
}
header .account-links a{color: #EEE; padding: 6px 10px; display: block; text-shadow: none; border-bottom: 1px solid #555}
header .account-links a:hover{ background: #444;}
.account-box.hover .arrow-up{top: 41px; right: 6px; position: absolute}
header .account-links a:first-child{
-webkit-border-top-left-radius: 5px;
-webkit-border-top-right-radius: 5px;
-moz-border-radius-topleft: 5px;
-moz-border-radius-topright: 5px;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
}
header .account-links a:last-child{
-webkit-border-bottom-right-radius: 5px;
-webkit-border-bottom-left-radius: 5px;
-moz-border-radius-bottomright: 5px;
-moz-border-radius-bottomleft: 5px;
border-bottom-right-radius: 5px;
border-bottom-left-radius: 5px;
border-bottom: 0;
}
app/assets/stylesheets/ui_basic.scss 0 → 100644
View file @ 3a4b4fb4
.ui_basic {
/*
* Application Header
*
*/
header {
width:100%;
padding:0;
margin:0;
top:1px;
left:0;
background: #F1F1F1; /* for non-css3 browsers */
border-bottom: 1px solid #ccc;
box-shadow: 0 -1px 0 white inset;
-moz-box-shadow: 0 -1px 0 white inset;
-webkit-box-shadow: 0 -1px 0 white inset;
z-index:10;
height:60px;
.app_logo {
width:230px;
float:left;
a {
float:left;
h1 {
float:left;
margin-left:5px;
font-size:20px;
line-height:34px;
font-weight:bold;
color:#aaa;
text-shadow: 0 1px 1px #FFF;
}
img {
float: left;
position: relative;
top: -9px;
width:46px;
}
}
}
.wrapper {
margin:auto;
min-width:$min_app_width;
max-width:$max_app_width;
position:relative;
padding:15px 0;
.top_panel_content {
margin:0 $app_padding;
}
}
.project_name {
float:left;
width:400px;
margin:0;
margin-right:30px;
font-size:20px;
line-height:34px;
font-weight:bold;
color:$style_color;
text-shadow: 0 1px 1px #FFF;
}
.git_url_wrapper {
padding:0px;
margin:0px;
float:left;
.git-url {
padding:0px;
margin:0px;
font-size: 12px;
margin-right:10px;
border-radius: 4px;
-moz-border-radius: 4px;
color: #666;
border: 1px solid #AAA;
padding: 0 10px 0 30px;
background: transparent url('images.png') no-repeat 8px -42px;
width: 260px;
height:26px;
}
}
/* Account box */
.account-box {
position: absolute;
right: 0;
top: 13px;
z-index: 10000;
width: 128px;
font-size: 11px;
float: right;
display: block;
cursor: pointer;
img {
border-radius: 4px;
right: 20px;
position: absolute;
width: 33px;
height: 33px;
display: block;
top: 0;
&:after {
content: " ";
display: block;
position: absolute;
top: 0;
right: 0;
left: 0;
bottom: 0;
float: right;
border-radius: 5px;
border: 1px solid rgba(255, 255, 255, 0.1);
border-bottom: 0;
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)));
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));
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));
-webkit-background-origin: border-box;
-moz-background-origin: border;
background-origin: border-box; } } }
.account-box {
&.hover {
height: 138px; }
&:hover > .account-links {
display: block; } }
.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, 0.2);
position: relative;
&:before {
content: ".";
width: 0;
height: 0;
position: absolute;
border: 5px solid transparent;
border-color: rgba(255, 255, 255, 0);
border-bottom-color: #333;
text-indent: -9999px;
top: -10px;
line-height: 0;
right: 10px;
z-index: 10; }
background: #333;
display: none;
z-index: 100000;
border-radius: 5px;
width: 100px;
position: absolute;
right: 20px;
top: 46px;
margin-top: 0;
float: right;
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
a {
color: #EEE;
padding: 6px 10px;
display: block;
text-shadow: none;
border-bottom: 1px solid #555;
&:hover {
background: #444; } } }
.account-box.hover .arrow-up {
top: 41px;
right: 6px;
position: absolute; }
.account-links a {
&:first-child {
-webkit-border-top-left-radius: 5px;
-webkit-border-top-right-radius: 5px;
-moz-border-radius-topleft: 5px;
-moz-border-radius-topright: 5px;
border-top-left-radius: 5px;
border-top-right-radius: 5px; }
&:last-child {
-webkit-border-bottom-right-radius: 5px;
-webkit-border-bottom-left-radius: 5px;
-moz-border-radius-bottomright: 5px;
-moz-border-radius-bottomleft: 5px;
border-bottom-right-radius: 5px;
border-bottom-left-radius: 5px;
border-bottom: 0; } }
}
/*
* End of Application Header
*
*/
}
app/views/layouts/admin.html.haml
View file @ 3a4b4fb4
!!! 5
%html{ :lang => "en"}
= render "layouts/head"
%body.admin
%body.ui_basic.admin
= render "layouts/flash"
= render "layouts/head_panel", :title => "Admin area"
.container
......
app/views/layouts/application.html.haml
View file @ 3a4b4fb4
!!! 5
%html{ :lang => "en"}
= render "layouts/head"
%body.application
%body.ui_basic.application
= render "layouts/flash"
= render "layouts/head_panel", :title => "Dashboard"
.container
......
app/views/layouts/devise.html.haml
View file @ 3a4b4fb4
!!! 5
%html{ :lang => "en"}
= render "layouts/head"
%body.login-page
%body.ui_basic.login-page
= render :partial => "layouts/flash"
.container= yield
app/views/layouts/error.html.haml
View file @ 3a4b4fb4
!!! 5
%html{ :lang => "en"}
= render "layouts/head"
%body.application
%body.ui_basic.application
= render "layouts/flash"
= render "layouts/head_panel", :title => ""
.container
......
app/views/layouts/profile.html.haml
View file @ 3a4b4fb4
!!! 5
%html{ :lang => "en"}
= render "layouts/head"
%body.profile
%body.ui_basic.profile
= render "layouts/flash"
= render "layouts/head_panel", :title => "Profile"
.container
......
app/views/layouts/project.html.haml
View file @ 3a4b4fb4
!!! 5
%html{ :lang => "en"}
= render "layouts/head"
%body.project
%body.ui_basic.project
= render "layouts/flash"
= render "layouts/head_panel", :title => @project.name
.container
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment
GitLab Nexedi Edition | About GitLab | About Nexedi | 沪ICP备2021021310号-2 | 沪ICP备2021021310号-7