Skip to content
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

Remove fomantic button module #30475

Merged
merged 19 commits into from Apr 14, 2024
Merged

Remove fomantic button module #30475

merged 19 commits into from Apr 14, 2024

Conversation

silverwind
Copy link
Member

@silverwind silverwind commented Apr 14, 2024

CSS-only module. Button colors are reduced to this:

Screenshot 2024-04-14 at 15 36 07

@GiteaBot GiteaBot added the lgtm/need 2 This PR needs two approvals by maintainers to be considered for merging. label Apr 14, 2024
@pull-request-size pull-request-size bot added the size/XXL Denotes a PR that changes 1000+ lines, ignoring generated files. label Apr 14, 2024
@silverwind silverwind added the type/refactoring Existing code has been cleaned up. There should be no new functionality. label Apr 14, 2024
@github-actions github-actions bot added modifies/templates This PR modifies the template files modifies/js labels Apr 14, 2024
@wxiaoguang
Copy link
Contributor

I am sure there are some button colors from legacy code, like "yellow"

{{template "base/modal_actions_confirm" (dict "ModalButtonColors" "yellow")}}

Copy link
Contributor

@wxiaoguang wxiaoguang left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Too many nits ....

@GiteaBot GiteaBot added lgtm/blocked A maintainer has reservations with the PR and thus it cannot be merged and removed lgtm/need 2 This PR needs two approvals by maintainers to be considered for merging. labels Apr 14, 2024
@silverwind
Copy link
Member Author

I am sure there are some button colors from legacy code, like "yellow"

{{template "base/modal_actions_confirm" (dict "ModalButtonColors" "yellow")}}

Removed in 3b0f6d6 and also fixed one issue with the "x" here:

image

@silverwind
Copy link
Member Author

All nits are resolved or invalid in my opinion 😉

@wxiaoguang wxiaoguang dismissed their stale review April 14, 2024 14:02

dismiss change request

@GiteaBot GiteaBot added lgtm/need 2 This PR needs two approvals by maintainers to be considered for merging. and removed lgtm/blocked A maintainer has reservations with the PR and thus it cannot be merged labels Apr 14, 2024
@GiteaBot GiteaBot added lgtm/need 1 This PR needs approval from one additional maintainer to be merged. and removed lgtm/need 2 This PR needs two approvals by maintainers to be considered for merging. labels Apr 14, 2024
@silverwind
Copy link
Member Author

Wrap done. Also added a upcoming tailwind class.

image

@silverwind
Copy link
Member Author

Increased the gap. I think it looks better because the spacing between icon and content is similar to the box above:

image

flex-text-block already has a small gap, but this needed more. I think we are abusing that class a bit here, but whatever.

@wxiaoguang
Copy link
Contributor

flex-text-block already has a small gap, but this needed more. I think we are abusing that class a bit here, but whatever.

IMO it was designed to work for this case: if default gap doesn't look good, add some tw helpers to fine tune. flex-xxx only provides basic flex ability to align items.

@GiteaBot GiteaBot added lgtm/done This PR has enough approvals to get merged. There are no important open reservations anymore. and removed lgtm/need 1 This PR needs approval from one additional maintainer to be merged. labels Apr 14, 2024
@silverwind
Copy link
Member Author

silverwind commented Apr 14, 2024

One more tweak added in 604ec20. All buttons will now not wrap their text until mobile viewport. I think it is worth to try this because wrapped text in buttons almost always looks bad in desktop view.

Screenshot 2024-04-14 at 19 05 00 Screenshot 2024-04-14 at 19 05 07

web_src/css/helpers.css Outdated Show resolved Hide resolved
@silverwind silverwind added the reviewed/wait-merge This pull request is part of the merge queue. It will be merged soon. label Apr 14, 2024
@silverwind silverwind enabled auto-merge (squash) April 14, 2024 17:09
@silverwind silverwind merged commit 9946353 into go-gitea:main Apr 14, 2024
26 checks passed
@GiteaBot GiteaBot added this to the 1.23.0 milestone Apr 14, 2024
@GiteaBot GiteaBot removed the reviewed/wait-merge This pull request is part of the merge queue. It will be merged soon. label Apr 14, 2024
silverwind added a commit to silverwind/gitea that referenced this pull request Apr 14, 2024
* origin/main: (35 commits)
  Remove fomantic button module (go-gitea#30475)
  Improve "must-change-password" logic and document (go-gitea#30472)
  Fix commitstatus summary (go-gitea#30431)
  Remove fomantic menu module (go-gitea#30325)
  Use `flex-container` for dashboard layout (go-gitea#30214)
  Rewrite and restyle reaction selector and enable no-sizzle eslint rule (go-gitea#30453)
  Pulse page improvements (go-gitea#30149)
  Fix JS error when opening to expanded code comment (go-gitea#30463)
  fix: Fix to delete cookie when AppSubURL is non-empty (go-gitea#30375)
  Add `interface{}` to `any` replacement to `make fmt`, exclude `*.pb.go` (go-gitea#30461)
  Fix network error when open/close organization/individual projects and redirect to project page (go-gitea#30387)
  Avoid losing token when updating mirror settings (go-gitea#30429)
  Fix label rendering (go-gitea#30456)
  Add comment for ContainsRedirectURI about the exact match (go-gitea#30457)
  Update JS and PY deps, lock eslint and related plugins (go-gitea#30452)
  Refactor cache and disable go-chi cache (go-gitea#30417)
  Fix admin notice view-detail (go-gitea#30450)
  Fix mirror error when mirror repo is empty (go-gitea#30432)
  Add `/public/assets/img/webpack` to ignore files again (go-gitea#30451)
  Lock a few tool dependencies to major versions (go-gitea#30439)
  ...
silverwind added a commit to silverwind/gitea that referenced this pull request Apr 14, 2024
* origin/main:
  Improve flex ellipsis (go-gitea#30479)
  Remove fomantic button module (go-gitea#30475)
  Improve "must-change-password" logic and document (go-gitea#30472)
  Fix commitstatus summary (go-gitea#30431)
  Remove fomantic menu module (go-gitea#30325)
  Use `flex-container` for dashboard layout (go-gitea#30214)
  Rewrite and restyle reaction selector and enable no-sizzle eslint rule (go-gitea#30453)
  Pulse page improvements (go-gitea#30149)
  Fix JS error when opening to expanded code comment (go-gitea#30463)
  fix: Fix to delete cookie when AppSubURL is non-empty (go-gitea#30375)
  Add `interface{}` to `any` replacement to `make fmt`, exclude `*.pb.go` (go-gitea#30461)
  Fix network error when open/close organization/individual projects and redirect to project page (go-gitea#30387)
  Avoid losing token when updating mirror settings (go-gitea#30429)
zjjhot added a commit to zjjhot/gitea that referenced this pull request Apr 15, 2024
* giteaofficial/main:
  [skip ci] Updated licenses and gitignores
  Revert 100% label max-width (go-gitea#30481)
  Improve flex ellipsis (go-gitea#30479)
  Remove fomantic button module (go-gitea#30475)
  Improve "must-change-password" logic and document (go-gitea#30472)
  Fix commitstatus summary (go-gitea#30431)
  Remove fomantic menu module (go-gitea#30325)
  Use `flex-container` for dashboard layout (go-gitea#30214)
  Rewrite and restyle reaction selector and enable no-sizzle eslint rule (go-gitea#30453)
  Pulse page improvements (go-gitea#30149)
silverwind added a commit that referenced this pull request Apr 15, 2024
Previously these colors were provided by fomantic css. I missed them.

Fixes: #30499
Regressed by: #30475
silverwind added a commit that referenced this pull request Apr 16, 2024
Fixes: #30514
Fixes:
#30288 (comment)

- Fix border-radius regression from
#30475
- Fix and simplify hover state
- Move the modal HTML so it does not interfere with the CSS
- Make the star and unwatch text show on mobile. There is still plenty
of space, below is iPhone 12 viewport size

<img width="696" alt="Screenshot 2024-04-15 at 20 34 03"
src="https://github.com/go-gitea/gitea/assets/115237/af90bb00-4671-4973-a255-8eb44ee6ba8d">
<img width="230" alt="Screenshot 2024-04-15 at 20 31 42"
src="https://github.com/go-gitea/gitea/assets/115237/986ef533-7a01-4bb0-8dcd-fd19e4259e84">
<img width="233" alt="Screenshot 2024-04-15 at 20 31 47"
src="https://github.com/go-gitea/gitea/assets/115237/5b825dd8-0ccc-4d56-9d8f-774abb935b68">

---------

Co-authored-by: Giteabot <teabot@gitea.io>
silverwind added a commit to silverwind/gitea that referenced this pull request Apr 16, 2024
…ea#30503)

Fixes: go-gitea#30514
Fixes: go-gitea#30288 (comment)

- Fix border-radius regression from
go-gitea#30475
- Fix and simplify hover state
- Move the modal HTML so it does not interfere with the CSS
- Make the star and unwatch text show on mobile. There is still plenty
of space, below is iPhone 12 viewport size

<img width="696" alt="Screenshot 2024-04-15 at 20 34 03"
src="https://github.com/go-gitea/gitea/assets/115237/af90bb00-4671-4973-a255-8eb44ee6ba8d">
<img width="230" alt="Screenshot 2024-04-15 at 20 31 42"
src="https://github.com/go-gitea/gitea/assets/115237/986ef533-7a01-4bb0-8dcd-fd19e4259e84">
<img width="233" alt="Screenshot 2024-04-15 at 20 31 47"
src="https://github.com/go-gitea/gitea/assets/115237/5b825dd8-0ccc-4d56-9d8f-774abb935b68">

---------

Co-authored-by: Giteabot <teabot@gitea.io>
lunny pushed a commit that referenced this pull request Apr 24, 2024
#30525)

Backport of #30503 to v1.22, the
only change excluded is the border-radius changes which aren't necessary
on this branch because the button css was not migrated.

Fixes: #30514
Fixes:
#30288 (comment)

- Fix border-radius regression from
#30475
- Fix and simplify hover state
- Move the modal HTML so it does not interfere with the CSS
- Make the star and unwatch text show on mobile. There is still plenty
of space, below is iPhone 12 viewport size

<img width="696" alt="Screenshot 2024-04-15 at 20 34 03"
src="https://github.com/go-gitea/gitea/assets/115237/af90bb00-4671-4973-a255-8eb44ee6ba8d">
<img width="230" alt="Screenshot 2024-04-15 at 20 31 42"
src="https://github.com/go-gitea/gitea/assets/115237/986ef533-7a01-4bb0-8dcd-fd19e4259e84">
<img width="233" alt="Screenshot 2024-04-15 at 20 31 47"
src="https://github.com/go-gitea/gitea/assets/115237/5b825dd8-0ccc-4d56-9d8f-774abb935b68">
@wxiaoguang wxiaoguang modified the milestones: 1.23.0, 1.22.0 Apr 27, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
lgtm/done This PR has enough approvals to get merged. There are no important open reservations anymore. modifies/js modifies/templates This PR modifies the template files size/XXL Denotes a PR that changes 1000+ lines, ignoring generated files. type/refactoring Existing code has been cleaned up. There should be no new functionality.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

4 participants