domi/forgejo-domi
1
0
Fork 0
forked from forgejo/forgejo
Code Pull requests Activity

Improve migrate page and add card CSS (#13751)

Browse source 
- Use original gitea logo on migrate page
- Add card styles and map colors to css vars
- Tweak migrate page, adding hover effect to cards

Co-authored-by: Lunny Xiao <xiaolunwen@gmail.com>
This commit is contained in:
silverwind 2020-12-05 11:09:09 +01:00 • committed by GitHub
parent 1a768e547c
commit 61d6c191d5
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
8 changed files with 83 additions and 54 deletions
Download patch file Download diff file Expand all files Collapse all files

44
web_src/less/_base.less
View file

@ -94,10 +94,12 @@
--color-hover: #0000000a;
--color-active: #00000010;
--color-menu: #ffffff;
--color-card: #ffffff;
--color-markdown-table-row: #00000008;
--color-markdown-code-block: #00000010;
--color-button: #ffffff;
--color-code-bg: #ffffff;
--color-shadow: #00000024;
}
:root:lang(ja) {
@ -374,6 +376,48 @@ a.muted:hover,
box-shadow: -1px -1px 0 0 var(--color-secondary);
}
.ui.cards > .card,
.ui.card {
background: var(--color-card);
border: 1px solid var(--color-secondary);
box-shadow: none;
}
.ui.cards > .card > .content,
.ui.card > .content {
border-color: var(--color-secondary);
}
.ui.cards > .card > .extra,
.ui.card > .extra,
.ui.cards > .card > .extra a:not(.ui),
.ui.card > .extra a:not(.ui) {
color: var(--color-text);
}
.ui.cards > .card > .extra a:not(.ui):hover,
.ui.card > .extra a:not(.ui):hover {
color: var(--color-primary);
}
.ui.cards > .card > .content > .header,
.ui.card > .content > .header {
color: var(--color-text);
}
.ui.cards > .card > .content > .description,
.ui.card > .content > .description {
color: var(--color-text);
}
.ui.cards a.card:hover,
.ui.link.cards .card:not(.icon):hover,
a.ui.card:hover,
.ui.link.card:hover {
border: 1px solid var(--color-secondary);
background: var(--color-card);
}
.ui.progress[data-percent="0"] .bar .progress {
color: var(--color-text);
}

11
web_src/less/_repository.less
View file

@ -3206,6 +3206,13 @@ td.blob-excerpt {
}
}
.migrate .cards .card {
text-align: center;
.repository.migrate .card {
transition: all .1s ease-in-out;
box-shadow: none !important;
border: 1px solid var(--color-secondary);
}
.repository.migrate .card:hover {
transform: scale(105%);
box-shadow: 0 .5rem 1rem var(--color-shadow) !important;
}

1
web_src/less/helpers.less
View file

@ -1,6 +1,7 @@
.df { display: flex !important; }
.dif { display: inline-flex !important; }
.ac { align-items: center !important; }
.tc { text-align: center !important; }
.jc { justify-content: center !important; }
.js { justify-content: flex-start !important; }
.je { justify-content: flex-end !important; }

34
web_src/less/themes/theme-arc-green.less
View file

@ -89,10 +89,12 @@
--color-hover: #ffffff0d;
--color-active: #ffffff14;
--color-menu: #2e323e;
--color-card: #2e323e;
--color-markdown-table-row: #ffffff06;
--color-markdown-code-block: #2a2e3a;
--color-button: #353846;
--color-code-bg: #2a2e3a;
--color-shadow: #00000060;
}
/* LineTableTD */
@ -817,22 +819,6 @@ td.blob-hunk {
background: #353945;
}
.ui.card,
.ui.cards > .card {
background: #353945;
box-shadow: 0 0 0 1px var(--color-secondary);
}
.ui.card > .content > .header,
.ui.cards > .card > .content > .header {
color: #dbdbdb;
}
.ui.card > .extra a:not(.ui),
.ui.cards > .card > .extra a:not(.ui) {
color: #87ab63;
}
.ui .text.black {
color: var(--color-secondary-dark-6);
}
@ -1366,19 +1352,3 @@ img[src$="/img/matrix.svg"] {
border: 1px solid rgba(121, 71, 66, .5) !important;
border-bottom: none !important;
}
.migrate .cards .card {
text-align: center;
}
.migrate .cards .card .content a {
color: rgb(158, 158, 158) !important;
}
.migrate .cards .card .content a:hover {
color: rgb(255, 255, 255) !important;
}
.migrate .cards .card .content .description {
color: rgb(158, 158, 158);
}