TRKJ/gitea
2
0
Fork 0
mirror of https://gitee.com/gitea/gitea synced 2025-11-04 08:30:25 +08:00
Code Issues Packages Projects Releases Wiki Activity

Remove CSS has selector and improve various styles (#26891)

Browse Source 
Replace  #26850

Major changes:

1. Remove all `has` selectors, it is still not supported by firefox.
Actually there could be some more general and clearer approaches
2. Remove `two-toggle-buttons`, the `.ui.buttons` just works well
3. Rewrite the `.ui.buttons` border styles, see the screenshots
4. Remove the "fine-tuning" paddings from the the flex children, they
could layout themselves well.

![image](https://github.com/go-gitea/gitea/assets/2114189/a32ed6f3-60f7-43d5-9492-62c45d2397f6)

![image](https://github.com/go-gitea/gitea/assets/2114189/5cb173c5-c942-4237-8cb4-2697220b3f06)

![image](https://github.com/go-gitea/gitea/assets/2114189/8a1c12b3-a632-48ff-b1a7-a01a4417f821)

![image](https://github.com/go-gitea/gitea/assets/2114189/46bde1bd-9113-4231-965d-6ec9076f6a3b)
This commit is contained in:
wxiaoguang
2023-09-04 18:22:46 +08:00
committed by GitHub
parent a38cf868c5
commit 51cfe0e7de
5 changed files with 39 additions and 40 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
web_src/css/base.css
View File

@@ -485,8 +485,10 @@ a.label,
border-color: var(--color-primary);
}
.ui.action.input .button {
.ui.action.input .ui.ui.button {
border-color: var(--color-input-border);
padding-top: 0; /* the ".action.input" is "flex + stretch", so let the buttons layout themselves */
padding-bottom: 0;
}
/* currently used for search bar dropdowns in repo search and explore code */
@@ -2015,25 +2017,19 @@ a.ui.basic.label:hover {
border-color: var(--color-secondary);
}
.ui.attached.header .right .button {
padding: 8px 10px;
font-weight: var(--font-weight-normal);
}
/* reduce height of buttons with dropdown icon */
.ui.attached.header .right .button:has(.dropdown.icon) {
padding-top: 7px;
padding-bottom: 7px;
}
/* fix misaligned right buttons on box headers */
.ui.attached.header .right:not(.dropdown) {
.ui.attached.header > .ui.right {
position: absolute;
right: 0.78571429rem;
top: 0;
bottom: 0;
display: flex;
align-items: center;
}
.ui.attached.header > .ui.right > .button,
.ui.attached.header > .ui.right > .dropdown > .button {
padding: 8px 10px;
font-weight: var(--font-weight-normal);
}
/* if a .top.attached.header is followed by a .segment, add some margin */