Skip to content

Commit 84cfbaa

Browse files
committed
Styling updates
1 parent ed39a30 commit 84cfbaa

File tree

13 files changed

+117
-92
lines changed

13 files changed

+117
-92
lines changed

_includes/comments/index.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ <h2 class="highlight-underline">Comments</h2>
1212

1313
{% include comments/new.html %}
1414

15-
<h3 id="comment-count">{% if comment_count == 1 %}One response{% else %}{{ comment_count }} responses{% endif %}</h3>
15+
<h4 id="comment-count">{% if comment_count == 1 %}One comment{% else %}{{ comment_count }} comments{% endif %}</h4>
1616
<ol id="comments-list">
1717
{% assign sorted_comments = comments | sort: 'date' %}
1818
{% for comment in sorted_comments %}

_includes/comments/new.html

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
<input id="comment-site" name="comment-site" type="hidden" value="{{ site.production_url }}" />
88

99
<div id="comment-box">
10-
<img id="avatar-preview" class="avatar" data-role="user-avatar"
10+
<img id="avatar-preview" class="avatar light-border" data-role="user-avatar"
1111
src="{{ site.baseurl }}/assets/images/comments/avatar-unknown.gif" alt="avatar" />
1212

1313
<div id="comment-text">
@@ -30,7 +30,7 @@
3030
<input id="comment-submit" type="submit" value="Add comment" />
3131

3232
<div id="remember-me">
33-
<input type="checkbox" name="remember" id="remember"><label for="remember">Remember me</label>
33+
<input type="checkbox" id="remember" name="remember"><label for="remember">Remember me</label>
3434
<span class="info-circle" title="Stores your name and email in the browser so you don't have to fill out the form again. This does not set a cookie."></span>
3535
</div>
3636
</div>

_sass/_code-samples.scss

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,5 @@
1+
@import "_variables.scss";
2+
13
div[class*="language-"] {
24
margin-bottom: 1em;
35
}

_sass/_comments.scss

Lines changed: 8 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,6 @@
1-
#comments {
1+
@import "_variables.scss";
2+
3+
#comments {
24
margin-top: 10px;
35

46
img.avatar {
@@ -8,10 +10,6 @@
810
}
911
}
1012

11-
#comment-count {
12-
padding: 8px;
13-
}
14-
1513
#comments-list {
1614
list-style-type: none;
1715

@@ -68,6 +66,7 @@
6866

6967
#remember-me {
7068
display: inline-block;
69+
font-size: 90%;
7170
padding: 10px 6px;
7271

7372
input {
@@ -77,3 +76,7 @@
7776
height: auto;
7877
}
7978
}
79+
80+
#comment-count {
81+
padding: 8px;
82+
}

_sass/_content.scss

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,5 @@
1+
@import "_variables.scss";
2+
13
/**
24
* 4. Content
35
* 4.1 Posts and Pages

_sass/_footer.scss

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,5 @@
1+
@import "_variables.scss";
2+
13
/**
24
* 5. Site Footer
35
* ----------------------------------------------------------------------------

_sass/_forms.scss

Lines changed: 88 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,88 @@
1+
@import "_variables.scss";
2+
3+
/* Form fields */
4+
input,
5+
textarea {
6+
background: $white;
7+
border-radius: 0;
8+
box-shadow: none;
9+
box-sizing: border-box;
10+
font-size: 16px;
11+
line-height: 1.5;
12+
margin: 10px 0 0 0;
13+
padding: 8px 10px;
14+
vertical-align: baseline;
15+
}
16+
17+
input[type="text"],
18+
textarea {
19+
border: 1px solid $black;
20+
color: $gray-darkest;
21+
display: block;
22+
max-width: 100%;
23+
width: 100%;
24+
}
25+
26+
input[type="text"]:focus,
27+
textarea:focus {
28+
outline: 0;
29+
}
30+
31+
button,
32+
input[type="submit"],
33+
input[type="button"],
34+
a.button {
35+
-moz-appearance: none;
36+
-webkit-appearance: none;
37+
background: $gray-darkest;
38+
border: 1px solid $gray-lighter;
39+
box-sizing: border-box;
40+
color: $body-text-color;
41+
display: inline-block;
42+
font-size: 12px;
43+
letter-spacing: 1px;
44+
line-height: 1.5;
45+
padding: 10px 30px;
46+
text-decoration: none;
47+
text-transform: uppercase;
48+
-webkit-transition: .3s ease;
49+
transition: .3s ease;
50+
}
51+
52+
button:hover,
53+
button:focus,
54+
button:active,
55+
input[type="submit"]:hover,
56+
input[type="submit"]:focus,
57+
input[type="submit"]:active,
58+
input[type="button"]:hover,
59+
input[type="button"]:focus,
60+
input[type="button"]:active,
61+
a.button:hover,
62+
a.button:focus,
63+
input.confirm-button {
64+
background: $gray-lighter;
65+
color: $black;
66+
outline: 0;
67+
}
68+
69+
input.confirm-button {
70+
border-color: $color-accent;
71+
}
72+
/* Placeholder text color */
73+
::-webkit-input-placeholder {
74+
color: $gray;
75+
}
76+
77+
:-moz-placeholder {
78+
color: $gray;
79+
}
80+
81+
::-moz-placeholder {
82+
color: $gray;
83+
opacity: 1;
84+
}
85+
86+
:-ms-input-placeholder {
87+
color: $gray;
88+
}

_sass/_general.scss

Lines changed: 3 additions & 84 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,5 @@
1+
@import "_variables.scss";
2+
13
/**
24
* 1. General
35
* ----------------------------------------------------------------------------
@@ -167,89 +169,6 @@ th {
167169
font-weight: bold;
168170
}
169171

170-
/* Form fields */
171-
input,
172-
textarea {
173-
background: #fff;
174-
border: 1px solid $black;
175-
border-radius: 0;
176-
box-shadow: none;
177-
box-sizing: border-box;
178-
color: $gray-darkest;
179-
font-size: 16px;
180-
line-height: 1.5;
181-
margin: 10px 0 0 0;
182-
max-width: 100%;
183-
padding: 8px 10px;
184-
vertical-align: baseline;
185-
}
186-
187-
input[type="text"],
188-
textarea {
189-
display: block;
190-
width: 100%;
191-
}
192-
193-
input[type="text"]:focus,
194-
textarea:focus {
195-
outline: 0;
196-
}
197-
198-
button,
199-
input[type="submit"],
200-
input[type="button"],
201-
a.button {
202-
-moz-appearance: none;
203-
-webkit-appearance: none;
204-
background: $gray-darkest;
205-
border: 1px solid $gray-lighter;
206-
box-sizing: border-box;
207-
color: $body-text-color;
208-
display: inline-block;
209-
font-size: 12px;
210-
letter-spacing: 1px;
211-
line-height: 1.5;
212-
padding: 10px 30px;
213-
text-decoration: none;
214-
text-transform: uppercase;
215-
-webkit-transition: .3s ease;
216-
transition: .3s ease;
217-
}
218-
219-
button:hover,
220-
button:focus,
221-
button:active,
222-
input[type="submit"]:hover,
223-
input[type="submit"]:focus,
224-
input[type="submit"]:active,
225-
input[type="button"]:hover,
226-
input[type="button"]:focus,
227-
input[type="button"]:active,
228-
a.button:hover,
229-
a.button:focus {
230-
background: $gray-lighter;
231-
color: $black;
232-
outline: 0;
233-
}
234-
235-
/* Placeholder text color */
236-
::-webkit-input-placeholder {
237-
color: $gray;
238-
}
239-
240-
:-moz-placeholder {
241-
color: $gray;
242-
}
243-
244-
::-moz-placeholder {
245-
color: $gray;
246-
opacity: 1;
247-
}
248-
249-
:-ms-input-placeholder {
250-
color: $gray;
251-
}
252-
253172
/* Videos, audios and embeds */
254173
embed,
255174
iframe,
@@ -273,7 +192,7 @@ img {
273192
max-width: 100%;
274193
}
275194

276-
img[src*="#light-border"] {
195+
.light-border, img[src*="#light-border"] {
277196
border: 1px solid $gray;
278197
}
279198

_sass/_header.scss

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,5 @@
1+
@import "_variables.scss";
2+
13
/**
24
* 3. Site Header
35
* ----------------------------------------------------------------------------

_sass/_media-queries.scss

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,5 @@
1+
@import "_variables.scss";
2+
13
/**
24
* 6. Media Queries
35
* ----------------------------------------------------------------------------

0 commit comments

Comments
 (0)