nooku is a Public Portfolio from Assembla

Assembla offers free public and private SVN/Git repositories and project hosting with bug/issue tracking and collaboration tools.

Create your own Portfolio or check out other free and subscription products from Assembla that will help accelerate your development projects.

nooku-server

Commit 3500

User picture
  • Author: tomjanssens
  • 2012-03-19 08:22 (about 2 years ago)

re #199 Restyled tabs

Files Affected

 
34993500
1746
  -webkit-box-flex: 0;
1746
  -webkit-box-flex: 0;
1747
  -moz-box-flex: 0;
1747
  -moz-box-flex: 0;
1748
  box-flex: 0;
1748
  box-flex: 0;
1749
  height: 31px;
 
 
1750
  background-color: #333;
1749
  background-color: #333;
 
 
1750
  border-bottom: 1px solid #888888;
1751
  background-color: #464646;
1751
  background-color: #464646;
1752
  background-image: -moz-linear-gradient(top, #555555, #2f2f2f);
1752
  background-image: -moz-linear-gradient(top, #555555, #2f2f2f);
1753
  background-image: -ms-linear-gradient(top, #555555, #2f2f2f);
1753
  background-image: -ms-linear-gradient(top, #555555, #2f2f2f);
...
 
...
 
1757
  background-image: linear-gradient(top, #555555, #2f2f2f);
1757
  background-image: linear-gradient(top, #555555, #2f2f2f);
1758
  background-repeat: repeat-x;
1758
  background-repeat: repeat-x;
1759
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#555555', endColorstr='#2f2f2f', GradientType=0);
1759
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#555555', endColorstr='#2f2f2f', GradientType=0);
 
 
1760
  -webkit-box-shadow: rgba(0, 0, 0, 0.8) 0px 1px 3px;
 
 
1761
  -moz-box-shadow: rgba(0, 0, 0, 0.8) 0px 1px 3px;
 
 
1762
  box-shadow: rgba(0, 0, 0, 0.8) 0px 1px 3px;
 
 
1763
  position: relative;
1760
}
1764
}
1761
#tabs-box {
1765
#tabs-box {
1762
  display: -webkit-box;
1766
  display: -webkit-box;
...
 
...
 
1768
  -webkit-box-flex: 0;
1772
  -webkit-box-flex: 0;
1769
  -moz-box-flex: 0;
1773
  -moz-box-flex: 0;
1770
  box-flex: 0;
1774
  box-flex: 0;
1771
  border-top: 1px solid #bbb;
 
 
1772
  background-color: #528bed;
1775
  background-color: #528bed;
1773
  background-image: -moz-linear-gradient(top, #6497ef, #3678ea);
1776
  background-image: -moz-linear-gradient(top, #6497ef, #3678ea);
1774
  background-image: -ms-linear-gradient(top, #6497ef, #3678ea);
1777
  background-image: -ms-linear-gradient(top, #6497ef, #3678ea);
...
 
...
 
1778
  background-image: linear-gradient(top, #6497ef, #3678ea);
1781
  background-image: linear-gradient(top, #6497ef, #3678ea);
1779
  background-repeat: repeat-x;
1782
  background-repeat: repeat-x;
1780
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#6497ef', endColorstr='#3678ea', GradientType=0);
1783
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#6497ef', endColorstr='#3678ea', GradientType=0);
 
 
1784
  -webkit-box-shadow: inset rgba(0, 0, 0, 0.1) 0px -2px 2px;
 
 
1785
  -moz-box-shadow: inset rgba(0, 0, 0, 0.1) 0px -2px 2px;
 
 
1786
  box-shadow: inset rgba(0, 0, 0, 0.1) 0px -2px 2px;
1781
}
1787
}
1782
#toolbar-box {
1788
#toolbar-box {
1783
  display: -webkit-box;
1789
  display: -webkit-box;
...
 
...
 
2550
#content-box.default .sidebar:first-child {
2556
#content-box.default .sidebar:first-child {
2551
  border-right: 1px solid #dddddd;
2557
  border-right: 1px solid #dddddd;
2552
}
2558
}
 
 
2559
#content-box.default .sidebar:first-child h4 {
 
 
2560
  padding: 4px 0 4px 10px;
 
 
2561
  margin: 12px 0 0 0;
 
 
2562
  color: #666;
 
 
2563
  text-transform: uppercase;
 
 
2564
}
 
 
2565
#content-box.default .sidebar:first-child h4:first-of-type {
 
 
2566
  margin-top: 2px;
 
 
2567
}
2553
#content-box.default .sidebar:first-child ul {
2568
#content-box.default .sidebar:first-child ul {
2554
  margin: 0;
2569
  margin: 0;
2555
  padding: 0;
2570
  padding: 0;
...
 
...
 
2700
 
2715
 
2701
}
2716
}
2702
#header-box > ul li a {
2717
#header-box > ul li a {
2703
  padding: 0.60em 1.5em 0.45em;
2718
  padding: 0 18px;
2704
  color: #555555;
2719
  color: #626262;
2705
  line-height: 1.6em;
2720
  line-height: 30px;
2706
  vertical-align: middle;
2721
  vertical-align: middle;
2707
  font-size: 12px;
2722
  font-size: 12px;
2708
  font-weight: bold;
2723
  font-weight: bold;
...
 
...
 
2846
  box-flex: 0;
2861
  box-flex: 0;
2847
  list-style: none;
2862
  list-style: none;
2848
  margin: 0;
2863
  margin: 0;
2849
  padding: 0 0 0 15px;
2864
  padding: 0 0 0 0px;
2850
}
2865
}
2851
#submenu li {
2866
#submenu li {
2852
  padding: 0;
2867
  padding: 0;
2853
  margin: 5px 2px 0 2px;
2868
  margin: 0px 0px 0 0px;
2854
}
2869
}
2855
#submenu li a,
2870
#submenu li a,
2856
#submenu span.nolink {
2871
#submenu span.nolink {
2857
  cursor: pointer;
2872
  cursor: pointer;
2858
  padding: 8px 15px;
2873
  padding: 0 25px;
 
 
2874
  line-height: 28px;
 
 
2875
  vertical-align: middle;
2859
  font-weight: bold;
2876
  font-weight: bold;
2860
  color: #ffffff;
2877
  color: #ffffff;
2861
  display: block;
2878
  display: block;
2862
  background: #165dd7;
2879
  -webkit-border-radius: 0 0;
2863
  -webkit-border-radius: 5px 5px 0 0;
2880
  -moz-border-radius: 0 0;
2864
  -moz-border-radius: 5px 5px 0 0;
2881
  border-radius: 0 0;
2865
  border-radius: 5px 5px 0 0;
2882
  border-right: 1px solid #6497ef;
2866
}
2883
}
2867
#submenu span.nolink {
2884
#submenu span.nolink {
2868
  color: #284388;
2885
  color: #7ba7f1;
2869
  cursor: default;
2886
  cursor: default;
2870
}
2887
}
2871
#submenu a.active,
2888
#submenu a.active,
...
 
...
 
2872
#submenu span.nolink.active {
2889
#submenu span.nolink.active {
2873
  color: #333333;
2890
  color: #333333;
2874
  background-color: #f9f9f9;
2891
  background-color: #f9f9f9;
 
 
2892
  background-color: #fdfdfd;
 
 
2893
  background-image: -moz-linear-gradient(top, #ffffff, #f9f9f9);
 
 
2894
  background-image: -ms-linear-gradient(top, #ffffff, #f9f9f9);
 
 
2895
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#f9f9f9));
 
 
2896
  background-image: -webkit-linear-gradient(top, #ffffff, #f9f9f9);
 
 
2897
  background-image: -o-linear-gradient(top, #ffffff, #f9f9f9);
 
 
2898
  background-image: linear-gradient(top, #ffffff, #f9f9f9);
 
 
2899
  background-repeat: repeat-x;
 
 
2900
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#f9f9f9', GradientType=0);
 
 
2901
  -webkit-box-shadow: rgba(0, 0, 0, 0.3) 0px 0px 4px;
 
 
2902
  -moz-box-shadow: rgba(0, 0, 0, 0.3) 0px 0px 4px;
 
 
2903
  box-shadow: rgba(0, 0, 0, 0.3) 0px 0px 4px;
2875
}
2904
}
2876
#submenu a.active:hover,
2905
#submenu a.active:hover,
2877
#submenu span.nolink.active:hover {
2906
#submenu span.nolink.active:hover {
34993500
74
#header-box  { 
74
#header-box  { 
75
    #flexbox > .box();
75
    #flexbox > .box();
76
 
76
 
77
    height: 31px;
 
 
78
    background-color: #333;
77
    background-color: #333;
 
 
78
    border-bottom: 1px solid lighten(@navbarBackground, 20%);
79
    #gradient > .vertical(@navbarBackground, darken(@navbarBackground, 15%));
79
    #gradient > .vertical(@navbarBackground, darken(@navbarBackground, 15%));
 
 
80
    .box-shadow(rgba(0, 0, 0, .8) 0px 1px 3px);
 
 
81
 
 
 
82
    position: relative; // We need this for .box-shadow
80
}
83
}
81
 
84
 
82
#tabs-box {
85
#tabs-box {
83
    #flexbox > .box();
86
    #flexbox > .box();
84
 
87
 
85
    border-top: 1px solid #bbb;
 
 
86
    #gradient > .vertical(@tabbarBackground, darken(@tabbarBackground, 10%));
88
    #gradient > .vertical(@tabbarBackground, darken(@tabbarBackground, 10%));
 
 
89
    .box-shadow(inset rgba(0, 0, 0, .10) 0px -2px 2px);
87
}
90
}
88
 
91
 
89
#toolbar-box {
92
#toolbar-box {
...
 
...
 
654
    .sidebar:first-child {
657
    .sidebar:first-child {
655
        border-right: 1px solid @grayLighter;
658
        border-right: 1px solid @grayLighter;
656
 
659
 
 
 
660
        h4 {            
 
 
661
            padding: 4px 0 4px 10px;
 
 
662
            margin: @baseLineHeight 0 0 0;
 
 
663
            color: #666;
 
 
664
            text-transform: uppercase;
 
 
665
        }
 
 
666
 
 
 
667
        h4:first-of-type {            
 
 
668
            margin-top: 2px;
 
 
669
        }
 
 
670
 
657
        ul {
671
        ul {
658
            margin: 0;
672
            margin: 0;
659
            padding: 0;
673
            padding: 0;
34993500
29
    > ul {
29
    > ul {
30
        li {
30
        li {
31
            a {
31
            a {
32
                padding: 0.60em 1.5em 0.45em;
32
                padding: 0 18px;
33
                color: @navbarLinkColorDisabled;
33
                color: lighten(@navbarBackground, 5%);
34
                line-height: 1.6em; vertical-align: middle;
34
                line-height: @baseLineHeight + 18px; vertical-align: middle;
35
                font-size: 12px; font-weight: bold; text-decoration: none;
35
                font-size: @baseFontSize + 1; font-weight: bold; text-decoration: none;
36
                background-repeat: no-repeat;
36
                background-repeat: no-repeat;
37
                background-image: none !important;
37
                background-image: none !important;
38
                border-right: 1px solid @navbarBackground;
38
                border-right: 1px solid @navbarBackground;
...
 
...
 
119
 
119
 
120
    list-style: none;
120
    list-style: none;
121
    margin: 0;
121
    margin: 0;
122
    padding: 0 0 0 15px;
122
    padding: 0 0 0 0px;
123
 
123
 
124
    li {
124
    li {
125
        padding: 0;
125
        padding: 0;
126
        margin: 5px 2px 0 2px;
126
        margin: 0px 0px 0 0px;
127
    }
127
    }
128
 
128
 
129
    li a,
129
    li a,
130
    span.nolink {
130
    span.nolink {
131
        cursor: pointer;
131
        cursor: pointer;
132
        padding: 8px 15px;
132
        padding: 0 25px;
 
 
133
        line-height: @baseLineHeight + 16px; vertical-align: middle;
133
        font-weight: bold;
134
        font-weight: bold;
134
        color: @tabbarLinkColor;
135
        color: @tabbarLinkColor;
135
        display: block;
136
        display: block;
136
        background: darken(@tabbarBackground, 20%);
137
        //background: darken(@tabbarBackground, 20%);
137
        .border-radius(5px 5px 0 0);
138
        .border-radius(0 0);
 
 
139
        border-right: 1px solid @tabbarBackground;
138
    }
140
    }
139
 
141
 
140
    span.nolink {
142
    span.nolink {
141
        color: #284388;
143
        color: lighten(@tabbarBackground, 5%);
142
        cursor: default;
144
        cursor: default;
143
    }
145
    }
144
 
146
 
...
 
...
 
146
    span.nolink.active {
148
    span.nolink.active {
147
        color: @tabbarLinkColorHighlight;
149
        color: @tabbarLinkColorHighlight;
148
        background-color: @tabbarBackgroundHighlight;
150
        background-color: @tabbarBackgroundHighlight;
 
 
151
        #gradient > .vertical(#FFF, @tabbarBackgroundHighlight);
 
 
152
        .box-shadow(rgba(0, 0, 0, .3) 0px 0px 4px);
149
    }
153
    }
150
 
154
 
151
    a.active:hover,
155
    a.active:hover,
34993500
48
 
48
 
49
@navbarLinkColor:                 @grayDark;
49
@navbarLinkColor:                 @grayDark;
50
@navbarLinkColorHighlight:        @white;
50
@navbarLinkColorHighlight:        @white;
51
@navbarLinkColorDisabled:         @gray;
 
 
52
 
51
 
53
// Tabbar
52
// Tabbar
54
@tabbarBackground:                #6497EF;
53
@tabbarBackground:                #6497EF;