@adcops/autocore-react 3.3.9 → 3.3.10

package/src/themes/theme-base/components/input/_radiobutton.scss

@@ -1,170 +1,170 @@
-//core
-.p-radiobutton {
-    position: relative;
-    display: inline-flex;
-    user-select: none;
-    vertical-align: bottom;
-}
-
-.p-radiobutton-input {
-    cursor: pointer;
-}
-
-.p-radiobutton-box {
-    display: flex;
-    justify-content: center;
-    align-items: center;
-}
-
-.p-radiobutton-icon {
-    -webkit-backface-visibility: hidden;
-    backface-visibility: hidden;
-    transform: translateZ(0) scale(.1);
-    border-radius: 50%;
-    visibility: hidden;
-}
-
-.p-radiobutton.p-highlight .p-radiobutton-icon {
-    transform: translateZ(0) scale(1.0, 1.0);
-    visibility: visible;
-}
-
-//theme
-.p-radiobutton {
-    width: $radiobuttonWidth;
-    height: $radiobuttonHeight;
-
-      .p-radiobutton-input {
-        appearance: none;
-        position: absolute;
-        top: 0;
-        left: 0;
-        width: 100%;
-        height: 100%;
-        padding: 0;
-        margin: 0;
-        opacity: 0;
-        z-index: 1;
-        outline: 0 none;
-        border: $radiobuttonBorder;
-        border-radius: 50%;
-    }
-
-    .p-radiobutton-box {
-        border: $radiobuttonBorder;
-        background: $inputBg;
-        width: $radiobuttonWidth;
-        height: $radiobuttonHeight;
-        color: $textColor;
-        border-radius: 50%;
-        transition: $formElementTransition;
-        outline-color: transparent;
-
-        .p-radiobutton-icon {
-            width: $radiobuttonIconSize;
-            height: $radiobuttonIconSize;
-            transition-duration: $transitionDuration;
-            background-color: $radiobuttonIconActiveColor;
-        }
-    }
-
-    &.p-highlight {
-        .p-radiobutton-box {
-            border-color: $radiobuttonActiveBorderColor;
-            background: $radiobuttonActiveBg;
-        }
-    }
-
-    &:not(.p-disabled) {
-        &:has(.p-radiobutton-input:hover) {
-            .p-radiobutton-box {
-                border-color: $inputHoverBorderColor;
-            }
-
-            &.p-highlight {
-                .p-radiobutton-box {
-                    border-color: $radiobuttonActiveHoverBorderColor;
-                    background: $radiobuttonActiveHoverBg;
-
-                    .p-radiobutton-icon {
-                        background-color: $radiobuttonIconActiveHoverColor;
-                    }
-                }
-            }
-        }
-
-        &:has(.p-radiobutton-input:focus-visible) {
-            .p-radiobutton-box {
-                @include focused-input();
-            }
-        }
-    }
-
-    &.p-invalid > .p-radiobutton-box {
-        @include invalid-input();
-    }
-
-    &.p-variant-filled {
-        .p-radiobutton-box {
-            background-color: $inputFilledBg;
-        }
-
-        &.p-highlight {
-            .p-radiobutton-box {
-                background: $radiobuttonActiveBg;
-            }
-        }
-
-        &:not(.p-disabled) {
-            &:has(.p-radiobutton-input:hover) {
-                .p-radiobutton-box {
-                    background-color: $inputFilledHoverBg;
-                }
-
-                &.p-highlight {
-                    .p-radiobutton-box {
-                        background: $radiobuttonActiveHoverBg;
-                    }
-                }
-            }
-        }
-    }
-}
-
-.p-input-filled {
-    .p-radiobutton {
-        .p-radiobutton-box {
-            background-color: $inputFilledBg;
-        }
-
-        &.p-highlight {
-            .p-radiobutton-box {
-                background: $radiobuttonActiveBg;
-            }
-        }
-
-        &:not(.p-disabled) {
-            &:has(.p-radiobutton-input:hover) {
-                .p-radiobutton-box {
-                    background-color: $inputFilledHoverBg;
-                }
-
-                &.p-highlight {
-                    .p-radiobutton-box {
-                        background: $radiobuttonActiveHoverBg;
-                    }
-                }
-            }
-        }
-    }
-}
-
-@if ($highlightBg == $radiobuttonActiveBg) {
-    .p-highlight {
-        .p-radiobutton {
-            .p-radiobutton-box {
-                border-color: $radiobuttonIconActiveColor;
-            }
-        }
-    }
+//core
+.p-radiobutton {
+    position: relative;
+    display: inline-flex;
+    user-select: none;
+    vertical-align: bottom;
+}
+
+.p-radiobutton-input {
+    cursor: pointer;
+}
+
+.p-radiobutton-box {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+}
+
+.p-radiobutton-icon {
+    -webkit-backface-visibility: hidden;
+    backface-visibility: hidden;
+    transform: translateZ(0) scale(.1);
+    border-radius: 50%;
+    visibility: hidden;
+}
+
+.p-radiobutton.p-highlight .p-radiobutton-icon {
+    transform: translateZ(0) scale(1.0, 1.0);
+    visibility: visible;
+}
+
+//theme
+.p-radiobutton {
+    width: $radiobuttonWidth;
+    height: $radiobuttonHeight;
+
+      .p-radiobutton-input {
+        appearance: none;
+        position: absolute;
+        top: 0;
+        left: 0;
+        width: 100%;
+        height: 100%;
+        padding: 0;
+        margin: 0;
+        opacity: 0;
+        z-index: 1;
+        outline: 0 none;
+        border: $radiobuttonBorder;
+        border-radius: 50%;
+    }
+
+    .p-radiobutton-box {
+        border: $radiobuttonBorder;
+        background: $inputBg;
+        width: $radiobuttonWidth;
+        height: $radiobuttonHeight;
+        color: $textColor;
+        border-radius: 50%;
+        transition: $formElementTransition;
+        outline-color: transparent;
+
+        .p-radiobutton-icon {
+            width: $radiobuttonIconSize;
+            height: $radiobuttonIconSize;
+            transition-duration: $transitionDuration;
+            background-color: $radiobuttonIconActiveColor;
+        }
+    }
+
+    &.p-highlight {
+        .p-radiobutton-box {
+            border-color: $radiobuttonActiveBorderColor;
+            background: $radiobuttonActiveBg;
+        }
+    }
+
+    &:not(.p-disabled) {
+        &:has(.p-radiobutton-input:hover) {
+            .p-radiobutton-box {
+                border-color: $inputHoverBorderColor;
+            }
+
+            &.p-highlight {
+                .p-radiobutton-box {
+                    border-color: $radiobuttonActiveHoverBorderColor;
+                    background: $radiobuttonActiveHoverBg;
+
+                    .p-radiobutton-icon {
+                        background-color: $radiobuttonIconActiveHoverColor;
+                    }
+                }
+            }
+        }
+
+        &:has(.p-radiobutton-input:focus-visible) {
+            .p-radiobutton-box {
+                @include focused-input();
+            }
+        }
+    }
+
+    &.p-invalid > .p-radiobutton-box {
+        @include invalid-input();
+    }
+
+    &.p-variant-filled {
+        .p-radiobutton-box {
+            background-color: $inputFilledBg;
+        }
+
+        &.p-highlight {
+            .p-radiobutton-box {
+                background: $radiobuttonActiveBg;
+            }
+        }
+
+        &:not(.p-disabled) {
+            &:has(.p-radiobutton-input:hover) {
+                .p-radiobutton-box {
+                    background-color: $inputFilledHoverBg;
+                }
+
+                &.p-highlight {
+                    .p-radiobutton-box {
+                        background: $radiobuttonActiveHoverBg;
+                    }
+                }
+            }
+        }
+    }
+}
+
+.p-input-filled {
+    .p-radiobutton {
+        .p-radiobutton-box {
+            background-color: $inputFilledBg;
+        }
+
+        &.p-highlight {
+            .p-radiobutton-box {
+                background: $radiobuttonActiveBg;
+            }
+        }
+
+        &:not(.p-disabled) {
+            &:has(.p-radiobutton-input:hover) {
+                .p-radiobutton-box {
+                    background-color: $inputFilledHoverBg;
+                }
+
+                &.p-highlight {
+                    .p-radiobutton-box {
+                        background: $radiobuttonActiveHoverBg;
+                    }
+                }
+            }
+        }
+    }
+}
+
+@if ($highlightBg == $radiobuttonActiveBg) {
+    .p-highlight {
+        .p-radiobutton {
+            .p-radiobutton-box {
+                border-color: $radiobuttonIconActiveColor;
+            }
+        }
+    }
 }

package/src/themes/theme-base/components/input/_rating.scss

@@ -1,81 +1,81 @@
-@use 'sass:math';
-
-// core
-.p-rating {
-    position: relative;
-    display: flex;
-    align-items: center;
-}
-
-.p-rating-item {
-    display: inline-flex;
-    align-items: center;
-    cursor: pointer;
-}
-
-.p-rating.p-readonly .p-rating-item {
-    cursor: default;
-}
-
-// theme
-.p-rating {
-    gap: $inlineSpacing;
-
-    .p-rating-item {
-        outline-color: transparent;
-        border-radius: 50%;
-        
-        .p-rating-icon {
-            color: $ratingStarIconOffColor;
-            transition: $formElementTransition;   
-            font-size: $ratingIconFontSize;
-
-            &.p-icon {
-                width: $ratingIconFontSize;
-                height: $ratingIconFontSize;
-            }
-    
-            &.p-rating-cancel {
-                color: $ratingCancelIconColor;
-            }
-        }
-
-        &.p-focus {
-            @include focused();
-        }
-
-        &.p-rating-item-active {
-            .p-rating-icon {
-                color: $ratingStarIconOnColor;
-            }
-        }
-    }
-
-    &:not(.p-disabled):not(.p-readonly) {
-        .p-rating-item {
-            &:hover {
-                .p-rating-icon {
-                    color: $ratingStarIconHoverColor;
-
-                    &.p-rating-cancel {
-                        color: $ratingCancelIconHoverColor;
-                    }
-                }
-            }
-        }
-    }
-}
-
-@if ($highlightBg == $ratingStarIconOnColor) {
-    .p-highlight {
-        .p-rating {
-            .p-rating-item {
-                &.p-rating-item-active {
-                    .p-rating-icon {
-                        color: $highlightTextColor;
-                    }
-                }
-            }
-        }
-    }
+@use 'sass:math';
+
+// core
+.p-rating {
+    position: relative;
+    display: flex;
+    align-items: center;
+}
+
+.p-rating-item {
+    display: inline-flex;
+    align-items: center;
+    cursor: pointer;
+}
+
+.p-rating.p-readonly .p-rating-item {
+    cursor: default;
+}
+
+// theme
+.p-rating {
+    gap: $inlineSpacing;
+
+    .p-rating-item {
+        outline-color: transparent;
+        border-radius: 50%;
+        
+        .p-rating-icon {
+            color: $ratingStarIconOffColor;
+            transition: $formElementTransition;   
+            font-size: $ratingIconFontSize;
+
+            &.p-icon {
+                width: $ratingIconFontSize;
+                height: $ratingIconFontSize;
+            }
+    
+            &.p-rating-cancel {
+                color: $ratingCancelIconColor;
+            }
+        }
+
+        &.p-focus {
+            @include focused();
+        }
+
+        &.p-rating-item-active {
+            .p-rating-icon {
+                color: $ratingStarIconOnColor;
+            }
+        }
+    }
+
+    &:not(.p-disabled):not(.p-readonly) {
+        .p-rating-item {
+            &:hover {
+                .p-rating-icon {
+                    color: $ratingStarIconHoverColor;
+
+                    &.p-rating-cancel {
+                        color: $ratingCancelIconHoverColor;
+                    }
+                }
+            }
+        }
+    }
+}
+
+@if ($highlightBg == $ratingStarIconOnColor) {
+    .p-highlight {
+        .p-rating {
+            .p-rating-item {
+                &.p-rating-item-active {
+                    .p-rating-icon {
+                        color: $highlightTextColor;
+                    }
+                }
+            }
+        }
+    }
 }

package/src/themes/theme-base/components/input/_selectbutton.scss

@@ -1,50 +1,50 @@
-.p-selectbutton {
-    .p-button {
-        background: $toggleButtonBg;
-        border: $toggleButtonBorder;
-        color: $toggleButtonTextColor;
-        transition: $formElementTransition;
-
-        .p-button-icon-left,
-        .p-button-icon-right {
-            color: $toggleButtonIconColor;
-        }
-
-        &:not(.p-disabled):not(.p-highlight):hover {
-            background: $toggleButtonHoverBg;
-            border-color: $toggleButtonHoverBorderColor;
-            color: $toggleButtonTextHoverColor;
-
-            .p-button-icon-left,
-            .p-button-icon-right {
-                color: $toggleButtonIconHoverColor;
-            }
-        }
-
-        &.p-highlight {
-            background: $toggleButtonActiveBg;
-            border-color: $toggleButtonActiveBorderColor;
-            color: $toggleButtonTextActiveColor;
-
-            .p-button-icon-left,
-            .p-button-icon-right {
-                color: $toggleButtonIconActiveColor;
-            }
-
-            &:hover {
-                background: $toggleButtonActiveHoverBg;
-                border-color: $toggleButtonActiveHoverBorderColor;
-                color: $toggleButtonTextActiveHoverColor;
-
-                .p-button-icon-left,
-                .p-button-icon-right {
-                    color: $toggleButtonIconActiveHoverColor;
-                }
-            }
-        }
-    }
-
-    &.p-invalid > .p-button {
-        @include invalid-input();
-    }
+.p-selectbutton {
+    .p-button {
+        background: $toggleButtonBg;
+        border: $toggleButtonBorder;
+        color: $toggleButtonTextColor;
+        transition: $formElementTransition;
+
+        .p-button-icon-left,
+        .p-button-icon-right {
+            color: $toggleButtonIconColor;
+        }
+
+        &:not(.p-disabled):not(.p-highlight):hover {
+            background: $toggleButtonHoverBg;
+            border-color: $toggleButtonHoverBorderColor;
+            color: $toggleButtonTextHoverColor;
+
+            .p-button-icon-left,
+            .p-button-icon-right {
+                color: $toggleButtonIconHoverColor;
+            }
+        }
+
+        &.p-highlight {
+            background: $toggleButtonActiveBg;
+            border-color: $toggleButtonActiveBorderColor;
+            color: $toggleButtonTextActiveColor;
+
+            .p-button-icon-left,
+            .p-button-icon-right {
+                color: $toggleButtonIconActiveColor;
+            }
+
+            &:hover {
+                background: $toggleButtonActiveHoverBg;
+                border-color: $toggleButtonActiveHoverBorderColor;
+                color: $toggleButtonTextActiveHoverColor;
+
+                .p-button-icon-left,
+                .p-button-icon-right {
+                    color: $toggleButtonIconActiveHoverColor;
+                }
+            }
+        }
+    }
+
+    &.p-invalid > .p-button {
+        @include invalid-input();
+    }
 }