feat(mail): center-align action button in email template
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -47,3 +47,26 @@
|
||||
.bg-custom-background {
|
||||
background-color: rgb(var(--v-table-header-color));
|
||||
}
|
||||
|
||||
// ---------------------------------------------------------------------------
|
||||
// Vuexy (Bootstrap 5) parity — spacing + horizontal rules in cards
|
||||
// (e.g. form-layouts-horizontal “Form separator”)
|
||||
// ---------------------------------------------------------------------------
|
||||
|
||||
.my-6 {
|
||||
margin-block-end: 1.5rem !important;
|
||||
margin-block-start: 1.5rem !important;
|
||||
}
|
||||
|
||||
.mx-n6 {
|
||||
margin-inline-end: -1.5rem !important;
|
||||
margin-inline-start: -1.5rem !important;
|
||||
}
|
||||
|
||||
// BS: `.card hr { color: var(--bs-card-border-color); }` — Vuetify card border token
|
||||
.v-card .v-card-text hr {
|
||||
border: 0;
|
||||
border-top: 1px solid rgba(var(--v-border-color), var(--v-border-opacity));
|
||||
color: rgba(var(--v-border-color), var(--v-border-opacity));
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
@@ -1,3 +1,58 @@
|
||||
.v-card-subtitle {
|
||||
color: rgba(var(--v-theme-on-background), 0.55);
|
||||
}
|
||||
|
||||
/* Card border shadow — colored bottom border with hover effect */
|
||||
.v-card[class*="card-border-shadow-"] {
|
||||
position: relative;
|
||||
overflow: visible;
|
||||
border-block-end: none;
|
||||
transition: box-shadow 0.3s ease;
|
||||
|
||||
&::after {
|
||||
position: absolute;
|
||||
border-radius: inherit;
|
||||
block-size: 100%;
|
||||
border-block-end: 0.125rem solid var(--card-border-bottom-color, rgba(var(--v-theme-on-surface), 0.12));
|
||||
content: "";
|
||||
inline-size: 100%;
|
||||
inset-block-end: 0;
|
||||
inset-inline-start: 0;
|
||||
pointer-events: none;
|
||||
transition: border-color 0.3s ease, border-width 0.3s ease;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
box-shadow: 0 0.25rem 1.125rem rgba(var(--v-theme-on-surface), 0.16) !important;
|
||||
|
||||
&::after {
|
||||
border-color: var(--card-hover-border-bottom-color, rgba(var(--v-theme-on-surface), 0.3));
|
||||
border-block-end-width: 0.1875rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.v-card.card-border-shadow-primary {
|
||||
--card-border-bottom-color: rgba(var(--v-theme-primary), 0.38);
|
||||
--card-hover-border-bottom-color: rgb(var(--v-theme-primary));
|
||||
}
|
||||
|
||||
.v-card.card-border-shadow-warning {
|
||||
--card-border-bottom-color: rgba(var(--v-theme-warning), 0.38);
|
||||
--card-hover-border-bottom-color: rgb(var(--v-theme-warning));
|
||||
}
|
||||
|
||||
.v-card.card-border-shadow-info {
|
||||
--card-border-bottom-color: rgba(var(--v-theme-info), 0.38);
|
||||
--card-hover-border-bottom-color: rgb(var(--v-theme-info));
|
||||
}
|
||||
|
||||
.v-card.card-border-shadow-success {
|
||||
--card-border-bottom-color: rgba(var(--v-theme-success), 0.38);
|
||||
--card-hover-border-bottom-color: rgb(var(--v-theme-success));
|
||||
}
|
||||
|
||||
.v-card.card-border-shadow-error {
|
||||
--card-border-bottom-color: rgba(var(--v-theme-error), 0.38);
|
||||
--card-hover-border-bottom-color: rgb(var(--v-theme-error));
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user