eightequal/AstralRinth
1
0
Fork 0
forked from didirus/AstralRinth
Code Pull Requests Activity

Versatile auth URLs & many UI fixes (#199)

Browse Source 
* Make project cards right-align their last element

Spaces out elements in a `.project-card` using `justify-content: space-between;`.

Fixes modrinth/knossos#170

* Automatically set URL for auth redirect

* Make login button use base url or current origin

Allows the login button to work in dev environment

* Remove Axios base URL trailing slash

* Update authUrl() on dashboard to match default

* Remove 'code' query from URL on page load
Allow non-exact paths to highlight mod & dashboard tabs

Fixes modrinth/knossos#200

* Make page 5 button visible on page 4 (pagination)

Fixes modrinth/knossos#184

* Color links on legal pages

Fixes modrinth/knossos#166

* Set max notifications to 5 and ignore duplicates

Fixes modrinth/knossos#175

* Add space above report button when no user desc

Fixes modrinth/knossos#143

* Better text spacing from edge of mobile screen

Fixes modrinth/knossos#179

* Fix slanted bars in modrinth/knossos#57

* Fix checkbox grid and role label

Fixes modrinth/knossos#191

* Move mod 'settings' button to the far right

Fixes modrinth/knossos#138

* Abbreviate minutes to min. when time is too long

Not a perfect solution imo, but works for now

Fixes modrinth/knossos#193

* Fix mobile header margins & add breakpoints

Fixes modrinth/knossos#203

* Clean up nuxt config
Silence babel warning & styleResources

* Upgrade sass-loader to 10.1.1 and remove warning

* Remove added horizontal footer padding

https://github.com/modrinth/knossos/pull/199#discussion_r629011624

* Improve mobile header fix

* Fix up minor inconsistencies in mod header

* Remove hard coded date

* Cleans up pagination to be more intuitive

* Fixes member invite input on moble

* Fix login button when searching mods

* Improved mobile mod search

Consistently sized pagination buttons

Breakpoint for sort buttons on smaller screens

* Consistent link style on text-only pages

* Better 4k support

* Slightly better mobile project-card support

Shuffles categories under mod icon when there is room

* Animate homepage typewriter effect backwards

* Tiny commit to align mod icons in mod headers

* Make processing status include 'Under Review'

This can be later updated once the backend has a separate status

* Create vercel.json

* Update domain auto detection

* Test vercel NODE_ENV

* Remove console.log for debugging hosting services

* Make mobile first + fix shrinked text circle size

* Optimize SVG

* Change media queries to be more mobile first

* Remove `|| window.location.origin`

* re-deploy vercel

* Change "Processing" message to "Under review"
This commit is contained in:
venashial
2021-05-27 09:27:13 -07:00
committed by GitHub
parent b224f1d78d
commit 4d64df37f5
20 changed files with 397 additions and 100 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
assets/images/utils/settings.svg Normal file
View File

@@ -0,0 +1,6 @@
<svg width="24" height="24" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"
stroke-width="2" viewBox="0 0 24 24">
<circle cx="12" cy="12" r="3" />
<path
d="M19.4 15a1.65 1.65 0 00.33 1.82l.06.06a2 2 0 010 2.83 2 2 0 01-2.83 0l-.06-.06a1.65 1.65 0 00-1.82-.33 1.65 1.65 0 00-1 1.51V21a2 2 0 01-2 2 2 2 0 01-2-2v-.09A1.65 1.65 0 009 19.4a1.65 1.65 0 00-1.82.33l-.06.06a2 2 0 01-2.83 0 2 2 0 010-2.83l.06-.06a1.65 1.65 0 00.33-1.82 1.65 1.65 0 00-1.51-1H3a2 2 0 01-2-2 2 2 0 012-2h.09A1.65 1.65 0 004.6 9a1.65 1.65 0 00-.33-1.82l-.06-.06a2 2 0 010-2.83 2 2 0 012.83 0l.06.06a1.65 1.65 0 001.82.33H9a1.65 1.65 0 001-1.51V3a2 2 0 012-2 2 2 0 012 2v.09a1.65 1.65 0 001 1.51 1.65 1.65 0 001.82-.33l.06-.06a2 2 0 012.83 0 2 2 0 010 2.83l-.06.06a1.65 1.65 0 00-.33 1.82V9a1.65 1.65 0 001.51 1H21a2 2 0 012 2 2 2 0 01-2 2h-.09a1.65 1.65 0 00-1.51 1z" />
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 888 B

37
assets/styles/components.scss
View File

@@ -82,7 +82,8 @@
word-wrap: break-word;
}
h1, h2 {
h1,
h2 {
padding: 10px 0 5px;
border-bottom: 1px solid var(--color-header-underline);
}
@@ -91,7 +92,7 @@
margin: 15px 0;
padding: 0 1em;
color: var(--color-text);
border-left: .25em solid var(--color-block-quote);
border-left: 0.25em solid var(--color-block-quote);
}
a {
@@ -152,7 +153,7 @@
z-index: 1;
}
&[x-placement^="top"] {
&[x-placement^='top'] {
margin-bottom: 5px;
.tooltip-arrow {
@@ -167,7 +168,7 @@
}
}
&[x-placement^="bottom"] {
&[x-placement^='bottom'] {
margin-top: 5px;
.tooltip-arrow {
@@ -182,7 +183,7 @@
}
}
&[x-placement^="right"] {
&[x-placement^='right'] {
margin-left: 5px;
.tooltip-arrow {
@@ -197,7 +198,7 @@
}
}
&[x-placement^="left"] {
&[x-placement^='left'] {
margin-right: 5px;
.tooltip-arrow {
@@ -215,13 +216,13 @@
&[aria-hidden='true'] {
visibility: hidden;
opacity: 0;
transition: opacity .15s, visibility .15s;
transition: opacity 0.15s, visibility 0.15s;
}
&[aria-hidden='false'] {
visibility: visible;
opacity: 1;
transition: opacity .15s;
transition: opacity 0.15s;
}
}
@@ -247,7 +248,7 @@
svg {
width: 1rem;
height: 1rem;
margin-right: 0.3rem;
margin-right: 0.4rem;
}
&:hover,
@@ -259,7 +260,8 @@
}
}
&.nuxt-link-exact-active {
&.nuxt-link-exact-active,
&.active-path {
color: var(--color-text-dark);
span {
@@ -293,7 +295,8 @@
flex-shrink: 0;
}
&.nuxt-link-exact-active {
&.nuxt-link-exact-active,
&.active-path {
svg {
color: var(--color-brand-light);
}
@@ -418,7 +421,6 @@
background: var(--color-button-bg-hover);
}
}
}
.section-header {
@@ -488,11 +490,8 @@ label {
&:focus {
outline: 0;
}
}
.stylized-toggle {
height: 32px;
width: 52px;
@@ -501,7 +500,7 @@ label {
position: relative;
margin: 0;
border: 2px solid var(--color-button-bg);
transition: all .2s ease;
transition: all 0.2s ease;
background: var(--color-button-bg);
&:after {
@@ -513,8 +512,8 @@ label {
height: 24px;
border-radius: 50%;
background: white;
box-shadow: 0 1px 2px rgba(44,44,44,.2);
transition: all .2s cubic-bezier(.5,.1,.75,1.35);
box-shadow: 0 1px 2px rgba(44, 44, 44, 0.2);
transition: all 0.2s cubic-bezier(0.5, 0.1, 0.75, 1.35);
}
&:checked {
background: var(--color-brand);
@@ -527,7 +526,7 @@ label {
background: var(--color-button-bg);
border: 2px solid var(--color-button-bg);
}
&:hover:checked &:focus:checked {
&:hover:checked &:focus:checked {
background: var(--color-brand);
border: 2px solid var(--color-brand);
}

3
assets/styles/injected.scss
View File

@@ -25,7 +25,8 @@
&:focus,
&:hover,
&.selected,
&.nuxt-link-exact-active {
&.nuxt-link-exact-active,
&.active-path {
color: var(--color-transparent-button-text-hover);
background-color: var(--color-transparent-button-bg-hover);
}