154 lines
3.4 KiB
Text
154 lines
3.4 KiB
Text
@mio-font-regular: Tahoma, Geneva, 'Dejavu Sans', Arial, Helvetica, sans-serif;
|
|
@mio-font-mono: Consolas, 'Liberation Mono', Menlo, Courier, monospace;
|
|
@site-mobile-width: 800px;
|
|
@font-size: 12px;
|
|
@line-height: 20px;
|
|
|
|
:root {
|
|
--site-max-width: 1200px;
|
|
--site-logo: url('/images/logos/imouto-default.png');
|
|
|
|
--header-height-desktop: 70px;
|
|
--header-height-mobile: 50px;
|
|
|
|
--background-image: initial;
|
|
|
|
@background-colour: #111;
|
|
--background-colour: @background-colour;
|
|
--background-colour-translucent-1: fade(@background-colour, 10%);
|
|
--background-colour-translucent-2: fade(@background-colour, 20%);
|
|
--background-colour-translucent-3: fade(@background-colour, 30%);
|
|
--background-colour-translucent-4: fade(@background-colour, 40%);
|
|
--background-colour-translucent-5: fade(@background-colour, 50%);
|
|
--background-colour-translucent-6: fade(@background-colour, 60%);
|
|
--background-colour-translucent-7: fade(@background-colour, 70%);
|
|
--background-colour-translucent-8: fade(@background-colour, 80%);
|
|
--background-colour-translucent-9: fade(@background-colour, 90%);
|
|
--background-colour-translucent: var(--background-colour-translucent-9); // switch to the numbered ones
|
|
--background-pattern: url('/images/clouds.png') fixed;
|
|
|
|
--text-colour: #fff;
|
|
--text-colour-inverted: #000;
|
|
|
|
--user-colour: inherit;
|
|
--user-header: url('/images/pixel.png');
|
|
--accent-colour: #8559a5;
|
|
--header-accent-colour: var(--accent-colour);
|
|
}
|
|
|
|
* {
|
|
margin: 0;
|
|
padding: 0;
|
|
box-sizing: border-box;
|
|
position: relative;
|
|
outline-style: none;
|
|
}
|
|
|
|
html,
|
|
body {
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
|
|
html {
|
|
scrollbar-color: var(--accent-colour) var(--background-colour);
|
|
}
|
|
|
|
.main {
|
|
display: flex;
|
|
flex-direction: column;
|
|
background-image: var(--background-image);
|
|
background-color: var(--background-colour);
|
|
font: @font-size/@line-height @mio-font-regular;
|
|
color: var(--text-colour);
|
|
background-attachment: fixed;
|
|
background-position: center center;
|
|
|
|
&__wrapper {
|
|
max-width: var(--site-max-width);
|
|
width: 100%;
|
|
margin: 0 auto;
|
|
flex: 1 0 auto;
|
|
}
|
|
|
|
&--bg-blend {
|
|
background-color: var(--accent-colour);
|
|
background-blend-mode: multiply;
|
|
}
|
|
|
|
&--bg-slide {
|
|
animation: background-slide infinite linear 2s;
|
|
}
|
|
|
|
&--bg-cover {
|
|
background-size: cover;
|
|
}
|
|
|
|
&--bg-contain {
|
|
background-size: contain;
|
|
}
|
|
|
|
&--bg-stretch {
|
|
background-size: 100% 100%;
|
|
}
|
|
|
|
&--bg-tile {
|
|
background-size: auto;
|
|
}
|
|
}
|
|
|
|
// Misc
|
|
@import "animations";
|
|
@import "link";
|
|
@import "markdown";
|
|
|
|
// Input elements
|
|
@import "input/input";
|
|
|
|
// Base styles
|
|
@import "avatar";
|
|
@import "container";
|
|
@import "flag";
|
|
@import "navigation";
|
|
@import "pagination";
|
|
@import "warning";
|
|
@import "messagebox";
|
|
|
|
// Specific styles
|
|
@import "header";
|
|
@import "footer";
|
|
@import "permissions";
|
|
|
|
// Main page styling
|
|
@import "home";
|
|
@import "landing";
|
|
|
|
// Auth
|
|
@import "auth/auth";
|
|
|
|
// Manage
|
|
@import "manage/manage";
|
|
|
|
// Profile
|
|
@import "profile/profile";
|
|
|
|
// Changelog
|
|
@import "changelog/changelog";
|
|
@import "changelog-actions-tags"; // move this into something in the manage dir
|
|
|
|
// Settings
|
|
@import "settings/settings";
|
|
|
|
// News
|
|
@import "news/news";
|
|
|
|
// Forums
|
|
@import "forum/forum";
|
|
|
|
// User stuff
|
|
@import "usercard";
|
|
@import "userlist";
|
|
|
|
// Comments
|
|
@import "comment"; // entries
|
|
@import "comments"; // listing
|