Files
remanso/src/styles/app.scss
2023-07-01 23:08:53 +02:00

115 lines
2.0 KiB
SCSS

@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Courier+Prime&family=Courgette&family=IBM+Plex+Serif&family=Kiwi+Maru&family=Maven+Pro&family=Noto+Sans+KR&family=Tajawal&family=Domine&family=Amiri&display=swap');
/**
font-family: 'Courgette', cursive;
font-family: 'IBM Plex Serif', serif;
font-family: 'Kiwi Maru', serif;
font-family: 'Maven Pro', sans-serif;
font-family: 'Noto Sans KR', sans-serif;
font-family: 'Tajawal', sans-serif;
font-family: 'Domine', serif;
font-family: 'Amiri', serif;
font-family: 'Courier Prime', serif;
*/
$primary: #2c3a47;
$link: #44b9a0;
$light-link: lighten($link, 45%);
$family-primary: 'Courier Prime', monospace;
:root {
--font-family: var(#{$family-primary});
--font-color: #4a4a4a;
--light-link: #{$light-link};
--background-color: #ffffff;
--note-width: 620px;
}
@import '../../node_modules/bulma/bulma.sass';
html {
overflow-y: auto;
overflow-x: auto;
}
body {
height: 100vh;
scroll-behavior: smooth;
overflow-y: auto;
font-size: 1.2em;
}
@media screen and (min-width: 769px) {
html,
body {
overflow-y: hidden;
}
}
.columns {
margin-left: 0;
margin-right: 0;
margin-top: 0;
&:last-child {
margin-bottom: 0;
}
}
#app {
height: 100vh;
display: flex;
}
a {
&:hover {
color: darken($link, 20);
}
&.external-link {
text-decoration: underline;
&::after {
margin-left: 0.2rem;
vertical-align: text-top;
content: url('assets/icons/external-link.svg');
}
}
}
.notif-success {
background-color: $link;
}
.repo-note {
font-family: var(--font-family);
color: var(--font-color);
background-color: var(--background-color);
transition-property: color, background-color;
transition: cubic-bezier(0.39, 0.575, 0.565, 1) 0.2s;
}
@media print {
html,
body {
overflow-y: auto;
height: auto;
}
#app {
height: auto;
}
}
pre {
code {
margin-right: 3rem;
}
}
code {
font-family: var(--font-family);
}