m/blog
1
0
Fork 0
mirror of https://github.com/kremalicious/blog.git synced 2025-02-14 21:10:25 +01:00
Code

typography switch for headings

Browse Source
This commit is contained in:
Matthias Kretschmann 2013-12-02 23:19:01 +01:00
parent de9d8172ef
commit af5d8bb989
5 changed files with 11 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
_src/_includes/articles.html
View File

@ -75,7 +75,7 @@
</footer> </footer>
{% else %} {% else %}
<a class="more-link" href="{{ post.url }}">Continue reading <i class="icon-arrow-right"></i></a> <a class="more-link" href="{{ post.url }}">Continue reading <i class="icon-forward"></i></a>
{% endif %} {% endif %}
</section> </section>

28
_src/assets/less/buttons.less
View File

@ -3,9 +3,12 @@
///////////////////////////////////// /////////////////////////////////////
.btn { .btn {
font-family: @font-family-serif; font-family: @headings-font-family;
font-weight: @headings-font-weight;
font-size: .85em;
line-height: 1em; line-height: 1em;
text-align: center; text-align: center;
text-transform: uppercase;
vertical-align: middle; vertical-align: middle;
cursor: pointer; cursor: pointer;
display: inline-block; display: inline-block;
@ -62,29 +65,6 @@ a.btn-primary:visited {
} }
.btn-tag {
line-height: @line-height-base;
text-align: center;
text-transform: lowercase;
vertical-align: middle;
color: @text-color-light;
&:before {
content: "#";
color: @text-color-dimmed;
font-size: .9em;
margin-right: .1em;
}
&:hover {
color: @link-color;
&:before { color: @text-color-light; }
}
}
.more-link { .more-link {
.btn; .btn;
background: none; background: none;

2
_src/assets/less/content.less
View File

@ -222,7 +222,7 @@ time {
text-align: center; text-align: center;
.post-title { .post-title {
font-size: .8em; font-size: 1em;
color: @text-color-light; color: @text-color-light;
line-height: @line-height-base; line-height: @line-height-base;
margin-top: 0; margin-top: 0;

2
_src/assets/less/typography.less
View File

@ -48,7 +48,7 @@ h6 {
h1, .h1 { font-size: ceil(@font-size-base * 2.75); } h1, .h1 { font-size: ceil(@font-size-base * 2.75); }
h2, .h2 { font-size: ceil(@font-size-base * 2); } h2, .h2 { font-size: ceil(@font-size-base * 2); }
h3, .h3 { font-size: ceil(@font-size-base * 1.5); } h3, .h3 { font-size: ceil(@font-size-base * 1.75); }
h4, .h4 { font-size: ceil(@font-size-base * 1.35); } h4, .h4 { font-size: ceil(@font-size-base * 1.35); }
h5, .h5 { font-size: ceil(@font-size-base * 1.1); } h5, .h5 { font-size: ceil(@font-size-base * 1.1); }
h6, .h6 { font-size: @font-size-base; } h6, .h6 { font-size: @font-size-base; }

10
_src/assets/less/variables.less
View File

@ -11,11 +11,9 @@
// Typography // Typography
///////////////////////////////////// /////////////////////////////////////
@font-family-sans-serif: 'ff-tisa-sans-web-pro', 'Helvetica Neue', Helvetica, Arial, sans-serif;
@font-family-serif: 'rooney-web',Georgia,Palatino,'Palatino Linotype',Times,'Times New Roman',serif;
@font-family-monospace: Menlo, Monaco, Consolas, 'Courier New', monospace; @font-family-monospace: Menlo, Monaco, Consolas, 'Courier New', monospace;
@font-family-base: @font-family-sans-serif; @font-family-base: 'ff-tisa-sans-web-pro', 'Helvetica Neue', Helvetica, Arial, sans-serif;
@font-weight-base: 400; @font-weight-base: 400;
@font-size-base: 18px; @font-size-base: 18px;
@ -26,9 +24,9 @@
@line-height-base: 1.5; @line-height-base: 1.5;
@line-height-computed: floor(@font-size-base * @line-height-base); @line-height-computed: floor(@font-size-base * @line-height-base);
@headings-font-family: @font-family-serif; @headings-font-family: 'brandon-grotesque','Helvetica Neue',Helvetica,Arial,sans-serif;
@headings-font-weight: 500; @headings-font-weight: 500; // Medium
@headings-line-height: 1.1; @headings-line-height: 1.2;
// Text Colors // Text Colors