jaculabilis/danbooru
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

artists: make artist pages less shit.

Browse Source 
* Group URLs by site.
* List most important URLs first and dead URLs last.
* Add site icons next to URLs.
* Put other names and group name beneath the artist name, instead of beneath the wiki.
This commit is contained in:
evazion
2022-02-08 20:04:51 -06:00
parent 51ba56e8a3
commit 7bbe6e9d22
9 changed files with 106 additions and 73 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
app/javascript/src/styles/base/030_links.scss
View File

@@ -1,23 +1,20 @@
@import "./000_vars";
a:link {
a {
color: var(--link-color);
text-decoration: none;
}
a:visited {
color: var(--link-color);
text-decoration: none;
}
a:hover {
color: var(--link-hover-color);
text-decoration: none;
}
a:active {
color: var(--link-color);
text-decoration: none;
}
a.active {

10
app/javascript/src/styles/base/040_colors.css
View File

@@ -310,6 +310,11 @@ html {
--related-tags-container-background: var(--grey-0);
--selected-related-tag-background-color: var(--link-color);
--selected-related-tag-color: var(--inverse-text-color);
--inactive-artist-url-color: var(--red-6);
--inactive-artist-url-hover-color: var(--red-5);
--banned-artist-label-color: var(--red-5);
--deleted-artist-label-color: var(--grey-6);
}
/* variables that aren't defined in the dark theme fall back to the :root theme */
@@ -506,4 +511,9 @@ body[data-current-user-theme="dark"] {
--related-tags-container-background: var(--grey-8);
--selected-related-tag-background-color: var(--link-color);
--selected-related-tag-color: var(--inverse-text-color);
--inactive-artist-url-color: var(--red-4);
--inactive-artist-url-hover-color: var(--red-3);
--banned-artist-label-color: var(--red-5);
--deleted-artist-label-color: var(--grey-6);
}

11
app/javascript/src/styles/common/utilities.scss
View File

@@ -28,6 +28,12 @@ $spacer: 0.25rem; /* 4px */
.text-xxs { font-size: var(--text-xxs); }
.text-xs { font-size: var(--text-xs); }
.text-sm { font-size: var(--text-sm); }
.text-lg { font-size: var(--text-lg); }
.text-xl { font-size: var(--text-xl); }
.text-xxl { font-size: var(--text-xxl); }
.underline { text-decoration-line: underline; }
.decoration-dotted { text-decoration-style: dotted; }
.truncate {
overflow: hidden;
@@ -90,9 +96,13 @@ $spacer: 0.25rem; /* 4px */
.p-1 { padding: 1 * $spacer; }
.p-4 { padding: 4 * $spacer; }
.px-1 { padding-left: 1 * $spacer; padding-right: 1 * $spacer; }
.px-2 { padding-left: 2 * $spacer; padding-right: 2 * $spacer; }
.px-4 { padding-left: 4 * $spacer; padding-right: 4 * $spacer; }
.px-8 { padding-left: 8 * $spacer; padding-right: 8 * $spacer; }
.py-1 { padding-top: 1 * $spacer; padding-bottom: 1 * $spacer; }
.py-2 { padding-top: 2 * $spacer; padding-bottom: 2 * $spacer; }
.py-4 { padding-top: 4 * $spacer; padding-bottom: 4 * $spacer; }
.py-8 { padding-top: 8 * $spacer; padding-bottom: 8 * $spacer; }
@@ -113,6 +123,7 @@ $spacer: 0.25rem; /* 4px */
.h-auto { height: auto; }
.h-1 { height: 1 * $spacer; }
.h-3 { height: 3 * $spacer; }
.h-4 { height: 4 * $spacer; }
.h-8 { height: 8 * $spacer; }
.h-10 { height: 10 * $spacer; }
.h-12 { height: 12 * $spacer; }

19
app/javascript/src/styles/specific/artists.scss Normal file
View File

@@ -0,0 +1,19 @@
.inactive-artist-url {
&:link, &:visited {
color: var(--inactive-artist-url-color);
}
&:hover {
color: var(--inactive-artist-url-hover-color);
}
}
.banned-artist-label {
background-color: var(--banned-artist-label-color);
color: var(--inverse-text-color);
}
.deleted-artist-label {
background-color: var(--deleted-artist-label-color);
color: var(--inverse-text-color);
}