152 lines
2.5 KiB
SCSS
Raw Normal View History

2020-02-07 12:37:31 +09:00
@import url("https://fonts.googleapis.com/css?family=PT+Sans:400,700");
2019-03-14 23:23:12 +09:00
2017-10-07 11:43:26 +09:00
$break-small: 500px;
$break-large: 840px;
2019-03-14 23:23:12 +09:00
2020-02-07 12:57:54 +09:00
:root {
--background: #fff;
--text: #000;
--accent: #4f33e8;
--highlight: #f6f6f6;
--tone: #989898;
2021-06-08 16:50:52 +09:00
--dim: rgb(203, 203, 203);
2020-02-07 12:57:54 +09:00
}
@media (prefers-color-scheme: dark) {
:root {
--background: #261e3a;
--text: #e2dfea;
--accent: #7033e8;
--highlight: #140d25;
--tone: #989898;
2021-06-08 16:50:52 +09:00
--dim: rgb(90, 83, 101);
2020-02-07 12:57:54 +09:00
}
}
2021-01-21 21:45:05 +09:00
html,
body {
box-sizing: border-box;
}
2017-10-07 11:43:26 +09:00
body {
2018-12-28 21:44:59 +09:00
width: 900px;
2017-10-07 11:43:26 +09:00
margin: 0 auto;
padding: 0 20px;
2021-01-21 21:45:05 +09:00
font-family: "PT Sans", "Hiragino Sans", "Hiragino Mincho ProN", sans-serif;
2017-11-28 12:20:00 +09:00
-webkit-font-smoothing: antialiased;
text-rendering: optimizeLegibility;
2021-06-08 22:10:25 +09:00
font-feature-settings: "kern";
2020-02-07 12:57:54 +09:00
background: var(--background);
color: var(--text);
2019-03-14 23:23:12 +09:00
2017-10-07 11:43:26 +09:00
@media screen and (max-width: $break-large) {
width: auto;
margin: 0;
}
2018-12-28 21:44:59 +09:00
}
// Highlight.js
2017-10-07 11:43:26 +09:00
.hljs {
2021-01-21 21:45:05 +09:00
border-radius: 6px;
font-family: Consolas, "Liberation Mono", Menlo, Courier, monospace;
font-size: 14px;
2020-02-07 12:57:54 +09:00
background: #0e0127 !important;
2020-02-07 12:37:31 +09:00
padding: 12px 18px !important;
line-height: 1.6em !important;
2021-01-21 21:45:05 +09:00
margin: 0;
2021-02-14 17:24:36 +09:00
@media screen and (max-width: $break-small) {
font-size: 0.8em;
}
2017-10-07 11:43:26 +09:00
}
code {
2018-05-24 23:18:31 +09:00
padding: 0 12px;
2017-10-07 11:43:26 +09:00
}
p code {
padding: 3px 10px;
2020-02-07 12:57:54 +09:00
background: var(--highlight);
2017-10-07 11:43:26 +09:00
border-radius: 3px;
font-size: 16px;
}
2018-07-19 20:53:12 +09:00
a:hover,
a:active,
a:link,
a:visited {
2020-02-07 12:57:54 +09:00
color: var(--text);
2017-10-07 11:43:26 +09:00
text-decoration: none;
}
2018-07-19 20:53:12 +09:00
h1,
h2,
h3,
h4,
p {
2017-10-07 11:43:26 +09:00
margin: 0;
padding: 0;
line-height: 1.333em;
}
hr {
display: block;
width: 100%;
height: 1px;
2020-02-07 12:57:54 +09:00
background-color: var(--highlight);
2017-10-07 11:43:26 +09:00
border: 0;
margin: 40px 0;
}
2019-03-14 23:23:12 +09:00
2021-05-01 02:19:10 +09:00
header.header {
2017-10-07 11:43:26 +09:00
display: flex;
flex-wrap: wrap;
2021-02-14 17:24:36 +09:00
margin-top: 60px;
margin-bottom: 80px;
flex-direction: row;
justify-content: flex-start;
2017-10-07 11:43:26 +09:00
align-items: center;
2019-03-14 23:23:12 +09:00
2017-10-07 11:43:26 +09:00
@media screen and (max-width: $break-small) {
2021-02-14 17:24:36 +09:00
margin-top: 30px;
margin-bottom: 60px;
// justify-content: center;
2017-10-07 11:43:26 +09:00
}
2019-03-14 23:23:12 +09:00
2017-10-07 11:43:26 +09:00
.logo {
2020-02-07 12:57:54 +09:00
@media (prefers-color-scheme: dark) {
filter: invert(1);
}
2019-03-14 23:23:12 +09:00
2017-10-07 11:43:26 +09:00
@media screen and (max-width: $break-small) {
2021-02-14 17:24:36 +09:00
padding-left: 5px;
2020-02-07 13:11:06 +09:00
}
}
2017-10-07 11:43:26 +09:00
.menu {
2021-02-14 17:24:36 +09:00
display: flex;
flex-direction: column;
2017-10-07 11:43:26 +09:00
list-style: none;
2021-02-14 17:24:36 +09:00
text-transform: lowercase;
font-weight: bold;
border-left: 1px solid var(--tone);
// font-family: Rockwell;
2019-03-14 23:23:12 +09:00
2021-02-14 17:24:36 +09:00
padding: 0;
margin: 0 0 0 30px;
padding: 0 0 0 30px;
.menu__item {
margin: 5px 0;
2017-10-07 11:43:26 +09:00
}
}
}
2019-03-14 22:32:24 +09:00
2021-01-21 21:45:05 +09:00
.page-nav {
display: flex;
justify-content: center;
.page-prev,
.page-number,
.page-next {
font-size: 1.2rem;
padding: 20px;
}
}
2020-02-07 12:37:31 +09:00
@import "./post";