@aristobyte-ui/presets 1.0.68 → 1.0.72

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.css DELETED
@@ -1,218 +0,0 @@
1
- /* components/ActionButtons/ActionButtons.module.scss */
2
- /* components/ActivityFeed/ActivityFeed.module.scss */
3
- /* components/AIAssistant/AIAssistant.module.scss */
4
- /* components/AnalyticsDashboard/AnalyticsDashboard.module.scss */
5
- /* components/BudgetTracker/BudgetTracker.module.scss */
6
- /* components/CalendarWidget/CalendarWidget.module.scss */
7
- /* components/ChatMessages/ChatMessages.module.scss */
8
- /* components/CloudStorage/CloudStorage.module.scss */
9
- /* components/CodeEditor/CodeEditor.module.scss */
10
- /* components/CodeStats/CodeStats.module.scss */
11
- /* components/ColorPaletteWidget/ColorPaletteWidget.module.scss */
12
- /* components/ContactCard/ContactCard.module.scss */
13
- /* components/CryptocurrencyWidget/CryptocurrencyWidget.module.scss */
14
- /* components/DatabaseWidget/DatabaseWidget.module.scss */
15
- /* components/DesignSystem/DesignSystem.module.scss */
16
- /* components/DeviceStatus/DeviceStatus.module.scss */
17
- /* components/DocumentScanner/DocumentScanner.module.scss */
18
- /* components/EmailDashboard/EmailDashboard.module.scss */
19
- /* components/EnergyMeter/EnergyMeter.module.scss */
20
- /* components/FileManager/FileManager.module.scss */
21
- /* components/FileUploadArea/FileUploadArea.module.scss */
22
- /* components/FitnessTracker/FitnessTracker.module.scss */
23
- /* components/GamingControllerWidget/GamingControllerWidget.module.scss */
24
- /* components/HabitTracker/HabitTracker.module.scss */
25
- /* components/HealthMonitor/HealthMonitor.module.scss */
26
- /* components/IdeaBulbWidget/IdeaBulbWidget.module.scss */
27
- /* components/InspirationWidget/InspirationWidget.module.scss */
28
- /* components/LanguageLearning/LanguageLearning.module.scss */
29
- /* components/LayerStackWidget/LayerStackWidget.module.scss */
30
- /* components/MediaControls/MediaControls.module.scss */
31
- /* components/MiniMenu/MiniMenu.module.scss */
32
- /* components/MouseTracker/MouseTracker.module.scss */
33
- /* components/MusicPlayer/MusicPlayer.module.scss */
34
- /* components/MusicProduction/MusicProduction.module.scss */
35
- /* components/NatureWidget/NatureWidget.module.scss */
36
- /* components/NavigationPills/NavigationPills.module.scss */
37
- /* components/NetworkStatus/NetworkStatus.module.scss */
38
- /* components/NotificationBadges/NotificationBadges.module.scss */
39
- /* components/NotificationCards/NotificationCards.module.scss */
40
- /* components/OfficeBuildingWidget/OfficeBuildingWidget.module.scss */
41
- /* components/PasswordManager/PasswordManager.module.scss */
42
- /* components/PhotoEditor/PhotoEditor.module.scss */
43
- /* components/PomodoroTimer/PomodoroTimer.module.scss */
44
- /* components/PricingCard/PricingCard.module.scss */
45
- /* components/ProfileBadge/ProfileBadge.module.scss */
46
- /* components/ProgressTracker/ProgressTracker.module.scss */
47
- /* components/QuickActions/QuickActions.module.scss */
48
- /* components/QuickStats/QuickStats.module.scss */
49
- /* components/ReadingProgress/ReadingProgress.module.scss */
50
- /* components/RecipeFinder/RecipeFinder.module.scss */
51
- /* components/RocketLaunchWidget/RocketLaunchWidget.module.scss */
52
- /* components/SettingsPanel/SettingsPanel.module.scss */
53
- /* components/ShoppingCart/ShoppingCart.module.scss */
54
- /* components/ShoppingList/ShoppingList.module.scss */
55
- /* components/SocialEngagement/SocialEngagement.module.scss */
56
- /* components/SocialMediaCard/SocialMediaCard.module.scss */
57
- .SocialMediaCard_module_social-media-card {
58
- background-color: #101828;
59
- box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
60
- display: flex;
61
- flex-direction: column;
62
- gap: 15px;
63
- max-width: 280px;
64
- padding: 22px;
65
- width: 100%;
66
- }
67
- .SocialMediaCard_module_social-media-card-radius--none {
68
- border-radius: 0rem;
69
- }
70
- .SocialMediaCard_module_social-media-card-radius--sm {
71
- border-radius: 0.25rem;
72
- }
73
- .SocialMediaCard_module_social-media-card-radius--md {
74
- border-radius: 0.5rem;
75
- }
76
- .SocialMediaCard_module_social-media-card-radius--lg {
77
- border-radius: 0.625rem;
78
- }
79
- .SocialMediaCard_module_social-media-card-radius--full {
80
- border-radius: 1.5rem;
81
- }
82
- .SocialMediaCard_module_social-media-card__header {
83
- align-items: center;
84
- display: flex;
85
- gap: 20px;
86
- justify-content: space-between;
87
- width: 100%;
88
- }
89
- .SocialMediaCard_module_social-media-card__avatar {
90
- align-content: center;
91
- background:
92
- linear-gradient(
93
- 135deg,
94
- #ad46ff 0%,
95
- #f6339a 100%);
96
- border-radius: 50%;
97
- display: flex;
98
- justify-content: center;
99
- height: 42px;
100
- overflow: hidden;
101
- position: relative;
102
- width: 42px;
103
- }
104
- .SocialMediaCard_module_social-media-card__avatar-icon {
105
- align-content: center;
106
- color: #ffffff;
107
- display: flex;
108
- justify-content: center;
109
- margin: auto;
110
- }
111
- .SocialMediaCard_module_social-media-card__avatar-img {
112
- height: 42px;
113
- width: 42px;
114
- object-fit: cover;
115
- }
116
- .SocialMediaCard_module_social-media-card__text {
117
- align-items: flex-start;
118
- display: flex;
119
- flex-direction: column;
120
- justify-content: center;
121
- }
122
- .SocialMediaCard_module_social-media-card__title {
123
- color: #ffffff;
124
- font-size: 16px;
125
- font-style: normal;
126
- font-weight: 500;
127
- line-height: 16px;
128
- }
129
- .SocialMediaCard_module_social-media-card__subtitle {
130
- color: #99a1af;
131
- font-size: 14px;
132
- font-style: normal;
133
- font-weight: 400;
134
- line-height: 14px;
135
- }
136
- .SocialMediaCard_module_social-media-card__content {
137
- color: #d1d5dc;
138
- font-size: 14px;
139
- font-style: normal;
140
- font-weight: 400;
141
- line-height: 14px;
142
- }
143
- .SocialMediaCard_module_social-media-card__metrics {
144
- align-items: center;
145
- display: flex;
146
- justify-content: flex-start;
147
- gap: 14px;
148
- }
149
- .SocialMediaCard_module_social-media-card__metric {
150
- align-items: center;
151
- display: flex;
152
- flex-direction: column;
153
- gap: 5px;
154
- justify-content: center;
155
- }
156
- .SocialMediaCard_module_social-media-card__metric-par {
157
- align-items: center;
158
- display: flex;
159
- gap: 7px;
160
- justify-content: center;
161
- }
162
- .SocialMediaCard_module_social-media-card__metric-text {
163
- align-items: center;
164
- display: flex;
165
- justify-content: center;
166
- }
167
- .SocialMediaCard_module_social-media-card__metric-icon {
168
- align-items: center;
169
- color: #99a1af;
170
- display: flex;
171
- justify-content: center;
172
- }
173
- .SocialMediaCard_module_social-media-card__metric-value {
174
- color: #99a1af;
175
- font-size: 14px;
176
- font-style: normal;
177
- font-weight: 400;
178
- line-height: 14px;
179
- }
180
- .SocialMediaCard_module_social-media-card__tags {
181
- display: inline-flex;
182
- flex-wrap: wrap;
183
- gap: 1px;
184
- }
185
- .SocialMediaCard_module_social-media-card__tag {
186
- margin: 0 2px;
187
- width: max-content;
188
- }
189
- .SocialMediaCard_module_social-media-card__tag-anchor {
190
- padding: 0;
191
- }
192
-
193
- /* components/StatisticsCards/StatisticsCards.module.scss */
194
-
195
- /* components/StatusIndicators/StatusIndicators.module.scss */
196
-
197
- /* components/StockMarket/StockMarket.module.scss */
198
-
199
- /* components/StreakCounter/StreakCounter.module.scss */
200
-
201
- /* components/SystemStatus/SystemStatus.module.scss */
202
-
203
- /* components/TaskManager/TaskManager.module.scss */
204
-
205
- /* components/TeamCollaborationWidget/TeamCollaborationWidget.module.scss */
206
-
207
- /* components/TimeLocationWidget/TimeLocationWidget.module.scss */
208
-
209
- /* components/TodoList/TodoList.module.scss */
210
-
211
- /* components/ToolWidget/ToolWidget.module.scss */
212
-
213
- /* components/TravelPlanner/TravelPlanner.module.scss */
214
-
215
- /* components/VideoCallWidget/VideoCallWidget.module.scss */
216
-
217
- /* components/WeatherWidget/WeatherWidget.module.scss */
218
- /*# sourceMappingURL=index.css.map */
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../components/SocialMediaCard.module.scss","../../../../node_modules/@aristobyte-ui/utils/styles/_settings.scss"],"sourcesContent":["@use \"@aristobyte-ui/utils/styles/settings\" as *;\n\n.social-media-card {\n background-color: #101828; // @TODO: @COLOR\n box-shadow: $shadow-md;\n display: flex;\n flex-direction: column;\n gap: 15px;\n max-width: 280px;\n padding: 22px;\n width: 100%;\n\n &-radius {\n &--none {\n border-radius: 0rem; // 0px\n }\n\n &--sm {\n border-radius: 0.25rem; // 4px\n }\n\n &--md {\n border-radius: 0.5rem; // 8px\n }\n\n &--lg {\n border-radius: 0.625rem; // 10px\n }\n\n &--full {\n border-radius: 1.5rem; // 24px\n }\n }\n\n &__header {\n align-items: center;\n display: flex;\n gap: 20px;\n justify-content: space-between;\n width: 100%;\n }\n\n &__avatar {\n align-content: center;\n background: linear-gradient(135deg, #ad46ff 0%, #f6339a 100%);\n border-radius: 50%;\n display: flex;\n justify-content: center;\n height: 42px;\n overflow: hidden;\n position: relative;\n width: 42px;\n\n &-icon {\n align-content: center;\n color: $white;\n display: flex;\n justify-content: center;\n margin: auto;\n }\n\n &-img {\n height: 42px;\n width: 42px;\n object-fit: cover;\n }\n }\n\n &__text {\n align-items: flex-start;\n display: flex;\n flex-direction: column;\n justify-content: center;\n }\n\n &__title {\n color: $title-color-dark;\n font-size: 16px;\n font-style: normal;\n font-weight: 500;\n line-height: 16px;\n }\n\n &__subtitle {\n color: $subtitle-color-dark;\n font-size: 14px;\n font-style: normal;\n font-weight: 400;\n line-height: 14px;\n }\n\n &__content {\n color: $description-color-dark;\n font-size: 14px;\n font-style: normal;\n font-weight: 400;\n line-height: 14px;\n }\n\n &__metrics {\n align-items: center;\n display: flex;\n justify-content: flex-start;\n gap: 14px;\n }\n\n &__metric {\n align-items: center;\n display: flex;\n flex-direction: column;\n gap: 5px;\n justify-content: center;\n\n &-par {\n align-items: center;\n display: flex;\n gap: 7px;\n justify-content: center;\n }\n\n &-text {\n align-items: center;\n display: flex;\n justify-content: center;\n }\n\n &-icon {\n align-items: center;\n color: $icon-color-dark;\n display: flex;\n justify-content: center;\n }\n\n &-value {\n color: $icon-color-dark;\n font-size: 14px;\n font-style: normal;\n font-weight: 400;\n line-height: 14px;\n }\n }\n\n &__tags {\n display: inline-flex;\n flex-wrap: wrap;\n gap: 1px;\n }\n\n &__tag {\n margin: 0 2px;\n width: max-content;\n\n &-anchor {\n padding: 0;\n }\n }\n}\n","// =========================================== //\n// AristoByte UI - Style Settings //\n// =========================================== //\n\n// === Design Tokens — Color Palette === //\n// Logo\n$logo-color-1: #ffee27;\n$logo-color-2: #fec800;\n$logo-color-3: #f18e35;\n$logo-color-4: #e95f32;\n$logo-color-5: #e2312d;\n$logo-gradient: linear-gradient(\n 90deg,\n $logo-color-1,\n $logo-color-2,\n $logo-color-3,\n $logo-color-4,\n $logo-color-5\n);\n\n// Base\n$white: #ffffff;\n$white-hover: #dddddd;\n$black: #000000;\n$black-hover: #222222;\n$transparent: transparent;\n\n// === Black Transparent Scale === //\n$black-transparent-100: rgba(0, 0, 0, 0.1);\n$black-transparent-200: rgba(0, 0, 0, 0.2);\n$black-transparent-300: rgba(0, 0, 0, 0.3);\n$black-transparent-400: rgba(0, 0, 0, 0.4);\n$black-transparent-500: rgba(0, 0, 0, 0.5);\n$black-transparent-600: rgba(0, 0, 0, 0.6);\n$black-transparent-700: rgba(0, 0, 0, 0.7);\n$black-transparent-800: rgba(0, 0, 0, 0.8);\n$black-transparent-900: rgba(0, 0, 0, 0.9);\n\n// === Black Transparent Scale === //\n$white-transparent-100: rgba(255, 255, 255, 0.1);\n$white-transparent-200: rgba(255, 255, 255, 0.2);\n$white-transparent-300: rgba(255, 255, 255, 0.3);\n$white-transparent-400: rgba(255, 255, 255, 0.4);\n$white-transparent-500: rgba(255, 255, 255, 0.5);\n$white-transparent-600: rgba(255, 255, 255, 0.6);\n$white-transparent-700: rgba(255, 255, 255, 0.7);\n$white-transparent-800: rgba(255, 255, 255, 0.8);\n$white-transparent-900: rgba(255, 255, 255, 0.9);\n\n// === Neutral Scale (Grey) === //\n$grey-50: #f9fafb;\n$grey-100: #f3f4f6;\n$grey-200: #e5e7eb;\n$grey-300: #d1d5db;\n$grey-400: #9ca3af;\n$grey-500: #6b7280;\n$grey-600: #4b5563;\n$grey-700: #374151;\n$grey-800: #1f2937;\n$grey-900: #111827;\n\n// === Primary Scale (Blue) === //\n$blue-50: #eff6ff;\n$blue-100: #dbeafe;\n$blue-200: #bfdbfe;\n$blue-300: #93c5fd;\n$blue-400: #60a5fa;\n$blue-500: #3b82f6;\n$blue-600: #2563eb; // Main\n$blue-700: #1d4ed8; // Hover\n$blue-800: #1e40af;\n$blue-900: #1e3a8a;\n\n// === Secondary Scale (Indigo) === //\n$indigo-50: #eef2ff;\n$indigo-100: #e0e7ff;\n$indigo-200: #c7d2fe;\n$indigo-300: #a5b4fc;\n$indigo-400: #818cf8;\n$indigo-500: #6366f1;\n$indigo-600: #4f46e5; // Main\n$indigo-700: #4338ca; // Hover\n\n// === Error Scale (Red) === //\n$red-50: #fef2f2;\n$red-100: #fee2e2;\n$red-200: #fecaca;\n$red-300: #fca5a5;\n$red-400: #f87171;\n$red-500: #ef4444;\n$red-600: #dc2626; // Main\n$red-700: #b91c1c; // Hover\n\n// === Success Scale (Green) === //\n$green-50: #f0fdf4;\n$green-100: #dcfce7;\n$green-200: #bbf7d0;\n$green-300: #86efac;\n$green-400: #4ade80;\n$green-500: #22c55e;\n$green-600: #16a34a; // Main\n$green-700: #15803d; // Hover\n\n// === Warning Scale (Amber) === //\n$amber-50: #fffbeb;\n$amber-100: #fef3c7;\n$amber-200: #fde68a;\n$amber-300: #fcd34d;\n$amber-400: #fbbf24;\n$amber-500: #f59e0b;\n$amber-600: #d97706; // Main\n$amber-700: #b45309; // Hover\n\n// === Semantic Tokens === //\n$color-default: $grey-800;\n$color-default-hover: $grey-900;\n$color-default-disabled: rgba($color-default, 0.5);\n\n$color-primary: $blue-600;\n$color-primary-hover: $blue-700;\n$color-primary-disabled: rgba($color-primary, 0.5);\n\n$color-secondary: $indigo-600;\n$color-secondary-hover: $indigo-700;\n$color-secondary-disabled: rgba($color-secondary, 0.5);\n\n$color-error: $red-600;\n$color-error-hover: $red-700;\n$color-error-disabled: rgba($color-error, 0.5);\n\n$color-success: $green-600;\n$color-success-hover: $green-700;\n$color-success-disabled: rgba($color-success, 0.5);\n\n$color-warning: $amber-600;\n$color-warning-hover: $amber-700;\n$color-warning-disabled: rgba($color-warning, 0.5);\n\n$text-color-white: $white;\n$text-color-black: $black;\n$text-color-white-disabled: rgba($white, 0.5);\n$text-color-black-disabled: rgba($black, 0.5);\n\n$title-color-dark: $white;\n$subtitle-color-dark: #99a1af;\n$description-color-dark: #d1d5dc;\n$icon-color-dark: #99a1af;\n\n// === Shadows === //\n//@TODO: @SHADOW\n$shadow-sm: 0 1px 2px 0 rgba($black, 0.05);\n$shadow-md:\n 0 4px 6px -1px rgba($black, 0.1),\n 0 2px 4px -1px rgba($black, 0.06);\n$shadow-lg:\n 0 10px 15px -3px rgba($black, 0.1),\n 0 4px 6px -2px rgba($black, 0.05);\n\n// === Font families === //\n$font-family-sans: \"Inter\", sans-serif;\n$font-family-serif: \"Georgia\", serif;\n$font-family-mono: \"Fira Code\", monospace;\n\n// === Font weights === //\n$font-weight-regular: 400;\n$font-weight-medium: 500;\n$font-weight-semibold: 600;\n$font-weight-bold: 700;\n\n// === Line heights === //\n$line-height-tight: 1.2;\n$line-height-snug: 1.375;\n$line-height-normal: 1.5;\n$line-height-loose: 1.625;\n\n// === Font Sizes — Semantic Tokens === //\n\n// === Titles === //\n$font-size-hero: 3rem; // 48px\n$font-size-title-1: 2.25rem; // 36px\n$font-size-title-2: 1.875rem; // 30px\n$font-size-title-3: 1.5rem; // 24px\n\n// === Subtitles === //\n$font-size-subtitle-1: 1.25rem; // 20px\n$font-size-subtitle-2: 1.125rem; // 18px\n\n// === Body text === //\n$font-size-body-lg: 1rem; // 16px\n$font-size-body-md: 0.9375rem; // 15px\n$font-size-body-sm: 0.875rem; // 14px\n\n// === Captions / Descriptions === //\n$font-size-caption: 0.75rem; // 12px\n$font-size-footnote: 0.6875rem; // 11px\n\n// === Buttons === //\n$font-size-button-lg: 1rem; // 16px\n$font-size-button-md: 0.875rem; // 14px\n$font-size-button-sm: 0.75rem; // 12px\n\n// === Animations === //\n\n$cubic-bezier-primary: cubic-bezier(0.55, -0.19, 0.59, 0.95);\n$cubic-bezier-secondary: cubic-bezier(0.175, 0.885, 0.32, 1.275);\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEA,CAAAA;AACE,oBAAA;AACA,cCoJA,EAAA,IAAA,IAAA,KAAA,KAAA,CAAA,EAAA,CAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,IAAA,IAAA,KAAA,KAAA,CAAA,EAAA,CAAA,EAAA,CAAA,EAAA;ADnJA,WAAA;AACA,kBAAA;AACA,OAAA;AACA,aAAA;AACA,WAAA;AACA,SAAA;;AAGE,CAAAC;AACE,iBAAA;;AAGF,CAAAC;AACE,iBAAA;;AAGF,CAAAC;AACE,iBAAA;;AAGF,CAAAC;AACE,iBAAA;;AAGF,CAAAC;AACE,iBAAA;;AAIJ,CAAAC;AACE,eAAA;AACA,WAAA;AACA,OAAA;AACA,mBAAA;AACA,SAAA;;AAGF,CAAAC;AACE,iBAAA;AACA;IAAA;MAAA,MAAA;MAAA,QAAA,EAAA;MAAA,QAAA;AACA,iBAAA;AACA,WAAA;AACA,mBAAA;AACA,UAAA;AACA,YAAA;AACA,YAAA;AACA,SAAA;;AAEA,CAAAC;AACE,iBAAA;AACA,SClCE;ADmCF,WAAA;AACA,mBAAA;AACA,UAAA;;AAGF,CAAAC;AACE,UAAA;AACA,SAAA;AACA,cAAA;;AAIJ,CAAAC;AACE,eAAA;AACA,WAAA;AACA,kBAAA;AACA,mBAAA;;AAGF,CAAAC;AACE,SCvDI;ADwDJ,aAAA;AACA,cAAA;AACA,eAAA;AACA,eAAA;;AAGF,CAAAC;AACE,SC4DkB;AD3DlB,aAAA;AACA,cAAA;AACA,eAAA;AACA,eAAA;;AAGF,CAAAC;AACE,SCqDqB;ADpDrB,aAAA;AACA,cAAA;AACA,eAAA;AACA,eAAA;;AAGF,CAAAC;AACE,eAAA;AACA,WAAA;AACA,mBAAA;AACA,OAAA;;AAGF,CAAAC;AACE,eAAA;AACA,WAAA;AACA,kBAAA;AACA,OAAA;AACA,mBAAA;;AAEA,CAAAC;AACE,eAAA;AACA,WAAA;AACA,OAAA;AACA,mBAAA;;AAGF,CAAAC;AACE,eAAA;AACA,WAAA;AACA,mBAAA;;AAGF,CAAAC;AACE,eAAA;AACA,SCkBY;ADjBZ,WAAA;AACA,mBAAA;;AAGF,CAAAC;AACE,SCYY;ADXZ,aAAA;AACA,cAAA;AACA,eAAA;AACA,eAAA;;AAIJ,CAAAC;AACE,WAAA;AACA,aAAA;AACA,OAAA;;AAGF,CAAAC;AACE,UAAA,EAAA;AACA,SAAA;;AAEA,CAAAC;AACE,WAAA;;","names":["social-media-card","social-media-card-radius--none","social-media-card-radius--sm","social-media-card-radius--md","social-media-card-radius--lg","social-media-card-radius--full","social-media-card__header","social-media-card__avatar","social-media-card__avatar-icon","social-media-card__avatar-img","social-media-card__text","social-media-card__title","social-media-card__subtitle","social-media-card__content","social-media-card__metrics","social-media-card__metric","social-media-card__metric-par","social-media-card__metric-text","social-media-card__metric-icon","social-media-card__metric-value","social-media-card__tags","social-media-card__tag","social-media-card__tag-anchor"]}