Commit 0ad83a2172e882d4b7aa189da53a69c13d24ceda

Authored by Dmitriy Zaporozhets
1 parent 8cc25ef9

css refactoring

app/assets/stylesheets/application.css
... ... @@ -7,48 +7,6 @@
7 7 *= require jquery-ui/jquery.tagify
8 8 *= require chosen
9 9 *= require_self
10   - *= require_tree .
  10 + *= require common
11 11 */
12 12  
13   -/** COLORS **/
14   -.cgray { color:gray; }
15   -.cred { color:#D12F19; }
16   -.cgreen { color:#44aa22; }
17   -
18   -/** COMMON STYLES **/
19   -.left {
20   - float:left;
21   -}
22   -.right {
23   - float:right;
24   -}
25   -.width-50p{
26   - width:50%;
27   -}
28   -.width-49p{
29   - width:49%;
30   -}
31   -.width-30p{
32   - width:30%;
33   -}
34   -.width-65p{
35   - width:65%;
36   -}
37   -.width-100p{
38   - width:100%;
39   -}
40   -.append-bottom-10 {
41   - margin-bottom:10px;
42   -}
43   -.append-bottom-20 {
44   - margin-bottom:20px;
45   -}
46   -.prepend-top-10 {
47   - margin-top:10px;
48   -}
49   -.no-borders {
50   - border:none;
51   -}
52   -.no-padding {
53   - padding:0 !important;
54   -}
... ...
app/assets/stylesheets/commits.css.scss
  1 +/* Commit Page */
  2 +body.project-page.commits-page .commit-info{float: right;}
  3 +body.project-page.commits-page .commit-info data{
  4 + padding: 4px 10px;
  5 + font-size: 11px;
  6 +}
  7 +body.project-page.commits-page .commit-info data.commit-button{
  8 + background-image: -webkit-gradient(linear, 0 0, 0 26, color-stop(0.192, #fff), to(#f4f4f4));
  9 + background-image: -webkit-linear-gradient(#fff 19.2%, #f4f4f4);
  10 + background-image: -moz-linear-gradient(#fff 19.2%, #f4f4f4);
  11 + background-image: -o-linear-gradient(#fff 19.2%, #f4f4f4);
  12 + box-shadow: 0 -1px 0 white inset;
  13 + display: block;
  14 + border: 1px solid #eee;
  15 + border-radius: 5px;
  16 + margin-bottom: 2px;
  17 + position: relative;
  18 + padding-right: 20px;
  19 +}
  20 +
  21 +body.project-page.commits-page .commit-button i{
  22 + background: url('images.png') no-repeat -138px -27px;
  23 + width: 6px;
  24 + height: 9px;
  25 + float: right;
  26 + position: absolute;
  27 + top: 6px;
  28 + right: 5px;
  29 +}
  30 +body.project-page.commits-page .commits-date {display: block; width: 100%; margin-bottom: 20px}
  31 +body.project-page.commits-page .commits-date .data {padding: 0}
  32 +body.project-page.commits-page a.commit{padding: 10px; border-bottom: 1px solid #eee; overflow: hidden; display: block;}
  33 +body.project-page.commits-page .commits-date a.commit {padding: 10px; border-bottom: none; overflow: hidden; display: block;}
  34 +body.project-page.commits-page .commits-date a.commit:last-child{border-bottom: 0}
  35 +body.project-page.commits-page .commits-date a.commit img{float: left; margin-right: 10px;}
  36 +body.project-page.commits-page .commits-date a.commit span.commit-title{display: block;}
  37 +body.project-page.commits-page .commits-date a.commit span.commit-title{margin-bottom: 10px}
  38 +body.project-page.commits-page .commits-date a.commit span.commit-author{color: #999; font-weight: normal; font-style: italic;}
  39 +body.project-page.commits-page .commits-date a.commit span.commit-author strong{font-weight: bold; font-style: normal;}
  40 +
  41 +/* eo Commit Page */
1 42 /** Commit diff view **/
2 43 .diff_file {
3 44 border:1px solid #CCC;
... ...
app/assets/stylesheets/common.scss 0 → 100644
... ... @@ -0,0 +1,110 @@
  1 +$text_color:#222;
  2 +$lite_text_color: #666;
  3 +$link_color:#FFF;
  4 +$active_link_color:#2FA0BB;
  5 +$active_bg_color:#79C3E0;
  6 +$active_bd_color: #2FA0BB;
  7 +$border_color:#FFF;
  8 +$app_width:980px;
  9 +$app_padding:20px;
  10 +$bg_color: #FFF;
  11 +$styled_border_color: #2FA0BB;
  12 +
  13 +/** MIXINS **/
  14 +@mixin round-borders-bottom($radius) {
  15 + border-top: 1px solid #eaeaea;
  16 + -moz-border-radius-bottomright: $radius;
  17 + -moz-border-radius-bottomleft: $radius;
  18 + border-bottom-right-radius: $radius;
  19 + border-bottom-left-radius: $radius;
  20 + -webkit-border-bottom-left-radius: $radius;
  21 + -webkit-border-bottom-right-radius: $radius;
  22 +}
  23 +
  24 +@mixin round-borders-top($radius) {
  25 + border-top: 1px solid #eaeaea;
  26 + -moz-border-radius-topright: $radius;
  27 + -moz-border-radius-topleft: $radius;
  28 + border-top-right-radius: $radius;
  29 + border-top-left-radius: $radius;
  30 + -webkit-border-top-left-radius: $radius;
  31 + -webkit-border-top-right-radius: $radius;
  32 +}
  33 +
  34 +@mixin round-borders-all($radius) {
  35 + border: 1px solid #eaeaea;
  36 + -moz-border-radius: $radius;
  37 + -webkit-border-radius: $radius;
  38 + border-radius: $radius;
  39 +}
  40 +
  41 +/** COLORS **/
  42 +.cgray { color:gray; }
  43 +.cred { color:#D12F19; }
  44 +.cgreen { color:#44aa22; }
  45 +
  46 +/** COMMON STYLES **/
  47 +.left {
  48 + float:left;
  49 +}
  50 +.right {
  51 + float:right;
  52 +}
  53 +.width-50p{
  54 + width:50%;
  55 +}
  56 +.width-49p{
  57 + width:49%;
  58 +}
  59 +.width-30p{
  60 + width:30%;
  61 +}
  62 +.width-65p{
  63 + width:65%;
  64 +}
  65 +.width-100p{
  66 + width:100%;
  67 +}
  68 +.append-bottom-10 {
  69 + margin-bottom:10px;
  70 +}
  71 +.append-bottom-20 {
  72 + margin-bottom:20px;
  73 +}
  74 +.prepend-top-10 {
  75 + margin-top:10px;
  76 +}
  77 +.no-borders {
  78 + border:none;
  79 +}
  80 +.no-padding {
  81 + padding:0 !important;
  82 +}
  83 +
  84 +/* General */
  85 +
  86 +body.collapsed {
  87 + background-color: $bg_color;
  88 +
  89 + #container{
  90 + margin: auto;
  91 + margin-top:51px;
  92 + width: $app_width;
  93 + border-top: 0;
  94 + background-color: $bg_color;
  95 + }
  96 +}
  97 +
  98 +
  99 +@import "style.scss";
  100 +@import "projects.css.scss";
  101 +@import "commits.css.scss";
  102 +@import "notes.css.scss";
  103 +@import "merge_requests.css.scss";
  104 +@import "highlight.css.scss";
  105 +@import "highlight.black.css.scss";
  106 +@import "issues.css.scss";
  107 +@import "commits.css.scss";
  108 +
  109 +@import "top_panel.scss";
  110 +@import "dashboard.scss";
... ...
app/assets/stylesheets/dashboard.scss 0 → 100644
... ... @@ -0,0 +1,26 @@
  1 +body.dashboard-page h2.icon span{ background-position: 9px -69px; }
  2 +body.dashboard-page header{margin-bottom: 0}
  3 +body.dashboard-page .news-feed{margin-left: 285px; min-height: 600px; margin-top: 20px; margin-right:2px; padding:20px;}
  4 +body.dashboard-page .dashboard-content{ position: relative; float: left; width: 100%; height: 100%; }
  5 +body.dashboard-page .news-feed h2{float: left;}
  6 +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; }
  7 +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;}
  8 +body.dashboard-page aside h4 a.button-small{float: right; text-transform: none; border-radius: 4px; margin-right: 2%; margin-top: -4px; display: block;}
  9 +body.dashboard-page aside .project-list {list-style: none; margin: 0; padding: 0;}
  10 +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;}
  11 +//body.dashboard-page aside .project-list li a:hover {background: #f1f1f1}
  12 +//body.dashboard-page aside .project-list li a:hover span.arrow{background-color: #E3E5EA;}
  13 +body.dashboard-page aside .project-list li a span.project-name{font-size: 14px; display: block; margin-bottom: 8px}
  14 +body.dashboard-page aside .project-list li a span.time{color: #666; font-weight: normal; font-size: 11px}
  15 +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}
  16 +body.dashboard-page .news-feed .project-updates {margin-bottom: 20px; display: block; width: 100%;}
  17 +body.dashboard-page .news-feed .project-updates .data{ padding: 0}
  18 +body.dashboard-page .news-feed .project-updates a.project-update {padding: 10px; overflow: hidden; display: block;}
  19 +body.dashboard-page .news-feed .project-updates a.project-update:last-child{border-bottom: 0}
  20 +body.dashboard-page .news-feed .project-updates a.project-update img{float: left; margin-right: 10px;}
  21 +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;}
  22 +body.dashboard-page .news-feed .project-updates a.project-update span.update-title{margin-bottom: 10px}
  23 +body.dashboard-page .news-feed .project-updates a.project-update span.update-author{color: #999; font-weight: normal; font-style: italic;}
  24 +body.dashboard-page .news-feed .project-updates a.project-update span.update-author strong{font-weight: bold; font-style: normal;}
  25 +/* eo Dashboard Page */
  26 +
... ...
app/assets/stylesheets/projects.css.scss
1   -/** MIXINS **/
2   -@mixin round-borders-bottom($radius) {
3   - border-top: 1px solid #eaeaea;
4   - -moz-border-radius-bottomright: $radius;
5   - -moz-border-radius-bottomleft: $radius;
6   - border-bottom-right-radius: $radius;
7   - border-bottom-left-radius: $radius;
8   - -webkit-border-bottom-left-radius: $radius;
9   - -webkit-border-bottom-right-radius: $radius;
10   -}
11   -
12   -@mixin round-borders-top($radius) {
13   - border-top: 1px solid #eaeaea;
14   - -moz-border-radius-topright: $radius;
15   - -moz-border-radius-topleft: $radius;
16   - border-top-right-radius: $radius;
17   - border-top-left-radius: $radius;
18   - -webkit-border-top-left-radius: $radius;
19   - -webkit-border-top-right-radius: $radius;
20   -}
21   -
22   -@mixin round-borders-all($radius) {
23   - border: 1px solid #eaeaea;
24   - -moz-border-radius: $radius;
25   - -webkit-border-radius: $radius;
26   - border-radius: $radius;
  1 +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;}
  2 +body.project-page h2.icon .project-name i.arrow{float: right;
  3 + position: absolute;
  4 + right: 10px;
  5 + top: 13px;
  6 + display: block;
  7 + background: url('images.png') no-repeat -97px -29px;
  8 + width: 4px;
  9 + height: 5px;
  10 +}
  11 +
  12 +body.project-page h2.icon span{ background-position: -78px -68px; }
  13 +body.project-page .project-container{ position: relative; float: left; width: 100%; height: 100%; padding-bottom: 10px;}
  14 +body.project-page .page-title{margin-bottom: 0}
  15 +
  16 +body.project-page .project-sidebar {
  17 + width: 110px;
  18 + left: 0;
  19 + top: 0;
  20 + height: 100%;
  21 + bottom: 0;
  22 + position: absolute;
  23 + float: left;
  24 + display: inline-block;
  25 + background: #FFF;
  26 + padding: $app_padding;
  27 + padding-right:0px;
  28 + margin: 0;
  29 + border-right: 1px solid #ddd;
27 30 }
28 31  
  32 +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}
  33 +body.projects-page input.text.git-url {margin:10px 0 0 }
  34 +.git_url_wrapper { margin-right:50px }
  35 +
  36 +.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); }
  37 +
  38 +
  39 +/* New project Page */
  40 +.new-project-page .container table{background: white}
  41 +body.project-page .project-sidebar aside{width: 109px}
  42 +body.project-page .project-sidebar aside a{
  43 + display: block;
  44 + position: relative;
  45 + padding: 15px 10px;
  46 + margin: 10px 0 0 0;
  47 +
  48 +
  49 +}
  50 +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}
  51 +body.project-page .project-sidebar aside a.current {
  52 + color: white;
  53 + background: $active_bg_color;
  54 + border: 1px solid $active_bd_color;
  55 + border-radius:5px;
  56 +
  57 +
  58 + -webkit-border-top-right-radius: 0;
  59 + -webkit-border-bottom-right-radius: 0;
  60 + -moz-border-radius-topright: 0px;
  61 + -moz-border-radius-bottomright: 0px;
  62 + border-top-right-radius: 0;
  63 + border-bottom-right-radius: 0;
  64 + margin-right: -1px;
  65 +}
  66 +body.project-page .project-content{ padding: $app_padding; display: block; margin-left: 130px; min-height: 600px}
  67 +body.project-page .project-content h2{ margin-top: 6px}
  68 +body.project-page .project-content .button.right{margin-left: 20px}
  69 +body.project-page table .commit a{color: #{$blue_link}}
  70 +body.project-page table th, body.project-page table td{ border-bottom: 1px solid #DEE2E3;}
  71 +body.project-page .fixed{position: fixed; }
  72 +
  73 +
  74 +
  75 +
29 76 /** File stat **/
30 77 .file_stats {
31 78 span {
... ... @@ -530,90 +577,6 @@ h4.dash-tabs {
530 577 }
531 578 }
532 579  
533   -body header {
534   - position:absolute;
535   - width:100%;
536   - padding:0;
537   - margin:0;
538   - top:0;
539   - left:0;
540   - background: #999; /* for non-css3 browsers */
541   - filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FAFAFA', endColorstr='#EAEAEA'); /* for IE */
542   - background: -webkit-gradient(linear, left top, left bottom, from(#FAFAFA), to(#EAEAEA)); /* for webkit browsers */
543   - background: -moz-linear-gradient(top, #FAFAFA, #EAEAEA); /* for firefox 3.6+ */
544   - border-bottom: 1px solid #ccc;
545   -
546   - height:50px;
547   -
548   - .wrapper {
549   - margin:auto;
550   - width:980px;
551   - padding: 10px 0;
552   - font-size: 11px;
553   - position:relative;
554   - }
555   - .project_name {
556   - float:left;
557   - width:235px;
558   - margin-right:30px;
559   - font-size:16px;
560   - font-weight:bold;
561   - padding:5px 7px;
562   - color:#333;
563   - }
564   -
565   - .git_url_wrapper {
566   - padding:0px;
567   - margin:0px;
568   - float:left;
569   -
570   - .git-url {
571   - padding:0px;
572   - margin:0px;
573   - font-size: 12px;
574   -
575   - margin-right:10px;
576   - border-radius: 4px;
577   - -moz-border-radius: 4px;
578   -
579   -
580   - color: #666;
581   - border: 1px solid #AAA;
582   - padding: 0 10px 0 30px;
583   - background: white url('images.png') no-repeat 8px -42px;
584   - width: 160px;
585   - height:26px;
586   - }
587   - }
588   -}
589   -
590   -.top_panel_holder .chzn-container {
591   - position:relative;
592   -
593   - .chzn-drop {
594   - margin:7px 0;
595   - border: 1px solid #CCC;
596   - min-width: 300px;
597   -
598   - .chzn-results {
599   - max-height:300px;
600   - }
601   - }
602   -
603   - .chzn-single {
604   - background:white;
605   - -moz-border-radius: 4px;
606   - border-radius: 4px;
607   -
608   - div {
609   - background:white;
610   - }
611   -
612   - span {
613   - font-weight: normal;
614   - }
615   - }
616   -}
617 580  
618 581 .dashboard-loader {
619 582 float:right;
... ... @@ -801,68 +764,9 @@ tr.line_notes_row {
801 764 }
802 765 }
803 766 }
804   -.top_links_holder {
805   - width:124px;
806   - float:left;
807 767  
808   - .top_link {
809   - position: relative;
810   - float:left;
811 768  
812   - &.home {
813   - width:28px;
814   - height:27px;
815   - top: -12px;
816   - border: 1px solid #CCC;
817   - border-radius: 3px;
818   - background: #fff;
819 769  
820   - margin-right:15px;
821   - padding: 6px 7px;
822   - }
823 770  
824   - &.admin {
825   - top: -3px;
826   - padding: 3px;
827   - width: 21px;
828   - height: 21px;
829   - }
830   - }
831   -}
832 771  
833 772  
834   -.dash_top_link {
835   - margin: 4px 14px;
836   - float: left;
837   - font-size: 14px;
838   -
839   - &.active {
840   - color:#2FA0BB;
841   - }
842   - &:hover {
843   - color:#2FA0BB;
844   - }
845   -}
846   -
847   -.top-tabs {
848   - margin: 0;
849   - padding: 5px;
850   - font-size: 14px;
851   - padding-bottom:10px;
852   - margin-bottom:20px;
853   - height:26px;
854   - border-bottom:1px solid #ccc;
855   -
856   - .tab {
857   - font-weight: bold;
858   - background:none;
859   - padding: 10px;
860   - float:left;
861   - padding-left:0px;
862   - padding-right:40px;
863   -
864   - &.active {
865   - color: #2FA0BB;
866   - }
867   - }
868   -}
... ...
app/assets/stylesheets/style.scss
... ... @@ -333,15 +333,6 @@ body.login-page{background-color: #f1f1f1; padding-top: 10%}
333 333 }
334 334 /* eo InfoBlock */
335 335  
336   -/* General */
337   -#container{background-color: white; overflow: hidden; }
338   -body.collapsed #container{
339   - margin: auto;
340   - margin-top:51px;
341   - width: 980px;
342   - border-top: 0;
343   -}
344   -
345 336 /* Header */
346 337 header{
347 338 background: #474D57 url('bg-header.png') repeat-x bottom;
... ... @@ -600,139 +591,12 @@ html, body { height: 100%; }
600 591  
601 592  
602 593  
603   -body.dashboard-page h2.icon span{ background-position: 9px -69px; }
604   -body.dashboard-page header{margin-bottom: 0}
605   -body.dashboard-page .news-feed{margin-left: 290px; min-height: 600px; margin-top: 20px; margin-right:2px;}
606   -body.dashboard-page .dashboard-content{ position: relative; float: left; width: 100%; height: 100%; }
607   -body.dashboard-page .news-feed h2{float: left;}
608   -body.dashboard-page aside{ min-height: 820px; position: relative; top: 0; bottom: 0; right: 0; width: 260px; float: left; border-right: 1px solid #ccc }
609   -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;}
610   -body.dashboard-page aside h4 a.button-small{float: right; text-transform: none; border-radius: 4px; margin-right: 2%; margin-top: -4px; display: block;}
611   -body.dashboard-page aside .project-list {list-style: none; margin: 0; padding: 0;}
612   -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;}
613   -//body.dashboard-page aside .project-list li a:hover {background: #f1f1f1}
614   -//body.dashboard-page aside .project-list li a:hover span.arrow{background-color: #E3E5EA;}
615   -body.dashboard-page aside .project-list li a span.project-name{font-size: 14px; display: block; margin-bottom: 8px}
616   -body.dashboard-page aside .project-list li a span.time{color: #666; font-weight: normal; font-size: 11px}
617   -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}
618   -body.dashboard-page .news-feed .project-updates {margin-bottom: 20px; display: block; width: 100%;}
619   -body.dashboard-page .news-feed .project-updates .data{ padding: 0}
620   -body.dashboard-page .news-feed .project-updates a.project-update {padding: 10px; overflow: hidden; display: block;}
621   -body.dashboard-page .news-feed .project-updates a.project-update:last-child{border-bottom: 0}
622   -body.dashboard-page .news-feed .project-updates a.project-update img{float: left; margin-right: 10px;}
623   -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;}
624   -body.dashboard-page .news-feed .project-updates a.project-update span.update-title{margin-bottom: 10px}
625   -body.dashboard-page .news-feed .project-updates a.project-update span.update-author{color: #999; font-weight: normal; font-style: italic;}
626   -body.dashboard-page .news-feed .project-updates a.project-update span.update-author strong{font-weight: bold; font-style: normal;}
627   -/* eo Dashboard Page */
628 594  
629 595 .grey-button.right{margin-top: 20px}
630 596  
631 597 /* Project Page */
632   -
633   -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;}
634   -body.project-page h2.icon .project-name i.arrow{float: right;
635   - position: absolute;
636   - right: 10px;
637   - top: 13px;
638   - display: block;
639   - background: url('images.png') no-repeat -97px -29px;
640   - width: 4px;
641   - height: 5px;
642   -}
643   -
644   -body.project-page h2.icon span{ background-position: -78px -68px; }
645   -body.project-page .project-container{ position: relative; float: left; width: 100%; height: 100%; padding-bottom: 10px;}
646   -body.project-page .page-title{margin-bottom: 0}
647   -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; }
648   -
649   -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}
650   -body.projects-page input.text.git-url {margin:10px 0 0 }
651   -.git_url_wrapper { margin-right:50px }
652   -
653   -.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); }
654   -
655   -body.project-page .project-sidebar aside{width: 109px}
656   -body.project-page .project-sidebar aside a{
657   - display: block;
658   - position: relative;
659   - //background: #FFF;
660   - padding: 15px 10px;
661   - //border: 1px solid #ccc;
662   - margin: 10px 0 0 0;
663   - //border-radius:5px;
664   -
665   -
666   -}
667   -//body.project-page .project-sidebar aside a:hover{background-color: #FFFFFF;}
668   -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}
669   -body.project-page .project-sidebar aside a.current {
670   - color: white;
671   - background: #79C3E0;
672   - border: 1px solid #2FA0BB;
673   - border-radius:5px;
674   -
675   -
676   - -webkit-border-top-right-radius: 0;
677   - -webkit-border-bottom-right-radius: 0;
678   - -moz-border-radius-topright: 0px;
679   - -moz-border-radius-bottomright: 0px;
680   - border-top-right-radius: 0;
681   - border-bottom-right-radius: 0;
682   - margin-right: -1px;
683   -}
684   -body.project-page .project-content{ padding: 20px; display: block; margin-left: 110px; min-height: 600px}
685   -body.project-page .project-content h2{ margin-top: 6px}
686   -body.project-page .project-content .button.right{margin-left: 20px}
687   -body.project-page table .commit a{color: #{$blue_link}}
688   -body.project-page table th, body.project-page table td{ border-bottom: 1px solid #DEE2E3;}
689   -body.project-page .fixed{position: fixed; }
690   -
691   -/* New project Page */
692   -.new-project-page .container table{background: white}
693 598 /* eo New Project Page */
694 599  
695   -/* Commit Page */
696   -body.project-page.commits-page .commit-info{float: right;}
697   -body.project-page.commits-page .commit-info data{
698   - padding: 4px 10px;
699   - font-size: 11px;
700   -}
701   -body.project-page.commits-page .commit-info data.commit-button{
702   - background-image: -webkit-gradient(linear, 0 0, 0 26, color-stop(0.192, #fff), to(#f4f4f4));
703   - background-image: -webkit-linear-gradient(#fff 19.2%, #f4f4f4);
704   - background-image: -moz-linear-gradient(#fff 19.2%, #f4f4f4);
705   - background-image: -o-linear-gradient(#fff 19.2%, #f4f4f4);
706   - box-shadow: 0 -1px 0 white inset;
707   - display: block;
708   - border: 1px solid #eee;
709   - border-radius: 5px;
710   - margin-bottom: 2px;
711   - position: relative;
712   - padding-right: 20px;
713   -}
714   -
715   -body.project-page.commits-page .commit-button i{
716   - background: url('images.png') no-repeat -138px -27px;
717   - width: 6px;
718   - height: 9px;
719   - float: right;
720   - position: absolute;
721   - top: 6px;
722   - right: 5px;
723   -}
724   -body.project-page.commits-page .commits-date {display: block; width: 100%; margin-bottom: 20px}
725   -body.project-page.commits-page .commits-date .data {padding: 0}
726   -body.project-page.commits-page a.commit{padding: 10px; border-bottom: 1px solid #eee; overflow: hidden; display: block;}
727   -body.project-page.commits-page .commits-date a.commit {padding: 10px; border-bottom: none; overflow: hidden; display: block;}
728   -body.project-page.commits-page .commits-date a.commit:last-child{border-bottom: 0}
729   -body.project-page.commits-page .commits-date a.commit img{float: left; margin-right: 10px;}
730   -body.project-page.commits-page .commits-date a.commit span.commit-title{display: block;}
731   -body.project-page.commits-page .commits-date a.commit span.commit-title{margin-bottom: 10px}
732   -body.project-page.commits-page .commits-date a.commit span.commit-author{color: #999; font-weight: normal; font-style: italic;}
733   -body.project-page.commits-page .commits-date a.commit span.commit-author strong{font-weight: bold; font-style: normal;}
734   -
735   -/* eo Commit Page */
736 600  
737 601 /* eo Project Page */
738 602  
... ...
app/assets/stylesheets/top_panel.scss 0 → 100644
... ... @@ -0,0 +1,146 @@
  1 +.main_links {
  2 + width:124px;
  3 + float:left;
  4 + a {
  5 + position: relative;
  6 + float:left;
  7 + padding: 4px;
  8 +
  9 + &.home {
  10 + margin-right:15px;
  11 + width: 26px;
  12 + }
  13 +
  14 + &.admin {
  15 + width: 21px;
  16 + }
  17 + }
  18 +}
  19 +
  20 +.dashboard_links {
  21 + padding:7px;
  22 + float:left;
  23 + a {
  24 + margin: 0 14px;
  25 + float: left;
  26 + font-size: 14px;
  27 +
  28 + &.active {
  29 + color:$active_link_color;
  30 + }
  31 + &:hover {
  32 + color:$active_link_color;
  33 + }
  34 + }
  35 +}
  36 +
  37 +.top-tabs {
  38 + margin: 0;
  39 + padding: 5px;
  40 + font-size: 14px;
  41 + padding-bottom:10px;
  42 + margin-bottom:20px;
  43 + height:26px;
  44 + border-bottom:1px solid #ccc;
  45 +
  46 + .tab {
  47 + font-weight: bold;
  48 + background:none;
  49 + padding: 10px;
  50 + float:left;
  51 + padding-left:0px;
  52 + padding-right:40px;
  53 +
  54 + &.active {
  55 + color: $active_link_color;
  56 + }
  57 + }
  58 +}
  59 +
  60 +body header {
  61 + position:absolute;
  62 + width:100%;
  63 + padding:0;
  64 + margin:0;
  65 + top:0;
  66 + left:0;
  67 + background: #999; /* for non-css3 browsers */
  68 + filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFF', endColorstr='#EAEAEA'); /* for IE */
  69 + background: -webkit-gradient(linear, left top, left bottom, from(#FFFFFF), to(#EAEAEA)); /* for webkit browsers */
  70 + background: -moz-linear-gradient(top, #FFFFFF, #EAEAEA); /* for firefox 3.6+ */
  71 + border-bottom: 2px solid $styled_border_color;
  72 +
  73 + height:50px;
  74 +
  75 + .wrapper {
  76 + margin:auto;
  77 + width:$app_width;
  78 + position:relative;
  79 +
  80 + .top_panel_content {
  81 + padding:10px $app_padding;
  82 + }
  83 + }
  84 +
  85 + .project_name {
  86 + float:left;
  87 + width:235px;
  88 + margin-right:30px;
  89 + font-size:16px;
  90 + font-weight:bold;
  91 + padding:5px 7px;
  92 + color:#333;
  93 + }
  94 +
  95 + .git_url_wrapper {
  96 + padding:0px;
  97 + margin:0px;
  98 + float:left;
  99 +
  100 + .git-url {
  101 + padding:0px;
  102 + margin:0px;
  103 + font-size: 12px;
  104 +
  105 + margin-right:10px;
  106 + border-radius: 4px;
  107 + -moz-border-radius: 4px;
  108 +
  109 +
  110 + color: #666;
  111 + border: 1px solid #AAA;
  112 + padding: 0 10px 0 30px;
  113 + background: white url('images.png') no-repeat 8px -42px;
  114 + width: 160px;
  115 + height:26px;
  116 + }
  117 + }
  118 +}
  119 +
  120 +.top_panel_holder .chzn-container {
  121 + position:relative;
  122 +
  123 + .chzn-drop {
  124 + margin:7px 0;
  125 + border: 1px solid #CCC;
  126 + min-width: 300px;
  127 +
  128 + .chzn-results {
  129 + max-height:300px;
  130 + }
  131 + }
  132 +
  133 + .chzn-single {
  134 + background:white;
  135 + -moz-border-radius: 4px;
  136 + border-radius: 4px;
  137 +
  138 + div {
  139 + background:white;
  140 + }
  141 +
  142 + span {
  143 + font-weight: normal;
  144 + }
  145 + }
  146 +}
... ...
app/views/layouts/_head_panel.html.haml
1 1 / Page Header
2 2 %header.top_panel_holder
3 3 .wrapper
4   - %div.top_links_holder
5   - = link_to root_path, :class => "top_link home", :title => "Home" do
6   - = image_tag "Home-UI.PNG", :width => 26
7   - - if current_user.is_admin?
8   - = link_to admin_root_path, :class => "top_link admin", :title => "Admin" do
9   - = image_tag "Gear-UI.PNG", :width => 20
  4 + .top_panel_content
  5 + %div.main_links
  6 + = link_to root_path, :class => "home", :title => "Home" do
  7 + = image_tag "Home-UI.PNG", :width => 26
  8 + - if current_user.is_admin?
  9 + = link_to admin_root_path, :class => "admin", :title => "Admin" do
  10 + = image_tag "Gear-UI.PNG", :width => 20
10 11  
11 12  
12   - - if project_layout
13   - .project_name
14   - = truncate @project.name, :length => 28
15   - .git_url_wrapper
16   - %input.git-url.text{:id => "", :name => "", :readonly => "", :type => "text", :value => @project.url_to_repo, :class => "one_click_select"}
17   - - if @project.repo_exists?
18   - .left{:style => "margin-left:5px;"}
19   - = render :partial => "projects/refs", :locals => { :destination => controller.controller_name == "commits" ? "commits" : "tree" }
20   - = yield :rss_icon
21 13  
22   - - elsif profile_layout
23   - = link_to "Activities", dashboard_path, :class => "dash_top_link #{"active" if current_page?(dashboard_path) || current_page?(root_path) }"
24   - = link_to "Projects", projects_path, :class => "dash_top_link #{"active" if current_page?(projects_path)}"
25   - = link_to "Issues", dashboard_issues_path, :class => "dash_top_link #{"active" if current_page?(dashboard_issues_path)}", :id => "issues_slide"
26   - = link_to "Merge Requests", dashboard_merge_requests_path, :class => "dash_top_link #{"active" if current_page?(dashboard_merge_requests_path)}", :id => "merge_requests_slide"
27   - .search
28   - = text_field_tag "search", nil, :placeholder => "Search", :class => "search-input"
  14 + - if project_layout
  15 + .project_name
  16 + = truncate @project.name, :length => 28
  17 + .git_url_wrapper
  18 + %input.git-url.text{:id => "", :name => "", :readonly => "", :type => "text", :value => @project.url_to_repo, :class => "one_click_select"}
  19 + - if @project.repo_exists?
  20 + .left{:style => "margin-left:5px;"}
  21 + = render :partial => "projects/refs", :locals => { :destination => controller.controller_name == "commits" ? "commits" : "tree" }
  22 + = yield :rss_icon
29 23  
30   - .account-box
31   - = link_to profile_path, :class => "pic" do
32   - = image_tag gravatar_icon(current_user.email)
33   - .account-links
34   - = link_to profile_path, :class => "username" do
35   - My profile
36   - = link_to 'Logout', destroy_user_session_path, :class => "logout", :method => :delete
37   - / .account-box
38   - -#.search
39   - = text_field_tag "search", nil, :placeholder => "Search", :class => "search-input"
40   - / .login-top
41   - - if current_user
42   - = javascript_tag do
43   - $(function(){
44   - $("#search").autocomplete({
45   - source: #{raw search_autocomplete_source},
46   - select: function(event, ui) { location.href = ui.item.url }
47   - });
48   - });
  24 + - elsif profile_layout
  25 + .dashboard_links
  26 + = link_to "Activities", dashboard_path, :class => "#{"active" if current_page?(dashboard_path) || current_page?(root_path) }"
  27 + = link_to "Projects", projects_path, :class => "#{"active" if current_page?(projects_path)}"
  28 + = link_to "Issues", dashboard_issues_path, :class => "#{"active" if current_page?(dashboard_issues_path)}", :id => "issues_slide"
  29 + = link_to "Merge Requests", dashboard_merge_requests_path, :class => "#{"active" if current_page?(dashboard_merge_requests_path)}", :id => "merge_requests_slide"
  30 + .search
  31 + = text_field_tag "search", nil, :placeholder => "Search", :class => "search-input"
49 32  
50   - - if current_user.require_ssh_key?
51   - #no_ssh_key_defined.big-message.error
52   - %p
53   - No SSH Key is defined. You won't be able to use any Git command!. Click #{link_to( 'here', keys_path )} to add one!
  33 + .account-box
  34 + = link_to profile_path, :class => "pic" do
  35 + = image_tag gravatar_icon(current_user.email)
  36 + .account-links
  37 + = link_to profile_path, :class => "username" do
  38 + My profile
  39 + = link_to 'Logout', destroy_user_session_path, :class => "logout", :method => :delete
  40 + - if current_user
  41 + = javascript_tag do
  42 + $(function(){
  43 + $("#search").autocomplete({
  44 + source: #{raw search_autocomplete_source},
  45 + select: function(event, ui) { location.href = ui.item.url }
  46 + });
  47 + });
  48 +
  49 + -#- if current_user.require_ssh_key?
  50 + #no_ssh_key_defined.big-message.error
  51 + %p
  52 + No SSH Key is defined. You won't be able to use any Git command!. Click #{link_to( 'here', keys_path )} to add one!
... ...