web/forgejo
10
0
Fork 0
mirror of https://codeberg.org/forgejo/forgejo.git synced 2025-06-02 16:35:26 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions 7

Modify width of ui container, fine tune css for settings pages and org header (#24315)

Browse source 
Close #24302 
Part of #24229, Follows #24246
This PR focused on CSS style fine-tune, main changes:

1. Give `.ui.ui.ui.container` a width of `1280px` with a max-width of
`calc(100vw - 64px)`, so the main contents looks better on large
devices.

2. Share styles for table elements in all levels settings pages to fix
overflow of runners table on mobile and for consistency (The headers on
mobile can be further improved, but haven't found a proper way yet).

3. Use [stackable
grid](https://fomantic-ui.com/collections/grid.html#stackable) and
[device column width](https://fomantic-ui.com/examples/responsive.html)
for responsiveness for some pages (repo/org collaborators settings
pages, org teams related page)

4. Fixed #24302 by sharing label related CSS in reporg.css

5. Fine tune repo tags settings page

---------

Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
This commit is contained in:
Hester Gong 2023-04-26 23:59:08 +08:00 • committed by GitHub
parent 58caf422e6
commit f1a4330306
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
20 changed files with 122 additions and 143 deletions
Download patch file Download diff file Expand all files Collapse all files

50
web_src/css/admin.css
View file

@ -4,30 +4,6 @@
margin: 12px -1rem -1rem;
}
.admin .table.segment {
padding: 0;
font-size: 13px;
overflow-x: auto;
}
.admin .table.segment:not(.striped) thead th:last-child {
padding-right: 5px !important;
}
.admin .table.segment th {
padding-top: 5px;
padding-bottom: 5px;
}
.admin .table.segment:not(.select) th:first-of-type,
.admin .table.segment:not(.select) td:first-of-type {
padding-left: 15px !important;
}
.admin .table.segment form tbody button[type="submit"] {
padding: 5px 8px;
}
.admin .settings .button.adopt,
.admin .settings .button.delete {
margin-top: -15px;
@ -44,7 +20,7 @@
}
.admin dl.admin-dl-horizontal {
padding: 20px;
padding: 1em;
margin: 0;
}
@ -84,27 +60,3 @@
white-space: pre-wrap;
word-wrap: break-word;
}
@media (max-width: 767px) {
.admin #notice-table .notice-description {
max-width: 80vw;
}
}
@media (min-width: 768px) and (max-width: 991px) {
.admin #notice-table .notice-description {
max-width: 360px;
}
}
@media (min-width: 992px) and (max-width: 1200px) {
.admin #notice-table .notice-description {
max-width: 510px;
}
}
@media (min-width: 1201px) {
.admin #notice-table .notice-description {
max-width: 640px;
}
}