pastes.sh/public/main.css

298 lines
3.7 KiB
CSS

*, ::before, ::after {
box-sizing: border-box;
}
::-moz-focus-inner {
border-style: none;
padding: 0;
}
:-moz-focusring { outline: 1px dotted ButtonText; }
:-moz-ui-invalid { box-shadow: none; }
:root[data-theme="theme-dark"] {
--white: #f2f2f2;
--black: #252525;
--purple: #bd93f9;
--blue: #8be9fd;
--yellow: #ffff80;
--pink: #ff80bf;
--orange: #ffca80;
--green: #50fa7b;
--grey: #414558;
--greyer: #282a36;
}
html {
background-color: var(--greyer);
color: var(--white);
line-height: 1.5;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell,
"Fira Sans", "Droid Sans", "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji",
"Segoe UI Emoji", "Segoe UI Symbol";
-webkit-text-size-adjust: 100%;
-moz-tab-size: 4;
tab-size: 4;
}
body {
margin: 0 auto;
max-width: 42rem;
}
@media only screen and (min-width: 1024px) {
body {
max-width: 60rem;
}
}
img {
max-width: 100%;
height: auto;
}
b, strong {
font-weight: bold;
}
code, kbd, samp, pre {
font-family: ui-monospace, SFMono-Regular, Consolas, 'Liberation Mono', Menlo, monospace;
font-size: 0.9em;
background-color: var(--black) !important;
}
code {
border-radius: 5px;
}
pre {
border-radius: 5px;
padding: 1rem;
overflow-x: auto;
margin: 0;
}
small {
font-size: 0.8rem;
}
summary {
display: list-item;
}
h1, h2, h3 {
margin: 0;
padding: 0;
border: 0;
font-style: normal;
font-weight: inherit;
font-size: inherit;
}
h1 .sub {
font-size: 0.6em;
}
hr {
color: inherit;
border: 0;
margin: 0;
height: 1px;
background: var(--grey);
margin: 2rem auto;
text-align: center;
}
a {
text-decoration: underline;
color: var(--blue);
}
a:hover, a:visited:hover {
color: var(--pink);
}
a:visited {
color: var(--purple);
}
a.link-grey {
text-decoration: underline;
color: var(--white);
}
a.link-grey:visited {
color: var(--white);
}
section {
margin-bottom: 2rem;
}
section:last-child {
margin-bottom: 0;
}
header {
margin: 1rem auto;
}
p {
margin: 1rem 0;
}
article {
overflow-wrap: break-word;
}
blockquote {
border-left: 5px solid var(--purple);
background-color: var(--grey);
padding: 0.5rem;
margin: 0;
}
ul, ol {
padding: 0 0 0 2rem;
list-style-position: outside;
}
ul[style*="list-style-type: none;"] {
padding: 0;
}
li {
margin: 0.5rem 0;
}
li > pre {
padding: 0;
}
footer {
text-align: center;
margin-bottom: 4rem;
}
dt {
font-weight: bold;
}
dd {
margin-left: 0;
}
dd:not(:last-child) {
margin-bottom: .5rem;
}
.md h1 {
font-size: 1.25rem;
line-height: 1.15;
font-weight: bold;
padding: 0.5rem 0;
}
.md h2 {
font-size: 1.125rem;
line-height: 1.15;
font-weight: bold;
padding: 0.5rem 0;
}
.md h3 {
font-weight: bold;
}
.md h4 {
font-size: 0.875rem;
font-weight: bold;
}
.post-date {
width: 130px;
}
.text-grey {
color: var(--grey);
}
.text-2xl {
font-size: 1.5rem;
line-height: 1.15;
}
.text-xl {
font-size: 1.25rem;
line-height: 1.15;
}
.text-lg {
font-size: 1.125rem;
line-height: 1.15;
}
.text-sm {
font-size: 0.875rem;
}
.text-center {
text-align: center;
}
.font-bold {
font-weight: bold;
}
.font-italic {
font-style: italic;
}
.inline {
display: inline;
}
.flex {
display: flex;
}
.items-center {
align-items: center;
}
.m-0 {
margin: 0;
}
.my {
margin-top: 0.5rem;
margin-bottom: 0.5rem;
}
.mx {
margin-left: 0.5rem;
margin-right: 0.5rem;
}
.mx-2 {
margin-left: 1rem;
margin-right: 1rem;
}
.justify-between {
justify-content: space-between;
}
.flex-1 {
flex: 1;
}
@media only screen and (max-width: 600px) {
body {
padding: 1rem;
}
header {
margin: 0;
}
}