aril 0.0.7 → 0.0.9

package/theme/styles/layout/layout.scss

@@ -1,24 +1,24 @@
-$breakpoint:992px !default;
-$scale:14px !default;
-
-@import './_fonts';
-@import './_animation';
-@import './_layout_light';
-@import './_layout_dim';
-@import './_layout_dark';
-@import './_main';
-@import './_sidebar_vertical';
-@import './_sidebar_slim';
-@import './_sidebar_slim_plus';
-@import './_sidebar_horizontal';
-@import './_sidebar_reveal';
-@import './_sidebar_drawer';
-@import './menutheme/_menutheme';
-@import './_responsive';
-@import './_topbar';
-@import './_breadcrumb';
-@import './_profile';
-@import './_config';
-@import './_content';
-@import './_typography';
-@import './_utils';
+$breakpoint: 992px !default;
+$scale: 14px !default;
+
+@import './_fonts';
+@import './_animation';
+@import './_layout_light';
+@import './_layout_dim';
+@import './_layout_dark';
+@import './_main';
+@import './_sidebar_vertical';
+@import './_sidebar_slim';
+@import './_sidebar_slim_plus';
+@import './_sidebar_horizontal';
+@import './_sidebar_reveal';
+@import './_sidebar_drawer';
+@import './menutheme/_menutheme';
+@import './_responsive';
+@import './_topbar';
+@import './_breadcrumb';
+@import './_profile';
+@import './_config';
+@import './_content';
+@import './_typography';
+@import './_utils';

package/theme/styles/layout/menutheme/_colorscheme.scss

@@ -1,11 +1,11 @@
-.layout-colorscheme-menu {
-    --logo-color: var(--primary-color);
-    --menu-bg: var(--surface-overlay);
-    --root-menuitem-text-color: var(--primary-color);
-    --menuitem-text-color: var(--text-color);
-    --menuitem-icon-color: var(--primary-color);
-    --menuitem-hover-bg-color: var(--surface-hover);
-    --popup-submenu-item-text-color: var(--text-color);
-    --popup-submenu-item-icon-color: var(--primary-color);
-    --popup-submenu-item-hover-bg-color: var(--surface-hover);
-}
+.layout-colorscheme-menu {
+	--logo-color: var(--primary-color);
+	--menu-bg: var(--surface-overlay);
+	--root-menuitem-text-color: var(--primary-color);
+	--menuitem-text-color: var(--text-color);
+	--menuitem-icon-color: var(--primary-color);
+	--menuitem-hover-bg-color: var(--surface-hover);
+	--popup-submenu-item-text-color: var(--text-color);
+	--popup-submenu-item-icon-color: var(--primary-color);
+	--popup-submenu-item-hover-bg-color: var(--surface-hover);
+}

package/theme/styles/layout/menutheme/_menutheme.scss

@@ -1,3 +1,3 @@
-@import './_colorscheme';
-@import './_primarycolor';
-@import './_transparent';
+@import './_colorscheme';
+@import './_primarycolor';
+@import './_transparent';

package/theme/styles/layout/menutheme/_primarycolor.scss

@@ -1,16 +1,16 @@
-.layout-primarycolor-menu {
-    --logo-color: var(--primary-color-text);
-    --menu-bg: linear-gradient(to left top, var(--primary-400), var(--primary-500), var(--primary-600));
-    --root-menuitem-text-color: var(--primary-color-text);
-    --menuitem-text-color: var(--primary-color-text);
-    --menuitem-icon-color: var(--primary-color-text);
-    --menuitem-hover-bg-color: rgba(255,255,255,.1);
-    --popup-submenu-item-text-color: var(--text-color);
-    --popup-submenu-item-icon-color: var(--primary-color);
-    --popup-submenu-item-hover-bg-color: var(--surface-hover);
-}
-
-.layout-dark.layout-primarycolor-menu,
-.layout-dim.layout-primarycolor-menu {
-    --menu-bg: linear-gradient(to left top, var(--primary-300), var(--primary-400), var(--primary-500));
-}
+.layout-primarycolor-menu {
+	--logo-color: var(--primary-color-text);
+	--menu-bg: linear-gradient(to left top, var(--primary-400), var(--primary-500), var(--primary-600));
+	--root-menuitem-text-color: var(--primary-color-text);
+	--menuitem-text-color: var(--primary-color-text);
+	--menuitem-icon-color: var(--primary-color-text);
+	--menuitem-hover-bg-color: rgba(255, 255, 255, 0.1);
+	--popup-submenu-item-text-color: var(--text-color);
+	--popup-submenu-item-icon-color: var(--primary-color);
+	--popup-submenu-item-hover-bg-color: var(--surface-hover);
+}
+
+.layout-dark.layout-primarycolor-menu,
+.layout-dim.layout-primarycolor-menu {
+	--menu-bg: linear-gradient(to left top, var(--primary-300), var(--primary-400), var(--primary-500));
+}

package/theme/styles/layout/menutheme/_transparent.scss

@@ -1,26 +1,26 @@
-.layout-transparent-menu {
-    --logo-color: var(--primary-color);
-    --menu-bg: var(--surface-overlay);
-    --root-menuitem-text-color: var(--primary-color);
-    --menuitem-text-color: var(--text-color);
-    --menuitem-icon-color: var(--primary-color);
-    --menuitem-hover-bg-color: var(--surface-hover);
-    --popup-submenu-item-text-color: var(--text-color);
-    --popup-submenu-item-icon-color: var(--primary-color);
-    --popup-submenu-item-hover-bg-color: var(--surface-hover);
-}
-
-@media screen and (min-width: $breakpoint) {
-    .layout-container.layout-transparent-menu {
-        &.layout-static,
-        &.layout-slim,
-        &.layout-slim-plus,
-        &.layout-horizontal {
-            .layout-sidebar {
-                background-color: transparent;
-                border-right: 1px solid transparent;
-                box-shadow: none;
-            }
-        }
-    }
-}
+.layout-transparent-menu {
+	--logo-color: var(--primary-color);
+	--menu-bg: var(--surface-overlay);
+	--root-menuitem-text-color: var(--primary-color);
+	--menuitem-text-color: var(--text-color);
+	--menuitem-icon-color: var(--primary-color);
+	--menuitem-hover-bg-color: var(--surface-hover);
+	--popup-submenu-item-text-color: var(--text-color);
+	--popup-submenu-item-icon-color: var(--primary-color);
+	--popup-submenu-item-hover-bg-color: var(--surface-hover);
+}
+
+@media screen and (min-width: $breakpoint) {
+	.layout-container.layout-transparent-menu {
+		&.layout-static,
+		&.layout-slim,
+		&.layout-slim-plus,
+		&.layout-horizontal {
+			.layout-sidebar {
+				background-color: transparent;
+				border-right: 1px solid transparent;
+				box-shadow: none;
+			}
+		}
+	}
+}

package/theme/styles/layout/preloading.scss

@@ -1,84 +1,84 @@
-.layout-preloader-container {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    height: 100vh;
-    width: 100vw;
-    background-color: #111417;
-
-    .layout-preloader {
-        position: relative;
-        width: 75px;
-        height: 75px;
-        background: transparent;
-        border: 3px solid #161a1f;
-        border-radius: 50%;
-        text-align: center;
-        line-height: 150px;
-        font-family: sans-serif;
-        font-size: 20px;
-        color: #6366F1;
-        letter-spacing: 4px;
-        text-transform: uppercase;
-        text-shadow: 0 0 10px #6366F1;
-        box-shadow: 0 0 20px rgba(0, 0, 0, .5);
-    
-        &:before {
-            content: '';
-            position: absolute;
-            top: -3px;
-            left: -3px;
-            width: 100%;
-            height: 100%;
-            border: 3px solid transparent;
-            border-top: 3px solid #6366F1;
-            border-right: 3px solid #6366F1;
-            border-radius: 50%;
-            animation: preloader-rotate-c 1s linear infinite;
-        }
-    
-        span {
-            display: block;
-            position: absolute;
-            top: calc(50% - 2px);
-            left: 50%;
-            width: 50%;
-            height: 4px;
-            background: transparent;
-            transform-origin: left;
-            animation: preloader-rotate 1s linear infinite;
-        }
-    
-        span:before {
-            content: '';
-            position: absolute;
-            width: 16px;
-            height: 16px;
-            border-radius: 50%;
-            background: #6366F1;
-            top: -6px;
-            right: -8px;
-            box-shadow: 0 0 20px #6366F1;
-        }
-    }
-}
-
-@keyframes preloader-rotate-c {
-    0% {
-        transform: rotate(0deg);
-    }
-
-    100% {
-        transform: rotate(360deg);
-    }
-}
-
-@keyframes preloader-rotate {
-    0% {
-        transform: rotate(45deg);
-    }
-
-    100% {
-        transform: rotate(405deg);
-    }
-}
+.layout-preloader-container {
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	height: 100vh;
+	width: 100vw;
+	background-color: #111417;
+
+	.layout-preloader {
+		position: relative;
+		width: 75px;
+		height: 75px;
+		background: transparent;
+		border: 3px solid #161a1f;
+		border-radius: 50%;
+		text-align: center;
+		line-height: 150px;
+		font-family: sans-serif;
+		font-size: 20px;
+		color: #6366f1;
+		letter-spacing: 4px;
+		text-transform: uppercase;
+		text-shadow: 0 0 10px #6366f1;
+		box-shadow: 0 0 20px rgba(0, 0, 0, 0.5);
+
+		&:before {
+			content: '';
+			position: absolute;
+			top: -3px;
+			left: -3px;
+			width: 100%;
+			height: 100%;
+			border: 3px solid transparent;
+			border-top: 3px solid #6366f1;
+			border-right: 3px solid #6366f1;
+			border-radius: 50%;
+			animation: preloader-rotate-c 1s linear infinite;
+		}
+
+		span {
+			display: block;
+			position: absolute;
+			top: calc(50% - 2px);
+			left: 50%;
+			width: 50%;
+			height: 4px;
+			background: transparent;
+			transform-origin: left;
+			animation: preloader-rotate 1s linear infinite;
+		}
+
+		span:before {
+			content: '';
+			position: absolute;
+			width: 16px;
+			height: 16px;
+			border-radius: 50%;
+			background: #6366f1;
+			top: -6px;
+			right: -8px;
+			box-shadow: 0 0 20px #6366f1;
+		}
+	}
+}
+
+@keyframes preloader-rotate-c {
+	0% {
+		transform: rotate(0deg);
+	}
+
+	100% {
+		transform: rotate(360deg);
+	}
+}
+
+@keyframes preloader-rotate {
+	0% {
+		transform: rotate(45deg);
+	}
+
+	100% {
+		transform: rotate(405deg);
+	}
+}

package/theme/styles/theme/base/_colors.scss

@@ -1,18 +1,17 @@
 :root {
-  @if variable-exists(colors) {
-    @each $name, $color in $colors {
-        @for $i from 0 through 5 {
-            @if ($i == 0) {
-                --#{$name}-50:#{tint($color, (5 - $i) * 19%)};
-            }
-            @else {
-                --#{$name}-#{$i * 100}:#{tint($color, (5 - $i) * 19%)};
-            }
-        }
+	@if variable-exists(colors) {
+		@each $name, $color in $colors {
+			@for $i from 0 through 5 {
+				@if ($i == 0) {
+					--#{$name}-50: #{tint($color, (5 - $i) * 19%)};
+				} @else {
+					--#{$name}-#{$i * 100}: #{tint($color, (5 - $i) * 19%)};
+				}
+			}
 
-        @for $i from 1 through 4 {
-            --#{$name}-#{($i + 5) * 100}:#{shade($color, $i * 15%)};
-        }
-    }
-  }
+			@for $i from 1 through 4 {
+				--#{$name}-#{($i + 5) * 100}: #{shade($color, $i * 15%)};
+			}
+		}
+	}
 }

package/theme/styles/theme/base/_common.scss

@@ -3,73 +3,74 @@
 }
 
 .p-component {
-    font-family: var(--font-family);
-    font-feature-settings: var(--font-feature-settings, normal);
-    font-size: $fontSize;
-    font-weight: $fontWeight;
+	font-family: var(--font-family);
+	font-feature-settings: var(--font-feature-settings, normal);
+	font-size: $fontSize;
+	font-weight: $fontWeight;
 }
 
 .p-component-overlay {
-    background-color: $maskBg;
-    transition-duration: $transitionDuration;
+	background-color: $maskBg;
+	transition-duration: $transitionDuration;
 }
 
-.p-disabled, .p-component:disabled {
-    opacity: $disabledOpacity;
+.p-disabled,
+.p-component:disabled {
+	opacity: $disabledOpacity;
 }
 
 .p-error {
-    color: $errorColor;
+	color: $errorColor;
 }
 
 .p-text-secondary {
-    color: $textSecondaryColor;
+	color: $textSecondaryColor;
 }
 
 .pi {
-    font-size: $primeIconFontSize;
+	font-size: $primeIconFontSize;
 }
 
 .p-icon {
-    width: $primeIconFontSize;
-    height: $primeIconFontSize;
+	width: $primeIconFontSize;
+	height: $primeIconFontSize;
 }
 
 .p-link {
-    font-family: var(--font-family);
-    font-feature-settings: var(--font-feature-settings, normal);
-    font-size: $fontSize;
-    border-radius: $borderRadius;
+	font-family: var(--font-family);
+	font-feature-settings: var(--font-feature-settings, normal);
+	font-size: $fontSize;
+	border-radius: $borderRadius;
 
-    &:focus-visible {
-        @include focused();
-    }
+	&:focus-visible {
+		@include focused();
+	}
 }
 
 .p-component-overlay-enter {
-    animation: p-component-overlay-enter-animation 150ms forwards;
+	animation: p-component-overlay-enter-animation 150ms forwards;
 }
 
 .p-component-overlay-leave {
-    animation: p-component-overlay-leave-animation 150ms forwards;
+	animation: p-component-overlay-leave-animation 150ms forwards;
 }
 
 .p-component-overlay {
-    @keyframes p-component-overlay-enter-animation {
-        from {
-            background-color: transparent;
-        }
-        to {
-            background-color: var(--maskbg);
-        }
-    }
+	@keyframes p-component-overlay-enter-animation {
+		from {
+			background-color: transparent;
+		}
+		to {
+			background-color: var(--maskbg);
+		}
+	}
 
-    @keyframes p-component-overlay-leave-animation {
-        from {
-            background-color: var(--maskbg);
-        }
-        to {
-            background-color: transparent;
-        }
-    }
+	@keyframes p-component-overlay-leave-animation {
+		from {
+			background-color: var(--maskbg);
+		}
+		to {
+			background-color: transparent;
+		}
+	}
 }