gitea/web_src/css
silverwind 99d7ef5091
Prevent layout shift in `<overflow-menu>` items (#29831)
There is a small layout shift in when active tab changes. Notice how the
actions SVG is unstable:


![](https://github.com/go-gitea/gitea/assets/115237/a6928e89-5d47-4a91-8f36-1fa22fddbce7)

This is because the active item with bold text is wider then the
inactive one. I have applied [this
trick](https://stackoverflow.com/a/32570813/808699) to prevent this
layout shift. It's only active inside `<overflow-menu>` because I wanted
to avoid changing HTML and doing it in regular JS would cause a flicker.
I don't expect us to introduce other similar menus without
`<overflow-menu>`, so that place is likely fine.


![after](https://github.com/go-gitea/gitea/assets/115237/d6089924-8de6-4ee0-8db4-15f16069a131)

I also changed the weight from 500 to 600, slightly reduced horizontal
padding, merged some tab-bar related CSS rules and a added a small
margin below repo-header so it does not look so crammed against the
buttons on top.

---------

Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
2024-03-20 17:00:35 +00:00
..
chroma
codemirror
editor
features
markup
modules Load citation JS only when needed (#29855) 2024-03-17 11:04:59 +01:00
repo Prevent layout shift in `<overflow-menu>` items (#29831) 2024-03-20 17:00:35 +00:00
shared Add `<overflow-menu>`, rename webcomponents (#29400) 2024-03-15 02:05:31 +00:00
standalone
themes Light theme color enhancements (#29830) 2024-03-16 02:33:01 +01:00
actions.css
admin.css
base.css Prevent layout shift in `<overflow-menu>` items (#29831) 2024-03-20 17:00:35 +00:00
dashboard.css Remove the negative margin from `.page-content` (#29922) 2024-03-20 11:21:18 +00:00
explore.css
font_i18n.css
form.css Unify search boxes (#29530) 2024-03-14 23:24:59 +00:00
helpers.css Migrate border and margin classes to Tailwind (#29828) 2024-03-18 14:47:05 +00:00
home.css
index.css Remove fomantic message module (#29856) 2024-03-17 11:21:14 +08:00
install.css
org.css
repo.css Refactor clone-panel styles (#29861) 2024-03-17 12:40:42 +00:00
review.css
user.css Remove the negative margin from `.page-content` (#29922) 2024-03-20 11:21:18 +00:00