v1

2026-04-30 21:58:39 +03:00
commit aabe5fe2b7
2923 changed files with 366740 additions and 0 deletions
@@ -0,0 +1,94 @@
+//
+// Icon shapes
+//
+
+
+.icon-shape {
+	display: inline-flex;
+	align-items: center;
+	justify-content: center;
+	text-align: center;
+	vertical-align: middle;
+	border-radius: $border-radius;
+	width: $icon-size;
+	height: $icon-size;
+
+	i {
+		font-size: 1.125rem;
+	}
+
+	svg {
+		width: $icon-size/ 2.5;
+		height: $icon-size/ 2.5;
+	}
+
+
+	&.icon-xl {
+		width: $icon-size-xl;
+		height: $icon-size-xl;
+
+		i {
+			font-size: 2.25rem;
+		}
+
+		svg {
+			width: $icon-size-xl/ 2.5;
+			height: $icon-size-xl/ 2.5;
+		}
+	}
+
+
+	&.icon-lg {
+		width: $icon-size-lg;
+		height: $icon-size-lg;
+
+		i {
+			font-size: 1.75rem;
+		}
+
+		svg {
+			width: $icon-size-lg/ 2.5;
+			height: $icon-size-lg/ 2.5;
+		}
+	}
+
+	&.icon-sm {
+		width: $icon-size-sm;
+		height: $icon-size-sm;
+
+		i {
+			font-size: $font-size-sm;
+		}
+
+		svg {
+			width: $icon-size-sm/ 2.5;
+			height: $icon-size-sm/ 2.5;
+		}
+	}
+
+	&.icon-xs {
+		width: $icon-size-xs;
+		height: $icon-size-xs;
+
+		i {
+			font-size: $font-size-xs;
+		}
+
+		svg {
+			width: $icon-size-xs/ 2.5;
+			height: $icon-size-xs/ 2.5;
+		}
+	}
+}
+
+// Color variations
+
+@each $color, $value in $theme-colors {
+    .icon-#{$color} {
+        @include icon-variant(theme-color-level($color, $icon-bg-level), $value);
+    }
+
+	.icon-outline-#{$color} {
+		@include icon-outline-variant($icon-border-width, $value);
+	}
+}
@@ -0,0 +1,83 @@
+//
+// Icon
+//
+
+
+.icon {
+	i, svg {
+		font-size: $icon-size / 1.75;
+	}
+
+	&:not(.icon-shape) svg {
+		width: $icon-size;
+		height: $icon-size;
+	}
+}
+
+.icon + .icon-text {
+	padding-left: 1rem;
+	width: calc(100% - #{$icon-size} - 1);
+}
+
+
+// Size variations
+
+.icon-xl {
+	i, svg {
+		font-size: $icon-size-xl / 1.75;
+	}
+
+	&:not(.icon-shape) svg {
+		width: $icon-size-xl;
+		height: $icon-size-xl;
+	}
+}
+
+.icon-xl + .icon-text {
+	width: calc(100% - #{$icon-size-xl} - 1);
+}
+
+.icon-lg {
+	i, svg {
+		font-size: $icon-size-lg / 1.75;
+	}
+
+	&:not(.icon-shape) svg {
+		width: $icon-size-lg;
+		height: $icon-size-lg;
+	}
+}
+
+.icon-lg + .icon-text {
+	width: calc(100% - #{$icon-size-lg} - 1);
+}
+
+.icon-sm {
+	i, svg {
+		font-size: $icon-size-sm / 1.75;
+	}
+
+	&:not(.icon-shape) svg {
+		width: $icon-size-sm;
+		height: $icon-size-sm;
+	}
+}
+
+.icon-sm + .icon-text {
+	width: calc(100% - #{$icon-size-sm} - 1);
+}
+
+.icon-xs {
+	i, svg {
+		font-size: $icon-size-xs / 1.75;
+	}
+
+	&:not(.icon-shape) svg {
+		width: $icon-size-xs;
+		height: $icon-size-xs;
+	}
+}
+
+.icon-xs + .icon-text {
+	width: calc(100% - #{$icon-size-xs} - 1);
+}