Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(68)

Side by Side Diff: css/sass/style.scss

Issue 85333007: Begin the redesign process, starting with the navbar. (Closed) Base URL: git@github.com:dart-lang/pub-dartlang.git@master
Patch Set: Code review updates. Created 7 years ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
« no previous file with comments | « css/sass/_syntax.scss ('k') | stylesheets/partials/_syntax.scss » ('j') | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
(Empty)
1 @import url(https://fonts.googleapis.com/css?family=Open+Sans:400,700|Montserrat :400,700);
2
3 @import "compass/reset";
4 @import "compass/typography/text/replacement";
5
6 @import "syntax";
7
8 $baseFontSize: 14px;
9 $baseLineHeight: 24px;
10
11 $sansFontFamily: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
12
13 $iconSpritePath: 'img/glyphicons-halflings.png';
14 $iconWhiteSpritePath: 'img/glyphicons-halflings-white.png';
15
16 @import "compass_twitter_bootstrap";
17
18 // Don't require nasty <table class="table"> that bootstrap expects.
19 table {
20 @extend .table;
21 }
22
23 body {
24 // Account for the fixed navbar height.
25 padding-top: 60px;
26 }
27
28 // Don't word wrap inline code.
29 code {
30 white-space: nowrap;
31 }
32
33 pre code {
34 white-space: inherit;
35 }
36
37 pre b {
38 font-weight: bold;
39 }
40
41 a.permalink {
42 margin-left: 0.5em;
43 display: none;
44 }
45
46 article {
47 @extend .span8;
48
49 position: relative;
50
51 h2, h3, h4 {
52 // Ensure that the headers don't get covered up by the navbar when the user
53 // clicks on the permalink.
54 padding-top: 40px;
55 margin-top: -40px;
56
57 &:hover a.permalink {
58 display: inline;
59 }
60 }
61 }
62
63 .navbar-search {
64 margin-top: 4px;
65
66 .search-query {
67 border-radius: 4px;
68 -moz-border-radius: 4px;
69 -webkit-border-radius: 4px;
70 height: 20px;
71 line-height: inherit;
72 }
73 }
74
75 .has-permalink:hover > a.permalink {
76 display:inline;
77 }
78
79 // Don't make tab bars so huge.
80 .nav-tabs > li > a {
81 padding-top: 4px;
82 padding-bottom: 4px;
83 }
84
85 .nav {
86 margin-bottom: 8px;
87 }
88
89 .package-sidebar {
90 padding-top: 50px;
91 }
92
93 tt {
94 font-family: $monoFontFamily;
95 padding: 0 3px;
96 }
97
98 footer {
99 @extend .well;
100 @extend .well-small;
101 font-size: 13px;
102 text-align: center;
103
104 .login, .logout {
105 display: inline-block;
106 float: right;
107 // #f5f5f5 is the background-color of the footer, which isn't a variable
108 // for some reason.
109 color: scale-color(#f5f5f5, $lightness: -15%);
110 }
111 }
112
113 form#private-key textarea {
114 width: 550px;
115 height: 420px;
116 font-family: $monoFontFamily;
117 }
118
119 // We have two brands: the dart logo and "pub.dartlang.org". This keeps them
120 // from being too spread out.
121 .brand + .brand {
122 padding-left: 10px;
123 }
124
125 // Highlight the brand text on hover. This matches other navbar buttons and
126 // makes it clearer that the logo links to something different.
127 a.brand:hover {
128 color: white;
129 }
130
131 .dart-logo {
132 @include replace-text("/static/img/dart.png", 0, 0);
133 width: 21px;
134 }
135
136 .intro {
137 @extend .well;
138 }
139
140 .get-started {
141 @extend .btn;
142 @extend .btn-primary;
143 }
144
145 h1 .version {
146 @extend small;
147 font-size: 20px;
148 }
149
150 td table {
151 margin: -4px;
152 td, th {
153 border: none;
154 padding: 4px;
155 }
156 }
157
158 td.archive, th.archive {
159 text-align: center;
160 vertical-align: middle;
161 }
162
163 // Need to shift the icons a bit to line the up with adjacent text.
164 .icon-hand-right,
165 .icon-envelope {
166 margin: 3px 0 0 2px;
167 }
168
169 .author {
170 white-space: nowrap;
171 }
172
173 .learn-more {
174 a {
175 @extend .btn;
176 @extend .btn-small;
177
178 color: $linkColor;
179
180 float: right;
181 position: absolute;
182 width: 270px;
183 right: -320px;
184
185 display: inline-block;
186 }
187 }
188
189 ol.toc {
190 @extend .well;
191
192 position: absolute;
193 right: -320px;
194 width: 230px;
195
196 float: right;
197
198 // Tweak padding to handle list bullets and the spacing on the header.
199 padding: 10px 20px 20px 40px;
200
201 li {
202 font-size: 13px;
203 line-height: 21px;
204 }
205 }
206
207 .toc:before {
208 @extend h3;
209 content: "Contents";
210 }
211
212 .pagination {
213 @extend .pagination-centered;
214 }
215
216 .progress {
217 @extend .progress-striped;
218 }
219
220 [class^="icon-"], [class*=" icon-"] {
221 @include hide-text;
222 }
223
224 ul ul {
225 list-style-type: circle;
226 }
227
228 .admin {
229 @extend .tabbable, .tabs-left;
230
231 > ul {
232 @extend .nav, .nav-tabs;
233 }
234
235 > div {
236 @extend .tab-content;
237
238 > div {
239 @extend .tab-pane, .container-fluid;
240 }
241 }
242
243 form button {
244 @extend .btn;
245 }
246 }
OLDNEW
« no previous file with comments | « css/sass/_syntax.scss ('k') | stylesheets/partials/_syntax.scss » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698