flashii/misuzu
flashii/misuzu
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

wow it sucks

Browse source
This commit is contained in:
flash 2018-09-10 00:44:10 +02:00
parent c32fdb4de6
commit c1d3a4672a
33 changed files with 116 additions and 99 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
assets/less/mio/classes/avatar.less
View file

@ -1,11 +1,11 @@
.avatar {
flex-shrink: 0;
background-color: #fbeeff;
background-color: var(--background-colour);
background-size: cover;
background-repeat: no-repeat;
background-position: center;
display: block;
border: 1px solid #9475b2;
border: 1px solid var(--accent-colour);
max-height: 200px;
max-width: 200px;
box-sizing: content-box;

2
assets/less/mio/classes/changelog-actions-tags.less
View file

@ -26,7 +26,7 @@
color: inherit;
text-decoration: none;
width: 200px;
border: 1px solid #9475b2;
border: 1px solid var(--accent-colour);
border-radius: 2px;
margin: 2px;
padding: 0 2px;

24
assets/less/mio/classes/changelog.less
View file

@ -9,7 +9,7 @@
margin-bottom: 1px;
@media (max-width: @site-mobile-width) {
border-bottom: 1px solid #9475b2;
border-bottom: 1px solid var(--accent-colour);
padding-bottom: 1px;
}
}
@ -29,8 +29,8 @@
// date header in public changelog
&__date {
display: block;
background: #9475b2;
color: #306;
background: var(--accent-colour);
color: var(--text-colour-header);
font-weight: 700;
margin-bottom: 1px;
text-decoration: none;
@ -92,7 +92,7 @@
}
&--light {
color: #fff;
color: var(--text-colour-inverted);
}
}
@ -124,7 +124,7 @@
}
&__tag {
border: 1px solid #9475b2;
border: 1px solid var(--accent-colour);
margin-right: 1px;
border-radius: 2px;
display: block;
@ -140,7 +140,7 @@
&__change {
&__line {
border: 1px solid #9475b2;
border: 1px solid var(--accent-colour);
display: flex;
align-items: stretch;
flex: 1 0 auto;
@ -168,7 +168,7 @@
&__action {
display: block;
padding: 6px 2px;
border-right: 1px solid #9475b2;
border-right: 1px solid var(--accent-colour);
writing-mode: sideways-lr;
text-orientation: sideways;
letter-spacing: 1px;
@ -176,7 +176,7 @@
flex: 0 0 auto;
&--light {
color: #fff;
color: var(--text-colour-inverted);
}
}
@ -193,7 +193,7 @@
}
&__date {
border: 1px solid #9475b2;
border: 1px solid var(--accent-colour);
color: inherit;
text-decoration: none;
margin-right: 1px;
@ -206,7 +206,7 @@
}
&__user {
border: 1px solid #9475b2;
border: 1px solid var(--accent-colour);
padding: 2px;
display: flex;
align-items: center;
@ -240,7 +240,7 @@
&__text {
margin: 1px 0;
padding: 1px 3px;
border-top: 1px solid #9475b2;
border-top: 1px solid var(--accent-colour);
font-size: 1.2em;
line-height: 1.5em;
flex: 1 1 auto;
@ -254,7 +254,7 @@
}
&__tag {
border: 1px solid #9475b2;
border: 1px solid var(--accent-colour);
margin-right: 1px;
border-radius: 2px;

2
assets/less/mio/classes/comments.less
View file

@ -11,7 +11,7 @@
&__input,
&__javascript,
&__notice--staff {
border-bottom: 1px solid #9475b2;
border-bottom: 1px solid var(--accent-colour);
padding-bottom: 1px;
margin-bottom: 1px;
}

10
assets/less/mio/classes/container.less
View file

@ -1,8 +1,8 @@
.container {
border: 1px solid #9475b2;
background-color: #fbeeff;
border: 1px solid var(--accent-colour);
background-color: var(--background-colour);
margin: 2px 0;
box-shadow: 0 1px 2px #9475b2;
box-shadow: 0 1px 2px var(--accent-colour);
&--hidden { // __title should always be the first element of a container
:not(:first-child) {
@ -13,8 +13,8 @@
&__title {
display: block;
text-decoration: none;
background-color: #9475b2;
color: #306;
background-color: var(--accent-colour);
color: var(--text-colour-header);
font-size: 1.17em;
font-weight: 700;
padding: 3px;

2
assets/less/mio/classes/footer.less
View file

@ -1,5 +1,5 @@
.footer {
background: linear-gradient(0deg, #c2affe, transparent) repeat-x;
background: linear-gradient(0deg, var(--gradient-start), transparent) repeat-x;
flex: 0 0 auto;
text-align: center;
font-size: .9em;

6
assets/less/mio/classes/forum/listing.less
View file

@ -13,7 +13,7 @@
min-height: 50px;
&:not(:last-child) {
border-bottom: 1px solid #9475b2;
border-bottom: 1px solid var(--accent-colour);
margin-bottom: 2px;
padding-bottom: 2px;
}
@ -36,7 +36,7 @@
&__title {
font-size: 1.2em;
line-height: 1.5em;
color: #306;
color: var(--text-colour-header);
&__link {
color: inherit;
@ -72,7 +72,7 @@
display: flex;
flex-shrink: 0;
flex-grow: 0;
border-left: 1px solid #9475b2;
border-left: 1px solid var(--accent-colour);
}
&__stats {

4
assets/less/mio/classes/forum/pagination.less
View file

@ -1,4 +1,4 @@
.forum__pagination {
box-shadow: 0 1px 2px #9475b2;
background-color: #fbeeff;
box-shadow: 0 1px 2px var(--accent-colour);
background-color: var(--background-colour);
}

14
assets/less/mio/classes/forum/post.less
View file

@ -1,8 +1,8 @@
.forum__post {
display: flex;
border: 1px solid #9475b2;
box-shadow: 0 1px 2px #9475b2;
background-color: #fbeeff;
border: 1px solid var(--accent-colour);
box-shadow: 0 1px 2px var(--accent-colour);
background-color: var(--background-colour);
margin: 2px 0;
@media (max-width: @site-mobile-width) {
@ -32,7 +32,7 @@
font-size: .9em;
line-height: 1.7em;
padding: 0 2px;
border-bottom: 1px solid #9475b2;
border-bottom: 1px solid var(--accent-colour);
display: flex;
justify-content: space-between;
@ -48,7 +48,7 @@
}
&__author {
border-right: 1px solid #9475b2;
border-right: 1px solid var(--accent-colour);
text-align: center;
flex-grow: 0;
flex-shrink: 0;
@ -59,7 +59,7 @@
@media (max-width: @site-mobile-width) {
border-right-width: 0;
border: 1px solid #9475b2;
border: 1px solid var(--accent-colour);
flex-direction: row;
border-bottom-width: 2px;
}
@ -93,7 +93,7 @@
&__avatar {
width: 120px;
height: 120px;
box-shadow: 0 1px 2px #9475b2;
box-shadow: 0 1px 2px var(--accent-colour);
@media (max-width: @site-mobile-width) {
width: 40px;

2
assets/less/mio/classes/forum/posting.less
View file

@ -11,7 +11,7 @@
color: #a00;
padding: 0 2px 1px;
margin-bottom: 2px;
border-bottom: 1px solid #9475b2;
border-bottom: 1px solid var(--accent-colour);
}
&__title {

6
assets/less/mio/classes/forum/topic.less
View file

@ -1,11 +1,11 @@
.forum__topic {
&__locked {
border: 1px solid #9475b2;
border: 1px solid var(--accent-colour);
display: flex;
align-items: center;
min-height: 40px;
margin-bottom: 2px;
box-shadow: 0 1px 2px #9475b2;
box-shadow: 0 1px 2px var(--accent-colour);
&__icon {
height: 40px;
@ -14,7 +14,7 @@
background-image: url('https://static.flash.moe/images/topic-icons/topic-locked-read.png');
background-position: center;
background-repeat: no-repeat;
background-color: #9475b2;
background-color: var(--accent-colour);
flex-grow: 0;
flex-shrink: 0;
}

4
assets/less/mio/classes/forum/topics.less
View file

@ -15,7 +15,7 @@
&:not(:first-child) {
margin-top: 1px;
padding-top: 1px;
border-top: 1px solid #9475b2;
border-top: 1px solid var(--accent-colour);
}
&__icon {
@ -40,7 +40,7 @@
display: flex;
flex-shrink: 0;
flex-grow: 0;
border-left: 1px solid #9475b2;
border-left: 1px solid var(--accent-colour);
}
&__info,

18
assets/less/mio/classes/header.less
View file

@ -1,6 +1,6 @@
.header {
flex: 0 0 auto;
background: linear-gradient(0deg, transparent, #c2affe) repeat-x;
background: linear-gradient(0deg, transparent, var(--gradient-start)) repeat-x;
&__wrapper {
margin: 0 auto;
@ -82,10 +82,10 @@
@media (max-width: @site-mobile-width) {
width: 100%;
background: #c2affe;
background: var(--gradient-start);
&__item:not(:last-child) {
border-bottom: 1px solid #9475b2;
border-bottom: 1px solid var(--accent-colour);
}
&__link {
@ -103,7 +103,7 @@
transition: background-color .2s;
&:hover {
background-color: #c2affe;
background-color: var(--gradient-start);
.header__submenu {
transform: scaleY(1);
@ -141,11 +141,11 @@
position: absolute; // floating
transform: scaleY(0);
transform-origin: center top 0;
background: #c2affe;
background: var(--gradient-start);
overflow: hidden;
z-index: 100;
text-align: left;
box-shadow: 0 1px 2px #9475b2;
box-shadow: 0 1px 2px var(--accent-colour);
transition: transform .2s;
&:hover {
@ -175,7 +175,7 @@
@media (max-width: @site-mobile-width) {
display: none;
width: 100%;
background: #c2affe;
background: var(--gradient-start);
font-size: 1.1em;
&-toggle:checked ~ .header__user {
@ -231,7 +231,7 @@
max-width: 100%;
font-size: 1.6em;
line-height: 1.5em;
border-bottom: 1px solid #9475b2;
border-bottom: 1px solid var(--accent-colour);
padding: 4px 8px;
text-align: left;
}
@ -262,7 +262,7 @@
padding: 0;
&:not(:last-child) {
border-bottom: 1px solid #9475b2;
border-bottom: 1px solid var(--accent-colour);
}
}
}

12
assets/less/mio/classes/input/button.less
View file

@ -1,6 +1,6 @@
.input__button {
background-image: linear-gradient(0deg, transparent, #c2affe);
background-color: #9475b2;
background-image: linear-gradient(0deg, transparent, var(--gradient-start));
background-color: var(--accent-colour);
font-family: @mio-font-regular;
font-size: 1.1em;
line-height: 1.4em;
@ -9,8 +9,8 @@
text-align: center;
cursor: pointer;
transition: background-color .2s, box-shadow .2s;
color: #306;
border: 1px solid #306;
color: var(--text-colour-header);
border: 1px solid var(--text-colour-header);
border-radius: 2px;
display: inline-block;
text-decoration: none;
@ -23,7 +23,7 @@
&:not(&--disabled) {
&:focus {
box-shadow: inset 0 0 2px 0 #306;
box-shadow: inset 0 0 2px 0 var(--text-colour-header);
}
&:hover {
@ -31,7 +31,7 @@
}
&:active {
background-color: #c2affe;
background-color: var(--gradient-start);
}
}
}

2
assets/less/mio/classes/input/select.less
View file

@ -7,6 +7,6 @@
min-width: 150px;
&:focus {
border-color: #9475b2;
border-color: var(--accent-colour);
}
}

2
assets/less/mio/classes/input/text.less
View file

@ -5,7 +5,7 @@
color: #111;
&:focus {
border-color: #9475b2;
border-color: var(--accent-colour);
}
&--readonly {

2
assets/less/mio/classes/input/textarea.less
View file

@ -6,6 +6,6 @@
color: #111;
&:focus {
border-color: #9475b2;
border-color: var(--accent-colour);
}
}

14
assets/less/mio/classes/navigation.less
View file

@ -5,7 +5,7 @@
width: 100%;
display: flex;
border-width: 0;
border-color: #000;
border-color: var(--text-colour);
border-style: solid;
border-top-width: 1px;
align-items: flex-start;
@ -49,12 +49,12 @@
&__option {
list-style: none;
background-color: #c9bbcc;
border: 1px solid #000;
border: 1px solid var(--text-colour);
border-top-width: 0;
flex-grow: 0;
@media (max-width: @mio-navigation-mobile) {
background-color: #9475b2;
background-color: var(--accent-colour);
width: 100%;
border: none;
flex-grow: 1;
@ -66,11 +66,11 @@
}
&--selected {
background-color: #fbeeff;
background-color: var(--background-colour);
top: -1px;
@media (max-width: @mio-navigation-mobile) {
background-color: #A586c3;
background-color: #a586c3;
top: 0;
}
@ -90,12 +90,12 @@
&__link {
display: block;
padding: 2px 1em;
color: #000;
color: var(--text-colour);
text-decoration: none;
@media (max-width: @mio-navigation-mobile) {
padding: 10px 15px;
color: #306;
color: var(--text-colour-header);
font-size: 1.5em;
}

2
assets/less/mio/classes/news/post.less
View file

@ -23,7 +23,7 @@
}
&__detail {
border: 1px solid #9475b2;
border: 1px solid var(--accent-colour);
padding: 1px;
&:not(:last-child) {

2
assets/less/mio/classes/news/preview.less
View file

@ -24,7 +24,7 @@
&__info {
display: flex;
justify-content: space-between;
border-top: 1px solid #9475b2;
border-top: 1px solid var(--accent-colour);
font-size: .9em;
padding: 0 2px;
margin-top: 1px;

10
assets/less/mio/classes/pagination.less
View file

@ -2,12 +2,12 @@
list-style: none;
display: flex;
padding: 1px;
border: 1px solid #9475b2;
border: 1px solid var(--accent-colour);
&__wrapper {
background-color: #fbeeff;
background-color: var(--background-colour);
margin: 2px 0;
box-shadow: 0 1px 2px #9475b2;
box-shadow: 0 1px 2px var(--accent-colour);
}
&__separator {
@ -16,8 +16,8 @@
}
&__option {
background: #9475b2;
color: #306;
background: var(--accent-colour);
color: var(--text-colour-header);
height: 20px;
min-width: 20px;

4
assets/less/mio/classes/permissions.less
View file

@ -11,7 +11,7 @@
&--header {
font-size: 1.2em;
line-height: 1.4em;
border-bottom: 1px solid #9475b2;
border-bottom: 1px solid var(--accent-colour);
padding-bottom: 1px;
font-family: @mio-font-heading;
@ -57,7 +57,7 @@
&--radio {
cursor: pointer;
border-left: 1px solid #9475b2;
border-left: 1px solid var(--accent-colour);
}
&--yes {

8
assets/less/mio/classes/profile.less
View file

@ -25,7 +25,7 @@
&__header {
height: 300px;
background-color: #fbeeff;
background-color: var(--background-colour);
background-size: cover;
background-repeat: no-repeat;
background-position: 50%;
@ -55,7 +55,7 @@
@media (max-width: @site-mobile-width) {
flex-direction: column;
background-color: #9475b2;
background-color: var(--accent-colour);
width: 100%;
padding-top: 2px;
}
@ -69,13 +69,13 @@
}
&__block {
border: 1px solid #9475b2;
border: 1px solid var(--accent-colour);
padding: 2px 4px;
margin-bottom: 2px;
background-color: rgba(251, 238, 255, .9);
@media (max-width: @site-mobile-width) {
background-color: #fbeeff;
background-color: var(--background-colour);
}
&--links:empty {

6
assets/less/mio/classes/settings/account.less
View file

@ -32,7 +32,7 @@
&:not(.settings__account__column--no-margin) {
margin: 1px;
border: 1px solid #9475b2;
border: 1px solid var(--accent-colour);
border-top-width: 0;
}
@ -44,8 +44,8 @@
}
&__title {
background-color: #9475b2;
color: #306;
background-color: var(--accent-colour);
color: var(--text-colour-header);
font-size: 1.1em;
font-weight: 700;
padding: 3px;

10
assets/less/mio/classes/settings/avatar.less
View file

@ -24,12 +24,12 @@
}
&__name {
background-color: #9475b2;
color: #306;
background-color: var(--accent-colour);
color: var(--text-colour-header);
text-overflow: ellipsis;
overflow: hidden;
padding: 0 4px;
border-bottom: 1px solid #306;
border-bottom: 1px solid var(--text-colour-header);
}
&__buttons {
@ -42,8 +42,8 @@
padding: 5px;
cursor: pointer;
font-family: inherit;
background-color: #9475b2;
color: #306;
background-color: var(--accent-colour);
color: var(--text-colour-header);
font-weight: 700;
border-radius: 0;

2
assets/less/mio/classes/settings/description.less
View file

@ -1,6 +1,6 @@
.settings__description {
font-size: .9em;
padding: 1px 4px;
border-bottom: 1px solid #9475b2;
border-bottom: 1px solid var(--accent-colour);
margin-bottom: 1px;
}

2
assets/less/mio/classes/settings/images.less
View file

@ -16,7 +16,7 @@
&__requirements {
text-align: left;
display: inline-block;
border: 3px double #9475b2;
border: 3px double var(--accent-colour);
padding: .5em 2em;
&__list {

2
assets/less/mio/classes/settings/log.less
View file

@ -7,7 +7,7 @@
&__entry {
display: flex;
border: 1px solid #9475b2;
border: 1px solid var(--accent-colour);
justify-content: space-between;
padding: 1px;
flex-wrap: wrap;

2
assets/less/mio/classes/settings/login-history.less
View file

@ -7,7 +7,7 @@
&__entry {
display: flex;
border: 1px solid #9475b2;
border: 1px solid var(--accent-colour);
justify-content: space-between;
padding: 1px;
flex-wrap: wrap;

4
assets/less/mio/classes/settings/sessions.less
View file

@ -18,13 +18,13 @@
display: flex;
justify-content: center;
padding: 6px;
border-bottom: 1px solid #9475b2;
border-bottom: 1px solid var(--accent-colour);
margin-bottom: 1px;
}
&__entry {
display: flex;
border: 1px solid #9475b2;
border: 1px solid var(--accent-colour);
justify-content: space-between;
padding: 1px;
flex-wrap: wrap;

2
assets/less/mio/classes/side-navigation.less
View file

@ -21,7 +21,7 @@
}
&__title {
color: #306;
color: var(--text-colour-header);
font-family: @mio-font-heading;
display: block;
font-weight: 700;

8
assets/less/mio/classes/usercard.less
View file

@ -1,5 +1,5 @@
.usercard {
box-shadow: 0 1px 2px #9475b2;
box-shadow: 0 1px 2px var(--accent-colour);
width: 300px;
height: 70px;
transition: box-shadow .5s;
@ -7,7 +7,7 @@
color: #fff;
&:hover {
box-shadow: 0 1px 1em #9475b2;
box-shadow: 0 1px 1em var(--accent-colour);
z-index: 2;
}
@ -17,7 +17,7 @@
top: 0;
height: 100%;
width: 100%;
background-color: #9475b2;
background-color: var(--accent-colour);
background-size: cover;
background-repeat: no-repeat;
background-position: center;
@ -27,7 +27,7 @@
padding: 4px;
height: 100%;
width: 100%;
//border: 1px solid #9475b2;
//border: 1px solid var(--accent-colour);
pointer-events: none;
display: flex;
background-color: rgba(0, 0, 0, .7);

21
assets/less/mio/main.less
View file

@ -3,8 +3,23 @@
@site-max-width: 1200px;
@site-mobile-width: 800px;
@default-accent-colour: #9475b2;
@default-background-colour: #fbeeff;
@default-text-colour: #000;
@default-header-text-colour: #306;
@default-gradient-start: #c2affe;
:root {
--site-max-width: @site-max-width;
--site-background-meta: initial;
--site-background-image: initial;
--accent-colour: @default-accent-colour;
--text-colour: @default-text-colour;
--text-colour-inverted: color(#fff - @default-text-colour);
--text-colour-header: @default-header-text-colour;
--background-colour: @default-background-colour;
--gradient-start: @default-gradient-start;
}
* {
@ -24,9 +39,11 @@ body {
.main {
display: flex;
flex-direction: column;
background-color: #fbeeff;
background: var(--site-background-meta);
background-image: var(--site-background-image);
background-color: var(--background-colour);
font: 12px/20px @mio-font-regular;
color: #000;
color: var(--text-colour);
&__wrapper {
max-width: var(--site-max-width);