homebrewserver.club/themes/homebrewtheme/static/css/main.css

510 lines
6.8 KiB
CSS
Raw Normal View History

2019-06-12 15:08:48 +02:00
/*
2k19 Homebrewserver.club Pelican theme
2019-06-12 15:08:48 +02:00
---
Style sheet is ordered vertically, with declarations for the header on top and footer on the bottom.
With contributions by club members:
http://roelof.info
http://randomiser.info/
http://majesticmoo.se
*/
2019-06-18 00:26:45 +02:00
2019-06-12 15:08:48 +02:00
@font-face {
font-family:'OrkneyRegular';
src: url('../fonts/Orkney Regular.woff') format('truetype');
}
html {
2019-08-16 14:55:50 +02:00
font-size:22px;
}
2019-06-12 15:08:48 +02:00
header {
width:100%;
}
#banner {
text-align: center;
2019-08-16 15:46:06 +02:00
padding-bottom: 0.2em;
2019-06-12 15:08:48 +02:00
padding-top: 1em;
font-size:3rem;
font-weight: bold;
2019-06-19 18:47:43 +02:00
font-family:'OrkneyRegular';
2019-08-16 15:46:06 +02:00
background-color: #EAEAEA;
2019-06-12 15:08:48 +02:00
}
#sitename {
color:#0074D9;
2019-06-19 18:29:34 +02:00
text-decoration: none;
/*text-decoration:overline underline;*/
/*text-decoration-style:wavy;*/
2019-06-18 00:26:45 +02:00
text-decoration-color:rgba(255, 65, 54, 0.5)/*#FF4136;*/
2019-06-19 18:29:34 +02:00
height:3em;
2019-06-12 15:08:48 +02:00
}
pre {
font-family: monospace;
}
2019-06-18 00:26:45 +02:00
2019-06-12 15:08:48 +02:00
#menu {
2019-06-18 00:26:45 +02:00
list-style:none;
font-size:1.4rem;
2019-08-16 15:46:06 +02:00
/*! margin-top:1.2em; */
2019-06-12 15:08:48 +02:00
font-weight:bold;
text-align:center;
2019-06-18 00:26:45 +02:00
text-transform:lowercase;
white-space: nowrap;
2019-06-19 18:29:34 +02:00
background-color: #EAEAEA;
2019-08-16 16:12:40 +02:00
2019-06-18 00:26:45 +02:00
}
#menu a {
padding-right:0.5%;
}
2019-06-18 00:26:45 +02:00
.dropdown {
position: relative;
display: inline-block;
color:#FF4136;
text-decoration:underline;
cursor: pointer;
}
.arrow{
font-size:1.1rem;
}
2019-06-18 00:26:45 +02:00
.guides-index {
display: none;
position: absolute;
2019-06-19 18:29:34 +02:00
background-color: #EAEAEA;
2019-06-18 00:26:45 +02:00
z-index: 1;
text-align:left;
box-sizing: initial;
padding-right:15%;
color:#0074D9;
}
.guides-index li{
font-size:calc(5px + 0.9vw);
font-weight:normal;
/*margin-top:10%;*/
2019-06-18 00:26:45 +02:00
}
2019-06-19 18:32:35 +02:00
.guides-index a:hover{
2019-06-18 00:26:45 +02:00
color:#333;
}
.dropdown:hover .guides-index {
display: block;
2019-06-12 15:08:48 +02:00
}
body {
line-height:1.6em;
color:#0074D9;
background-color:#f6f6f6;
2019-08-16 15:49:27 +02:00
font-family:times;
2019-06-12 15:08:48 +02:00
letter-spacing: 0.05em;
margin:0;
/*! padding: 1em; */
}
#index{
max-width:65%;
2019-06-12 15:08:48 +02:00
margin: auto;
2019-06-18 00:26:45 +02:00
color:#333;
2019-06-12 15:08:48 +02:00
}
/*
#content {
max-width:75%;
margin:auto;
}*/
2019-06-12 15:08:48 +02:00
a {
color:#FF4136;
}
#index{
/*! width:100%; */
2019-08-16 16:12:40 +02:00
padding-top:3.5em;
2019-06-12 15:08:48 +02:00
padding-bottom:1em;
}
2019-08-16 14:02:49 +02:00
#manifesto {
font-family:'OrkneyRegular';
2019-08-16 16:44:32 +02:00
width:85%;
2019-08-16 14:02:49 +02:00
margin:0 auto;
}
2019-06-12 15:08:48 +02:00
#post-list {
/*display: flex;
flex-wrap: wrap;*/
2019-08-16 16:44:32 +02:00
margin-top:2em;
padding-left:0;
2019-06-24 10:58:09 +02:00
display: flex;
flex-direction: row;
2019-06-24 10:58:09 +02:00
flex-wrap: wrap;
align-items: stretch;
align-content: center;
2019-06-12 15:08:48 +02:00
}
2019-08-16 16:44:32 +02:00
#post-list a, #post-list p{
font-size:0.87em;
}
2019-08-16 16:12:40 +02:00
2019-08-16 16:44:32 +02:00
.hentry{
line-height:1.3em;
}
2019-08-16 16:12:40 +02:00
2019-06-24 10:58:09 +02:00
.post-item {
max-width: 30%;
padding:0 2% 0 0;
2019-06-24 10:58:09 +02:00
}
2019-06-12 15:08:48 +02:00
h1{
font-size:2.4rem;
2019-06-12 15:08:48 +02:00
margin: 0;
padding: 0.5em;
padding-left: 0;
}
}
h2{
font-size:2rem;
padding: 1em;
margin: 0;
}
}
h3{
font-size:1.4rem;
2019-06-12 15:08:48 +02:00
text-decoration: underline;
padding: 1em;
margin: 0;
}
2019-06-19 18:47:43 +02:00
h1, h2,h3 {
font-family:'OrkneyRegular';
2019-08-16 16:01:52 +02:00
color:black;
2019-06-12 15:08:48 +02:00
}
.summary p{
font-size:0.8rem;
text-align: left;
margin:0;
}
.hentry{
2019-06-24 10:58:09 +02:00
background-color: #EAEAEA;
padding:1.4em;
margin-bottom:1.4em;
2019-08-16 16:44:32 +02:00
border-width: 1px 1px 4px 4px;
border-style: solid;
2019-06-12 15:08:48 +02:00
}
.entry-title{
font-size:2rem;
2019-06-12 15:08:48 +02:00
font-weight:bold;
line-height: 1.2em;
2019-06-19 18:47:43 +02:00
font-family:'OrkneyRegular';
2019-06-12 15:08:48 +02:00
}
2019-06-24 12:41:08 +02:00
.index-entry-title{
font-size:1.4rem;
font-weight:bold;
line-height: 1.4em;
font-family:'OrkneyRegular';
word-wrap: break-word;
2019-06-24 12:41:08 +02:00
}
2019-06-12 15:08:48 +02:00
.entry-title span{
width:100%;
display:inline-block;
}
.toc{
width:35%;
2019-08-16 15:58:52 +02:00
font-size: 0.7em;
2019-06-12 15:08:48 +02:00
padding: 3em;
float: right;
2019-08-16 15:58:52 +02:00
line-height: 2em;
2019-08-16 14:55:50 +02:00
border-width: 1px 1px 4px 4px;
border-style: solid;
2019-08-16 14:55:50 +02:00
/*! margin: 1.6em; */
background-color: #EAEAEA;
margin-top: 4em;
margin-left: 1.6em;
margin-bottom: 1.6em;
2019-08-16 15:46:06 +02:00
font-family: OrkneyRegular;
2019-06-12 15:08:48 +02:00
}
2019-08-16 15:58:52 +02:00
.toc li{
line-height:1.7em;
}
2019-06-12 15:08:48 +02:00
.toc .toctitle {
font-size:1rem;
2019-08-16 15:46:06 +02:00
padding-bottom: 1em;
2019-06-12 15:08:48 +02:00
}
.toc ul{
}
.entry-content{
/*! margin:auto; */
2019-08-16 14:55:50 +02:00
padding-top:2em;
2019-06-12 15:08:48 +02:00
padding-bottom:1em;
}
.entry-content pre{
font-size: 18px;
padding: 0.5em;
overflow: auto;
background-color: #EAEAEA;
line-height: 1.2em;
}
2019-06-12 15:08:48 +02:00
.codehilite {
max-width: 800px;
margin:1em auto;
}
code {
/*! font-size: 18px; */
padding: 0.5em;
background-color: #EAEAEA;
line-height: 1.2em;
}
.entry-content img{
max-height:100%;
max-width: 100%;
}
.entry-content ul{
line-height:1.5;
margin: auto;
max-width:800px;
}
.entry-content pre{
margin: auto;
}
.highlight{
margin: auto;
max-width:800px;
}
blockquote {
font-style:italic;
}
#content p{
line-height:1.6;
/*max-width:55ch;*/
2019-06-12 15:08:48 +02:00
margin: 0 auto;
margin-bottom:1em;
}
2019-08-16 14:02:49 +02:00
2019-06-12 15:08:48 +02:00
#content .caption{
font-size:80%;
padding-top:0;
margin-top:0px;
}
#content p.img{
margin-bottom:0px;
}
.category-intro {
width:85%;
}
2019-06-12 15:08:48 +02:00
.divider {
font-size:12px;
width:100%;
line-height:1em;
background-color:white;
}
.published{
font-size:smaller;
}
#categories {
font-size: 40px;
margin-top: 2em;
text-align: center;
}
#pertaining{
margin-top:2em;
text-align:center;
}
.footnote{
font-size:14px;
margin:auto;
max-width:800px;
}
.author{
font-size:smaller;
}
.post-info {
line-height: 1em;
margin-top:1em;
}
table{
margin: 1em auto;
max-width: 800px;
font-size:0.9em;
width: 100%;
border-collapse: collapse;
text-align: left;
border: 1px solid #0074D9;
}
table td, table th {
border: 1px dashed #EAEAEA;
padding-left:1em;
padding-top:0.2em;
}
table thead tr {
border-bottom: 1px solid #0074D9;
background: #EAEAEA;
}
table tr:nth-child(even) {
background: #EAEAEA;
}
#page-content p{
line-height:1.6;
max-width:75ch;
margin: 0 auto;
margin-bottom:1em;
}
2019-06-12 15:08:48 +02:00
/* some good ol' theft from https://codepo8.github.io/css-fork-on-github-ribbon/ */
#forkongithub a {
background:#FF4136;
color:#fff;
text-decoration:none;
font-family:'OrkneyRegular';
2019-06-12 15:08:48 +02:00
/*! font-family:arial,sans-serif; */
text-align:right;
font-weight:bold;
padding:5px 40px;
font-size:1rem;
line-height:2rem;
position:relative;
transition:0.5s;
font-size: 14px;
2019-06-18 00:26:45 +02:00
box-sizing:initial;
2019-06-12 15:08:48 +02:00
}
#forkongithub a:hover{
background:#0074D9;
color:#fff;}
#forkongithub a::before,#forkongithub a::after{
content:"";
width:100%;
display:block;
position:absolute;
top:1px;
left:0;
height:1px;
background:#fff;
2019-06-12 15:08:48 +02:00
}
#forkongithub a::after{
bottom:1px;
top:auto;
}
@media screen and (min-width:800px){
#forkongithub{
position:fixed;
display:block;
top:0;
right:0;
width:200px;
overflow:hidden;
height:200px;
z-index:9999;
}
#forkongithub a{
width:210px;
position:absolute;
top:30px;
right:-60px;
transform:rotate(45deg);
-webkit-transform:rotate(45deg);
-ms-transform:rotate(45deg);
-moz-transform:rotate(45deg);
-o-transform:rotate(45deg);
box-shadow:4px 4px 10px rgba(0,0,0,0.8);
}
}
@media screen and (max-width:620px) {
2019-06-19 18:29:34 +02:00
html {font-size:20px;}
2019-06-12 15:08:48 +02:00
#banner{
font-size: 1rem;
line-height: 1rem;
word-wrap: break-word;
}
#menu{font-size:1rem}
#index{
max-width:100%;
}
#content{
padding:1em;
}
2019-06-19 18:47:43 +02:00
#content p{
line-height: 1.4em;
}
2019-06-12 15:08:48 +02:00
ul {
padding:0em;
}
article {
padding:1em;
}
blockquote{margin:1em;}
code{
font-size:90%;
padding:0.3em;
}
h1 {
font-size:2rem;
line-height:1em;
}
.entry-content pre {
font-size: 90%;
padding: 0.3em;
}
.footnote {
word-wrap: break-word;
}
.footnote ol{
padding-left:1.5em;
}