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

Improve alert and popover style #4349

Merged

Conversation

manuelmeister
Copy link
Member

  • Fix activator button not the same size as when popover is open
  • Increase text contrast of warning alert

@manuelmeister manuelmeister added type: Frontend UX/UI deploy! Creates a feature branch deployment for this PR labels Dec 29, 2023
@manuelmeister manuelmeister marked this pull request as ready for review December 29, 2023 18:03
Copy link

github-actions bot commented Dec 29, 2023

Feature branch deployment currently inactive.

If the PR is still open, you can add the deploy! label to this PR to trigger a feature branch deployment.

@manuelmeister manuelmeister changed the title Improve alert and popover Improve alert and popover style Jan 3, 2024
@pmattmann
Copy link
Member

Can you provide an example of what changes - so I don't have to search 🙈
thx 😊

@manuelmeister
Copy link
Member Author

manuelmeister commented Jan 3, 2024

@pmattmann the alert styling on the login page
image

and the activator button of the delete popover inside the team edit dialog
image

Comment on lines 75 to 84

.v-alert.warning--text {
.v-alert__icon {
color: #d25f00 !important;
}
.v-alert__content {
color: #972e00 !important;
}
border-color: #ffe0b2 !important;
}
Copy link
Member

Choose a reason for hiding this comment

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

👍

@@ -12,7 +12,7 @@
<template #activator="{ attrs, on }">
<slot name="activator" v-bind="{ attrs, on }" />
</template>
<div class="ec-activator" @click="open = false">
<div class="ec-activator v-card__actions pa-0" @click="open = false">
Copy link
Member

Choose a reason for hiding this comment

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

I can't tell the difference

Copy link
Member Author

Choose a reason for hiding this comment

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

Before:
Bildschirmfoto 2024-01-04 um 08 56 30

After:
Bildschirmfoto 2024-01-04 um 08 55 42

The button should now be the same width as the activator button on desktop

@carlobeltrame carlobeltrame added this pull request to the merge queue Jan 6, 2024
Merged via the queue into ecamp:devel with commit 6669ba5 Jan 6, 2024
32 checks passed
@manuelmeister manuelmeister deleted the feature/improve-alert-and-prompt branch January 6, 2024 22:32
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
deploy! Creates a feature branch deployment for this PR type: Frontend UX/UI
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

3 participants