-
-
Notifications
You must be signed in to change notification settings - Fork 5.5k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Clean up diff header css and reduce global textarea min-height #29232
Conversation
@@ -37,13 +37,13 @@ | |||
.combo-markdown-editor textarea.markdown-text-editor { | |||
display: block; | |||
width: 100%; | |||
min-height: 200px; | |||
max-height: calc(100vh - 200px); | |||
min-height: 140px; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
looks like a magic number, maybe a css-var is easier to maintain and with the name of the var everybody knowns what the number means
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Added a per-element variable in 59230d2. Normally I do not recommend such variables because they complicate the themeing and I think all theme-related vars should be on :root
, but it does make a certain sense to have "private" variables on elements like in this case.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Actually I think a global variable makes sense here, added in ec7e053. The current 132px fits exactly 6 lines on my screen:
web_src/css/base.css
Outdated
@@ -21,6 +21,7 @@ | |||
--border-radius-circle: 50%; | |||
--opacity-disabled: 0.55; | |||
--height-loading: 16rem; | |||
--min-height-textarea: 132px; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
calc(1.57142em + 6lh + 2px)
might be an alternative (padding + 6 lines + border), but lh
unit is not so well supported: https://caniuse.com/?search=lh%20unit.
Co-authored-by: delvh <dev.lh@web.de>
…tea#29232) 1. Tweak diff header and remove a numbe of unneeded CSS for it: Before: <img width="433" alt="Screenshot 2024-02-18 at 01 08 09" src="https://github.com/go-gitea/gitea/assets/115237/d8b377c0-57bc-44d5-bb57-a582c7d4b3b4"> After: <img width="463" alt="Screenshot 2024-02-18 at 01 07 56" src="https://github.com/go-gitea/gitea/assets/115237/d08c17e7-5b86-4d07-81da-6371f4754325"> 3. Reduce height of review textarea and also reduce fomantic's CSS from 12em to 8em. Now fits better on my screen: <img width="1352" alt="image" src="https://github.com/go-gitea/gitea/assets/115237/5c658d13-295e-4929-94da-13ade888020d"> --------- Co-authored-by: delvh <dev.lh@web.de>
…tea#29232) 1. Tweak diff header and remove a numbe of unneeded CSS for it: Before: <img width="433" alt="Screenshot 2024-02-18 at 01 08 09" src="https://github.com/go-gitea/gitea/assets/115237/d8b377c0-57bc-44d5-bb57-a582c7d4b3b4"> After: <img width="463" alt="Screenshot 2024-02-18 at 01 07 56" src="https://github.com/go-gitea/gitea/assets/115237/d08c17e7-5b86-4d07-81da-6371f4754325"> 3. Reduce height of review textarea and also reduce fomantic's CSS from 12em to 8em. Now fits better on my screen: <img width="1352" alt="image" src="https://github.com/go-gitea/gitea/assets/115237/5c658d13-295e-4929-94da-13ade888020d"> --------- Co-authored-by: delvh <dev.lh@web.de> (cherry picked from commit 39f8ab5)
Automatically locked because of our CONTRIBUTING guidelines |
Before:
After: