Skip to content
  • 2 commits
  • 10 files changed
  • 0 commit comments
  • 1 contributor
Commits on Jun 13, 2012
@Pistos Pistos Refactor where (in what files) fonts are defined, to pave the way for…
… member-selectable (relative) font size.
0ad7311
@Pistos Pistos Members can now select between "legible" and "small" font size (globa…
…l effect across entire site for the member).
394ecfb
View
11 controller/accounts.rb
@@ -25,5 +25,16 @@ def generate_api_token
account.generate_api_token
redirect_referrer
end
+
+ def font(choice = nil)
+ case choice
+ when 'small'
+ account.font_css = 'fonts-small'
+ else
+ account.font_css = nil
+ end
+
+ redirect_referrer
+ end
end
end
View
1 layout/_head.xhtml
@@ -3,6 +3,7 @@
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0"/>
<link href="/css/application.css?t=#{File.mtime('public/css/application.css').to_i}" media="screen" rel="stylesheet" type="text/css" />
+ <link href="/css/#{account.font_css || 'fonts'}.css?t=#{File.mtime('public/css/' + (account.font_css || 'fonts') + '.css').to_i}" media="screen" rel="stylesheet" type="text/css" />
<link href="/css/single-post-view.css?t=#{File.mtime('public/css/single-post-view.css').to_i}" media="screen" rel="stylesheet" type="text/css" />
<link href="/css/excerpts-view.css?t=#{File.mtime('public/css/excerpts-view.css').to_i}" media="screen" rel="stylesheet" type="text/css" />
<?r if account.admin? ?>
View
7 layout/_menu.xhtml
@@ -14,6 +14,13 @@
<div id="account-window" class="window has-shadow">
<a href="/profiles/show/#{account.member.id}"><img src="/images/icon-account.png" alt="Profile"/> Profile</a><br/>
<a href="/accounts/edit"><img src="/images/icon-settings.png" alt="Settings"/> Settings</a><br/>
+ Text:
+ <?r if account.font_css == 'fonts-small' ?>
+ <a href="/accounts/font" title="Legible font size"/>legible</a> | small
+ <?r else ?>
+ legible | <a href="/accounts/font/small" title="Small font size"/>small</a>
+ <?r end ?>
+ <br/>
<?r if session[:layout] == 'narrow' ?>
<a href="/layout/wide"><img src="/images/icon-display.png" alt="large display"/> Large display</a></br>
<?r else ?>
View
109 scss-include/font-declarations.scss
@@ -0,0 +1,109 @@
+body.body {
+ font-family: Arial, sans-serif;
+}
+
+h1, h2, h3, h4, h5, h6 {
+ font-family: Arial, sans-serif;
+}
+h1 { font-size: $font_extra_extra_large; }
+h2 { font-size: $font_extra_large; }
+h3 { font-size: $font_large; }
+h4 { font-size: $font_normal; }
+h5, h6 { font-size: $font_small; }
+
+.menu {
+ font-size: $font_small;
+}
+#menu-narrower #menu-account {
+ font-size: $font_small;
+}
+
+.member-name {
+ font-size: $font_normal;
+ font-weight: bold;
+}
+
+.age, .age-update {
+ font-size: $font_small;
+}
+
+.post-text {
+ font-size: $font_normal;
+}
+
+div.comment {
+ .member-name { font-size: $font_small }
+ .age { font-size: $font_extra_small; }
+ .text { font-size: $font_small; }
+}
+
+#account-window {
+ font-size: $font_normal;
+}
+
+#notifications-window {
+ font-size: $font_small;
+ .header .title {
+ float: left;
+ font-weight: bold;
+ font-size: $font_normal;
+ }
+}
+
+#num-notifications-unseen {
+ font-weight: bold;
+ font-size: 14px;
+}
+
+.notification.unseen {
+ font-weight: bold;
+}
+.notification.seen {
+ font-weight: normal;
+}
+
+blockquote {
+ font-style: italic;
+}
+
+.form-buttons input {
+ font-size: $font_extra_small;
+}
+
+.filler {
+ font-size: $font_extra_small;
+}
+
+table.table th {
+ font-weight: bold;
+}
+
+#query-examples td:first-child {
+ font-family: monospace;
+}
+
+div.river .query {
+ font-family: monospace;
+}
+
+.markdown-injector a {
+ font-size: $font_extra_extra_small;
+}
+
+.excerpts-view {
+ .post-excerpt {
+ .post-tools {
+ a.confirm-hide {
+ font-weight: bold;
+ }
+ }
+ div.excerpt {
+ .end-of-text {
+ font-size: $font_extra_extra_small;
+ }
+ }
+ .link-view-post {
+ font-size: $font_large;
+ }
+ }
+}
View
7 scss-include/fonts-default.scss
@@ -0,0 +1,7 @@
+$font_extra_extra_large: 26px;
+$font_extra_large: 23px;
+$font_large: 20px;
+$font_normal: 18px;
+$font_small: 16px;
+$font_extra_small: 14px;
+$font_extra_extra_small: 12px;
View
7 scss-include/fonts-small.scss
@@ -0,0 +1,7 @@
+$font_extra_extra_large: 22px;
+$font_extra_large: 19px;
+$font_large: 16px;
+$font_normal: 14px;
+$font_small: 12px;
+$font_extra_small: 10px;
+$font_extra_extra_small: 8px;
View
73 scss/application.scss
@@ -8,7 +8,6 @@ Icon set by http://icons8.com/
*/
@import "colours.scss";
-@import "fonts.scss";
html {
height: 100%;
@@ -17,12 +16,10 @@ html {
body.body {
padding: 0px;
margin: 0px;
- font-family: Arial, sans-serif;
color: #261818;
height: 100%;
}
h1, h2, h3, h4, h5, h6 {
- font-family: Arial, sans-serif;
margin-top: 0px;
}
div, p, form {
@@ -30,11 +27,6 @@ div, p, form {
margin-top: 1em;
}
}
-h1 { font-size: $font_extra_extra_large; }
-h2 { font-size: $font_extra_large; }
-h3 { font-size: $font_large; }
-h4 { font-size: $font_normal; }
-h5, h6 { font-size: $font_small; }
.bg {
background: url('/images/bg.jpg') top center repeat;
@@ -118,7 +110,6 @@ textarea, input[type="text"], input[type="password"] {
}
.menu {
- font-size: $font_small;
text-align: right;
height: 40px;
position: fixed;
@@ -172,13 +163,31 @@ textarea, input[type="text"], input[type="password"] {
#menu-account {
width: auto;
padding-top: 4px;
- font-size: $font_small;
img {
height: 32px;
width: 32px;
}
}
+
+ #account-window {
+ top: 46px;
+ right: 18px;
+ width: 180px;
+ padding: 5px;
+
+ a {
+ line-height: 28px;
+ margin-left: 0px;
+ }
+
+ img {
+ vertical-align: middle;
+ height: 24px;
+ width: 24px;
+ }
+ }
+
}
}
@@ -201,13 +210,7 @@ textarea, input[type="text"], input[type="password"] {
height: 40px;
}
-.member-name {
- font-size: $font_normal;
- font-weight: bold;
-}
-
.age, .age-update {
- font-size: $font_small;
color: #888888;
}
@@ -233,7 +236,6 @@ textarea, input[type="text"], input[type="password"] {
.post-text {
clear: left;
- font-size: $font_normal;
}
div.comment {
@@ -243,11 +245,8 @@ div.comment {
height: 30px;
width: 30px;
}
- .member-name { font-size: $font_small }
- .age { font-size: $font_extra_small; }
.text {
clear: left;
- font-size: $font_small;
}
.comment-tools {
@@ -328,7 +327,6 @@ textarea.comment, form.comment .form-buttons {
width: 300px;
min-height: 100px;
padding: 10px;
- font-size: $font_small;
.header {
margin-bottom: 8px;
@@ -336,8 +334,6 @@ textarea.comment, form.comment .form-buttons {
.title {
float: left;
- font-weight: bold;
- font-size: $font_normal;
}
.tools {
@@ -347,32 +343,12 @@ textarea.comment, form.comment .form-buttons {
}
#num-notifications-unseen {
- font-weight: bold;
- font-size: 14px;
padding: 1px 2px 2px 2px;
top: 8px;
left: -28px;
position: relative;
}
-#account-window {
- top: 46px;
- right: 18px;
- width: 150px;
- padding: 5px;
- font-size: $font_normal;
-
- a {
- line-height: 28px;
- }
-
- img {
- vertical-align: middle;
- height: 24px;
- width: 24px;
- }
-}
-
.has-shadow {
-moz-box-shadow: 0px 4px 20px $shadow;
-webkit-box-shadow: 0px 4px 20px $shadow;
@@ -391,11 +367,9 @@ textarea.comment, form.comment .form-buttons {
}
}
.notification.unseen {
- font-weight: bold;
opacity: 1.0;
}
.notification.seen {
- font-weight: normal;
opacity: 0.8;
}
@@ -407,7 +381,6 @@ blockquote {
border-left: 4px solid $iced_coffee;
padding: 0.5em 0px 0.1em 1em;
margin-left: 0px;
- font-style: italic;
text-align: left;
}
@@ -432,7 +405,6 @@ blockquote {
input {
margin-left: 10px;
height: 24px;
- font-size: $font_extra_small;
}
}
@@ -452,7 +424,6 @@ a.hashtag {
position: absolute;
left: 34px;
cursor: text;
- font-size: $font_extra_small;
vertical-align: middle;
padding-top: 2px;
}
@@ -481,7 +452,6 @@ table.table {
border: 1px solid $main_green;
border-collapse: collapse;
th {
- font-weight: bold;
text-align: left;
}
th, td {
@@ -493,7 +463,6 @@ table.table {
#query-examples {
td:first-child {
white-space: nowrap;
- font-family: monospace;
}
}
@@ -508,9 +477,6 @@ div.river {
.river-tools {
margin-left: 20px
}
- .query {
- font-family: monospace;
- }
}
textarea.custom {
width: 500px;
@@ -553,7 +519,6 @@ textarea#invitations {
background-color: $faint_tan;
color: black;
border-bottom: 0px;
- font-size: $font_extra_extra_small;
margin-left: 0.5em;
cursor: pointer;
}
View
4 scss/excerpts-view.scss
@@ -1,5 +1,4 @@
@import "colours.scss";
-@import "fonts.scss";
.excerpts-view {
.post-excerpt {
@@ -27,7 +26,6 @@
}
a.confirm-hide {
display: none;
- font-weight: bold;
}
}
@@ -57,7 +55,6 @@
}
.end-of-text {
opacity: 0.2;
- font-size: $font_extra_extra_small;
}
.show-more, .show-less {
@@ -70,7 +67,6 @@
}
.link-view-post {
- font-size: $font_large;
margin-top: 10px;
}
View
2 scss/fonts-small.scss
@@ -0,0 +1,2 @@
+@import "../scss-include/fonts-small.scss";
+@import "../scss-include/font-declarations.scss";
View
10 scss/fonts.scss
@@ -1,8 +1,2 @@
-
-$font_extra_extra_large: 26px;
-$font_extra_large: 23px;
-$font_large: 20px;
-$font_normal: 18px;
-$font_small: 16px;
-$font_extra_small: 14px;
-$font_extra_extra_small: 12px;
+@import "../scss-include/fonts-default.scss";
+@import "../scss-include/font-declarations.scss";

No commit comments for this range

Something went wrong with that request. Please try again.