mirror of
https://gitlab.dit.htwk-leipzig.de/htwk-software/htwkalender.git
synced 2025-08-11 14:13:49 +02:00
fix:#53 linted formatted frontend files
This commit is contained in:
@@ -1,185 +1,188 @@
|
||||
// core
|
||||
.p-message-wrapper {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.p-message-icon {
|
||||
flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.p-message-close {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-shrink: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.p-message-close.p-link {
|
||||
margin-left: auto;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
margin-left: auto;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.p-message-enter-from {
|
||||
opacity: 0;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.p-message-enter-active {
|
||||
transition: opacity 0.3s;
|
||||
transition: opacity 0.3s;
|
||||
}
|
||||
|
||||
.p-message.p-message-leave-from {
|
||||
max-height: 1000px;
|
||||
max-height: 1000px;
|
||||
}
|
||||
|
||||
.p-message.p-message-leave-to {
|
||||
max-height: 0;
|
||||
opacity: 0;
|
||||
margin: 0;
|
||||
max-height: 0;
|
||||
opacity: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.p-message-leave-active {
|
||||
overflow: hidden;
|
||||
transition: max-height 0.3s cubic-bezier(0, 1, 0, 1), opacity 0.3s, margin 0.15s;
|
||||
overflow: hidden;
|
||||
transition:
|
||||
max-height 0.3s cubic-bezier(0, 1, 0, 1),
|
||||
opacity 0.3s,
|
||||
margin 0.15s;
|
||||
}
|
||||
|
||||
.p-message-leave-active .p-message-close {
|
||||
display: none;
|
||||
display: none;
|
||||
}
|
||||
|
||||
// theme
|
||||
.p-message {
|
||||
margin: $messageMargin;
|
||||
border-radius: $borderRadius;
|
||||
margin: $messageMargin;
|
||||
border-radius: $borderRadius;
|
||||
|
||||
.p-message-wrapper {
|
||||
padding: $messagePadding;
|
||||
.p-message-wrapper {
|
||||
padding: $messagePadding;
|
||||
}
|
||||
|
||||
.p-message-close {
|
||||
width: $actionIconWidth;
|
||||
height: $actionIconHeight;
|
||||
border-radius: $actionIconBorderRadius;
|
||||
background: transparent;
|
||||
transition: $actionIconTransition;
|
||||
outline-color: transparent;
|
||||
|
||||
&:hover {
|
||||
background: rgba(255, 255, 255, 0.5);
|
||||
}
|
||||
|
||||
&:focus-visible {
|
||||
@include focused();
|
||||
}
|
||||
}
|
||||
|
||||
&.p-message-info {
|
||||
background: $infoMessageBg;
|
||||
border: $infoMessageBorder;
|
||||
border-width: $messageBorderWidth;
|
||||
color: $infoMessageTextColor;
|
||||
|
||||
.p-message-icon {
|
||||
color: $infoMessageIconColor;
|
||||
}
|
||||
|
||||
.p-message-close {
|
||||
width: $actionIconWidth;
|
||||
height: $actionIconHeight;
|
||||
border-radius: $actionIconBorderRadius;
|
||||
background: transparent;
|
||||
transition: $actionIconTransition;
|
||||
outline-color: transparent;
|
||||
|
||||
&:hover {
|
||||
background: rgba(255, 255, 255, 0.5);
|
||||
}
|
||||
|
||||
&:focus-visible {
|
||||
@include focused();
|
||||
}
|
||||
color: $infoMessageIconColor;
|
||||
}
|
||||
}
|
||||
|
||||
&.p-message-info {
|
||||
background: $infoMessageBg;
|
||||
border: $infoMessageBorder;
|
||||
border-width: $messageBorderWidth;
|
||||
color: $infoMessageTextColor;
|
||||
|
||||
.p-message-icon {
|
||||
color: $infoMessageIconColor;
|
||||
}
|
||||
|
||||
.p-message-close {
|
||||
color: $infoMessageIconColor;
|
||||
}
|
||||
}
|
||||
|
||||
&.p-message-success {
|
||||
background: $successMessageBg;
|
||||
border: $successMessageBorder;
|
||||
border-width: $messageBorderWidth;
|
||||
color: $successMessageTextColor;
|
||||
|
||||
.p-message-icon {
|
||||
color: $successMessageIconColor;
|
||||
}
|
||||
|
||||
.p-message-close {
|
||||
color: $successMessageIconColor;
|
||||
}
|
||||
}
|
||||
|
||||
&.p-message-warn {
|
||||
background: $warningMessageBg;
|
||||
border: $warningMessageBorder;
|
||||
border-width: $messageBorderWidth;
|
||||
color: $warningMessageTextColor;
|
||||
|
||||
.p-message-icon {
|
||||
color: $warningMessageIconColor;
|
||||
}
|
||||
|
||||
.p-message-close {
|
||||
color: $warningMessageIconColor;
|
||||
}
|
||||
}
|
||||
|
||||
&.p-message-error {
|
||||
background: $errorMessageBg;
|
||||
border: $errorMessageBorder;
|
||||
border-width: $messageBorderWidth;
|
||||
color: $errorMessageTextColor;
|
||||
|
||||
.p-message-icon {
|
||||
color: $errorMessageIconColor;
|
||||
}
|
||||
|
||||
.p-message-close {
|
||||
color: $errorMessageIconColor;
|
||||
}
|
||||
}
|
||||
|
||||
@if variable-exists(secondaryMessageBg) {
|
||||
&.p-message-secondary {
|
||||
background: $secondaryMessageBg;
|
||||
border: $secondaryMessageBorder;
|
||||
border-width: $messageBorderWidth;
|
||||
color: $secondaryMessageTextColor;
|
||||
|
||||
.p-message-icon {
|
||||
color: $secondaryMessageIconColor;
|
||||
}
|
||||
|
||||
.p-message-close {
|
||||
color: $secondaryMessageIconColor;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@if variable-exists(contrastMessageBg) {
|
||||
&.p-message-contrast {
|
||||
background: $contrastMessageBg;
|
||||
border: $contrastMessageBorder;
|
||||
border-width: $messageBorderWidth;
|
||||
color: $contrastMessageTextColor;
|
||||
|
||||
.p-message-icon {
|
||||
color: $contrastMessageIconColor;
|
||||
}
|
||||
|
||||
.p-message-close {
|
||||
color: $contrastMessageIconColor;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.p-message-text {
|
||||
font-size: $messageTextFontSize;
|
||||
font-weight: $messageTextFontWeight;
|
||||
}
|
||||
&.p-message-success {
|
||||
background: $successMessageBg;
|
||||
border: $successMessageBorder;
|
||||
border-width: $messageBorderWidth;
|
||||
color: $successMessageTextColor;
|
||||
|
||||
.p-message-icon {
|
||||
font-size: $messageIconFontSize;
|
||||
margin-right: $inlineSpacing;
|
||||
color: $successMessageIconColor;
|
||||
}
|
||||
|
||||
.p-icon:not(.p-message-close-icon) {
|
||||
width: $messageIconFontSize;
|
||||
height: $messageIconFontSize;
|
||||
.p-message-close {
|
||||
color: $successMessageIconColor;
|
||||
}
|
||||
}
|
||||
|
||||
&.p-message-warn {
|
||||
background: $warningMessageBg;
|
||||
border: $warningMessageBorder;
|
||||
border-width: $messageBorderWidth;
|
||||
color: $warningMessageTextColor;
|
||||
|
||||
.p-message-icon {
|
||||
color: $warningMessageIconColor;
|
||||
}
|
||||
|
||||
.p-message-close {
|
||||
color: $warningMessageIconColor;
|
||||
}
|
||||
}
|
||||
|
||||
&.p-message-error {
|
||||
background: $errorMessageBg;
|
||||
border: $errorMessageBorder;
|
||||
border-width: $messageBorderWidth;
|
||||
color: $errorMessageTextColor;
|
||||
|
||||
.p-message-icon {
|
||||
color: $errorMessageIconColor;
|
||||
}
|
||||
|
||||
.p-message-close {
|
||||
color: $errorMessageIconColor;
|
||||
}
|
||||
}
|
||||
|
||||
@if variable-exists(secondaryMessageBg) {
|
||||
&.p-message-secondary {
|
||||
background: $secondaryMessageBg;
|
||||
border: $secondaryMessageBorder;
|
||||
border-width: $messageBorderWidth;
|
||||
color: $secondaryMessageTextColor;
|
||||
|
||||
.p-message-icon {
|
||||
color: $secondaryMessageIconColor;
|
||||
}
|
||||
|
||||
.p-message-close {
|
||||
color: $secondaryMessageIconColor;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@if variable-exists(contrastMessageBg) {
|
||||
&.p-message-contrast {
|
||||
background: $contrastMessageBg;
|
||||
border: $contrastMessageBorder;
|
||||
border-width: $messageBorderWidth;
|
||||
color: $contrastMessageTextColor;
|
||||
|
||||
.p-message-icon {
|
||||
color: $contrastMessageIconColor;
|
||||
}
|
||||
|
||||
.p-message-close {
|
||||
color: $contrastMessageIconColor;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.p-message-text {
|
||||
font-size: $messageTextFontSize;
|
||||
font-weight: $messageTextFontWeight;
|
||||
}
|
||||
|
||||
.p-message-icon {
|
||||
font-size: $messageIconFontSize;
|
||||
margin-right: $inlineSpacing;
|
||||
}
|
||||
|
||||
.p-icon:not(.p-message-close-icon) {
|
||||
width: $messageIconFontSize;
|
||||
height: $messageIconFontSize;
|
||||
}
|
||||
}
|
||||
|
Reference in New Issue
Block a user