diff options
author | Dmitriy Zaporozhets <dzaporozhets@sphereconsultinginc.com> | 2012-01-16 23:07:57 +0400 |
---|---|---|
committer | Dmitriy Zaporozhets <dzaporozhets@sphereconsultinginc.com> | 2012-01-16 23:07:57 +0400 |
commit | 0ad83a2172e882d4b7aa189da53a69c13d24ceda (patch) | |
tree | d0abd5d59d933a5ee7b93923a7da7e2e455386fc /app | |
parent | 8cc25ef94e540e8512f0c22eb4a506f812e9982f (diff) |
css refactoring
Diffstat (limited to 'app')
-rw-r--r-- | app/assets/stylesheets/application.css | 44 | ||||
-rw-r--r-- | app/assets/stylesheets/commits.css.scss | 41 | ||||
-rw-r--r-- | app/assets/stylesheets/common.scss | 110 | ||||
-rw-r--r-- | app/assets/stylesheets/dashboard.scss | 26 | ||||
-rw-r--r-- | app/assets/stylesheets/projects.css.scss | 242 | ||||
-rw-r--r-- | app/assets/stylesheets/style.scss | 136 | ||||
-rw-r--r-- | app/assets/stylesheets/top_panel.scss | 146 | ||||
-rw-r--r-- | app/views/layouts/_head_panel.html.haml | 89 |
8 files changed, 441 insertions, 393 deletions
diff --git a/app/assets/stylesheets/application.css b/app/assets/stylesheets/application.css index e4de2a2772f..f811293185e 100644 --- a/app/assets/stylesheets/application.css +++ b/app/assets/stylesheets/application.css @@ -7,48 +7,6 @@ *= require jquery-ui/jquery.tagify *= require chosen *= require_self - *= require_tree . + *= require common */ -/** COLORS **/ -.cgray { color:gray; } -.cred { color:#D12F19; } -.cgreen { color:#44aa22; } - -/** COMMON STYLES **/ -.left { - float:left; -} -.right { - float:right; -} -.width-50p{ - width:50%; -} -.width-49p{ - width:49%; -} -.width-30p{ - width:30%; -} -.width-65p{ - width:65%; -} -.width-100p{ - width:100%; -} -.append-bottom-10 { - margin-bottom:10px; -} -.append-bottom-20 { - margin-bottom:20px; -} -.prepend-top-10 { - margin-top:10px; -} -.no-borders { - border:none; -} -.no-padding { - padding:0 !important; -} diff --git a/app/assets/stylesheets/commits.css.scss b/app/assets/stylesheets/commits.css.scss index e42b9dfc64f..eab3315ac5b 100644 --- a/app/assets/stylesheets/commits.css.scss +++ b/app/assets/stylesheets/commits.css.scss @@ -1,3 +1,44 @@ +/* Commit Page */ +body.project-page.commits-page .commit-info{float: right;} +body.project-page.commits-page .commit-info data{ + padding: 4px 10px; + font-size: 11px; +} +body.project-page.commits-page .commit-info data.commit-button{ + background-image: -webkit-gradient(linear, 0 0, 0 26, color-stop(0.192, #fff), to(#f4f4f4)); + background-image: -webkit-linear-gradient(#fff 19.2%, #f4f4f4); + background-image: -moz-linear-gradient(#fff 19.2%, #f4f4f4); + background-image: -o-linear-gradient(#fff 19.2%, #f4f4f4); + box-shadow: 0 -1px 0 white inset; + display: block; + border: 1px solid #eee; + border-radius: 5px; + margin-bottom: 2px; + position: relative; + padding-right: 20px; +} + +body.project-page.commits-page .commit-button i{ + background: url('images.png') no-repeat -138px -27px; + width: 6px; + height: 9px; + float: right; + position: absolute; + top: 6px; + right: 5px; +} +body.project-page.commits-page .commits-date {display: block; width: 100%; margin-bottom: 20px} +body.project-page.commits-page .commits-date .data {padding: 0} +body.project-page.commits-page a.commit{padding: 10px; border-bottom: 1px solid #eee; overflow: hidden; display: block;} +body.project-page.commits-page .commits-date a.commit {padding: 10px; border-bottom: none; overflow: hidden; display: block;} +body.project-page.commits-page .commits-date a.commit:last-child{border-bottom: 0} +body.project-page.commits-page .commits-date a.commit img{float: left; margin-right: 10px;} +body.project-page.commits-page .commits-date a.commit span.commit-title{display: block;} +body.project-page.commits-page .commits-date a.commit span.commit-title{margin-bottom: 10px} +body.project-page.commits-page .commits-date a.commit span.commit-author{color: #999; font-weight: normal; font-style: italic;} +body.project-page.commits-page .commits-date a.commit span.commit-author strong{font-weight: bold; font-style: normal;} + +/* eo Commit Page */ /** Commit diff view **/ .diff_file { border:1px solid #CCC; diff --git a/app/assets/stylesheets/common.scss b/app/assets/stylesheets/common.scss new file mode 100644 index 00000000000..e8e9bc39cc5 --- /dev/null +++ b/app/assets/stylesheets/common.scss @@ -0,0 +1,110 @@ +$text_color:#222; +$lite_text_color: #666; +$link_color:#FFF; +$active_link_color:#2FA0BB; +$active_bg_color:#79C3E0; +$active_bd_color: #2FA0BB; +$border_color:#FFF; +$app_width:980px; +$app_padding:20px; +$bg_color: #FFF; +$styled_border_color: #2FA0BB; + +/** MIXINS **/ +@mixin round-borders-bottom($radius) { + border-top: 1px solid #eaeaea; + -moz-border-radius-bottomright: $radius; + -moz-border-radius-bottomleft: $radius; + border-bottom-right-radius: $radius; + border-bottom-left-radius: $radius; + -webkit-border-bottom-left-radius: $radius; + -webkit-border-bottom-right-radius: $radius; +} + +@mixin round-borders-top($radius) { + border-top: 1px solid #eaeaea; + -moz-border-radius-topright: $radius; + -moz-border-radius-topleft: $radius; + border-top-right-radius: $radius; + border-top-left-radius: $radius; + -webkit-border-top-left-radius: $radius; + -webkit-border-top-right-radius: $radius; +} + +@mixin round-borders-all($radius) { + border: 1px solid #eaeaea; + -moz-border-radius: $radius; + -webkit-border-radius: $radius; + border-radius: $radius; +} + +/** COLORS **/ +.cgray { color:gray; } +.cred { color:#D12F19; } +.cgreen { color:#44aa22; } + +/** COMMON STYLES **/ +.left { + float:left; +} +.right { + float:right; +} +.width-50p{ + width:50%; +} +.width-49p{ + width:49%; +} +.width-30p{ + width:30%; +} +.width-65p{ + width:65%; +} +.width-100p{ + width:100%; +} +.append-bottom-10 { + margin-bottom:10px; +} +.append-bottom-20 { + margin-bottom:20px; +} +.prepend-top-10 { + margin-top:10px; +} +.no-borders { + border:none; +} +.no-padding { + padding:0 !important; +} + +/* General */ + +body.collapsed { + background-color: $bg_color; + + #container{ + margin: auto; + margin-top:51px; + width: $app_width; + border-top: 0; + background-color: $bg_color; + } +} + + +@import "style.scss"; +@import "projects.css.scss"; +@import "commits.css.scss"; +@import "notes.css.scss"; +@import "merge_requests.css.scss"; +@import "highlight.css.scss"; +@import "highlight.black.css.scss"; +@import "issues.css.scss"; +@import "commits.css.scss"; + +@import "top_panel.scss"; +@import "dashboard.scss"; diff --git a/app/assets/stylesheets/dashboard.scss b/app/assets/stylesheets/dashboard.scss new file mode 100644 index 00000000000..efbb3b9c979 --- /dev/null +++ b/app/assets/stylesheets/dashboard.scss @@ -0,0 +1,26 @@ +body.dashboard-page h2.icon span{ background-position: 9px -69px; } +body.dashboard-page header{margin-bottom: 0} +body.dashboard-page .news-feed{margin-left: 285px; min-height: 600px; margin-top: 20px; margin-right:2px; padding:20px;} +body.dashboard-page .dashboard-content{ position: relative; float: left; width: 100%; height: 100%; } +body.dashboard-page .news-feed h2{float: left;} +body.dashboard-page aside{ min-height: 820px; position: relative; top: 0; bottom: 0; right: 0; width: 260px; float: left; border-right: 1px solid #ccc; padding:20px; padding-right:0; } +body.dashboard-page aside h4{margin: 0; border-bottom: 1px solid #ccc; padding: 20px 20px 20px 0px; font-size: 11px; font-weight: bold; text-transform: uppercase;} +body.dashboard-page aside h4 a.button-small{float: right; text-transform: none; border-radius: 4px; margin-right: 2%; margin-top: -4px; display: block;} +body.dashboard-page aside .project-list {list-style: none; margin: 0; padding: 0;} +body.dashboard-page aside .project-list li a {background: white; color: #{$blue_link}; display: block; border-bottom: 1px solid #eee; padding: 14px 6% 14px 0px;} +//body.dashboard-page aside .project-list li a:hover {background: #f1f1f1} +//body.dashboard-page aside .project-list li a:hover span.arrow{background-color: #E3E5EA;} +body.dashboard-page aside .project-list li a span.project-name{font-size: 14px; display: block; margin-bottom: 8px} +body.dashboard-page aside .project-list li a span.time{color: #666; font-weight: normal; font-size: 11px} +body.dashboard-page aside .project-list li a span.arrow{float: right; background: #E3E5EA; padding: 10px; border-radius: 5px; margin-top: 2px; text-shadow: none; color: #999} +body.dashboard-page .news-feed .project-updates {margin-bottom: 20px; display: block; width: 100%;} +body.dashboard-page .news-feed .project-updates .data{ padding: 0} +body.dashboard-page .news-feed .project-updates a.project-update {padding: 10px; overflow: hidden; display: block;} +body.dashboard-page .news-feed .project-updates a.project-update:last-child{border-bottom: 0} +body.dashboard-page .news-feed .project-updates a.project-update img{float: left; margin-right: 10px;} +body.dashboard-page .news-feed .project-updates a.project-update span.update-title, .dashboard-page .news-feed .project-updates li a span.update-author{display: block;} +body.dashboard-page .news-feed .project-updates a.project-update span.update-title{margin-bottom: 10px} +body.dashboard-page .news-feed .project-updates a.project-update span.update-author{color: #999; font-weight: normal; font-style: italic;} +body.dashboard-page .news-feed .project-updates a.project-update span.update-author strong{font-weight: bold; font-style: normal;} +/* eo Dashboard Page */ + diff --git a/app/assets/stylesheets/projects.css.scss b/app/assets/stylesheets/projects.css.scss index b82076bc8d2..0a01e3d4050 100644 --- a/app/assets/stylesheets/projects.css.scss +++ b/app/assets/stylesheets/projects.css.scss @@ -1,31 +1,78 @@ -/** MIXINS **/ -@mixin round-borders-bottom($radius) { - border-top: 1px solid #eaeaea; - -moz-border-radius-bottomright: $radius; - -moz-border-radius-bottomleft: $radius; - border-bottom-right-radius: $radius; - border-bottom-left-radius: $radius; - -webkit-border-bottom-left-radius: $radius; - -webkit-border-bottom-right-radius: $radius; -} - -@mixin round-borders-top($radius) { - border-top: 1px solid #eaeaea; - -moz-border-radius-topright: $radius; - -moz-border-radius-topleft: $radius; - border-top-right-radius: $radius; - border-top-left-radius: $radius; - -webkit-border-top-left-radius: $radius; - -webkit-border-top-right-radius: $radius; -} - -@mixin round-borders-all($radius) { - border: 1px solid #eaeaea; - -moz-border-radius: $radius; - -webkit-border-radius: $radius; - border-radius: $radius; +body.project-page h2.icon .project-name, body.project-page h2.icon d{border: 1px solid #eee; padding: 5px 30px 5px 10px; border-radius: 5px; position: relative;} +body.project-page h2.icon .project-name i.arrow{float: right; + position: absolute; + right: 10px; + top: 13px; + display: block; + background: url('images.png') no-repeat -97px -29px; + width: 4px; + height: 5px; +} + +body.project-page h2.icon span{ background-position: -78px -68px; } +body.project-page .project-container{ position: relative; float: left; width: 100%; height: 100%; padding-bottom: 10px;} +body.project-page .page-title{margin-bottom: 0} + +body.project-page .project-sidebar { + width: 110px; + left: 0; + top: 0; + height: 100%; + bottom: 0; + position: absolute; + float: left; + display: inline-block; + background: #FFF; + padding: $app_padding; + padding-right:0px; + margin: 0; + border-right: 1px solid #ddd; } +body.projects-page input.text.git-url { font-size: 12px; border-radius: 5px; color: #666; box-shadow: 0 1px 2px rgba(0,0,0,.2) inset; padding: 8px 0 8px 30px; margin-bottom: 20px; background: white url('images.png') no-repeat 8px -40px; width: 136px} +body.projects-page input.text.git-url {margin:10px 0 0 } +.git_url_wrapper { margin-right:50px } + +.projects_selector:hover > .project-box{ -moz-box-shadow:0px 0px 10px rgba(0, 0, 0, .1); -webkit-box-shadow:0px 0px 10px rgba(0, 0, 0, .1); box-shadow:0px 0px 10px rgba(0, 0, 0, .1); } + + +/* New project Page */ +.new-project-page .container table{background: white} +body.project-page .project-sidebar aside{width: 109px} +body.project-page .project-sidebar aside a{ + display: block; + position: relative; + padding: 15px 10px; + margin: 10px 0 0 0; + + +} +body.project-page .project-sidebar aside a span.number{float: right; border-radius: 5px; text-shadow: none; background: rgba(0,0,0,.12); text-align: center; padding: 5px 8px; position: absolute; top: 10px; right: 10px} +body.project-page .project-sidebar aside a.current { + color: white; + background: $active_bg_color; + border: 1px solid $active_bd_color; + border-radius:5px; + + + -webkit-border-top-right-radius: 0; + -webkit-border-bottom-right-radius: 0; + -moz-border-radius-topright: 0px; + -moz-border-radius-bottomright: 0px; + border-top-right-radius: 0; + border-bottom-right-radius: 0; + margin-right: -1px; +} +body.project-page .project-content{ padding: $app_padding; display: block; margin-left: 130px; min-height: 600px} +body.project-page .project-content h2{ margin-top: 6px} +body.project-page .project-content .button.right{margin-left: 20px} +body.project-page table .commit a{color: #{$blue_link}} +body.project-page table th, body.project-page table td{ border-bottom: 1px solid #DEE2E3;} +body.project-page .fixed{position: fixed; } + + + + /** File stat **/ .file_stats { span { @@ -530,90 +577,6 @@ h4.dash-tabs { } } -body header { - position:absolute; - width:100%; - padding:0; - margin:0; - top:0; - left:0; - background: #999; /* for non-css3 browsers */ - filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FAFAFA', endColorstr='#EAEAEA'); /* for IE */ - background: -webkit-gradient(linear, left top, left bottom, from(#FAFAFA), to(#EAEAEA)); /* for webkit browsers */ - background: -moz-linear-gradient(top, #FAFAFA, #EAEAEA); /* for firefox 3.6+ */ - border-bottom: 1px solid #ccc; - - height:50px; - - .wrapper { - margin:auto; - width:980px; - padding: 10px 0; - font-size: 11px; - position:relative; - } - .project_name { - float:left; - width:235px; - margin-right:30px; - font-size:16px; - font-weight:bold; - padding:5px 7px; - color:#333; - } - - .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: white url('images.png') no-repeat 8px -42px; - width: 160px; - height:26px; - } - } -} - -.top_panel_holder .chzn-container { - position:relative; - - .chzn-drop { - margin:7px 0; - border: 1px solid #CCC; - min-width: 300px; - - .chzn-results { - max-height:300px; - } - } - - .chzn-single { - background:white; - -moz-border-radius: 4px; - border-radius: 4px; - - div { - background:white; - } - - span { - font-weight: normal; - } - } -} .dashboard-loader { float:right; @@ -801,68 +764,9 @@ tr.line_notes_row { } } } -.top_links_holder { - width:124px; - float:left; - .top_link { - position: relative; - float:left; - &.home { - width:28px; - height:27px; - top: -12px; - border: 1px solid #CCC; - border-radius: 3px; - background: #fff; - margin-right:15px; - padding: 6px 7px; - } - &.admin { - top: -3px; - padding: 3px; - width: 21px; - height: 21px; - } - } -} -.dash_top_link { - margin: 4px 14px; - float: left; - font-size: 14px; - - &.active { - color:#2FA0BB; - } - &:hover { - color:#2FA0BB; - } -} - -.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: #2FA0BB; - } - } -} diff --git a/app/assets/stylesheets/style.scss b/app/assets/stylesheets/style.scss index 916f6744ffe..08b5550f25f 100644 --- a/app/assets/stylesheets/style.scss +++ b/app/assets/stylesheets/style.scss @@ -333,15 +333,6 @@ body.login-page{background-color: #f1f1f1; padding-top: 10%} } /* eo InfoBlock */ -/* General */ -#container{background-color: white; overflow: hidden; } -body.collapsed #container{ - margin: auto; - margin-top:51px; - width: 980px; - border-top: 0; -} - /* Header */ header{ background: #474D57 url('bg-header.png') repeat-x bottom; @@ -600,139 +591,12 @@ html, body { height: 100%; } -body.dashboard-page h2.icon span{ background-position: 9px -69px; } -body.dashboard-page header{margin-bottom: 0} -body.dashboard-page .news-feed{margin-left: 290px; min-height: 600px; margin-top: 20px; margin-right:2px;} -body.dashboard-page .dashboard-content{ position: relative; float: left; width: 100%; height: 100%; } -body.dashboard-page .news-feed h2{float: left;} -body.dashboard-page aside{ min-height: 820px; position: relative; top: 0; bottom: 0; right: 0; width: 260px; float: left; border-right: 1px solid #ccc } -body.dashboard-page aside h4{margin: 0; border-bottom: 1px solid #ccc; padding: 20px 20px 20px 0px; font-size: 11px; font-weight: bold; text-transform: uppercase;} -body.dashboard-page aside h4 a.button-small{float: right; text-transform: none; border-radius: 4px; margin-right: 2%; margin-top: -4px; display: block;} -body.dashboard-page aside .project-list {list-style: none; margin: 0; padding: 0;} -body.dashboard-page aside .project-list li a {background: white; color: #{$blue_link}; display: block; border-bottom: 1px solid #eee; padding: 14px 6% 14px 0px;} -//body.dashboard-page aside .project-list li a:hover {background: #f1f1f1} -//body.dashboard-page aside .project-list li a:hover span.arrow{background-color: #E3E5EA;} -body.dashboard-page aside .project-list li a span.project-name{font-size: 14px; display: block; margin-bottom: 8px} -body.dashboard-page aside .project-list li a span.time{color: #666; font-weight: normal; font-size: 11px} -body.dashboard-page aside .project-list li a span.arrow{float: right; background: #E3E5EA; padding: 10px; border-radius: 5px; margin-top: 2px; text-shadow: none; color: #999} -body.dashboard-page .news-feed .project-updates {margin-bottom: 20px; display: block; width: 100%;} -body.dashboard-page .news-feed .project-updates .data{ padding: 0} -body.dashboard-page .news-feed .project-updates a.project-update {padding: 10px; overflow: hidden; display: block;} -body.dashboard-page .news-feed .project-updates a.project-update:last-child{border-bottom: 0} -body.dashboard-page .news-feed .project-updates a.project-update img{float: left; margin-right: 10px;} -body.dashboard-page .news-feed .project-updates a.project-update span.update-title, .dashboard-page .news-feed .project-updates li a span.update-author{display: block;} -body.dashboard-page .news-feed .project-updates a.project-update span.update-title{margin-bottom: 10px} -body.dashboard-page .news-feed .project-updates a.project-update span.update-author{color: #999; font-weight: normal; font-style: italic;} -body.dashboard-page .news-feed .project-updates a.project-update span.update-author strong{font-weight: bold; font-style: normal;} -/* eo Dashboard Page */ .grey-button.right{margin-top: 20px} /* Project Page */ - -body.project-page h2.icon .project-name, body.project-page h2.icon d{border: 1px solid #eee; padding: 5px 30px 5px 10px; border-radius: 5px; position: relative;} -body.project-page h2.icon .project-name i.arrow{float: right; - position: absolute; - right: 10px; - top: 13px; - display: block; - background: url('images.png') no-repeat -97px -29px; - width: 4px; - height: 5px; -} - -body.project-page h2.icon span{ background-position: -78px -68px; } -body.project-page .project-container{ position: relative; float: left; width: 100%; height: 100%; padding-bottom: 10px;} -body.project-page .page-title{margin-bottom: 0} -body.project-page .project-sidebar {width: 110px; left: 0; top: 0; height: 100%; bottom: 0; position: absolute; float: left; display: inline-block; background: #FFF; padding: 20px 0 20px 0; margin: 0; border-right: 1px solid #ddd; } - -body.projects-page input.text.git-url { font-size: 12px; border-radius: 5px; color: #666; box-shadow: 0 1px 2px rgba(0,0,0,.2) inset; padding: 8px 0 8px 30px; margin-bottom: 20px; background: white url('images.png') no-repeat 8px -40px; width: 136px} -body.projects-page input.text.git-url {margin:10px 0 0 } -.git_url_wrapper { margin-right:50px } - -.projects_selector:hover > .project-box{ -moz-box-shadow:0px 0px 10px rgba(0, 0, 0, .1); -webkit-box-shadow:0px 0px 10px rgba(0, 0, 0, .1); box-shadow:0px 0px 10px rgba(0, 0, 0, .1); } - -body.project-page .project-sidebar aside{width: 109px} -body.project-page .project-sidebar aside a{ - display: block; - position: relative; - //background: #FFF; - padding: 15px 10px; - //border: 1px solid #ccc; - margin: 10px 0 0 0; - //border-radius:5px; - - -} -//body.project-page .project-sidebar aside a:hover{background-color: #FFFFFF;} -body.project-page .project-sidebar aside a span.number{float: right; border-radius: 5px; text-shadow: none; background: rgba(0,0,0,.12); text-align: center; padding: 5px 8px; position: absolute; top: 10px; right: 10px} -body.project-page .project-sidebar aside a.current { - color: white; - background: #79C3E0; - border: 1px solid #2FA0BB; - border-radius:5px; - - - -webkit-border-top-right-radius: 0; - -webkit-border-bottom-right-radius: 0; - -moz-border-radius-topright: 0px; - -moz-border-radius-bottomright: 0px; - border-top-right-radius: 0; - border-bottom-right-radius: 0; - margin-right: -1px; -} -body.project-page .project-content{ padding: 20px; display: block; margin-left: 110px; min-height: 600px} -body.project-page .project-content h2{ margin-top: 6px} -body.project-page .project-content .button.right{margin-left: 20px} -body.project-page table .commit a{color: #{$blue_link}} -body.project-page table th, body.project-page table td{ border-bottom: 1px solid #DEE2E3;} -body.project-page .fixed{position: fixed; } - -/* New project Page */ -.new-project-page .container table{background: white} /* eo New Project Page */ -/* Commit Page */ -body.project-page.commits-page .commit-info{float: right;} -body.project-page.commits-page .commit-info data{ - padding: 4px 10px; - font-size: 11px; -} -body.project-page.commits-page .commit-info data.commit-button{ - background-image: -webkit-gradient(linear, 0 0, 0 26, color-stop(0.192, #fff), to(#f4f4f4)); - background-image: -webkit-linear-gradient(#fff 19.2%, #f4f4f4); - background-image: -moz-linear-gradient(#fff 19.2%, #f4f4f4); - background-image: -o-linear-gradient(#fff 19.2%, #f4f4f4); - box-shadow: 0 -1px 0 white inset; - display: block; - border: 1px solid #eee; - border-radius: 5px; - margin-bottom: 2px; - position: relative; - padding-right: 20px; -} - -body.project-page.commits-page .commit-button i{ - background: url('images.png') no-repeat -138px -27px; - width: 6px; - height: 9px; - float: right; - position: absolute; - top: 6px; - right: 5px; -} -body.project-page.commits-page .commits-date {display: block; width: 100%; margin-bottom: 20px} -body.project-page.commits-page .commits-date .data {padding: 0} -body.project-page.commits-page a.commit{padding: 10px; border-bottom: 1px solid #eee; overflow: hidden; display: block;} -body.project-page.commits-page .commits-date a.commit {padding: 10px; border-bottom: none; overflow: hidden; display: block;} -body.project-page.commits-page .commits-date a.commit:last-child{border-bottom: 0} -body.project-page.commits-page .commits-date a.commit img{float: left; margin-right: 10px;} -body.project-page.commits-page .commits-date a.commit span.commit-title{display: block;} -body.project-page.commits-page .commits-date a.commit span.commit-title{margin-bottom: 10px} -body.project-page.commits-page .commits-date a.commit span.commit-author{color: #999; font-weight: normal; font-style: italic;} -body.project-page.commits-page .commits-date a.commit span.commit-author strong{font-weight: bold; font-style: normal;} - -/* eo Commit Page */ /* eo Project Page */ diff --git a/app/assets/stylesheets/top_panel.scss b/app/assets/stylesheets/top_panel.scss new file mode 100644 index 00000000000..e529397eabc --- /dev/null +++ b/app/assets/stylesheets/top_panel.scss @@ -0,0 +1,146 @@ +.main_links { + width:124px; + float:left; + a { + position: relative; + float:left; + padding: 4px; + + &.home { + margin-right:15px; + width: 26px; + } + + &.admin { + width: 21px; + } + } +} + +.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; + } + } +} + +body header { + position:absolute; + width:100%; + padding:0; + margin:0; + top:0; + left:0; + background: #999; /* for non-css3 browsers */ + filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFF', endColorstr='#EAEAEA'); /* for IE */ + background: -webkit-gradient(linear, left top, left bottom, from(#FFFFFF), to(#EAEAEA)); /* for webkit browsers */ + background: -moz-linear-gradient(top, #FFFFFF, #EAEAEA); /* for firefox 3.6+ */ + border-bottom: 2px solid $styled_border_color; + + height:50px; + + .wrapper { + margin:auto; + width:$app_width; + position:relative; + + .top_panel_content { + padding:10px $app_padding; + } + } + + .project_name { + float:left; + width:235px; + margin-right:30px; + font-size:16px; + font-weight:bold; + padding:5px 7px; + color:#333; + } + + .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: white url('images.png') no-repeat 8px -42px; + width: 160px; + height:26px; + } + } +} + +.top_panel_holder .chzn-container { + position:relative; + + .chzn-drop { + margin:7px 0; + border: 1px solid #CCC; + min-width: 300px; + + .chzn-results { + max-height:300px; + } + } + + .chzn-single { + background:white; + -moz-border-radius: 4px; + border-radius: 4px; + + div { + background:white; + } + + span { + font-weight: normal; + } + } +} diff --git a/app/views/layouts/_head_panel.html.haml b/app/views/layouts/_head_panel.html.haml index da351d07093..c2943d049ed 100644 --- a/app/views/layouts/_head_panel.html.haml +++ b/app/views/layouts/_head_panel.html.haml @@ -1,53 +1,52 @@ / Page Header %header.top_panel_holder .wrapper - %div.top_links_holder - = link_to root_path, :class => "top_link home", :title => "Home" do - = image_tag "Home-UI.PNG", :width => 26 - - if current_user.is_admin? - = link_to admin_root_path, :class => "top_link admin", :title => "Admin" do - = image_tag "Gear-UI.PNG", :width => 20 + .top_panel_content + %div.main_links + = link_to root_path, :class => "home", :title => "Home" do + = image_tag "Home-UI.PNG", :width => 26 + - if current_user.is_admin? + = link_to admin_root_path, :class => "admin", :title => "Admin" do + = image_tag "Gear-UI.PNG", :width => 20 - - if project_layout - .project_name - = truncate @project.name, :length => 28 - .git_url_wrapper - %input.git-url.text{:id => "", :name => "", :readonly => "", :type => "text", :value => @project.url_to_repo, :class => "one_click_select"} - - if @project.repo_exists? - .left{:style => "margin-left:5px;"} - = render :partial => "projects/refs", :locals => { :destination => controller.controller_name == "commits" ? "commits" : "tree" } - = yield :rss_icon - - elsif profile_layout - = link_to "Activities", dashboard_path, :class => "dash_top_link #{"active" if current_page?(dashboard_path) || current_page?(root_path) }" - = link_to "Projects", projects_path, :class => "dash_top_link #{"active" if current_page?(projects_path)}" - = link_to "Issues", dashboard_issues_path, :class => "dash_top_link #{"active" if current_page?(dashboard_issues_path)}", :id => "issues_slide" - = link_to "Merge Requests", dashboard_merge_requests_path, :class => "dash_top_link #{"active" if current_page?(dashboard_merge_requests_path)}", :id => "merge_requests_slide" - .search - = text_field_tag "search", nil, :placeholder => "Search", :class => "search-input" + - if project_layout + .project_name + = truncate @project.name, :length => 28 + .git_url_wrapper + %input.git-url.text{:id => "", :name => "", :readonly => "", :type => "text", :value => @project.url_to_repo, :class => "one_click_select"} + - if @project.repo_exists? + .left{:style => "margin-left:5px;"} + = render :partial => "projects/refs", :locals => { :destination => controller.controller_name == "commits" ? "commits" : "tree" } + = yield :rss_icon - .account-box - = link_to profile_path, :class => "pic" do - = image_tag gravatar_icon(current_user.email) - .account-links - = link_to profile_path, :class => "username" do - My profile - = link_to 'Logout', destroy_user_session_path, :class => "logout", :method => :delete - / .account-box - -#.search - = text_field_tag "search", nil, :placeholder => "Search", :class => "search-input" - / .login-top - - if current_user - = javascript_tag do - $(function(){ - $("#search").autocomplete({ - source: #{raw search_autocomplete_source}, - select: function(event, ui) { location.href = ui.item.url } - }); - }); + - elsif profile_layout + .dashboard_links + = link_to "Activities", dashboard_path, :class => "#{"active" if current_page?(dashboard_path) || current_page?(root_path) }" + = link_to "Projects", projects_path, :class => "#{"active" if current_page?(projects_path)}" + = link_to "Issues", dashboard_issues_path, :class => "#{"active" if current_page?(dashboard_issues_path)}", :id => "issues_slide" + = link_to "Merge Requests", dashboard_merge_requests_path, :class => "#{"active" if current_page?(dashboard_merge_requests_path)}", :id => "merge_requests_slide" + .search + = text_field_tag "search", nil, :placeholder => "Search", :class => "search-input" - - if current_user.require_ssh_key? - #no_ssh_key_defined.big-message.error - %p - No SSH Key is defined. You won't be able to use any Git command!. Click #{link_to( 'here', keys_path )} to add one! + .account-box + = link_to profile_path, :class => "pic" do + = image_tag gravatar_icon(current_user.email) + .account-links + = link_to profile_path, :class => "username" do + My profile + = link_to 'Logout', destroy_user_session_path, :class => "logout", :method => :delete + - if current_user + = javascript_tag do + $(function(){ + $("#search").autocomplete({ + source: #{raw search_autocomplete_source}, + select: function(event, ui) { location.href = ui.item.url } + }); + }); + + -#- if current_user.require_ssh_key? + #no_ssh_key_defined.big-message.error + %p + No SSH Key is defined. You won't be able to use any Git command!. Click #{link_to( 'here', keys_path )} to add one! |