1 |
4cce112d
|
Andreas Kohlbecker
|
/**
|
2 |
|
|
* @file
|
3 |
|
|
* Page Styling
|
4 |
|
|
*
|
5 |
|
|
* Style the markup found in page.tpl.php. Also includes some styling of
|
6 |
|
|
* miscellaneous Drupal elements that appear in the $content variable, such as
|
7 |
|
|
* ul.links, .pager, .more-link, etc.
|
8 |
|
|
*/
|
9 |
|
|
|
10 |
|
|
@import "base";
|
11 |
|
|
|
12 |
|
|
|
13 |
|
|
/*
|
14 |
|
|
* Body
|
15 |
|
|
*/
|
16 |
|
|
|
17 |
|
|
body {
|
18 |
|
|
margin: 0;
|
19 |
|
|
padding: 0;
|
20 |
|
|
}
|
21 |
|
|
|
22 |
ca55d066
|
Andreas Kohlbecker
|
h1, h2, h3, h4, h5, h6 {
|
23 |
|
|
font-weight: normal;
|
24 |
|
|
}
|
25 |
|
|
|
26 |
4cce112d
|
Andreas Kohlbecker
|
#page {
|
27 |
ca55d066
|
Andreas Kohlbecker
|
// single-box-shadow($color, $hoff, $voff, $blur, $spread, $inset)
|
28 |
4b02c7e4
|
Andreas Kohlbecker
|
@include single-box-shadow(black, 0px, 5px, 20px);
|
29 |
|
|
padding-top: $zen-gutter-width;
|
30 |
c2f02e8f
|
Andreas Kohlbecker
|
background-color: #fff;
|
31 |
4cce112d
|
Andreas Kohlbecker
|
}
|
32 |
|
|
|
33 |
|
|
/*
|
34 |
|
|
* The skip-link link will be completely hidden until a user tabs to the link.
|
35 |
|
|
* See the element-focusable rule in system.base.css.
|
36 |
|
|
*/
|
37 |
|
|
|
38 |
|
|
#skip-link {
|
39 |
|
|
margin: 0;
|
40 |
|
|
|
41 |
|
|
a,
|
42 |
|
|
a:visited {
|
43 |
|
|
display: block;
|
44 |
|
|
width: 100%;
|
45 |
|
|
padding: 2px 0 3px 0;
|
46 |
|
|
text-align: center;
|
47 |
|
|
background-color: #666;
|
48 |
|
|
color: #fff;
|
49 |
|
|
}
|
50 |
|
|
}
|
51 |
|
|
|
52 |
|
|
/*
|
53 |
|
|
* Header
|
54 |
|
|
*/
|
55 |
|
|
|
56 |
|
|
#header {
|
57 |
4b02c7e4
|
Andreas Kohlbecker
|
margin-bottom: $zen-gutter-width / 2;
|
58 |
4cce112d
|
Andreas Kohlbecker
|
}
|
59 |
|
|
|
60 |
|
|
#logo { /* Wrapping link for logo */
|
61 |
|
|
float: left; /* LTR */
|
62 |
|
|
margin: 0;
|
63 |
4b02c7e4
|
Andreas Kohlbecker
|
margin-right: $zen-gutter-width / 2;
|
64 |
4cce112d
|
Andreas Kohlbecker
|
padding: 0;
|
65 |
|
|
|
66 |
|
|
img {
|
67 |
|
|
vertical-align: bottom;
|
68 |
|
|
}
|
69 |
|
|
}
|
70 |
|
|
|
71 |
|
|
#name-and-slogan { /* Wrapper for website name and slogan */
|
72 |
|
|
float: left;
|
73 |
4b02c7e4
|
Andreas Kohlbecker
|
margin-right: $zen-gutter-width / 2;
|
74 |
4cce112d
|
Andreas Kohlbecker
|
}
|
75 |
|
|
|
76 |
|
|
#site-name { /* The name of the website */
|
77 |
|
|
margin: 0;
|
78 |
|
|
font-size: 2em;
|
79 |
|
|
line-height: 1.5em;
|
80 |
|
|
|
81 |
|
|
a:link,
|
82 |
|
|
a:visited {
|
83 |
|
|
color: #000;
|
84 |
|
|
text-decoration: none;
|
85 |
|
|
}
|
86 |
|
|
|
87 |
|
|
a:hover,
|
88 |
|
|
a:focus {
|
89 |
|
|
text-decoration: underline;
|
90 |
|
|
}
|
91 |
|
|
}
|
92 |
|
|
|
93 |
|
|
#site-slogan { /* The slogan (or tagline) of a website */
|
94 |
|
|
margin: 0;
|
95 |
|
|
font-size: 1em;
|
96 |
|
|
}
|
97 |
|
|
|
98 |
|
|
.region-header { /* Wrapper for any blocks placed in the header region */
|
99 |
|
|
clear: both; /* Clear the logo */
|
100 |
|
|
}
|
101 |
|
|
|
102 |
|
|
/*
|
103 |
|
|
* Main (container for everything else)
|
104 |
|
|
*/
|
105 |
|
|
|
106 |
|
|
#main {
|
107 |
|
|
}
|
108 |
|
|
|
109 |
|
|
/*
|
110 |
|
|
* Content
|
111 |
|
|
*/
|
112 |
|
|
|
113 |
|
|
#content {
|
114 |
|
|
}
|
115 |
|
|
|
116 |
4b02c7e4
|
Andreas Kohlbecker
|
|
117 |
4cce112d
|
Andreas Kohlbecker
|
.region-highlighted {
|
118 |
|
|
}
|
119 |
|
|
|
120 |
|
|
.breadcrumb { /* The path to the current page in the form of a list of links */
|
121 |
|
|
ol {
|
122 |
|
|
margin: 0;
|
123 |
|
|
padding: 0;
|
124 |
|
|
}
|
125 |
|
|
li {
|
126 |
|
|
display: inline;
|
127 |
|
|
list-style-type: none;
|
128 |
|
|
margin: 0;
|
129 |
|
|
padding: 0;
|
130 |
|
|
}
|
131 |
|
|
}
|
132 |
|
|
|
133 |
|
|
h1.title, /* The title of the page */
|
134 |
|
|
h2.node-title, /* Title of a piece of content when it is given in a list of content */
|
135 |
|
|
h2.block-title, /* Block title */
|
136 |
|
|
h2.title, /* Comment section heading */
|
137 |
|
|
h2.comment-form, /* Comment form heading */
|
138 |
|
|
h3.title { /* Comment title */
|
139 |
|
|
margin: 0;
|
140 |
|
|
}
|
141 |
|
|
|
142 |
|
|
tr.even { /* Some tables have rows marked even or odd. */
|
143 |
|
|
/* background-color: #eee; */ /* Drupal core uses a #eee background */
|
144 |
|
|
}
|
145 |
|
|
|
146 |
|
|
tr.odd {
|
147 |
|
|
/* background-color: #eee; */ /* Drupal core uses a #eee background */
|
148 |
|
|
}
|
149 |
|
|
|
150 |
|
|
div.messages { /* Important messages (status, warning, and error) for the user. See also the declarations in messages.css. */
|
151 |
|
|
margin: 1.5em 0; /* Drupal core uses "6px 0" margin */
|
152 |
|
|
|
153 |
|
|
ul {
|
154 |
|
|
margin-top: 0;
|
155 |
|
|
margin-bottom: 0;
|
156 |
|
|
}
|
157 |
|
|
}
|
158 |
|
|
|
159 |
|
|
div.status { /* Normal priority messages */
|
160 |
|
|
}
|
161 |
|
|
|
162 |
|
|
div.warning,
|
163 |
|
|
tr.warning { /* Medium priority messages */
|
164 |
|
|
/* border: 1px solid #f0c020; */ /* Drupal core uses: 1px solid #f0c020 */
|
165 |
|
|
}
|
166 |
|
|
|
167 |
|
|
div.error,
|
168 |
|
|
tr.error { /* High priority messages. See also the .error declaration below. */
|
169 |
|
|
}
|
170 |
|
|
|
171 |
|
|
.error { /* Errors that are separate from div.messages status messages. */
|
172 |
|
|
/* color: #e55; */ /* Drupal core uses a #e55 background */
|
173 |
|
|
}
|
174 |
|
|
|
175 |
|
|
.warning { /* Warnings that are separate from div.messages status messages. */
|
176 |
|
|
/* color: #e09010; */ /* Drupal core uses a #e09010 background */
|
177 |
|
|
}
|
178 |
|
|
|
179 |
|
|
.tabs { /* See also the tabs.css file. */
|
180 |
|
|
}
|
181 |
|
|
|
182 |
|
|
.region-help { /* Help text on a page */
|
183 |
|
|
}
|
184 |
|
|
|
185 |
|
|
.more-help-link { /* Link to more help */
|
186 |
|
|
}
|
187 |
|
|
|
188 |
|
|
.region-content { /* Wrapper for the actual page content */
|
189 |
|
|
}
|
190 |
|
|
|
191 |
|
|
ul.inline { /* List of links generated by theme_links() */
|
192 |
|
|
display: inline;
|
193 |
|
|
padding: 0;
|
194 |
|
|
|
195 |
|
|
li {
|
196 |
|
|
display: inline;
|
197 |
|
|
list-style-type: none;
|
198 |
|
|
padding: 0 1em 0 0; /* LTR */
|
199 |
|
|
}
|
200 |
|
|
}
|
201 |
|
|
span.field-label { /* The inline field label used by the Fences module */
|
202 |
|
|
padding: 0 1em 0 0; /* LTR */
|
203 |
|
|
}
|
204 |
|
|
|
205 |
|
|
.item-list .pager { /* A list of page numbers when more than 1 page of content is available */
|
206 |
|
|
padding: 0;
|
207 |
|
|
|
208 |
|
|
li { /* Each page number in the pager list */
|
209 |
|
|
padding: 0 0.5em;
|
210 |
|
|
}
|
211 |
|
|
}
|
212 |
|
|
|
213 |
|
|
.feed-icon { /* The link to the RSS or Atom feed for the current list of content */
|
214 |
|
|
}
|
215 |
|
|
|
216 |
|
|
.more-link { /* Aggregator, blog, and forum more link */
|
217 |
|
|
}
|
218 |
|
|
|
219 |
|
|
/*
|
220 |
|
|
* First sidebar (on left in LTR languages, on right in RTL)
|
221 |
|
|
*
|
222 |
|
|
* Remember to NOT add padding or margin to your .region-sidebar-first
|
223 |
|
|
* (see the layout.css file.)
|
224 |
|
|
*/
|
225 |
|
|
|
226 |
|
|
.region-sidebar-first {
|
227 |
|
|
}
|
228 |
|
|
|
229 |
|
|
/*
|
230 |
|
|
* Second sidebar (on right in LTR languages, on left in RTL)
|
231 |
|
|
*
|
232 |
|
|
* Remember to NOT add padding or margin to your .region-sidebar-second
|
233 |
|
|
* (see the layout.css file.)
|
234 |
|
|
*/
|
235 |
|
|
|
236 |
|
|
.region-sidebar-second {
|
237 |
|
|
}
|
238 |
|
|
|
239 |
|
|
/*
|
240 |
|
|
* Footer
|
241 |
|
|
*/
|
242 |
|
|
|
243 |
|
|
#footer {
|
244 |
|
|
}
|
245 |
|
|
|
246 |
|
|
/*
|
247 |
|
|
* Page bottom
|
248 |
|
|
*/
|
249 |
|
|
|
250 |
|
|
.region-bottom { /* Wrapper for any blocks placed in the page bottom region */
|
251 |
|
|
}
|