joak
/
varia.website
forked from varia/varia.website
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

typographic changes

transformations
mb@mb 7 years ago
parent
3659e8a7b0
commit
dde0cce635
1 changed files with 86 additions and 80 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 166
      themes/varia/static/css/main.css

166
themes/varia/static/css/main.css
View File

@ -1,30 +1,36 @@
@font-face{
font-family: "header";
src:url('../fonts/cmuntt.ttf');
font-weight: normal;
font-style: normal;
}
@font-face{
font-family: "kop";
src:url('../fonts/cmunssdc.ttf');
font-weight: normal;
font-style: normal;
}
@font-face{
font-family: "main";
src:url('../fonts/CourierCode-Roman.ttf');
src:url('../fonts/cooper-hewitt/CooperHewitt-Medium.otf');
font-weight: normal;
font-style: normal;
}
@font-face{
font-family: "main";
src:url('../fonts/CourierCode-Bold.ttf');
src:url('../fonts/cooper-hewitt/CooperHewitt-Bold.otf');
font-weight: bold;
font-style: normal;
}
@font-face{
font-family: "main";
src:url('../fonts/CourierCode-Italic.ttf');
src:url('../fonts/cooper-hewitt/CooperHewitt-MediumItalic.otf');
font-weight: normal;
font-style: italic;
}
@font-face{
font-family: "main";
src:url('../fonts/CourierCode-BoldItalic.ttf');
src:url('../fonts/cooper-hewitt/CooperHewitt-BoldItalic.otf');
font-weight: bold;
font-style: italic;
}
@ -34,13 +40,14 @@ body{
min-width: 500px;
top:0px;
left:0px;
margin:14px auto 5em auto;
padding: 0px 15px;
margin:0 auto 5em auto;
padding: 14px 15px;
font-family: "main", monospace;
font-size: 15px;
line-height:1.8;
background-color: rgba(252, 255, 120, .7);
color:black;
font-size: 22px;
line-height:1.65;
/*letter-spacing: 0.01em;*/
background-color: rgba(238, 238, 238, 0.5);
color:#164515;
}
#content{
margin-top:1em;
@ -55,34 +62,12 @@ a:hover{
border:0;
text-decoration: none;
}
a.h-card{
color:black;
text-decoration: none;
}
hr, .separator hr {
border:0;
border-top:1px dotted #7e5211;
color: black;
margin:1em 0 .5em;
}
blockquote {
font-style:italic;
}
ul {
padding-left:0px;
}
h1, h2, h3, h4, h5, h6, #header{
margin:0;
padding:0;
}
h1{
font-family: "header";
font-family: "kop";
font-size: 100%;
}
h2{
@ -97,10 +82,32 @@ h1, h2, h3, h4, h5, h6, #header{
p{
margin:0 0 1em 0;
}
em{
}
sup{
font-size: 12px;
}
pre{
line-height: 1.0;
font-family: monospace;
}
hr, .separator hr {
border:0;
border-top:1px dotted #7e5211;
color: black;
margin:1em 0 .5em;
}
blockquote {
font-style:italic;
}
ul {
padding-left:0px;
}
.paginator{
float:right;
margin:0px;
@ -120,7 +127,7 @@ ul li{
/* article info */
.article-info{
font-size: 14px;
font-size: 12px;
margin:0;
}
/* date */
@ -137,12 +144,17 @@ ul li{
font-size: 12px;
font-style: italic;
}
.post-info time{
display: block;
}
.post-info sup{
font-size: 100%;
font-size: 80%;
}
.post-info .categories:before, .post-info .article-translation:before{
content:'→';
color:#7e5211;
font-family: sans-serif;
padding-right: 5px;
}
/****************************/
@ -150,12 +162,13 @@ ul li{
header {
width:calc(100% - 50px);
margin-top:0;
margin-top:26px;
margin-bottom:5em;
padding-bottom:1em;
font-family: 'main';
font-size: 14px;
font-family: "header";
font-size: 17px;
line-height: 1.6;
letter-spacing: -0.03em;
}
header img{
width: 50px;
@ -165,6 +178,9 @@ header {
}
/* custom font size for index */
#content.index header{
font-size: 24px;
line-height: 1.5;
margin-top:0;
}
header p{
display: inline;
@ -204,23 +220,33 @@ header {
transform: skew(2deg);
}
#translation{
.buttons{
position: absolute;
font-size: 12px;
top:0px;
right:15px;
font-size: 14px;
margin:0;
padding:0;
text-align: right;
}
#translation li{
.buttons.top, .buttons.side{
top:10px;
right:15px;
text-align: right;
}
.buttons.side{
top:40px;
}
.buttons.side li{
display: block;
}
.buttons li{
list-style: none;
display: inline-block;
padding-left: 3px;
}
#translation li.active a{
.buttons li.active a{
text-decoration: none;
}
#translation li.active{
font-weight: bold;
.buttons li.active{
/*font-weight: bold;*/
}
/****************************/
@ -231,14 +257,13 @@ header {
.summary p{
display: inline;
}
.article.hentry{
.article.hentry, /*.documentation.hentry*/{
width:calc(400px + 2em);
/*font-size: 125%;*/
}
.hentry{
display: inline-block;
width: 200px;
font-size: 13.5px;
font-size: 14px;
line-height: 1.65;
margin:0 2em 5em 0;
padding:0;
@ -250,16 +275,16 @@ header {
.hentry .article-info .event-details{
margin:5px 0 2px;
min-height: 1.65em;
font-family: monospace;
}
/* title */
.hentry .article-info .entry-title{
display: block;
width: 100%;
font-family: "header";
font-size: 165%;
font-family: "kop";
font-size: 185%;
font-weight: bold;
line-height: 1.15;
letter-spacing: -0.01em;
margin:0;
}
.hentry .article-info .entry-title a{
@ -280,7 +305,7 @@ header {
/* article */
#content.body .entry-title{
display:inline-block;
font-family: "header";
font-family: "kop";
font-size: 250%;
line-height: 1.25;
font-weight: bold;
@ -309,24 +334,6 @@ header {
.entry-content .seperator hr, #page-content hr{
width:100%;
}
/* Roel's complex footnote effect */
.entry-content span.simple-footnote-container{
float: left;
width: 200px;
margin:.5em 0 0 -270px;
}
.entry-content span.simple-footnote-content{
display: block;
font-size: 12px;
line-height: 1.3;
word-wrap:break-word;
}
.entry-content blockquote{
font-size: 150%;
margin:1em 3em 0;
line-height: 1.5;
}
/****************************/
/* other */
@ -348,22 +355,21 @@ header {
margin-top: 2em;
text-align: center;
}
/*.simple-footnotes{
font-size:14px;
margin:auto;
max-width:800px;
}
*/
.author{
display: none;
/*display: none;*/
}
iframe{
width: 100%;
height: auto;
}
/*footnotes*/
sup span{
float: right;
width: 200px;
margin:0.25em -150px 1em 3em;
clear:both;
font-size: 11px;
line-height: 1.5;
display: inline;
}
sup span p{

Write Preview
Loading…
Cancel
Save