diff options
author | silverwind <me@silverwind.io> | 2023-06-29 14:24:22 +0200 |
---|---|---|
committer | GitHub <noreply@github.com> | 2023-06-29 20:24:22 +0800 |
commit | 64f2d70262c4cfc1ee74875b4ec920551e304199 (patch) | |
tree | f09f0828b365485370ee788e93dfa1bafb6094fc /web_src/css | |
parent | 72b3af74be9654d6bb84c0ba6568d8eeca445963 (diff) | |
download | gitea-64f2d70262c4cfc1ee74875b4ec920551e304199.tar.gz gitea-64f2d70262c4cfc1ee74875b4ec920551e304199.zip |
Replace fomantic divider module with our own (#25539)
Should look exactly like before for normal dividers. "Horizontal" ones
look better because they no longer use image backgrounds.
<img width="917" alt="Screenshot 2023-06-27 at 19 07 56"
src="https://github.com/go-gitea/gitea/assets/115237/d97d8dec-6859-44a8-85ba-e4549b4dd9df">
<img width="914" alt="Screenshot 2023-06-27 at 19 05 58"
src="https://github.com/go-gitea/gitea/assets/115237/8bf98544-2d82-4ebf-ac68-d6dc237bd6b2">
<img width="1246" alt="Screenshot 2023-06-27 at 19 00 42"
src="https://github.com/go-gitea/gitea/assets/115237/36a6bb21-6029-4f53-8bee-535f55c66fed">
<img width="344" alt="Screenshot 2023-06-27 at 18 58 15"
src="https://github.com/go-gitea/gitea/assets/115237/a9e70aee-8e6b-4ea1-9e93-19c9f96aec6e">
<img width="823" alt="Screenshot 2023-06-27 at 18 56 22"
src="https://github.com/go-gitea/gitea/assets/115237/e7a497cd-f262-4683-8872-23c3c8cce32f">
<img width="330" alt="Screenshot 2023-06-27 at 19 21 11"
src="https://github.com/go-gitea/gitea/assets/115237/42f24149-a655-4c7e-bd26-8ab52db6446b">
Diffstat (limited to 'web_src/css')
-rw-r--r-- | web_src/css/admin.css | 5 | ||||
-rw-r--r-- | web_src/css/base.css | 14 | ||||
-rw-r--r-- | web_src/css/helpers.css | 1 | ||||
-rw-r--r-- | web_src/css/index.css | 1 | ||||
-rw-r--r-- | web_src/css/modules/divider.css | 39 | ||||
-rw-r--r-- | web_src/css/repo.css | 7 |
6 files changed, 43 insertions, 24 deletions
diff --git a/web_src/css/admin.css b/web_src/css/admin.css index 58e0527350..07c0190f52 100644 --- a/web_src/css/admin.css +++ b/web_src/css/admin.css @@ -15,11 +15,6 @@ flex-wrap: wrap; } -/* divider needs explicit width because the parent container is "display: flex" */ -.admin dl.admin-dl-horizontal .ui.divider { - width: 100%; -} - .admin dl.admin-dl-horizontal dt, .admin dl.admin-dl-horizontal dd { line-height: 1; diff --git a/web_src/css/base.css b/web_src/css/base.css index 016c263e43..8b8d376c57 100644 --- a/web_src/css/base.css +++ b/web_src/css/base.css @@ -465,15 +465,6 @@ a.label, background-color: var(--color-markup-code-block); } -.ui.divider { - color: var(--color-text); -} - -.ui.divider:not(.vertical,.horizontal) { - border-top-color: var(--color-secondary) !important; - border-bottom: none !important; -} - .ui.dividing.header { border-bottom-color: var(--color-secondary); } @@ -2083,11 +2074,6 @@ table th[data-sortt-desc] .svg { border-radius: 0 0 var(--border-radius) var(--border-radius); } -.ui.dropdown .menu > .divider { - border-top: 1px solid var(--color-secondary); - margin: 4px 0; -} - .ui.multiple.dropdown > .label { box-shadow: 0 0 0 1px var(--color-secondary) inset; } diff --git a/web_src/css/helpers.css b/web_src/css/helpers.css index 520a199682..68d4a1b021 100644 --- a/web_src/css/helpers.css +++ b/web_src/css/helpers.css @@ -76,6 +76,7 @@ Gitea's private styles use `g-` prefix. .gt-self-end { align-self: flex-end !important; } .gt-no-underline { text-decoration-line: none !important; } .gt-w-auto { width: auto !important; } +.gt-normal-case { text-transform: none !important; } .gt-overflow-x-auto { overflow-x: auto !important; } .gt-overflow-x-scroll { overflow-x: scroll !important; } diff --git a/web_src/css/index.css b/web_src/css/index.css index d7ac9f453d..6a3e7d0dd5 100644 --- a/web_src/css/index.css +++ b/web_src/css/index.css @@ -9,6 +9,7 @@ @import "./modules/comment.css"; @import "./modules/navbar.css"; @import "./modules/toast.css"; +@import "./modules/divider.css"; @import "./shared/issuelist.css"; @import "./shared/milestone.css"; diff --git a/web_src/css/modules/divider.css b/web_src/css/modules/divider.css new file mode 100644 index 0000000000..8c9649d6ba --- /dev/null +++ b/web_src/css/modules/divider.css @@ -0,0 +1,39 @@ +.divider { + margin: 1rem 0; + height: 0; + font-weight: var(--font-weight-medium); + text-transform: uppercase; + color: var(--color-text); + font-size: 1rem; + width: 100%; +} + +.divider:not(.divider-text) { + border-top: 1px solid var(--color-secondary); +} + +.divider.divider-text { + display: flex; + align-items: center; + padding: 7px 0; +} + +.divider.divider-text::before, +.divider.divider-text::after { + content: ""; + flex: 1; + border-top: 1px solid var(--color-secondary); +} + +.divider.divider-text::before { + margin-right: .75em; +} + +.divider.divider-text::after { + margin-left: .75em; +} + +.ui.dropdown .menu > .divider { + border-top: 1px solid var(--color-secondary); + margin: 4px 0; +} diff --git a/web_src/css/repo.css b/web_src/css/repo.css index 0122e79aae..e20355dbc3 100644 --- a/web_src/css/repo.css +++ b/web_src/css/repo.css @@ -138,10 +138,6 @@ background-color: var(--color-header-wrapper); } -.repository .header-wrapper .ui.tabs.divider { - border-bottom: 0; -} - .repository .header-wrapper .ui.tabular .svg { margin-right: 5px; } @@ -591,6 +587,7 @@ .repository.options .danger .ui.divider { margin: 0; + border-color: var(--color-error-border); } .repository.new.issue .comment.form .comment .avatar { @@ -1012,7 +1009,7 @@ .repository.view.issue .comment-list .comment .merge-section .divider { margin-left: -1rem; - margin-right: -1rem; + width: calc(100% + 2rem); } .repository.view.issue .comment-list .comment .merge-section.no-header::before, |