-
-
Notifications
You must be signed in to change notification settings - Fork 8.7k
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
Update buttons to use new classes on the dashboard #6799
Conversation
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 nice 👏🏻
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.
Not intentional - Might need to clear cache there, your screenshot is showing the old style buttons. I've just reran it again on my end and it produces what's seen in the screenshot - |
Ok clearing cache worked, for me clicking the button size changes doesn't seem to work. it worked for one click on S but then I couldn't get back to L, when I cleared by cookies I can't change the size any more |
Can't seem to reproduce that in Safari or Chrome. Screen.Recording.2022-07-14.at.18.28.39.mov |
How are you testing? I'm using If I request the URL http://localhost:8080/jenkins/iconSize?24x24 and I have a breakpoint at
If I add a trailing slash then it's correctly invoked: This seems to be a pre-existing issue and I can reproduce it on master, would be good to hear someone else can as well though. |
I'm doing the same but can't seem to reproduce it on |
A bunch, including some with strange names for CSRF, I'll try from a clean one later on |
Is this PR good to move forward without that? |
Yes (as I could reproduce on master as well) |
/label ready-for-merge This PR is now ready for merge, after ~24 hours, we will merge it if there's no negative feedback. Thanks! |
Please stop taking out color out of design elements. These buttons were blue to indicate that they are clickable. What's separating them now from the rest of the text? |
Probably causes JENKINS-70247. |
Confirmed through bisection. |
Small PR to update the design of the
.jenkins-button
classes as well as to use the classes on the dashboard. This is the first part of several PRs to update buttons across Jenkins (see the closed #5897 for a rough end goal).Before
![image](https://user-images.githubusercontent.com/43062514/177791054-3f4f6e7d-5dd2-4841-a40e-94171c07fa79.png)
After
![image](https://user-images.githubusercontent.com/43062514/177790797-ab983834-72bd-47aa-8a80-60d48c51367b.png)
It's rather hard to tell any major differences here (apart from color), the key differences are the hover/focus states:
Before
Screen.Recording.2022-07-07.at.14.56.34.mov
After
Screen.Recording.2022-07-07.at.14.58.34.mov
New keyboard focus state
![Screenshot 2022-07-07 at 14 59 35](https://user-images.githubusercontent.com/43062514/177791938-a99ce933-1f51-4277-bc4e-45f2d0196b5e.png)
What else?
.jenkins-button
appearance (slightly more rounded/padded, icons are larger).jenkins-button--destructive
), you can now use semantic and palette classes to the same thing (e.g..jenkins-button .jenkins-!-destructive-color
).jenkins-button--transparent
has been renamed to.jenkins-button--tertiary
Seeing as
.jenkins-button
isn't used anywhere apart from Jenkins/Design Library it should be fine to make these breaking changes without backwards compatibility. I'll update Design Library to support these changes.Proposed changelog entries
Proposed upgrade guidelines
N/A
Submitter checklist
Proposed changelog entries
section only if there are breaking changes or other changes which may require extra steps from users during the upgrade@Restricted
or have@since TODO
Javadoc, as appropriate.@Deprecated(since = "TODO")
or@Deprecated(forRemoval = true, since = "TODO")
if applicable.Desired reviewers
@jenkinsci/sig-ux
Maintainer checklist
Before the changes are marked as
ready-for-merge
:Proposed changelog entries
are accurate, human-readable, and in the imperative moodupgrade-guide-needed
label is set and there is aProposed upgrade guidelines
section in the PR title. (example)lts-candidate
to be considered (see query).