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 { .avatar {
flex-shrink: 0; flex-shrink: 0;
background-color: #fbeeff; background-color: var(--background-colour);
background-size: cover; background-size: cover;
background-repeat: no-repeat; background-repeat: no-repeat;
background-position: center; background-position: center;
display: block; display: block;
border: 1px solid #9475b2; border: 1px solid var(--accent-colour);
max-height: 200px; max-height: 200px;
max-width: 200px; max-width: 200px;
box-sizing: content-box; box-sizing: content-box;

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

@ -1,6 +1,6 @@
.header { .header {
flex: 0 0 auto; flex: 0 0 auto;
background: linear-gradient(0deg, transparent, #c2affe) repeat-x; background: linear-gradient(0deg, transparent, var(--gradient-start)) repeat-x;
&__wrapper { &__wrapper {
margin: 0 auto; margin: 0 auto;
@ -82,10 +82,10 @@
@media (max-width: @site-mobile-width) { @media (max-width: @site-mobile-width) {
width: 100%; width: 100%;
background: #c2affe; background: var(--gradient-start);
&__item:not(:last-child) { &__item:not(:last-child) {
border-bottom: 1px solid #9475b2; border-bottom: 1px solid var(--accent-colour);
} }
&__link { &__link {
@ -103,7 +103,7 @@
transition: background-color .2s; transition: background-color .2s;
&:hover { &:hover {
background-color: #c2affe; background-color: var(--gradient-start);
.header__submenu { .header__submenu {
transform: scaleY(1); transform: scaleY(1);
@ -141,11 +141,11 @@
position: absolute; // floating position: absolute; // floating
transform: scaleY(0); transform: scaleY(0);
transform-origin: center top 0; transform-origin: center top 0;
background: #c2affe; background: var(--gradient-start);
overflow: hidden; overflow: hidden;
z-index: 100; z-index: 100;
text-align: left; text-align: left;
box-shadow: 0 1px 2px #9475b2; box-shadow: 0 1px 2px var(--accent-colour);
transition: transform .2s; transition: transform .2s;
&:hover { &:hover {
@ -175,7 +175,7 @@
@media (max-width: @site-mobile-width) { @media (max-width: @site-mobile-width) {
display: none; display: none;
width: 100%; width: 100%;
background: #c2affe; background: var(--gradient-start);
font-size: 1.1em; font-size: 1.1em;
&-toggle:checked ~ .header__user { &-toggle:checked ~ .header__user {
@ -231,7 +231,7 @@
max-width: 100%; max-width: 100%;
font-size: 1.6em; font-size: 1.6em;
line-height: 1.5em; line-height: 1.5em;
border-bottom: 1px solid #9475b2; border-bottom: 1px solid var(--accent-colour);
padding: 4px 8px; padding: 4px 8px;
text-align: left; text-align: left;
} }
@ -262,7 +262,7 @@
padding: 0; padding: 0;
&:not(:last-child) { &: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 { .input__button {
background-image: linear-gradient(0deg, transparent, #c2affe); background-image: linear-gradient(0deg, transparent, var(--gradient-start));
background-color: #9475b2; background-color: var(--accent-colour);
font-family: @mio-font-regular; font-family: @mio-font-regular;
font-size: 1.1em; font-size: 1.1em;
line-height: 1.4em; line-height: 1.4em;
@ -9,8 +9,8 @@
text-align: center; text-align: center;
cursor: pointer; cursor: pointer;
transition: background-color .2s, box-shadow .2s; transition: background-color .2s, box-shadow .2s;
color: #306; color: var(--text-colour-header);
border: 1px solid #306; border: 1px solid var(--text-colour-header);
border-radius: 2px; border-radius: 2px;
display: inline-block; display: inline-block;
text-decoration: none; text-decoration: none;
@ -23,7 +23,7 @@
&:not(&--disabled) { &:not(&--disabled) {
&:focus { &:focus {
box-shadow: inset 0 0 2px 0 #306; box-shadow: inset 0 0 2px 0 var(--text-colour-header);
} }
&:hover { &:hover {
@ -31,7 +31,7 @@
} }
&:active { &: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; min-width: 150px;
&:focus { &: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; color: #111;
&:focus { &:focus {
border-color: #9475b2; border-color: var(--accent-colour);
} }
&--readonly { &--readonly {

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

@ -3,8 +3,23 @@
@site-max-width: 1200px; @site-max-width: 1200px;
@site-mobile-width: 800px; @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 { :root {
--site-max-width: @site-max-width; --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 { .main {
display: flex; display: flex;
flex-direction: column; 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; font: 12px/20px @mio-font-regular;
color: #000; color: var(--text-colour);
&__wrapper { &__wrapper {
max-width: var(--site-max-width); max-width: var(--site-max-width);