diff options
author | Daniel Baumann <daniel@debian.org> | 2024-10-18 20:33:49 +0200 |
---|---|---|
committer | Daniel Baumann <daniel@debian.org> | 2024-12-12 23:57:56 +0100 |
commit | e68b9d00a6e05b3a941f63ffb696f91e554ac5ec (patch) | |
tree | 97775d6c13b0f416af55314eb6a89ef792474615 /web_src/css/shared | |
parent | Initial commit. (diff) | |
download | forgejo-e68b9d00a6e05b3a941f63ffb696f91e554ac5ec.tar.xz forgejo-e68b9d00a6e05b3a941f63ffb696f91e554ac5ec.zip |
Adding upstream version 9.0.3.
Signed-off-by: Daniel Baumann <daniel@debian.org>
Diffstat (limited to '')
-rw-r--r-- | web_src/css/shared/flex-list.css | 108 | ||||
-rw-r--r-- | web_src/css/shared/milestone.css | 62 | ||||
-rw-r--r-- | web_src/css/shared/repoorg.css | 18 | ||||
-rw-r--r-- | web_src/css/shared/settings.css | 37 |
4 files changed, 225 insertions, 0 deletions
diff --git a/web_src/css/shared/flex-list.css b/web_src/css/shared/flex-list.css new file mode 100644 index 0000000..0f54779 --- /dev/null +++ b/web_src/css/shared/flex-list.css @@ -0,0 +1,108 @@ +.flex-list { + list-style: none; +} + +.flex-item { + display: flex; + gap: 8px; + align-items: flex-start; + padding: 10px 0; +} + +.flex-item .flex-item-leading { + display: flex; + align-items: flex-start; +} + +.flex-item .flex-item-main { + display: flex; + flex-direction: column; + flex-grow: 1; + flex-basis: 60%; /* avoid wrapping the "flex-item-trailing" too aggressively */ + min-width: 0; /* make the "text truncate" work, otherwise the flex axis is not limited and the text just overflows */ +} + +.flex-item-header { + display: flex; + gap: .25rem; + justify-content: space-between; + flex-wrap: wrap; +} + +.flex-item a:not(.label, .button):hover { + color: var(--color-primary) !important; +} + +.flex-item .flex-item-icon { + align-self: baseline; /* mainly used by the issue list, to align the leading icon with the title */ +} + +.flex-item .flex-item-icon + .flex-item-main { + align-self: baseline; +} + +.flex-item .flex-item-trailing { + display: flex; + gap: 0.5rem; + align-items: center; + flex-grow: 0; + flex-wrap: wrap; + justify-content: end; +} + +.flex-item .flex-item-title { + display: inline-flex; + flex-wrap: wrap; + align-items: center; + gap: .25rem; + max-width: 100%; + color: var(--color-text); + font-size: 16px; + font-weight: var(--font-weight-semibold); + overflow-wrap: anywhere; + min-width: 0; +} + +.flex-item .flex-item-title a { + color: var(--color-text); + overflow-wrap: anywhere; +} + +.flex-item .flex-item-body { + display: flex; + align-items: center; + flex-wrap: wrap; + gap: .25rem; + color: var(--color-text-light-2); + overflow-wrap: anywhere; +} + +.flex-item .flex-item-body a { + color: inherit; + overflow-wrap: anywhere; +} + +.flex-list > .flex-item + .flex-item { + border-top: 1px solid var(--color-secondary); +} + +/* Fomantic UI segment has default "padding: 1em", so here it removes the padding-top and padding-bottom accordingly (there might also be some `tw-hidden` siblings). +Developers could also use "flex-space-fitted" class to remove the first item's padding-top and the last item's padding-bottom */ +.flex-list.flex-space-fitted > .flex-item:first-child, +.ui.segment > .flex-list > .flex-item:first-child { + padding-top: 0; +} + +.flex-list.flex-space-fitted > .flex-item:last-child, +.ui.segment > .flex-list > .flex-item:last-child { + padding-bottom: 0; +} + +/* If there is a divider besides the flex-list, some padding/margin are not needs */ +.divider + .flex-list > .flex-item:first-child { + padding-top: 0; +} + +.flex-list + .divider { + margin-top: 0; +} diff --git a/web_src/css/shared/milestone.css b/web_src/css/shared/milestone.css new file mode 100644 index 0000000..91e6b5e --- /dev/null +++ b/web_src/css/shared/milestone.css @@ -0,0 +1,62 @@ +.milestone-list { + list-style: none; +} + +.milestone-card { + width: 100%; + padding-top: 10px; + padding-bottom: 10px; +} + +.milestone-card + .milestone-card { + border-top: 1px solid var(--color-secondary); +} + +.milestone-card .content { + padding-top: 10px; +} + +.milestone-header progress { + width: 200px; + height: 16px; +} + +.milestone-header { + display: flex; + align-items: center; + margin: 0; + flex-wrap: wrap; + justify-content: space-between; +} + +.milestone-toolbar { + padding-top: 5px; + display: flex; + flex-wrap: wrap; + gap: 8px; + justify-content: space-between; +} + +.milestone-toolbar .group { + color: var(--color-text-light-2); + display: flex; + flex-wrap: wrap; + gap: 8px; +} + +.milestone-toolbar .group > a { + font-size: 15px; + color: var(--color-text-light-2); +} + +.milestone-toolbar .group > a:hover { + color: var(--color-text); +} + +@media (max-width: 767.98px) { + .milestone-card { + display: flex; + flex-direction: column; + gap: 8px; + } +} diff --git a/web_src/css/shared/repoorg.css b/web_src/css/shared/repoorg.css new file mode 100644 index 0000000..5573ae4 --- /dev/null +++ b/web_src/css/shared/repoorg.css @@ -0,0 +1,18 @@ +.repository .head .ui.header .text, +.organization .head .ui.header .text { + vertical-align: middle; + font-size: 1.6rem; + margin-left: 15px; +} + +.repository .ui.tabs.container, +.organization .ui.tabs.container { + margin-top: 14px; + margin-bottom: 0; +} + +.repository .head .ui.header .org-visibility .label, +.organization .head .ui.header .org-visibility .label { + margin-left: 5px; + margin-top: 5px; +} diff --git a/web_src/css/shared/settings.css b/web_src/css/shared/settings.css new file mode 100644 index 0000000..33f8861 --- /dev/null +++ b/web_src/css/shared/settings.css @@ -0,0 +1,37 @@ +details.toggleable-item { + user-select: none !important; + padding: 0 !important; +} + +details.toggleable-item .menu { + margin: 4px 0 10px !important; +} + +details.toggleable-item summary { + display: flex; + justify-content: space-between; + align-items: center; + padding: 0.92857143em 1.14285714em; +} + +details.toggleable-item summary::marker, /* Chrome, Edge, Firefox */ +details.toggleable-item summary::-webkit-details-marker /* Safari */ { + display: none; +} + +details.toggleable-item summary::after { + transition: transform 0.25s ease; + content: ""; + width: 14px; + height: 14px; + mask-size: cover; + -webkit-mask-size: cover; + mask-image: var(--octicon-chevron-right); + -webkit-mask-image: var(--octicon-chevron-right); + background: currentcolor; + border: 1px solid var(--color-body); /* workaround https://bugzilla.mozilla.org/show_bug.cgi?id=1671784 */ +} + +details.toggleable-item[open] summary::after { + transform: rotate(90deg); +} |