libmedium/templates/main.css

195 lines
2.4 KiB
CSS

* {
margin: 0;
padding: 0;
}
body {
width: 100%;
display: flex;
flex-direction: column;
}
main {
width: 35em;
margin: auto;
display: flex;
flex-direction: column;
}
h1,
h2,
h3,
h4,
h5,
h6 {
font-family: sohne, "Helvetica Neue", Helvetica, Arial, sans-serif !important;
}
a {
color: rgb(0, 86, 179);
text-decoration: none;
}
a:visited {
color: rgb(0, 86, 179);
}
a:hover {
text-decoration: underline;
}
html {
color: #333;
font-family: charter, Georgia, Cambria, "Times New Roman", Times, serif;
font-size: 26px;
line-height: 1.55rem;
}
p {
margin: 20px 0;
}
img {
margin: auto;
max-width: 100%;
display: block;
}
figcaption {
text-align: center;
}
/*
code {
font-family: monospace;
font-size: 15px;
white-space: pre-wrap;
font-weight: 600;
line-height: 1rem;
padding: 5px;
border-radius: 6px;
background-color: rgba(175, 184, 193, 0.2);
}
*/
pre {
font-family: Menlo, Monaco, "Courier New", Courier, monospace;
font-size: 15px;
white-space: pre-wrap;
/*
font-weight: 600;
*/
line-height: 1rem;
padding: 20px;
border-radius: 6px;
background-color: rgba(175, 184, 193, 0.2);
}
.code-block {
display: block;
margin: 5px 0;
padding: 20px;
}
iframe {
width: 100%;
display: block;
margin: auto;
min-height: 100px;
}
@media screen and (max-width: 1200px) {
html {
font-size: 16px;
line-height: 1.5rem;
}
main {
width: 90%;
}
img {
display: block;
}
h1,
h2,
h3,
h4,
h5,
h6 {
font-family: "Times New Roman", Times, serif;
line-height: 30px;
}
}
.author__photo {
width: 28px;
height: 28px;
border-radius: 20px;
display: inline-block;
margin: auto;
margin-right: 5px;
display: inline-flex;
}
.medium__source {
font-style: italic;
}
.author {
display: inline-flex;
flex-direction: row;
margin-right: 5px;
}
.meta {
display: inline-flex;
}
.gist_contianer {
border-radius: 6px;
border: 1px solid rgb(211, 211, 211);
}
.gist_link {
margin-left: 5px;
}
.libmedium__meta {
background-color: rgb(255, 165, 0);
padding: 5px;
}
blockquote {
margin-left: -5px;
padding-left: 19px;
border-left: 4px solid #333;
font-style: italic;
}
ol,
ul {
margin-left: 40px;
}
.line-number {
margin-right: 20px;
display: inline-block;
}
.gist-block {
overflow-x: scroll;
display: block;
}
.mixtape {
padding: 20px;
border: 1px solid gray;
display: flex;
align-items: center;
margin: 30px 0;
}