Files
AstralRinth/assets/styles/injected.scss
Prospector 7b84d8c3d5 [WIP] Rework design (#34)
* WIP: Redesign the default layout

* Merge old & new default layouts

* Fix login logic; add proper user controls dropdown

* Fix latest version listing (#31) (#32)

Co-authored-by: Aeledfyr <45501007+Aeledfyr@users.noreply.github.com>

* First pass of design cleanup

* Improve ad integration and fix light theme

* Begin splitting up variables, change some styling to new mockup

* Continue redesign progress

* Work on some more pages

* Add missing dark theme variables for text

* Continue working on modularizing

* Continue progress, redo pagination

* Fix auth buttons in navbar layout

* Continue progress

* Continue progress more

* Redo ModResult

* Scope ModPage :irritater:

* Continue Dashboard

* Continue progress on Dashboard and cleanup

* Add missing variables for dark theme

* Small tweaks, cleanup, and continue mod page progress

* Fix user not being able to see hidden mods that they own

* Start reworking mod creation

* Continue revamp of mod creation page

* Yank v-html out

* Hotfix markdown rendering and some spacing issues

* Move legal; continue with mod creation; create reusable footer

* Create README.md

* Update README.md

* Update README.md

* Add in basic usage instructions

* Fix some stuff

* Continue with mod creation; fix some CSS errors

* Start user page

* Start transition to vue-select; fix a few bugs

* Continue mod creation page

* Finish mod pages

* Add very raw version editing

* Mod editing + creation

* Fixed versions that were in processing causing a 404 (#39)

Co-authored-by: Mikhail Oleynikov <falseresync@gmail.com>
Co-authored-by: Aeledfyr <45501007+Aeledfyr@users.noreply.github.com>
Co-authored-by: Jai A <jai.a@tuta.io>
Co-authored-by: MulverineX <mulverin3@gmail.com>
Co-authored-by: diabolical17 <calumproh28@gmail.com>
Co-authored-by: Geometrically <18202329+Geometrically@users.noreply.github.com>
2020-11-30 14:55:01 -07:00

88 lines
1.6 KiB
SCSS

%card {
background: var(--color-raised-bg);
border-radius: var(--size-rounded-card);
}
%card-spaced-b {
@extend %card;
margin-bottom: var(--spacing-card-md);
}
%row {
display: flex;
flex-direction: row;
}
%column {
display: flex;
flex-direction: column;
}
%transparent-clickable {
border-radius: var(--size-rounded-control);
color: var(--color-text);
background-color: transparent;
&:focus,
&:hover,
&.selected,
&.nuxt-link-exact-active {
color: var(--color-transparent-button-text-hover);
background-color: var(--color-transparent-button-bg-hover);
}
&:active {
color: var(--color-transparent-button-text-active);
background-color: var(--color-transparent-button-bg-active);
}
}
%label {
color: var(--color-text);
font-weight: var(--font-weight-extrabold);
letter-spacing: 0.02rem;
margin: 0;
margin-bottom: 0.25em;
text-transform: uppercase;
}
%small-label {
@extend %label;
color: var(--color-text);
font-size: var(--font-size-xs);
letter-spacing: 0.02rem;
}
%large-label {
@extend %label;
color: var(--color-text);
font-size: var(--font-size-sm);
margin-bottom: 0.5em;
}
%stat {
margin-top: 0.5rem;
margin-right: 1rem;
@extend %row;
@media screen and (min-width: 900px) {
margin-top: 0;
}
svg {
margin: auto 0.5rem auto 0;
height: 1.5rem;
width: 1.5rem;
color: var(--color-icon);
}
.info {
margin: auto 0;
white-space: nowrap;
h4 {
@extend %small-label;
}
.value {
font-size: var(--font-size-sm);
margin: 0;
color: var(--color-text-dark);
}
}
}