Update theme for 2019

This commit is contained in:
panr 2019-01-06 11:23:25 +01:00
parent 563972fe5f
commit 2ff92d6fdf
20 changed files with 375 additions and 83 deletions

View file

@ -10,24 +10,6 @@
background: #252627;
}
.bulb {
&-on {
display: none;
.dark-theme & {
display: block;
}
}
&-off {
display: block;
.dark-theme & {
display: none;
}
}
}
&__right {
display: flex;
flex-direction: row;
@ -49,5 +31,13 @@
}
.theme-toggle {
display: flex;
align-items: center;
justify-content: center;
line-height: 1;
cursor: pointer;
}
.theme-toggler {
fill: currentColor;
}

View file

@ -16,14 +16,14 @@
@font-face {
font-family: 'Inter UI';
font-style: normal;
font-weight: 500;
font-weight: 600;
src: url("../fonts/Inter-UI-Medium.woff2") format("woff2"),
url("../fonts/Inter-UI-Medium.woff") format("woff");
}
@font-face {
font-family: 'Inter UI';
font-style: italic;
font-weight: 500;
font-weight: 600;
src: url("../fonts/Inter-UI-MediumItalic.woff2") format("woff2"),
url("../fonts/Inter-UI-MediumItalic.woff") format("woff");
}
@ -31,29 +31,14 @@
@font-face {
font-family: 'Inter UI';
font-style: normal;
font-weight: 700;
font-weight: 800;
src: url("../fonts/Inter-UI-Bold.woff2") format("woff2"),
url("../fonts/Inter-UI-Bold.woff") format("woff");
}
@font-face {
font-family: 'Inter UI';
font-style: italic;
font-weight: 700;
font-weight: 800;
src: url("../fonts/Inter-UI-BoldItalic.woff2") format("woff2"),
url("../fonts/Inter-UI-BoldItalic.woff") format("woff");
}
@font-face {
font-family: 'Inter UI';
font-style: normal;
font-weight: 900;
src: url("../fonts/Inter-UI-Black.woff2") format("woff2"),
url("../fonts/Inter-UI-Black.woff") format("woff");
}
@font-face {
font-family: 'Inter UI';
font-style: italic;
font-weight: 900;
src: url("../fonts/Inter-UI-BlackItalic.woff2") format("woff2"),
url("../fonts/Inter-UI-BlackItalic.woff") format("woff");
}

View file

@ -12,13 +12,17 @@
margin-right: 5px;
}
&__text {
font-size: 1.125rem;
}
&__cursor {
display: inline-block;
width: 2px;
width: 10px;
height: 1rem;
background: #fe5186;
margin-left: 5px;
border-radius: 2px;
border-radius: 1px;
animation: cursor 1s infinite;
}
}

View file

@ -12,7 +12,7 @@ body {
margin: 0;
padding: 0;
font-family: 'Inter UI', -apple-system, BlinkMacSystemFont, "Roboto", "Segoe UI", Helvetica, Arial, sans-serif;
font-size: 18px;
font-size: 1rem;
line-height: 1.54;
background-color: var(--light-background);
color: var(--light-color);
@ -146,10 +146,10 @@ code {
}
pre {
background: #1a1a1d;
background: #212020;
padding: 20px;
border-radius: 8px;
font-size: 1rem;
font-size: .95rem;
overflow: auto;
@media (--phone) {
@ -163,6 +163,10 @@ pre {
margin: 0;
padding: 0;
font-size: inherit;
.dark-theme & {
color: inherit;
}
}
}

View file

@ -1,7 +1,7 @@
.menu {
background: #fafafa;
border-right: 1px solid;
margin-right: 10px;
margin-right: 18px;
.dark-theme & {
background: #252627;
@ -27,11 +27,7 @@
list-style: none;
li {
margin: 0 10px;
&:last-of-type {
margin-right: 0;
}
margin: 0 12px;
}
@media (--phone) {

View file

@ -1,6 +1,6 @@
.pagination {
margin-top: 50px;
&__title {
display: flex;
text-align: center;
@ -37,11 +37,60 @@
&__buttons {
display: flex;
justify-content: space-around;
align-items: center;
justify-content: center;
width: 1024px;
max-width: 100%;
a {
text-decoration: none;
font-weight: bold;
}
}
}
}
.button {
position: relative;
display: inline-flex;
align-items: center;
justify-content: center;
background: var(--light-background-secondary);
font-size: 1rem;
font-weight: 600;
border-radius: 8px;
max-width: 40%;
padding: 0;
cursor: pointer;
appearance: none;
.dark-theme & {
background: var(--dark-background-secondary);
}
+ .button {
margin-left: 10px;
}
a {
display: flex;
padding: 8px 16px;
text-decoration: none;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
}
&__text {
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
}
&.next .button__icon {
margin-left: 8px;
}
&.previous .button__icon {
margin-right: 8px;
}
}

View file

@ -38,7 +38,7 @@ pre[class*="language-"] {
:not(pre) > code[class*="language-"],
pre[class*="language-"] {
background: #1a1a1d !important;
background: #212020 !important;
border-radius: 8px;
}