realaravinth/bench-forgejo
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity
bench-forgejo/web_src/less/helpers.less

180 lines
7.3 KiB
Text
Raw Normal View History

Change search and filter icons to SVG (#13473) Unfortunately, the Fomantic CSS relies on i.icon instead of .icon so a wrapper is necessary for these with an accompanying class to center the icon.
2020-11-09 23:51:47 +05:30
.df { display: flex !important; }
Add pull request manually merge instruction (#13840) * add pull request command line instructions * Add pull request manually merge instuction * Fix styles * Fix lint * Move inline style to class file * add space between merge button and hint text * Add sentence end charcter * Change the language file * adjust secondary bg * further adjustment Co-authored-by: silverwind <me@silverwind.io>
2020-12-10 08:29:05 +05:30
.di { display: inline !important; }
Dropdowns, Labels fixes and more CSS tweaks (#13733) * Dropdowns and Labels fixes - Rework dropdown, menu and label styles - Improve issue sidebar milestone and label sections - Fix archived repo and private org badge - Move more colors to CSS vars - Move issue number to end of title on issue page * more dropdown fixes * fix basic blue labels - fixes #13731 * improve class setting on svg Co-authored-by: zeripath <art27@cantab.net> Co-authored-by: techknowlogick <techknowlogick@gitea.io>
2020-11-29 11:52:04 +05:30
.dif { display: inline-flex !important; }
Add pull request manually merge instruction (#13840) * add pull request command line instructions * Add pull request manually merge instuction * Fix styles * Fix lint * Move inline style to class file * add space between merge button and hint text * Add sentence end charcter * Change the language file * adjust secondary bg * further adjustment Co-authored-by: silverwind <me@silverwind.io>
2020-12-10 08:29:05 +05:30
.dib { display: inline-block !important; }
Rework commit page header (#17849) - Remove blue background and use regular header styling - Use flexbox on author and signature segments - Add shield-type icons besides gpg key, replacing icon font icons - Ensure author and signature line are same height - Remove erronous green background on arc-green signature line - Turn signing colors into CSS variables - Consolidate the two warning states into one Co-authored-by: zeripath <art27@cantab.net>
2021-12-01 05:10:17 +05:30
.pr { position: relative !important; }
Change search and filter icons to SVG (#13473) Unfortunately, the Fomantic CSS relies on i.icon instead of .icon so a wrapper is necessary for these with an accompanying class to center the icon.
2020-11-09 23:51:47 +05:30
.ac { align-items: center !important; }
Improve migrate page and add card CSS (#13751) - Use original gitea logo on migrate page - Add card styles and map colors to css vars - Tweak migrate page, adding hover effect to cards Co-authored-by: Lunny Xiao <xiaolunwen@gmail.com>
2020-12-05 15:39:09 +05:30
.tc { text-align: center !important; }
Rework commit page header (#17849) - Remove blue background and use regular header styling - Use flexbox on author and signature segments - Add shield-type icons besides gpg key, replacing icon font icons - Ensure author and signature line are same height - Remove erronous green background on arc-green signature line - Turn signing colors into CSS variables - Consolidate the two warning states into one Co-authored-by: zeripath <art27@cantab.net>
2021-12-01 05:10:17 +05:30
.tl { text-align: left !important; }
Change <a> elements to underline on hover (#17898) Fomantic brings a opinionated style that removed underline on mouse hover which I think is important UX to have. This re-enables the underline in the Fomantic config and fixes a few cases where underline was deemed disruptive.
2021-12-18 10:59:00 +05:30
.tdn { text-decoration: none !important; }
Change search and filter icons to SVG (#13473) Unfortunately, the Fomantic CSS relies on i.icon instead of .icon so a wrapper is necessary for these with an accompanying class to center the icon.
2020-11-09 23:51:47 +05:30
.jc { justify-content: center !important; }
.js { justify-content: flex-start !important; }
.je { justify-content: flex-end !important; }
.sb { justify-content: space-between !important; }
Fix tooltips and issue dependency styles (#13458) - Convert all tooltips to JS-based ones, fixing overflow issues - Restyle issue dependencies/dependants - Move popup styles to base style - CSS Helper tweaks - Unify pseudo element selectors and lint for it Fixes: https://github.com/go-gitea/gitea/issues/13400
2020-11-10 23:58:07 +05:30
.fc { flex-direction: column !important; }
.f1 { flex: 1 !important; }
Issue and Pulls lists rework (#13594) * Issue and Pulls lists rework Reorganized and restyled the issue and pull request lists. * color and layout tweaks * use new issue list on dashboard as well * move pagination into template * misc tweaks * fix label hover * fix milestone list * fix discrepancies between issue and milestone list, add new 'merge' helper * fmt * simplify merge helper * remove whitespace * fix startIndex * further simplify dict merging * rename helper to 'mergeinto' for clarity * allow bottom-row to wrap Co-authored-by: Lauris BH <lauris@nix.lv>
2020-11-25 16:50:40 +05:30
.fw { flex-wrap: wrap !important; }
Direct avatar rendering (#13649) * Direct avatar rendering This adds new template helpers for avatar rendering which output image elements with direct links to avatars which makes them cacheable by the browsers. This should be a major performance improvment for pages with many avatars. * fix avatars of other user's profile pages * fix top border on user avatar name * uncircle avatars * remove old incomplete avatar selector * use title attribute for name and add it back on blame * minor refactor * tweak comments * fix url path join and adjust test to new result * dedupe functions
2020-12-04 00:16:11 +05:30
.vm { vertical-align: middle !important; }
Search and Diff CSS enhancements (#14050) * Search and Diff CSS enhancements - Use flexbox for language stats - Improve labels and code boxes on repo and code search - Use flexbox on diff header and improve suppressed diff text - Add dedicated color for diff expander * more diff tweaks, less vertical padding on header * more minor tweaks * always show fold icon, image diff improvments * remove margin Co-authored-by: Lunny Xiao <xiaolunwen@gmail.com> Co-authored-by: techknowlogick <techknowlogick@gitea.io>
2020-12-20 23:30:03 +05:30
.w-100 { width: 100% !important; }
.h-100 { height: 100% !important; }
Rework repo buttons (#20602) * Rework repo buttons - Replace "New PR" and "Go to File" button with Icon Button - Move all "Add File" actions into a dropdown button - Remove most custom styling of clone buttons - Margin and wiki tweaks Buttons are now all equal height, mobile layout wraps gracefully. Fixes: https://github.com/go-gitea/gitea/issues/13671 Replaces: https://github.com/go-gitea/gitea/pull/20375 Co-authored-by: Lauris BH <lauris@nix.lv> Co-authored-by: zeripath <art27@cantab.net> Co-authored-by: Lunny Xiao <xiaolunwen@gmail.com>
2022-08-08 04:45:11 +05:30
.br-0 { border-radius: 0 !important; }
Fix tooltips and issue dependency styles (#13458) - Convert all tooltips to JS-based ones, fixing overflow issues - Restyle issue dependencies/dependants - Move popup styles to base style - CSS Helper tweaks - Unify pseudo element selectors and lint for it Fixes: https://github.com/go-gitea/gitea/issues/13400
2020-11-10 23:58:07 +05:30
Use native inputs in whitespace dropdown (#20980) Use native `<input type="radio">` instead of fake icon font. The `pointer-events: none` is necessary so the link click always takes effect. Tested in Firefox, Safari and Chrome. Before: <img width="305" alt="Screen Shot 2022-08-27 at 20 42 11" src="https://user-images.githubusercontent.com/115237/187044786-6655c766-c3fb-4672-9e3e-219b3ec4896c.png"> After: <img width="298" alt="Screen Shot 2022-08-27 at 21 10 05" src="https://user-images.githubusercontent.com/115237/187044790-33f87741-062e-4744-80b1-d3bd3fd725e3.png"> <img width="302" alt="image" src="https://user-images.githubusercontent.com/115237/187044872-6c133cea-65ee-4ebd-b18a-a8b38c791565.png">
2022-09-25 19:31:05 +05:30
/* below class names match Tailwind CSS */
.pointer-events-none { pointer-events: none !important; }
Fix tooltips and issue dependency styles (#13458) - Convert all tooltips to JS-based ones, fixing overflow issues - Restyle issue dependencies/dependants - Move popup styles to base style - CSS Helper tweaks - Unify pseudo element selectors and lint for it Fixes: https://github.com/go-gitea/gitea/issues/13400
2020-11-10 23:58:07 +05:30
.mono {
font-family: var(--fonts-monospace) !important;
Fix various documentation, user-facing, and source comment typos (#16367) * Fix various doc, user-facing, and source comment typos Found via `codespell -q 3 -S ./options/locale,./vendor -L ba,pullrequest,pullrequests,readby`
2021-07-08 17:08:13 +05:30
font-size: .9em !important; /* compensate for monospace fonts being usually slightly larger */
Fix tooltips and issue dependency styles (#13458) - Convert all tooltips to JS-based ones, fixing overflow issues - Restyle issue dependencies/dependants - Move popup styles to base style - CSS Helper tweaks - Unify pseudo element selectors and lint for it Fixes: https://github.com/go-gitea/gitea/issues/13400
2020-11-10 23:58:07 +05:30
}
Search and Diff CSS enhancements (#14050) * Search and Diff CSS enhancements - Use flexbox for language stats - Improve labels and code boxes on repo and code search - Use flexbox on diff header and improve suppressed diff text - Add dedicated color for diff expander * more diff tweaks, less vertical padding on header * more minor tweaks * always show fold icon, image diff improvments * remove margin Co-authored-by: Lunny Xiao <xiaolunwen@gmail.com> Co-authored-by: techknowlogick <techknowlogick@gitea.io>
2020-12-20 23:30:03 +05:30
.bold { font-weight: 600 !important; }
Fix tooltips and issue dependency styles (#13458) - Convert all tooltips to JS-based ones, fixing overflow issues - Restyle issue dependencies/dependants - Move popup styles to base style - CSS Helper tweaks - Unify pseudo element selectors and lint for it Fixes: https://github.com/go-gitea/gitea/issues/13400
2020-11-10 23:58:07 +05:30
.word-break {
word-wrap: break-word !important;
Fix Pull Request comment filename word breaks (#19535) * Fix word breaks in Chrome This fixes word wrapping on the filename for a comment on a PR. A previous commit fixed this problem in Firefox, but not Chrome. Fixes #16248 * Don't break Outdated badge This prevents the Outdated badge on a PR from wrapping in the middle of the word for a comment on a long filename. * Move word break to recommended element * Add overflow-wrap per PR review * Update web_src/less/helpers.less Co-authored-by: silverwind <me@silverwind.io> Co-authored-by: 6543 <6543@obermui.de> Co-authored-by: Lunny Xiao <xiaolunwen@gmail.com>
2022-04-29 15:00:54 +05:30
word-break: break-word; /* compat: Safari */
overflow-wrap: anywhere;
Fix tooltips and issue dependency styles (#13458) - Convert all tooltips to JS-based ones, fixing overflow issues - Restyle issue dependencies/dependants - Move popup styles to base style - CSS Helper tweaks - Unify pseudo element selectors and lint for it Fixes: https://github.com/go-gitea/gitea/issues/13400
2020-11-10 23:58:07 +05:30
}
File header tweaks, add CSS helpers (#12635) - replace two instances of fontawesome with octicons - add new "class" optional argument to "svg" helper - add many new CSS helpers and move their import to the end for increaseed precedence Co-authored-by: zeripath <art27@cantab.net> Co-authored-by: techknowlogick <techknowlogick@gitea.io>
2020-09-08 22:47:56 +05:30
Fix overflow in commit graph (#17947) * Fix overflow in commit graph Limit commit message to 50% width. This is rather crude but should work for common use cases with not too-long author names. Fixes: https://github.com/go-gitea/gitea/issues/17944 * Make it work with dynamic width * use span * use explicit none Co-authored-by: Lunny Xiao <xiaolunwen@gmail.com>
2021-12-11 19:42:18 +05:30
.ellipsis {
overflow: hidden !important;
white-space: nowrap !important;
text-overflow: ellipsis !important;
}
Style and template tweaks (#13828) * Style and template tweaks - Get red and green buttons on arc green closer to base theme - EasyMDE adjustments, toolbar and focus border - Fix header on 404 repo page - Tweaks to frontpage search, add 'Create Repo' button - Fix misaligned box headers - Fix pagination on arc-green - Fix background and footer on explore and repo search * better fix for header button alignment * add label hover for reactions
2020-12-04 16:48:37 +05:30
.full-screen-width { width: 100vw !important; }
Fix frontpage avatars (#13853) The frontpage uses a rather strange method to obtain the commit's avatar which I've overlooked earlier. I don't exactly understand how it works but this change fixes the wrong default avatars by using the function that was in previous use. Also introduced a few constants for size an size increase factor. Fixes: https://github.com/go-gitea/gitea/issues/13844
2020-12-09 05:42:15 +05:30
.full-screen-height { height: 100vh !important; }
Style and template tweaks (#13828) * Style and template tweaks - Get red and green buttons on arc green closer to base theme - EasyMDE adjustments, toolbar and focus border - Fix header on 404 repo page - Tweaks to frontpage search, add 'Create Repo' button - Fix misaligned box headers - Fix pagination on arc-green - Fix background and footer on explore and repo search * better fix for header button alignment * add label hover for reactions
2020-12-04 16:48:37 +05:30
Form styling adjustments (#13501) * Form styling adjustments - Move all form-related styling to _forms.less - Defined new form-related variables - Fix spinner on frontpage repo search - Add new rounded-* helpers and fix repo search radius * misc arc green tweaks Co-authored-by: zeripath <art27@cantab.net> Co-authored-by: techknowlogick <techknowlogick@gitea.io> Co-authored-by: Lauris BH <lauris@nix.lv>
2020-11-12 21:29:33 +05:30
.rounded { border-radius: var(--border-radius) !important; }
.rounded-top { border-radius: var(--border-radius) var(--border-radius) 0 0 !important; }
.rounded-bottom { border-radius: 0 0 var(--border-radius) var(--border-radius) !important; }
.rounded-left { border-radius: var(--border-radius) 0 0 var(--border-radius) !important; }
.rounded-right { border-radius: 0 var(--border-radius) var(--border-radius) 0 !important; }
Dashboard search tweaks (#14008) - Fix color of inactive pagination parts caused by overreaching CSS selector. - Slightly reduce horizontal padding on list items - Add spacing around pagination and move it outside of <ul>
2020-12-18 01:28:21 +05:30
.border-secondary { border: 1px solid var(--color-secondary) !important; }
.border-secondary-top { border-top: 1px solid var(--color-secondary) !important; }
.border-secondary-bottom { border-bottom: 1px solid var(--color-secondary) !important; }
.border-secondary-left { border-left: 1px solid var(--color-secondary) !important; }
.border-secondary-right { border-right: 1px solid var(--color-secondary) !important; }
Prevent clone protocol button flash on page load (#13626) * Prevent clone protocol button flash on page load Previously, the saved active buttons would flash on page load because if delay involved in JS execution. Prevent these flashes bydisabling transitions on page load and run the script right after. It's not an ideal solution (which would require server-side storage of user settings like this) but I'd say better than before. * add defer Co-authored-by: zeripath <art27@cantab.net>
2020-11-27 02:01:09 +05:30
.no-transition { transition: none !important; }
CSS color variables, less bold font weight and more (#13567) * CSS color variables, less bold font weight - Define color variables for fully saturated colors and apply them where it made sense - Add background color helper classes - Globally reduce bold font weight from 700 to 500 - Remove border from timeline icons - Unify dropzone styling - Various border style consolidations * attempt to fix test * another attempt at tests * fix contains
2020-11-16 02:28:16 +05:30
.bg-red { background: var(--color-red) !important; }
.bg-orange { background: var(--color-orange) !important; }
.bg-yellow { background: var(--color-yellow) !important; }
.bg-olive { background: var(--color-olive) !important; }
.bg-green { background: var(--color-green) !important; }
.bg-teal { background: var(--color-teal) !important; }
.bg-blue { background: var(--color-blue) !important; }
.bg-violet { background: var(--color-violet) !important; }
.bg-purple { background: var(--color-purple) !important; }
.bg-pink { background: var(--color-pink) !important; }
.bg-brown { background: var(--color-brown) !important; }
.bg-grey { background: var(--color-grey) !important; }
.bg-gold { background: var(--color-gold) !important; }
.text-white { color: var(--color-white) !important; }
File header tweaks, add CSS helpers (#12635) - replace two instances of fontawesome with octicons - add new "class" optional argument to "svg" helper - add many new CSS helpers and move their import to the end for increaseed precedence Co-authored-by: zeripath <art27@cantab.net> Co-authored-by: techknowlogick <techknowlogick@gitea.io>
2020-09-08 22:47:56 +05:30
.m-0 { margin: 0 !important; }
.m-1 { margin: .125rem !important; }
.m-2 { margin: .25rem !important; }
.m-3 { margin: .5rem !important; }
.m-4 { margin: 1rem !important; }
.m-5 { margin: 2rem !important; }
.ml-0 { margin-left: 0 !important; }
.ml-1 { margin-left: .125rem !important; }
.ml-2 { margin-left: .25rem !important; }
.ml-3 { margin-left: .5rem !important; }
.ml-4 { margin-left: 1rem !important; }
.ml-5 { margin-left: 2rem !important; }
.mr-0 { margin-right: 0 !important; }
.mr-1 { margin-right: .125rem !important; }
.mr-2 { margin-right: .25rem !important; }
.mr-3 { margin-right: .5rem !important; }
.mr-4 { margin-right: 1rem !important; }
.mr-5 { margin-right: 2rem !important; }
.mt-0 { margin-top: 0 !important; }
.mt-1 { margin-top: .125rem !important; }
.mt-2 { margin-top: .25rem !important; }
.mt-3 { margin-top: .5rem !important; }
.mt-4 { margin-top: 1rem !important; }
.mt-5 { margin-top: 2rem !important; }
.mb-0 { margin-bottom: 0 !important; }
.mb-1 { margin-bottom: .125rem !important; }
.mb-2 { margin-bottom: .25rem !important; }
.mb-3 { margin-bottom: .5rem !important; }
.mb-4 { margin-bottom: 1rem !important; }
.mb-5 { margin-bottom: 2rem !important; }
.mx-0 { margin-left: 0 !important; margin-right: 0 !important; }
.mx-1 { margin-left: .125rem !important; margin-right: .125rem !important; }
.mx-2 { margin-left: .25rem !important; margin-right: .25rem !important; }
.mx-3 { margin-left: .5rem !important; margin-right: .5rem !important; }
.mx-4 { margin-left: 1rem !important; margin-right: 1rem !important; }
.mx-5 { margin-left: 2rem !important; margin-right: 2rem !important; }
.my-0 { margin-top: 0 !important; margin-bottom: 0 !important; }
.my-1 { margin-top: .125rem !important; margin-bottom: .125rem !important; }
.my-2 { margin-top: .25rem !important; margin-bottom: .25rem !important; }
.my-3 { margin-top: .5rem !important; margin-bottom: .5rem !important; }
.my-4 { margin-top: 1rem !important; margin-bottom: 1rem !important; }
.my-5 { margin-top: 2rem !important; margin-bottom: 2rem !important; }
.p-0 { padding: 0 !important; }
.p-1 { padding: .125rem !important; }
.p-2 { padding: .25rem !important; }
.p-3 { padding: .5rem !important; }
.p-4 { padding: 1rem !important; }
.p-5 { padding: 2rem !important; }
.pl-0 { padding-left: 0 !important; }
.pl-1 { padding-left: .125rem !important; }
.pl-2 { padding-left: .25rem !important; }
.pl-3 { padding-left: .5rem !important; }
.pl-4 { padding-left: 1rem !important; }
.pl-5 { padding-left: 2rem !important; }
.pr-0 { padding-right: 0 !important; }
.pr-1 { padding-right: .125rem !important; }
.pr-2 { padding-right: .25rem !important; }
.pr-3 { padding-right: .5rem !important; }
.pr-4 { padding-right: 1rem !important; }
.pr-5 { padding-right: 2rem !important; }
.pt-0 { padding-top: 0 !important; }
.pt-1 { padding-top: .125rem !important; }
.pt-2 { padding-top: .25rem !important; }
.pt-3 { padding-top: .5rem !important; }
.pt-4 { padding-top: 1rem !important; }
.pt-5 { padding-top: 2rem !important; }
.pb-0 { padding-bottom: 0 !important; }
.pb-1 { padding-bottom: .125rem !important; }
.pb-2 { padding-bottom: .25rem !important; }
.pb-3 { padding-bottom: .5rem !important; }
.pb-4 { padding-bottom: 1rem !important; }
.pb-5 { padding-bottom: 2rem !important; }
.px-0 { padding-left: 0 !important; padding-right: 0 !important; }
.px-1 { padding-left: .125rem !important; padding-right: .125rem !important; }
.px-2 { padding-left: .25rem !important; padding-right: .25rem !important; }
.px-3 { padding-left: .5rem !important; padding-right: .5rem !important; }
.px-4 { padding-left: 1rem !important; padding-right: 1rem !important; }
.px-5 { padding-left: 2rem !important; padding-right: 2rem !important; }
.py-0 { padding-top: 0 !important; padding-bottom: 0 !important; }
.py-1 { padding-top: .125rem !important; padding-bottom: .125rem !important; }
.py-2 { padding-top: .25rem !important; padding-bottom: .25rem !important; }
.py-3 { padding-top: .5rem !important; padding-bottom: .5rem !important; }
.py-4 { padding-top: 1rem !important; padding-bottom: 1rem !important; }
.py-5 { padding-top: 2rem !important; padding-bottom: 2rem !important; }
Add support mCaptcha as captcha provider (#20458) https://mcaptcha.org/ Co-authored-by: Felipe Leopoldo Sologuren Gutiérrez <fsologureng@users.noreply.github.com>
2022-08-10 18:50:10 +05:30
@media @mediaSm {
.db-small { display: block !important; }
.w-100-small { width: 100% !important; }
Improve code comment review on mobile (#21461) - Fix placement of avatar image, this was not placed in the `comment-header-left` and add CSS to cover the limiting of width+height of avatar for code-review comment on "Files changed" page. This fixes the big noticeable avatar issue. - Apply `margin-bottom` to the "next" button, so it's consistent with the "previous" button. - Make sure the "next"/"previous" start at `flex-start` on mobile and not off-screen at `flex-end`. As well force them to have `flex: 1` so they won't overflow on x-asis. This also requires the `width: 100%` for the `.ui.buttons` div. - Resolves #20074 ### Before <details><img width="512" src="https://user-images.githubusercontent.com/25481501/195952930-09560cad-419f-43a3-a8a4-a4166c117994.jpg"></details> ### After <details><img width="512" src="https://user-images.githubusercontent.com/25481501/197340081-0365dfa8-4344-46b4-8702-a40c778c073f.jpg"></details> Co-authored-by: Lunny Xiao <xiaolunwen@gmail.com> Co-authored-by: silverwind <me@silverwind.io>
2022-10-25 16:41:49 +05:30
.js-small { justify-content: flex-start !important; }
Add support mCaptcha as captcha provider (#20458) https://mcaptcha.org/ Co-authored-by: Felipe Leopoldo Sologuren Gutiérrez <fsologureng@users.noreply.github.com>
2022-08-10 18:50:10 +05:30
}
Reference in a new issue Copy permalink