cloud-ide-layout 1.0.208 → 1.0.209
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/fesm2022/{cloud-ide-layout-cloud-ide-layout-CU0WBmHS.mjs → cloud-ide-layout-cloud-ide-layout-C4dYqSYm.mjs} +321 -479
- package/fesm2022/cloud-ide-layout-cloud-ide-layout-C4dYqSYm.mjs.map +1 -0
- package/fesm2022/{cloud-ide-layout-dashboard-manager.component-BKfePD78.mjs → cloud-ide-layout-dashboard-manager.component-BJArKBjQ.mjs} +2 -2
- package/fesm2022/{cloud-ide-layout-dashboard-manager.component-BKfePD78.mjs.map → cloud-ide-layout-dashboard-manager.component-BJArKBjQ.mjs.map} +1 -1
- package/fesm2022/{cloud-ide-layout-drawer-theme.component-D0xJWft1.mjs → cloud-ide-layout-drawer-theme.component-D_F14KO8.mjs} +2 -2
- package/fesm2022/{cloud-ide-layout-drawer-theme.component-D0xJWft1.mjs.map → cloud-ide-layout-drawer-theme.component-D_F14KO8.mjs.map} +1 -1
- package/fesm2022/{cloud-ide-layout-home-wrapper.component-BjJEbmZe.mjs → cloud-ide-layout-home-wrapper.component-CsfkluH7.mjs} +2 -2
- package/fesm2022/{cloud-ide-layout-home-wrapper.component-BjJEbmZe.mjs.map → cloud-ide-layout-home-wrapper.component-CsfkluH7.mjs.map} +1 -1
- package/fesm2022/{cloud-ide-layout-sidedrawer-notes.component-nkGvIVbP.mjs → cloud-ide-layout-sidedrawer-notes.component-uQ2UOmsw.mjs} +2 -2
- package/fesm2022/{cloud-ide-layout-sidedrawer-notes.component-nkGvIVbP.mjs.map → cloud-ide-layout-sidedrawer-notes.component-uQ2UOmsw.mjs.map} +1 -1
- package/fesm2022/cloud-ide-layout.mjs +1 -1
- package/package.json +1 -1
- package/fesm2022/cloud-ide-layout-cloud-ide-layout-CU0WBmHS.mjs.map +0 -1
|
@@ -1920,261 +1920,182 @@ class NotificationSettingsComponent {
|
|
|
1920
1920
|
}
|
|
1921
1921
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: NotificationSettingsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1922
1922
|
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: NotificationSettingsComponent, isStandalone: true, selector: "cide-lyt-notification-settings", ngImport: i0, template: `
|
|
1923
|
-
<div class="notification-settings-container tw-p-6 tw-space-y-6 tw-bg-
|
|
1924
|
-
|
|
1925
|
-
<div class="tw-flex tw-items-center tw-gap-2 tw-pb-3 tw-border-b tw-border-gray-200 dark:tw-border-gray-700">
|
|
1926
|
-
<div class="tw-w-8 tw-h-8 tw-bg-blue-500 tw-rounded-lg tw-flex tw-items-center tw-justify-center">
|
|
1927
|
-
<cide-ele-icon class="tw-text-white">settings</cide-ele-icon>
|
|
1928
|
-
</div>
|
|
1929
|
-
<div>
|
|
1930
|
-
<h3 class="tw-m-0 tw-text-sm tw-font-semibold">Notification Settings</h3>
|
|
1931
|
-
<p class="tw-m-0 tw-text-xs tw-text-gray-600 dark:tw-text-gray-400">Customize your notification preferences</p>
|
|
1932
|
-
</div>
|
|
1933
|
-
</div>
|
|
1934
|
-
|
|
1935
|
-
<form [formGroup]="settingsForm" class="tw-space-y-6">
|
|
1923
|
+
<div class="notification-settings-container tw-p-6 tw-space-y-6 tw-bg-[var(--cide-ele-bg-primary)] tw-text-[var(--cide-ele-text-primary)]">
|
|
1924
|
+
<form [formGroup]="settingsForm" class="tw-space-y-8">
|
|
1936
1925
|
<!-- Notification Channels -->
|
|
1937
|
-
<div class="tw-space-y-
|
|
1938
|
-
<h4 class="tw-text-xs tw-font-
|
|
1926
|
+
<div class="tw-space-y-4">
|
|
1927
|
+
<h4 class="tw-text-xs tw-font-bold tw-text-[var(--cide-ele-text-tertiary)] tw-uppercase tw-tracking-widest">Notification Channels</h4>
|
|
1939
1928
|
|
|
1940
|
-
|
|
1941
|
-
|
|
1942
|
-
<div class="tw-flex tw-
|
|
1943
|
-
<
|
|
1944
|
-
|
|
1945
|
-
|
|
1946
|
-
|
|
1929
|
+
<div class="tw-grid tw-grid-cols-1 md:tw-grid-cols-3 tw-gap-4">
|
|
1930
|
+
<!-- In-App Notifications -->
|
|
1931
|
+
<div class="tw-flex tw-flex-col tw-justify-between tw-p-4 tw-bg-[var(--cide-ele-bg-secondary)] tw-rounded-xl tw-border tw-border-[var(--cide-ele-border-primary)] hover:tw-border-[var(--cide-ele-border-active)] tw-transition-all">
|
|
1932
|
+
<div class="tw-flex tw-items-center tw-gap-3 tw-mb-4">
|
|
1933
|
+
<div class="tw-p-2 tw-bg-blue-500/10 tw-rounded-lg">
|
|
1934
|
+
<cide-ele-icon class="tw-text-blue-500">notifications</cide-ele-icon>
|
|
1935
|
+
</div>
|
|
1936
|
+
<div>
|
|
1937
|
+
<label class="tw-text-sm tw-font-semibold tw-block">In-App</label>
|
|
1938
|
+
<p class="tw-m-0 tw-text-[10px] tw-text-[var(--cide-ele-text-tertiary)]">Within the application</p>
|
|
1939
|
+
</div>
|
|
1940
|
+
</div>
|
|
1941
|
+
<div class="tw-flex tw-justify-end">
|
|
1942
|
+
<label class="tw-relative tw-inline-flex tw-items-center tw-cursor-pointer">
|
|
1943
|
+
<input type="checkbox" formControlName="channelInApp" class="tw-sr-only tw-peer">
|
|
1944
|
+
<div class="tw-w-10 tw-h-5 tw-bg-gray-200 peer-focus:tw-outline-none tw-rounded-full peer dark:tw-bg-gray-700 peer-checked:after:tw-translate-x-full peer-checked:after:tw-border-white after:tw-content-[''] after:tw-absolute after:tw-top-[2px] after:tw-left-[2px] after:tw-bg-white after:tw-border-gray-300 after:tw-border after:tw-rounded-full after:tw-h-4 after:tw-w-4 after:tw-transition-all dark:tw-border-gray-600 peer-checked:tw-bg-blue-600"></div>
|
|
1945
|
+
</label>
|
|
1947
1946
|
</div>
|
|
1948
1947
|
</div>
|
|
1949
|
-
<label class="tw-relative tw-inline-flex tw-items-center tw-cursor-pointer">
|
|
1950
|
-
<input type="checkbox" formControlName="channelInApp" class="tw-sr-only tw-peer">
|
|
1951
|
-
<div class="tw-w-11 tw-h-6 tw-bg-gray-200 peer-focus:tw-outline-none peer-focus:tw-ring-4 peer-focus:tw-ring-blue-300 dark:peer-focus:tw-ring-blue-800 dark:peer-focus:tw-ring-offset-gray-800 tw-rounded-full peer dark:tw-bg-gray-700 peer-checked:after:tw-translate-x-full peer-checked:after:tw-border-white after:tw-content-[''] after:tw-absolute after:tw-top-[2px] after:tw-left-[2px] after:tw-bg-white after:tw-border-gray-300 after:tw-border after:tw-rounded-full after:tw-h-5 after:tw-w-5 after:tw-transition-all dark:tw-border-gray-600 peer-checked:tw-bg-blue-600"></div>
|
|
1952
|
-
</label>
|
|
1953
|
-
</div>
|
|
1954
1948
|
|
|
1955
|
-
|
|
1956
|
-
|
|
1957
|
-
|
|
1958
|
-
|
|
1959
|
-
|
|
1960
|
-
|
|
1961
|
-
<
|
|
1949
|
+
<!-- Email Notifications -->
|
|
1950
|
+
<div class="tw-flex tw-flex-col tw-justify-between tw-p-4 tw-bg-[var(--cide-ele-bg-secondary)] tw-rounded-xl tw-border tw-border-[var(--cide-ele-border-primary)] hover:tw-border-[var(--cide-ele-border-active)] tw-transition-all">
|
|
1951
|
+
<div class="tw-flex tw-items-center tw-gap-3 tw-mb-4">
|
|
1952
|
+
<div class="tw-p-2 tw-bg-purple-500/10 tw-rounded-lg">
|
|
1953
|
+
<cide-ele-icon class="tw-text-purple-500">mail</cide-ele-icon>
|
|
1954
|
+
</div>
|
|
1955
|
+
<div>
|
|
1956
|
+
<label class="tw-text-sm tw-font-semibold tw-block">Email</label>
|
|
1957
|
+
<p class="tw-m-0 tw-text-[10px] tw-text-[var(--cide-ele-text-tertiary)]">Via your register email</p>
|
|
1958
|
+
</div>
|
|
1959
|
+
</div>
|
|
1960
|
+
<div class="tw-flex tw-justify-end">
|
|
1961
|
+
<label class="tw-relative tw-inline-flex tw-items-center tw-cursor-pointer">
|
|
1962
|
+
<input type="checkbox" formControlName="channelEmail" class="tw-sr-only tw-peer">
|
|
1963
|
+
<div class="tw-w-10 tw-h-5 tw-bg-gray-200 peer-focus:tw-outline-none tw-rounded-full peer dark:tw-bg-gray-700 peer-checked:after:tw-translate-x-full peer-checked:after:tw-border-white after:tw-content-[''] after:tw-absolute after:tw-top-[2px] after:tw-left-[2px] after:tw-bg-white after:tw-border-gray-300 after:tw-border after:tw-rounded-full after:tw-h-4 after:tw-w-4 after:tw-transition-all dark:tw-border-gray-600 peer-checked:tw-bg-blue-600"></div>
|
|
1964
|
+
</label>
|
|
1962
1965
|
</div>
|
|
1963
1966
|
</div>
|
|
1964
|
-
<label class="tw-relative tw-inline-flex tw-items-center tw-cursor-pointer">
|
|
1965
|
-
<input type="checkbox" formControlName="channelEmail" class="tw-sr-only tw-peer">
|
|
1966
|
-
<div class="tw-w-11 tw-h-6 tw-bg-gray-200 peer-focus:tw-outline-none peer-focus:tw-ring-4 peer-focus:tw-ring-blue-300 dark:peer-focus:tw-ring-blue-800 dark:peer-focus:tw-ring-offset-gray-800 tw-rounded-full peer dark:tw-bg-gray-700 peer-checked:after:tw-translate-x-full peer-checked:after:tw-border-white after:tw-content-[''] after:tw-absolute after:tw-top-[2px] after:tw-left-[2px] after:tw-bg-white after:tw-border-gray-300 after:tw-border after:tw-rounded-full after:tw-h-5 after:tw-w-5 after:tw-transition-all dark:tw-border-gray-600 peer-checked:tw-bg-blue-600"></div>
|
|
1967
|
-
</label>
|
|
1968
|
-
</div>
|
|
1969
1967
|
|
|
1970
|
-
|
|
1971
|
-
|
|
1972
|
-
|
|
1973
|
-
|
|
1974
|
-
|
|
1975
|
-
|
|
1976
|
-
<
|
|
1968
|
+
<!-- SMS Notifications -->
|
|
1969
|
+
<div class="tw-flex tw-flex-col tw-justify-between tw-p-4 tw-bg-[var(--cide-ele-bg-secondary)] tw-rounded-xl tw-border tw-border-[var(--cide-ele-border-primary)] hover:tw-border-[var(--cide-ele-border-active)] tw-transition-all">
|
|
1970
|
+
<div class="tw-flex tw-items-center tw-gap-3 tw-mb-4">
|
|
1971
|
+
<div class="tw-p-2 tw-bg-orange-500/10 tw-rounded-lg">
|
|
1972
|
+
<cide-ele-icon class="tw-text-orange-500">sms</cide-ele-icon>
|
|
1973
|
+
</div>
|
|
1974
|
+
<div>
|
|
1975
|
+
<label class="tw-text-sm tw-font-semibold tw-block">SMS/Mobile</label>
|
|
1976
|
+
<p class="tw-m-0 tw-text-[10px] tw-text-[var(--cide-ele-text-tertiary)]">Text message updates</p>
|
|
1977
|
+
</div>
|
|
1978
|
+
</div>
|
|
1979
|
+
<div class="tw-flex tw-justify-end">
|
|
1980
|
+
<label class="tw-relative tw-inline-flex tw-items-center tw-cursor-pointer">
|
|
1981
|
+
<input type="checkbox" formControlName="channelSms" class="tw-sr-only tw-peer">
|
|
1982
|
+
<div class="tw-w-10 tw-h-5 tw-bg-gray-200 peer-focus:tw-outline-none tw-rounded-full peer dark:tw-bg-gray-700 peer-checked:after:tw-translate-x-full peer-checked:after:tw-border-white after:tw-content-[''] after:tw-absolute after:tw-top-[2px] after:tw-left-[2px] after:tw-bg-white after:tw-border-gray-300 after:tw-border after:tw-rounded-full after:tw-h-4 after:tw-w-4 after:tw-transition-all dark:tw-border-gray-600 peer-checked:tw-bg-blue-600"></div>
|
|
1983
|
+
</label>
|
|
1977
1984
|
</div>
|
|
1978
1985
|
</div>
|
|
1979
|
-
<label class="tw-relative tw-inline-flex tw-items-center tw-cursor-pointer">
|
|
1980
|
-
<input type="checkbox" formControlName="channelSms" class="tw-sr-only tw-peer">
|
|
1981
|
-
<div class="tw-w-11 tw-h-6 tw-bg-gray-200 peer-focus:tw-outline-none peer-focus:tw-ring-4 peer-focus:tw-ring-blue-300 dark:peer-focus:tw-ring-blue-800 dark:peer-focus:tw-ring-offset-gray-800 tw-rounded-full peer dark:tw-bg-gray-700 peer-checked:after:tw-translate-x-full peer-checked:after:tw-border-white after:tw-content-[''] after:tw-absolute after:tw-top-[2px] after:tw-left-[2px] after:tw-bg-white after:tw-border-gray-300 after:tw-border after:tw-rounded-full after:tw-h-5 after:tw-w-5 after:tw-transition-all dark:tw-border-gray-600 peer-checked:tw-bg-blue-600"></div>
|
|
1982
|
-
</label>
|
|
1983
1986
|
</div>
|
|
1984
1987
|
</div>
|
|
1985
1988
|
|
|
1986
|
-
|
|
1987
|
-
|
|
1988
|
-
<
|
|
1989
|
-
|
|
1990
|
-
|
|
1991
|
-
|
|
1992
|
-
|
|
1993
|
-
|
|
1994
|
-
|
|
1995
|
-
|
|
1996
|
-
|
|
1989
|
+
<div class="tw-grid tw-grid-cols-1 md:tw-grid-cols-2 tw-gap-8">
|
|
1990
|
+
<!-- Sound Settings -->
|
|
1991
|
+
<div class="tw-space-y-4">
|
|
1992
|
+
<h4 class="tw-text-xs tw-font-bold tw-text-[var(--cide-ele-text-tertiary)] tw-uppercase tw-tracking-widest">Sound Preferences</h4>
|
|
1993
|
+
|
|
1994
|
+
<div class="tw-p-5 tw-bg-[var(--cide-ele-bg-secondary)] tw-rounded-2xl tw-border tw-border-[var(--cide-ele-border-primary)] tw-space-y-5">
|
|
1995
|
+
<div class="tw-flex tw-items-center tw-justify-between">
|
|
1996
|
+
<div class="tw-flex tw-items-center tw-gap-3">
|
|
1997
|
+
<div class="tw-p-1.5 tw-bg-blue-500/10 tw-rounded-lg">
|
|
1998
|
+
<cide-ele-icon class="tw-text-blue-500 tw-text-lg">volume_up</cide-ele-icon>
|
|
1999
|
+
</div>
|
|
2000
|
+
<span class="tw-text-sm tw-font-medium">Enable Alert Sounds</span>
|
|
2001
|
+
</div>
|
|
2002
|
+
<label class="tw-relative tw-inline-flex tw-items-center tw-cursor-pointer">
|
|
2003
|
+
<input type="checkbox" formControlName="soundEnabled" class="tw-sr-only tw-peer">
|
|
2004
|
+
<div class="tw-w-10 tw-h-5 tw-bg-gray-200 peer-focus:tw-outline-none tw-rounded-full peer dark:tw-bg-gray-700 peer-checked:after:tw-translate-x-full peer-checked:after:tw-border-white after:tw-content-[''] after:tw-absolute after:tw-top-[2px] after:tw-left-[2px] after:tw-bg-white after:tw-border-gray-300 after:tw-border after:tw-rounded-full after:tw-h-4 after:tw-w-4 after:tw-transition-all dark:tw-border-gray-600 peer-checked:tw-bg-blue-600"></div>
|
|
2005
|
+
</label>
|
|
1997
2006
|
</div>
|
|
1998
|
-
</div>
|
|
1999
|
-
<label class="tw-relative tw-inline-flex tw-items-center tw-cursor-pointer">
|
|
2000
|
-
<input
|
|
2001
|
-
type="checkbox"
|
|
2002
|
-
formControlName="soundEnabled"
|
|
2003
|
-
class="tw-sr-only tw-peer">
|
|
2004
|
-
<div class="tw-w-11 tw-h-6 tw-bg-gray-200 peer-focus:tw-outline-none peer-focus:tw-ring-4 peer-focus:tw-ring-blue-300 dark:peer-focus:tw-ring-blue-800 dark:peer-focus:tw-ring-offset-gray-800 tw-rounded-full peer dark:tw-bg-gray-700 peer-checked:after:tw-translate-x-full peer-checked:after:tw-border-white after:tw-content-[''] after:tw-absolute after:tw-top-[2px] after:tw-left-[2px] after:tw-bg-white after:tw-border-gray-300 after:tw-border after:tw-rounded-full after:tw-h-5 after:tw-w-5 after:tw-transition-all dark:tw-border-gray-600 peer-checked:tw-bg-blue-600"></div>
|
|
2005
|
-
</label>
|
|
2006
|
-
</div>
|
|
2007
|
-
|
|
2008
|
-
@if (settingsForm.get('soundEnabled')?.value) {
|
|
2009
|
-
<!-- Sound Type -->
|
|
2010
|
-
<div class="tw-p-3 tw-bg-gray-50 dark:tw-bg-gray-800/50 tw-rounded-lg tw-border tw-border-gray-200 dark:tw-border-gray-700">
|
|
2011
|
-
<label class="tw-block tw-text-xs tw-font-medium tw-mb-2">Sound Type</label>
|
|
2012
|
-
<cide-ele-select
|
|
2013
|
-
formControlName="soundType"
|
|
2014
|
-
[options]="soundTypeOptions"
|
|
2015
|
-
placeholder="Select sound type">
|
|
2016
|
-
</cide-ele-select>
|
|
2017
|
-
</div>
|
|
2018
2007
|
|
|
2019
|
-
|
|
2020
|
-
|
|
2021
|
-
|
|
2022
|
-
|
|
2023
|
-
|
|
2024
|
-
|
|
2025
|
-
<div class="volume-slider-container">
|
|
2026
|
-
<input
|
|
2027
|
-
type="range"
|
|
2028
|
-
formControlName="soundVolume"
|
|
2029
|
-
min="0"
|
|
2030
|
-
max="100"
|
|
2031
|
-
step="1"
|
|
2032
|
-
(input)="onVolumeChange($event)"
|
|
2033
|
-
class="volume-slider tw-w-full">
|
|
2034
|
-
</div>
|
|
2035
|
-
<div class="tw-flex tw-justify-between tw-text-[10px] tw-text-gray-500 dark:tw-text-gray-400 tw-mt-1">
|
|
2036
|
-
<span>0%</span>
|
|
2037
|
-
<span>100%</span>
|
|
2038
|
-
</div>
|
|
2039
|
-
</div>
|
|
2008
|
+
@if (settingsForm.get('soundEnabled')?.value) {
|
|
2009
|
+
<div class="tw-space-y-4 tw-pt-2 tw-border-t tw-border-[var(--cide-ele-border-primary)] tw-border-dashed">
|
|
2010
|
+
<div>
|
|
2011
|
+
<label class="tw-block tw-text-xs tw-font-semibold tw-text-[var(--cide-ele-text-secondary)] tw-mb-3">NOTIFICATION SOUND</label>
|
|
2012
|
+
<cide-ele-select formControlName="soundType" [options]="soundTypeOptions" placeholder="Select Sound"></cide-ele-select>
|
|
2013
|
+
</div>
|
|
2040
2014
|
|
|
2041
|
-
|
|
2042
|
-
|
|
2043
|
-
|
|
2044
|
-
|
|
2045
|
-
|
|
2046
|
-
|
|
2047
|
-
|
|
2048
|
-
|
|
2049
|
-
|
|
2050
|
-
Test Sound
|
|
2051
|
-
</button>
|
|
2052
|
-
}
|
|
2053
|
-
</div>
|
|
2015
|
+
<div class="tw-space-y-3">
|
|
2016
|
+
<div class="tw-flex tw-items-center tw-justify-between">
|
|
2017
|
+
<label class="tw-text-xs tw-font-semibold tw-text-[var(--cide-ele-text-secondary)]">VOLUME LEVEL</label>
|
|
2018
|
+
<span class="tw-text-xs tw-font-bold tw-text-blue-500">{{ settingsForm.get('soundVolume')?.value }}%</span>
|
|
2019
|
+
</div>
|
|
2020
|
+
<div class="volume-slider-container">
|
|
2021
|
+
<input type="range" formControlName="soundVolume" min="0" max="100" step="1" (input)="onVolumeChange($event)" class="volume-slider tw-w-full">
|
|
2022
|
+
</div>
|
|
2023
|
+
</div>
|
|
2054
2024
|
|
|
2055
|
-
|
|
2056
|
-
|
|
2057
|
-
|
|
2058
|
-
|
|
2059
|
-
|
|
2060
|
-
|
|
2061
|
-
<div class="tw-flex tw-items-center tw-gap-2">
|
|
2062
|
-
<cide-ele-icon class="tw-text-gray-600 dark:tw-text-gray-400">schedule</cide-ele-icon>
|
|
2063
|
-
<div>
|
|
2064
|
-
<label class="tw-text-sm tw-font-medium">Enable Quiet Hours</label>
|
|
2065
|
-
<p class="tw-m-0 tw-text-xs tw-text-gray-500 dark:tw-text-gray-400">Mute notifications during specified hours</p>
|
|
2066
|
-
</div>
|
|
2025
|
+
<button type="button" cideEleButton variant="ghost" size="sm" (click)="testSound()" class="tw-w-full tw-bg-blue-500/5 hover:tw-bg-blue-500/10 tw-text-blue-500 tw-font-semibold">
|
|
2026
|
+
<cide-ele-icon class="tw-mr-2">play_arrow</cide-ele-icon>
|
|
2027
|
+
Preview Sound
|
|
2028
|
+
</button>
|
|
2029
|
+
</div>
|
|
2030
|
+
}
|
|
2067
2031
|
</div>
|
|
2068
|
-
<label class="tw-relative tw-inline-flex tw-items-center tw-cursor-pointer">
|
|
2069
|
-
<input
|
|
2070
|
-
type="checkbox"
|
|
2071
|
-
formControlName="quietHoursEnabled"
|
|
2072
|
-
class="tw-sr-only tw-peer">
|
|
2073
|
-
<div class="tw-w-11 tw-h-6 tw-bg-gray-200 peer-focus:tw-outline-none peer-focus:tw-ring-4 peer-focus:tw-ring-blue-300 dark:peer-focus:tw-ring-blue-800 dark:peer-focus:tw-ring-offset-gray-800 tw-rounded-full peer dark:tw-bg-gray-700 peer-checked:after:tw-translate-x-full peer-checked:after:tw-border-white after:tw-content-[''] after:tw-absolute after:tw-top-[2px] after:tw-left-[2px] after:tw-bg-white after:tw-border-gray-300 after:tw-border after:tw-rounded-full after:tw-h-5 after:tw-w-5 after:tw-transition-all dark:tw-border-gray-600 peer-checked:tw-bg-blue-600"></div>
|
|
2074
|
-
</label>
|
|
2075
2032
|
</div>
|
|
2076
2033
|
|
|
2077
|
-
|
|
2078
|
-
|
|
2079
|
-
|
|
2080
|
-
|
|
2081
|
-
|
|
2082
|
-
|
|
2083
|
-
|
|
2084
|
-
|
|
2085
|
-
|
|
2086
|
-
|
|
2087
|
-
|
|
2088
|
-
|
|
2089
|
-
|
|
2090
|
-
|
|
2091
|
-
|
|
2092
|
-
|
|
2093
|
-
|
|
2094
|
-
|
|
2095
|
-
</div>
|
|
2096
|
-
}
|
|
2097
|
-
</div>
|
|
2034
|
+
<!-- Schedule & Snooze -->
|
|
2035
|
+
<div class="tw-space-y-6">
|
|
2036
|
+
<!-- Quiet Hours -->
|
|
2037
|
+
<div class="tw-space-y-4">
|
|
2038
|
+
<h4 class="tw-text-xs tw-font-bold tw-text-[var(--cide-ele-text-tertiary)] tw-uppercase tw-tracking-widest">Do Not Disturb</h4>
|
|
2039
|
+
<div class="tw-p-5 tw-bg-[var(--cide-ele-bg-secondary)] tw-rounded-2xl tw-border tw-border-[var(--cide-ele-border-primary)] tw-space-y-4">
|
|
2040
|
+
<div class="tw-flex tw-items-center tw-justify-between">
|
|
2041
|
+
<div class="tw-flex tw-items-center tw-gap-3">
|
|
2042
|
+
<div class="tw-p-1.5 tw-bg-amber-500/10 tw-rounded-lg">
|
|
2043
|
+
<cide-ele-icon class="tw-text-amber-500 tw-text-lg">bedtime</cide-ele-icon>
|
|
2044
|
+
</div>
|
|
2045
|
+
<span class="tw-text-sm tw-font-medium">Quiet Hours</span>
|
|
2046
|
+
</div>
|
|
2047
|
+
<label class="tw-relative tw-inline-flex tw-items-center tw-cursor-pointer">
|
|
2048
|
+
<input type="checkbox" formControlName="quietHoursEnabled" class="tw-sr-only tw-peer">
|
|
2049
|
+
<div class="tw-w-10 tw-h-5 tw-bg-gray-200 peer-focus:tw-outline-none tw-rounded-full peer dark:tw-bg-gray-700 peer-checked:after:tw-translate-x-full peer-checked:after:tw-border-white after:tw-content-[''] after:tw-absolute after:tw-top-[2px] after:tw-left-[2px] after:tw-bg-white after:tw-border-gray-300 after:tw-border after:tw-rounded-full after:tw-h-4 after:tw-w-4 after:tw-transition-all dark:tw-border-gray-600 peer-checked:tw-bg-blue-600"></div>
|
|
2050
|
+
</label>
|
|
2051
|
+
</div>
|
|
2098
2052
|
|
|
2099
|
-
|
|
2100
|
-
|
|
2101
|
-
|
|
2102
|
-
|
|
2103
|
-
|
|
2104
|
-
|
|
2105
|
-
|
|
2106
|
-
|
|
2107
|
-
|
|
2108
|
-
|
|
2109
|
-
|
|
2053
|
+
@if (settingsForm.get('quietHoursEnabled')?.value) {
|
|
2054
|
+
<div class="tw-grid tw-grid-cols-2 tw-gap-4 tw-pt-2">
|
|
2055
|
+
<div>
|
|
2056
|
+
<label class="tw-block tw-text-[10px] tw-font-bold tw-text-[var(--cide-ele-text-tertiary)] tw-mb-1 tw-uppercase">START</label>
|
|
2057
|
+
<cide-ele-input type="time" formControlName="quietHoursStart"></cide-ele-input>
|
|
2058
|
+
</div>
|
|
2059
|
+
<div>
|
|
2060
|
+
<label class="tw-block tw-text-[10px] tw-font-bold tw-text-[var(--cide-ele-text-tertiary)] tw-mb-1 tw-uppercase">END</label>
|
|
2061
|
+
<cide-ele-input type="time" formControlName="quietHoursEnd"></cide-ele-input>
|
|
2062
|
+
</div>
|
|
2063
|
+
</div>
|
|
2064
|
+
}
|
|
2110
2065
|
</div>
|
|
2111
2066
|
</div>
|
|
2112
|
-
<label class="tw-relative tw-inline-flex tw-items-center tw-cursor-pointer">
|
|
2113
|
-
<input
|
|
2114
|
-
type="checkbox"
|
|
2115
|
-
formControlName="snoozeEnabled"
|
|
2116
|
-
class="tw-sr-only tw-peer">
|
|
2117
|
-
<div class="tw-w-11 tw-h-6 tw-bg-gray-200 peer-focus:tw-outline-none peer-focus:tw-ring-4 peer-focus:tw-ring-blue-300 dark:peer-focus:tw-ring-blue-800 dark:peer-focus:tw-ring-offset-gray-800 tw-rounded-full peer dark:tw-bg-gray-700 peer-checked:after:tw-translate-x-full peer-checked:after:tw-border-white after:tw-content-[''] after:tw-absolute after:tw-top-[2px] after:tw-left-[2px] after:tw-bg-white after:tw-border-gray-300 after:tw-border after:tw-rounded-full after:tw-h-5 after:tw-w-5 after:tw-transition-all dark:tw-border-gray-600 peer-checked:tw-bg-blue-600"></div>
|
|
2118
|
-
</label>
|
|
2119
|
-
</div>
|
|
2120
2067
|
|
|
2121
|
-
|
|
2122
|
-
<div class="tw-
|
|
2123
|
-
<
|
|
2124
|
-
|
|
2125
|
-
|
|
2126
|
-
|
|
2127
|
-
|
|
2128
|
-
|
|
2129
|
-
|
|
2130
|
-
|
|
2131
|
-
|
|
2132
|
-
|
|
2133
|
-
|
|
2068
|
+
<!-- Snooze -->
|
|
2069
|
+
<div class="tw-space-y-4">
|
|
2070
|
+
<div class="tw-p-5 tw-bg-[var(--cide-ele-bg-secondary)] tw-rounded-2xl tw-border tw-border-[var(--cide-ele-border-primary)] tw-space-y-4">
|
|
2071
|
+
<div class="tw-flex tw-items-center tw-justify-between">
|
|
2072
|
+
<div class="tw-flex tw-items-center tw-gap-3">
|
|
2073
|
+
<div class="tw-p-1.5 tw-bg-rose-500/10 tw-rounded-lg">
|
|
2074
|
+
<cide-ele-icon class="tw-text-rose-500 tw-text-lg">snooze</cide-ele-icon>
|
|
2075
|
+
</div>
|
|
2076
|
+
<span class="tw-text-sm tw-font-medium">Snooze Notifications</span>
|
|
2077
|
+
</div>
|
|
2078
|
+
<label class="tw-relative tw-inline-flex tw-items-center tw-cursor-pointer">
|
|
2079
|
+
<input type="checkbox" formControlName="snoozeEnabled" class="tw-sr-only tw-peer">
|
|
2080
|
+
<div class="tw-w-10 tw-h-5 tw-bg-gray-200 peer-focus:tw-outline-none tw-rounded-full peer dark:tw-bg-gray-700 peer-checked:after:tw-translate-x-full peer-checked:after:tw-border-white after:tw-content-[''] after:tw-absolute after:tw-top-[2px] after:tw-left-[2px] after:tw-bg-white after:tw-border-gray-300 after:tw-border after:tw-rounded-full after:tw-h-4 after:tw-w-4 after:tw-transition-all dark:tw-border-gray-600 peer-checked:tw-bg-blue-600"></div>
|
|
2081
|
+
</label>
|
|
2082
|
+
</div>
|
|
2134
2083
|
|
|
2135
|
-
|
|
2136
|
-
|
|
2137
|
-
|
|
2138
|
-
|
|
2139
|
-
|
|
2140
|
-
|
|
2141
|
-
<div class="tw-flex tw-items-center tw-gap-2">
|
|
2142
|
-
<cide-ele-icon class="tw-text-gray-600 dark:tw-text-gray-400">desktop_windows</cide-ele-icon>
|
|
2143
|
-
<div>
|
|
2144
|
-
<label class="tw-text-sm tw-font-medium">Desktop Notifications</label>
|
|
2145
|
-
<p class="tw-m-0 tw-text-xs tw-text-gray-500 dark:tw-text-gray-400">Show browser notifications</p>
|
|
2084
|
+
@if (settingsForm.get('snoozeEnabled')?.value) {
|
|
2085
|
+
<div>
|
|
2086
|
+
<label class="tw-block tw-text-[10px] tw-font-bold tw-text-[var(--cide-ele-text-tertiary)] tw-mb-1 tw-uppercase">DURATION (MINUTES)</label>
|
|
2087
|
+
<cide-ele-input type="number" formControlName="snoozeDuration" min="5" max="1440"></cide-ele-input>
|
|
2088
|
+
</div>
|
|
2089
|
+
}
|
|
2146
2090
|
</div>
|
|
2147
2091
|
</div>
|
|
2148
|
-
<label class="tw-relative tw-inline-flex tw-items-center tw-cursor-pointer">
|
|
2149
|
-
<input
|
|
2150
|
-
type="checkbox"
|
|
2151
|
-
formControlName="desktopNotifications"
|
|
2152
|
-
class="tw-sr-only tw-peer">
|
|
2153
|
-
<div class="tw-w-11 tw-h-6 tw-bg-gray-200 peer-focus:tw-outline-none peer-focus:tw-ring-4 peer-focus:tw-ring-blue-300 dark:peer-focus:tw-ring-blue-800 dark:peer-focus:tw-ring-offset-gray-800 tw-rounded-full peer dark:tw-bg-gray-700 peer-checked:after:tw-translate-x-full peer-checked:after:tw-border-white after:tw-content-[''] after:tw-absolute after:tw-top-[2px] after:tw-left-[2px] after:tw-bg-white after:tw-border-gray-300 after:tw-border after:tw-rounded-full after:tw-h-5 after:tw-w-5 after:tw-transition-all dark:tw-border-gray-600 peer-checked:tw-bg-blue-600"></div>
|
|
2154
|
-
</label>
|
|
2155
2092
|
</div>
|
|
2156
2093
|
</div>
|
|
2157
2094
|
|
|
2158
|
-
<!--
|
|
2159
|
-
<div class="tw-flex tw-gap-
|
|
2160
|
-
<button
|
|
2161
|
-
|
|
2162
|
-
cideEleButton
|
|
2163
|
-
variant="outline"
|
|
2164
|
-
size="sm"
|
|
2165
|
-
(click)="reset()"
|
|
2166
|
-
class="tw-flex-1">
|
|
2167
|
-
Reset
|
|
2168
|
-
</button>
|
|
2169
|
-
<button
|
|
2170
|
-
type="button"
|
|
2171
|
-
cideEleButton
|
|
2172
|
-
variant="primary"
|
|
2173
|
-
size="sm"
|
|
2174
|
-
(click)="save()"
|
|
2175
|
-
class="tw-flex-1">
|
|
2176
|
-
Save Settings
|
|
2177
|
-
</button>
|
|
2095
|
+
<!-- Footer Actions -->
|
|
2096
|
+
<div class="tw-flex tw-items-center tw-justify-end tw-gap-3 tw-pt-6 tw-border-t tw-border-[var(--cide-ele-border-primary)]">
|
|
2097
|
+
<button type="button" cideEleButton variant="ghost" (click)="reset()" class="tw-text-[var(--cide-ele-text-secondary)] tw-font-medium">Discard Changes</button>
|
|
2098
|
+
<button type="button" cideEleButton variant="primary" (click)="save()" [disabled]="settingsForm.pristine || settingsForm.invalid" class="tw-px-8 tw-shadow-lg tw-shadow-blue-500/20">Apply Settings</button>
|
|
2178
2099
|
</div>
|
|
2179
2100
|
</form>
|
|
2180
2101
|
</div>
|
|
@@ -2191,261 +2112,182 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
|
|
|
2191
2112
|
CideInputComponent,
|
|
2192
2113
|
CideSelectComponent
|
|
2193
2114
|
], template: `
|
|
2194
|
-
<div class="notification-settings-container tw-p-6 tw-space-y-6 tw-bg-
|
|
2195
|
-
|
|
2196
|
-
<div class="tw-flex tw-items-center tw-gap-2 tw-pb-3 tw-border-b tw-border-gray-200 dark:tw-border-gray-700">
|
|
2197
|
-
<div class="tw-w-8 tw-h-8 tw-bg-blue-500 tw-rounded-lg tw-flex tw-items-center tw-justify-center">
|
|
2198
|
-
<cide-ele-icon class="tw-text-white">settings</cide-ele-icon>
|
|
2199
|
-
</div>
|
|
2200
|
-
<div>
|
|
2201
|
-
<h3 class="tw-m-0 tw-text-sm tw-font-semibold">Notification Settings</h3>
|
|
2202
|
-
<p class="tw-m-0 tw-text-xs tw-text-gray-600 dark:tw-text-gray-400">Customize your notification preferences</p>
|
|
2203
|
-
</div>
|
|
2204
|
-
</div>
|
|
2205
|
-
|
|
2206
|
-
<form [formGroup]="settingsForm" class="tw-space-y-6">
|
|
2115
|
+
<div class="notification-settings-container tw-p-6 tw-space-y-6 tw-bg-[var(--cide-ele-bg-primary)] tw-text-[var(--cide-ele-text-primary)]">
|
|
2116
|
+
<form [formGroup]="settingsForm" class="tw-space-y-8">
|
|
2207
2117
|
<!-- Notification Channels -->
|
|
2208
|
-
<div class="tw-space-y-
|
|
2209
|
-
<h4 class="tw-text-xs tw-font-
|
|
2118
|
+
<div class="tw-space-y-4">
|
|
2119
|
+
<h4 class="tw-text-xs tw-font-bold tw-text-[var(--cide-ele-text-tertiary)] tw-uppercase tw-tracking-widest">Notification Channels</h4>
|
|
2210
2120
|
|
|
2211
|
-
|
|
2212
|
-
|
|
2213
|
-
<div class="tw-flex tw-
|
|
2214
|
-
<
|
|
2215
|
-
|
|
2216
|
-
|
|
2217
|
-
|
|
2121
|
+
<div class="tw-grid tw-grid-cols-1 md:tw-grid-cols-3 tw-gap-4">
|
|
2122
|
+
<!-- In-App Notifications -->
|
|
2123
|
+
<div class="tw-flex tw-flex-col tw-justify-between tw-p-4 tw-bg-[var(--cide-ele-bg-secondary)] tw-rounded-xl tw-border tw-border-[var(--cide-ele-border-primary)] hover:tw-border-[var(--cide-ele-border-active)] tw-transition-all">
|
|
2124
|
+
<div class="tw-flex tw-items-center tw-gap-3 tw-mb-4">
|
|
2125
|
+
<div class="tw-p-2 tw-bg-blue-500/10 tw-rounded-lg">
|
|
2126
|
+
<cide-ele-icon class="tw-text-blue-500">notifications</cide-ele-icon>
|
|
2127
|
+
</div>
|
|
2128
|
+
<div>
|
|
2129
|
+
<label class="tw-text-sm tw-font-semibold tw-block">In-App</label>
|
|
2130
|
+
<p class="tw-m-0 tw-text-[10px] tw-text-[var(--cide-ele-text-tertiary)]">Within the application</p>
|
|
2131
|
+
</div>
|
|
2132
|
+
</div>
|
|
2133
|
+
<div class="tw-flex tw-justify-end">
|
|
2134
|
+
<label class="tw-relative tw-inline-flex tw-items-center tw-cursor-pointer">
|
|
2135
|
+
<input type="checkbox" formControlName="channelInApp" class="tw-sr-only tw-peer">
|
|
2136
|
+
<div class="tw-w-10 tw-h-5 tw-bg-gray-200 peer-focus:tw-outline-none tw-rounded-full peer dark:tw-bg-gray-700 peer-checked:after:tw-translate-x-full peer-checked:after:tw-border-white after:tw-content-[''] after:tw-absolute after:tw-top-[2px] after:tw-left-[2px] after:tw-bg-white after:tw-border-gray-300 after:tw-border after:tw-rounded-full after:tw-h-4 after:tw-w-4 after:tw-transition-all dark:tw-border-gray-600 peer-checked:tw-bg-blue-600"></div>
|
|
2137
|
+
</label>
|
|
2218
2138
|
</div>
|
|
2219
2139
|
</div>
|
|
2220
|
-
<label class="tw-relative tw-inline-flex tw-items-center tw-cursor-pointer">
|
|
2221
|
-
<input type="checkbox" formControlName="channelInApp" class="tw-sr-only tw-peer">
|
|
2222
|
-
<div class="tw-w-11 tw-h-6 tw-bg-gray-200 peer-focus:tw-outline-none peer-focus:tw-ring-4 peer-focus:tw-ring-blue-300 dark:peer-focus:tw-ring-blue-800 dark:peer-focus:tw-ring-offset-gray-800 tw-rounded-full peer dark:tw-bg-gray-700 peer-checked:after:tw-translate-x-full peer-checked:after:tw-border-white after:tw-content-[''] after:tw-absolute after:tw-top-[2px] after:tw-left-[2px] after:tw-bg-white after:tw-border-gray-300 after:tw-border after:tw-rounded-full after:tw-h-5 after:tw-w-5 after:tw-transition-all dark:tw-border-gray-600 peer-checked:tw-bg-blue-600"></div>
|
|
2223
|
-
</label>
|
|
2224
|
-
</div>
|
|
2225
2140
|
|
|
2226
|
-
|
|
2227
|
-
|
|
2228
|
-
|
|
2229
|
-
|
|
2230
|
-
|
|
2231
|
-
|
|
2232
|
-
<
|
|
2141
|
+
<!-- Email Notifications -->
|
|
2142
|
+
<div class="tw-flex tw-flex-col tw-justify-between tw-p-4 tw-bg-[var(--cide-ele-bg-secondary)] tw-rounded-xl tw-border tw-border-[var(--cide-ele-border-primary)] hover:tw-border-[var(--cide-ele-border-active)] tw-transition-all">
|
|
2143
|
+
<div class="tw-flex tw-items-center tw-gap-3 tw-mb-4">
|
|
2144
|
+
<div class="tw-p-2 tw-bg-purple-500/10 tw-rounded-lg">
|
|
2145
|
+
<cide-ele-icon class="tw-text-purple-500">mail</cide-ele-icon>
|
|
2146
|
+
</div>
|
|
2147
|
+
<div>
|
|
2148
|
+
<label class="tw-text-sm tw-font-semibold tw-block">Email</label>
|
|
2149
|
+
<p class="tw-m-0 tw-text-[10px] tw-text-[var(--cide-ele-text-tertiary)]">Via your register email</p>
|
|
2150
|
+
</div>
|
|
2151
|
+
</div>
|
|
2152
|
+
<div class="tw-flex tw-justify-end">
|
|
2153
|
+
<label class="tw-relative tw-inline-flex tw-items-center tw-cursor-pointer">
|
|
2154
|
+
<input type="checkbox" formControlName="channelEmail" class="tw-sr-only tw-peer">
|
|
2155
|
+
<div class="tw-w-10 tw-h-5 tw-bg-gray-200 peer-focus:tw-outline-none tw-rounded-full peer dark:tw-bg-gray-700 peer-checked:after:tw-translate-x-full peer-checked:after:tw-border-white after:tw-content-[''] after:tw-absolute after:tw-top-[2px] after:tw-left-[2px] after:tw-bg-white after:tw-border-gray-300 after:tw-border after:tw-rounded-full after:tw-h-4 after:tw-w-4 after:tw-transition-all dark:tw-border-gray-600 peer-checked:tw-bg-blue-600"></div>
|
|
2156
|
+
</label>
|
|
2233
2157
|
</div>
|
|
2234
2158
|
</div>
|
|
2235
|
-
<label class="tw-relative tw-inline-flex tw-items-center tw-cursor-pointer">
|
|
2236
|
-
<input type="checkbox" formControlName="channelEmail" class="tw-sr-only tw-peer">
|
|
2237
|
-
<div class="tw-w-11 tw-h-6 tw-bg-gray-200 peer-focus:tw-outline-none peer-focus:tw-ring-4 peer-focus:tw-ring-blue-300 dark:peer-focus:tw-ring-blue-800 dark:peer-focus:tw-ring-offset-gray-800 tw-rounded-full peer dark:tw-bg-gray-700 peer-checked:after:tw-translate-x-full peer-checked:after:tw-border-white after:tw-content-[''] after:tw-absolute after:tw-top-[2px] after:tw-left-[2px] after:tw-bg-white after:tw-border-gray-300 after:tw-border after:tw-rounded-full after:tw-h-5 after:tw-w-5 after:tw-transition-all dark:tw-border-gray-600 peer-checked:tw-bg-blue-600"></div>
|
|
2238
|
-
</label>
|
|
2239
|
-
</div>
|
|
2240
2159
|
|
|
2241
|
-
|
|
2242
|
-
|
|
2243
|
-
|
|
2244
|
-
|
|
2245
|
-
|
|
2246
|
-
|
|
2247
|
-
<
|
|
2160
|
+
<!-- SMS Notifications -->
|
|
2161
|
+
<div class="tw-flex tw-flex-col tw-justify-between tw-p-4 tw-bg-[var(--cide-ele-bg-secondary)] tw-rounded-xl tw-border tw-border-[var(--cide-ele-border-primary)] hover:tw-border-[var(--cide-ele-border-active)] tw-transition-all">
|
|
2162
|
+
<div class="tw-flex tw-items-center tw-gap-3 tw-mb-4">
|
|
2163
|
+
<div class="tw-p-2 tw-bg-orange-500/10 tw-rounded-lg">
|
|
2164
|
+
<cide-ele-icon class="tw-text-orange-500">sms</cide-ele-icon>
|
|
2165
|
+
</div>
|
|
2166
|
+
<div>
|
|
2167
|
+
<label class="tw-text-sm tw-font-semibold tw-block">SMS/Mobile</label>
|
|
2168
|
+
<p class="tw-m-0 tw-text-[10px] tw-text-[var(--cide-ele-text-tertiary)]">Text message updates</p>
|
|
2169
|
+
</div>
|
|
2170
|
+
</div>
|
|
2171
|
+
<div class="tw-flex tw-justify-end">
|
|
2172
|
+
<label class="tw-relative tw-inline-flex tw-items-center tw-cursor-pointer">
|
|
2173
|
+
<input type="checkbox" formControlName="channelSms" class="tw-sr-only tw-peer">
|
|
2174
|
+
<div class="tw-w-10 tw-h-5 tw-bg-gray-200 peer-focus:tw-outline-none tw-rounded-full peer dark:tw-bg-gray-700 peer-checked:after:tw-translate-x-full peer-checked:after:tw-border-white after:tw-content-[''] after:tw-absolute after:tw-top-[2px] after:tw-left-[2px] after:tw-bg-white after:tw-border-gray-300 after:tw-border after:tw-rounded-full after:tw-h-4 after:tw-w-4 after:tw-transition-all dark:tw-border-gray-600 peer-checked:tw-bg-blue-600"></div>
|
|
2175
|
+
</label>
|
|
2248
2176
|
</div>
|
|
2249
2177
|
</div>
|
|
2250
|
-
<label class="tw-relative tw-inline-flex tw-items-center tw-cursor-pointer">
|
|
2251
|
-
<input type="checkbox" formControlName="channelSms" class="tw-sr-only tw-peer">
|
|
2252
|
-
<div class="tw-w-11 tw-h-6 tw-bg-gray-200 peer-focus:tw-outline-none peer-focus:tw-ring-4 peer-focus:tw-ring-blue-300 dark:peer-focus:tw-ring-blue-800 dark:peer-focus:tw-ring-offset-gray-800 tw-rounded-full peer dark:tw-bg-gray-700 peer-checked:after:tw-translate-x-full peer-checked:after:tw-border-white after:tw-content-[''] after:tw-absolute after:tw-top-[2px] after:tw-left-[2px] after:tw-bg-white after:tw-border-gray-300 after:tw-border after:tw-rounded-full after:tw-h-5 after:tw-w-5 after:tw-transition-all dark:tw-border-gray-600 peer-checked:tw-bg-blue-600"></div>
|
|
2253
|
-
</label>
|
|
2254
2178
|
</div>
|
|
2255
2179
|
</div>
|
|
2256
2180
|
|
|
2257
|
-
|
|
2258
|
-
|
|
2259
|
-
<
|
|
2260
|
-
|
|
2261
|
-
|
|
2262
|
-
|
|
2263
|
-
|
|
2264
|
-
|
|
2265
|
-
|
|
2266
|
-
|
|
2267
|
-
|
|
2181
|
+
<div class="tw-grid tw-grid-cols-1 md:tw-grid-cols-2 tw-gap-8">
|
|
2182
|
+
<!-- Sound Settings -->
|
|
2183
|
+
<div class="tw-space-y-4">
|
|
2184
|
+
<h4 class="tw-text-xs tw-font-bold tw-text-[var(--cide-ele-text-tertiary)] tw-uppercase tw-tracking-widest">Sound Preferences</h4>
|
|
2185
|
+
|
|
2186
|
+
<div class="tw-p-5 tw-bg-[var(--cide-ele-bg-secondary)] tw-rounded-2xl tw-border tw-border-[var(--cide-ele-border-primary)] tw-space-y-5">
|
|
2187
|
+
<div class="tw-flex tw-items-center tw-justify-between">
|
|
2188
|
+
<div class="tw-flex tw-items-center tw-gap-3">
|
|
2189
|
+
<div class="tw-p-1.5 tw-bg-blue-500/10 tw-rounded-lg">
|
|
2190
|
+
<cide-ele-icon class="tw-text-blue-500 tw-text-lg">volume_up</cide-ele-icon>
|
|
2191
|
+
</div>
|
|
2192
|
+
<span class="tw-text-sm tw-font-medium">Enable Alert Sounds</span>
|
|
2193
|
+
</div>
|
|
2194
|
+
<label class="tw-relative tw-inline-flex tw-items-center tw-cursor-pointer">
|
|
2195
|
+
<input type="checkbox" formControlName="soundEnabled" class="tw-sr-only tw-peer">
|
|
2196
|
+
<div class="tw-w-10 tw-h-5 tw-bg-gray-200 peer-focus:tw-outline-none tw-rounded-full peer dark:tw-bg-gray-700 peer-checked:after:tw-translate-x-full peer-checked:after:tw-border-white after:tw-content-[''] after:tw-absolute after:tw-top-[2px] after:tw-left-[2px] after:tw-bg-white after:tw-border-gray-300 after:tw-border after:tw-rounded-full after:tw-h-4 after:tw-w-4 after:tw-transition-all dark:tw-border-gray-600 peer-checked:tw-bg-blue-600"></div>
|
|
2197
|
+
</label>
|
|
2268
2198
|
</div>
|
|
2269
|
-
</div>
|
|
2270
|
-
<label class="tw-relative tw-inline-flex tw-items-center tw-cursor-pointer">
|
|
2271
|
-
<input
|
|
2272
|
-
type="checkbox"
|
|
2273
|
-
formControlName="soundEnabled"
|
|
2274
|
-
class="tw-sr-only tw-peer">
|
|
2275
|
-
<div class="tw-w-11 tw-h-6 tw-bg-gray-200 peer-focus:tw-outline-none peer-focus:tw-ring-4 peer-focus:tw-ring-blue-300 dark:peer-focus:tw-ring-blue-800 dark:peer-focus:tw-ring-offset-gray-800 tw-rounded-full peer dark:tw-bg-gray-700 peer-checked:after:tw-translate-x-full peer-checked:after:tw-border-white after:tw-content-[''] after:tw-absolute after:tw-top-[2px] after:tw-left-[2px] after:tw-bg-white after:tw-border-gray-300 after:tw-border after:tw-rounded-full after:tw-h-5 after:tw-w-5 after:tw-transition-all dark:tw-border-gray-600 peer-checked:tw-bg-blue-600"></div>
|
|
2276
|
-
</label>
|
|
2277
|
-
</div>
|
|
2278
|
-
|
|
2279
|
-
@if (settingsForm.get('soundEnabled')?.value) {
|
|
2280
|
-
<!-- Sound Type -->
|
|
2281
|
-
<div class="tw-p-3 tw-bg-gray-50 dark:tw-bg-gray-800/50 tw-rounded-lg tw-border tw-border-gray-200 dark:tw-border-gray-700">
|
|
2282
|
-
<label class="tw-block tw-text-xs tw-font-medium tw-mb-2">Sound Type</label>
|
|
2283
|
-
<cide-ele-select
|
|
2284
|
-
formControlName="soundType"
|
|
2285
|
-
[options]="soundTypeOptions"
|
|
2286
|
-
placeholder="Select sound type">
|
|
2287
|
-
</cide-ele-select>
|
|
2288
|
-
</div>
|
|
2289
2199
|
|
|
2290
|
-
|
|
2291
|
-
|
|
2292
|
-
|
|
2293
|
-
|
|
2294
|
-
|
|
2295
|
-
|
|
2296
|
-
<div class="volume-slider-container">
|
|
2297
|
-
<input
|
|
2298
|
-
type="range"
|
|
2299
|
-
formControlName="soundVolume"
|
|
2300
|
-
min="0"
|
|
2301
|
-
max="100"
|
|
2302
|
-
step="1"
|
|
2303
|
-
(input)="onVolumeChange($event)"
|
|
2304
|
-
class="volume-slider tw-w-full">
|
|
2305
|
-
</div>
|
|
2306
|
-
<div class="tw-flex tw-justify-between tw-text-[10px] tw-text-gray-500 dark:tw-text-gray-400 tw-mt-1">
|
|
2307
|
-
<span>0%</span>
|
|
2308
|
-
<span>100%</span>
|
|
2309
|
-
</div>
|
|
2310
|
-
</div>
|
|
2200
|
+
@if (settingsForm.get('soundEnabled')?.value) {
|
|
2201
|
+
<div class="tw-space-y-4 tw-pt-2 tw-border-t tw-border-[var(--cide-ele-border-primary)] tw-border-dashed">
|
|
2202
|
+
<div>
|
|
2203
|
+
<label class="tw-block tw-text-xs tw-font-semibold tw-text-[var(--cide-ele-text-secondary)] tw-mb-3">NOTIFICATION SOUND</label>
|
|
2204
|
+
<cide-ele-select formControlName="soundType" [options]="soundTypeOptions" placeholder="Select Sound"></cide-ele-select>
|
|
2205
|
+
</div>
|
|
2311
2206
|
|
|
2312
|
-
|
|
2313
|
-
|
|
2314
|
-
|
|
2315
|
-
|
|
2316
|
-
|
|
2317
|
-
|
|
2318
|
-
|
|
2319
|
-
|
|
2320
|
-
|
|
2321
|
-
Test Sound
|
|
2322
|
-
</button>
|
|
2323
|
-
}
|
|
2324
|
-
</div>
|
|
2207
|
+
<div class="tw-space-y-3">
|
|
2208
|
+
<div class="tw-flex tw-items-center tw-justify-between">
|
|
2209
|
+
<label class="tw-text-xs tw-font-semibold tw-text-[var(--cide-ele-text-secondary)]">VOLUME LEVEL</label>
|
|
2210
|
+
<span class="tw-text-xs tw-font-bold tw-text-blue-500">{{ settingsForm.get('soundVolume')?.value }}%</span>
|
|
2211
|
+
</div>
|
|
2212
|
+
<div class="volume-slider-container">
|
|
2213
|
+
<input type="range" formControlName="soundVolume" min="0" max="100" step="1" (input)="onVolumeChange($event)" class="volume-slider tw-w-full">
|
|
2214
|
+
</div>
|
|
2215
|
+
</div>
|
|
2325
2216
|
|
|
2326
|
-
|
|
2327
|
-
|
|
2328
|
-
|
|
2329
|
-
|
|
2330
|
-
|
|
2331
|
-
|
|
2332
|
-
<div class="tw-flex tw-items-center tw-gap-2">
|
|
2333
|
-
<cide-ele-icon class="tw-text-gray-600 dark:tw-text-gray-400">schedule</cide-ele-icon>
|
|
2334
|
-
<div>
|
|
2335
|
-
<label class="tw-text-sm tw-font-medium">Enable Quiet Hours</label>
|
|
2336
|
-
<p class="tw-m-0 tw-text-xs tw-text-gray-500 dark:tw-text-gray-400">Mute notifications during specified hours</p>
|
|
2337
|
-
</div>
|
|
2217
|
+
<button type="button" cideEleButton variant="ghost" size="sm" (click)="testSound()" class="tw-w-full tw-bg-blue-500/5 hover:tw-bg-blue-500/10 tw-text-blue-500 tw-font-semibold">
|
|
2218
|
+
<cide-ele-icon class="tw-mr-2">play_arrow</cide-ele-icon>
|
|
2219
|
+
Preview Sound
|
|
2220
|
+
</button>
|
|
2221
|
+
</div>
|
|
2222
|
+
}
|
|
2338
2223
|
</div>
|
|
2339
|
-
<label class="tw-relative tw-inline-flex tw-items-center tw-cursor-pointer">
|
|
2340
|
-
<input
|
|
2341
|
-
type="checkbox"
|
|
2342
|
-
formControlName="quietHoursEnabled"
|
|
2343
|
-
class="tw-sr-only tw-peer">
|
|
2344
|
-
<div class="tw-w-11 tw-h-6 tw-bg-gray-200 peer-focus:tw-outline-none peer-focus:tw-ring-4 peer-focus:tw-ring-blue-300 dark:peer-focus:tw-ring-blue-800 dark:peer-focus:tw-ring-offset-gray-800 tw-rounded-full peer dark:tw-bg-gray-700 peer-checked:after:tw-translate-x-full peer-checked:after:tw-border-white after:tw-content-[''] after:tw-absolute after:tw-top-[2px] after:tw-left-[2px] after:tw-bg-white after:tw-border-gray-300 after:tw-border after:tw-rounded-full after:tw-h-5 after:tw-w-5 after:tw-transition-all dark:tw-border-gray-600 peer-checked:tw-bg-blue-600"></div>
|
|
2345
|
-
</label>
|
|
2346
2224
|
</div>
|
|
2347
2225
|
|
|
2348
|
-
|
|
2349
|
-
|
|
2350
|
-
|
|
2351
|
-
|
|
2352
|
-
|
|
2353
|
-
|
|
2354
|
-
|
|
2355
|
-
|
|
2356
|
-
|
|
2357
|
-
|
|
2358
|
-
|
|
2359
|
-
|
|
2360
|
-
|
|
2361
|
-
|
|
2362
|
-
|
|
2363
|
-
|
|
2364
|
-
|
|
2365
|
-
|
|
2366
|
-
</div>
|
|
2367
|
-
}
|
|
2368
|
-
</div>
|
|
2226
|
+
<!-- Schedule & Snooze -->
|
|
2227
|
+
<div class="tw-space-y-6">
|
|
2228
|
+
<!-- Quiet Hours -->
|
|
2229
|
+
<div class="tw-space-y-4">
|
|
2230
|
+
<h4 class="tw-text-xs tw-font-bold tw-text-[var(--cide-ele-text-tertiary)] tw-uppercase tw-tracking-widest">Do Not Disturb</h4>
|
|
2231
|
+
<div class="tw-p-5 tw-bg-[var(--cide-ele-bg-secondary)] tw-rounded-2xl tw-border tw-border-[var(--cide-ele-border-primary)] tw-space-y-4">
|
|
2232
|
+
<div class="tw-flex tw-items-center tw-justify-between">
|
|
2233
|
+
<div class="tw-flex tw-items-center tw-gap-3">
|
|
2234
|
+
<div class="tw-p-1.5 tw-bg-amber-500/10 tw-rounded-lg">
|
|
2235
|
+
<cide-ele-icon class="tw-text-amber-500 tw-text-lg">bedtime</cide-ele-icon>
|
|
2236
|
+
</div>
|
|
2237
|
+
<span class="tw-text-sm tw-font-medium">Quiet Hours</span>
|
|
2238
|
+
</div>
|
|
2239
|
+
<label class="tw-relative tw-inline-flex tw-items-center tw-cursor-pointer">
|
|
2240
|
+
<input type="checkbox" formControlName="quietHoursEnabled" class="tw-sr-only tw-peer">
|
|
2241
|
+
<div class="tw-w-10 tw-h-5 tw-bg-gray-200 peer-focus:tw-outline-none tw-rounded-full peer dark:tw-bg-gray-700 peer-checked:after:tw-translate-x-full peer-checked:after:tw-border-white after:tw-content-[''] after:tw-absolute after:tw-top-[2px] after:tw-left-[2px] after:tw-bg-white after:tw-border-gray-300 after:tw-border after:tw-rounded-full after:tw-h-4 after:tw-w-4 after:tw-transition-all dark:tw-border-gray-600 peer-checked:tw-bg-blue-600"></div>
|
|
2242
|
+
</label>
|
|
2243
|
+
</div>
|
|
2369
2244
|
|
|
2370
|
-
|
|
2371
|
-
|
|
2372
|
-
|
|
2373
|
-
|
|
2374
|
-
|
|
2375
|
-
|
|
2376
|
-
|
|
2377
|
-
|
|
2378
|
-
|
|
2379
|
-
|
|
2380
|
-
|
|
2245
|
+
@if (settingsForm.get('quietHoursEnabled')?.value) {
|
|
2246
|
+
<div class="tw-grid tw-grid-cols-2 tw-gap-4 tw-pt-2">
|
|
2247
|
+
<div>
|
|
2248
|
+
<label class="tw-block tw-text-[10px] tw-font-bold tw-text-[var(--cide-ele-text-tertiary)] tw-mb-1 tw-uppercase">START</label>
|
|
2249
|
+
<cide-ele-input type="time" formControlName="quietHoursStart"></cide-ele-input>
|
|
2250
|
+
</div>
|
|
2251
|
+
<div>
|
|
2252
|
+
<label class="tw-block tw-text-[10px] tw-font-bold tw-text-[var(--cide-ele-text-tertiary)] tw-mb-1 tw-uppercase">END</label>
|
|
2253
|
+
<cide-ele-input type="time" formControlName="quietHoursEnd"></cide-ele-input>
|
|
2254
|
+
</div>
|
|
2255
|
+
</div>
|
|
2256
|
+
}
|
|
2381
2257
|
</div>
|
|
2382
2258
|
</div>
|
|
2383
|
-
<label class="tw-relative tw-inline-flex tw-items-center tw-cursor-pointer">
|
|
2384
|
-
<input
|
|
2385
|
-
type="checkbox"
|
|
2386
|
-
formControlName="snoozeEnabled"
|
|
2387
|
-
class="tw-sr-only tw-peer">
|
|
2388
|
-
<div class="tw-w-11 tw-h-6 tw-bg-gray-200 peer-focus:tw-outline-none peer-focus:tw-ring-4 peer-focus:tw-ring-blue-300 dark:peer-focus:tw-ring-blue-800 dark:peer-focus:tw-ring-offset-gray-800 tw-rounded-full peer dark:tw-bg-gray-700 peer-checked:after:tw-translate-x-full peer-checked:after:tw-border-white after:tw-content-[''] after:tw-absolute after:tw-top-[2px] after:tw-left-[2px] after:tw-bg-white after:tw-border-gray-300 after:tw-border after:tw-rounded-full after:tw-h-5 after:tw-w-5 after:tw-transition-all dark:tw-border-gray-600 peer-checked:tw-bg-blue-600"></div>
|
|
2389
|
-
</label>
|
|
2390
|
-
</div>
|
|
2391
2259
|
|
|
2392
|
-
|
|
2393
|
-
<div class="tw-
|
|
2394
|
-
<
|
|
2395
|
-
|
|
2396
|
-
|
|
2397
|
-
|
|
2398
|
-
|
|
2399
|
-
|
|
2400
|
-
|
|
2401
|
-
|
|
2402
|
-
|
|
2403
|
-
|
|
2404
|
-
|
|
2260
|
+
<!-- Snooze -->
|
|
2261
|
+
<div class="tw-space-y-4">
|
|
2262
|
+
<div class="tw-p-5 tw-bg-[var(--cide-ele-bg-secondary)] tw-rounded-2xl tw-border tw-border-[var(--cide-ele-border-primary)] tw-space-y-4">
|
|
2263
|
+
<div class="tw-flex tw-items-center tw-justify-between">
|
|
2264
|
+
<div class="tw-flex tw-items-center tw-gap-3">
|
|
2265
|
+
<div class="tw-p-1.5 tw-bg-rose-500/10 tw-rounded-lg">
|
|
2266
|
+
<cide-ele-icon class="tw-text-rose-500 tw-text-lg">snooze</cide-ele-icon>
|
|
2267
|
+
</div>
|
|
2268
|
+
<span class="tw-text-sm tw-font-medium">Snooze Notifications</span>
|
|
2269
|
+
</div>
|
|
2270
|
+
<label class="tw-relative tw-inline-flex tw-items-center tw-cursor-pointer">
|
|
2271
|
+
<input type="checkbox" formControlName="snoozeEnabled" class="tw-sr-only tw-peer">
|
|
2272
|
+
<div class="tw-w-10 tw-h-5 tw-bg-gray-200 peer-focus:tw-outline-none tw-rounded-full peer dark:tw-bg-gray-700 peer-checked:after:tw-translate-x-full peer-checked:after:tw-border-white after:tw-content-[''] after:tw-absolute after:tw-top-[2px] after:tw-left-[2px] after:tw-bg-white after:tw-border-gray-300 after:tw-border after:tw-rounded-full after:tw-h-4 after:tw-w-4 after:tw-transition-all dark:tw-border-gray-600 peer-checked:tw-bg-blue-600"></div>
|
|
2273
|
+
</label>
|
|
2274
|
+
</div>
|
|
2405
2275
|
|
|
2406
|
-
|
|
2407
|
-
|
|
2408
|
-
|
|
2409
|
-
|
|
2410
|
-
|
|
2411
|
-
|
|
2412
|
-
<div class="tw-flex tw-items-center tw-gap-2">
|
|
2413
|
-
<cide-ele-icon class="tw-text-gray-600 dark:tw-text-gray-400">desktop_windows</cide-ele-icon>
|
|
2414
|
-
<div>
|
|
2415
|
-
<label class="tw-text-sm tw-font-medium">Desktop Notifications</label>
|
|
2416
|
-
<p class="tw-m-0 tw-text-xs tw-text-gray-500 dark:tw-text-gray-400">Show browser notifications</p>
|
|
2276
|
+
@if (settingsForm.get('snoozeEnabled')?.value) {
|
|
2277
|
+
<div>
|
|
2278
|
+
<label class="tw-block tw-text-[10px] tw-font-bold tw-text-[var(--cide-ele-text-tertiary)] tw-mb-1 tw-uppercase">DURATION (MINUTES)</label>
|
|
2279
|
+
<cide-ele-input type="number" formControlName="snoozeDuration" min="5" max="1440"></cide-ele-input>
|
|
2280
|
+
</div>
|
|
2281
|
+
}
|
|
2417
2282
|
</div>
|
|
2418
2283
|
</div>
|
|
2419
|
-
<label class="tw-relative tw-inline-flex tw-items-center tw-cursor-pointer">
|
|
2420
|
-
<input
|
|
2421
|
-
type="checkbox"
|
|
2422
|
-
formControlName="desktopNotifications"
|
|
2423
|
-
class="tw-sr-only tw-peer">
|
|
2424
|
-
<div class="tw-w-11 tw-h-6 tw-bg-gray-200 peer-focus:tw-outline-none peer-focus:tw-ring-4 peer-focus:tw-ring-blue-300 dark:peer-focus:tw-ring-blue-800 dark:peer-focus:tw-ring-offset-gray-800 tw-rounded-full peer dark:tw-bg-gray-700 peer-checked:after:tw-translate-x-full peer-checked:after:tw-border-white after:tw-content-[''] after:tw-absolute after:tw-top-[2px] after:tw-left-[2px] after:tw-bg-white after:tw-border-gray-300 after:tw-border after:tw-rounded-full after:tw-h-5 after:tw-w-5 after:tw-transition-all dark:tw-border-gray-600 peer-checked:tw-bg-blue-600"></div>
|
|
2425
|
-
</label>
|
|
2426
2284
|
</div>
|
|
2427
2285
|
</div>
|
|
2428
2286
|
|
|
2429
|
-
<!--
|
|
2430
|
-
<div class="tw-flex tw-gap-
|
|
2431
|
-
<button
|
|
2432
|
-
|
|
2433
|
-
cideEleButton
|
|
2434
|
-
variant="outline"
|
|
2435
|
-
size="sm"
|
|
2436
|
-
(click)="reset()"
|
|
2437
|
-
class="tw-flex-1">
|
|
2438
|
-
Reset
|
|
2439
|
-
</button>
|
|
2440
|
-
<button
|
|
2441
|
-
type="button"
|
|
2442
|
-
cideEleButton
|
|
2443
|
-
variant="primary"
|
|
2444
|
-
size="sm"
|
|
2445
|
-
(click)="save()"
|
|
2446
|
-
class="tw-flex-1">
|
|
2447
|
-
Save Settings
|
|
2448
|
-
</button>
|
|
2287
|
+
<!-- Footer Actions -->
|
|
2288
|
+
<div class="tw-flex tw-items-center tw-justify-end tw-gap-3 tw-pt-6 tw-border-t tw-border-[var(--cide-ele-border-primary)]">
|
|
2289
|
+
<button type="button" cideEleButton variant="ghost" (click)="reset()" class="tw-text-[var(--cide-ele-text-secondary)] tw-font-medium">Discard Changes</button>
|
|
2290
|
+
<button type="button" cideEleButton variant="primary" (click)="save()" [disabled]="settingsForm.pristine || settingsForm.invalid" class="tw-px-8 tw-shadow-lg tw-shadow-blue-500/20">Apply Settings</button>
|
|
2449
2291
|
</div>
|
|
2450
2292
|
</form>
|
|
2451
2293
|
</div>
|
|
@@ -5627,8 +5469,8 @@ class CideLytSidedrawerWrapperComponent {
|
|
|
5627
5469
|
}
|
|
5628
5470
|
ngOnInit() {
|
|
5629
5471
|
// Initialize the component map (You'd likely populate this from a config or service)
|
|
5630
|
-
this.componentMap['drowar_notes'] = () => import('./cloud-ide-layout-sidedrawer-notes.component-
|
|
5631
|
-
this.componentMap['drawer_theme'] = () => import('./cloud-ide-layout-drawer-theme.component-
|
|
5472
|
+
this.componentMap['drowar_notes'] = () => import('./cloud-ide-layout-sidedrawer-notes.component-uQ2UOmsw.mjs').then(m => m.CideLytSidedrawerNotesComponent);
|
|
5473
|
+
this.componentMap['drawer_theme'] = () => import('./cloud-ide-layout-drawer-theme.component-D_F14KO8.mjs').then(m => m.CideLytDrawerThemeComponent);
|
|
5632
5474
|
}
|
|
5633
5475
|
async loadComponent(configFor) {
|
|
5634
5476
|
console.log('🔍 SIDEDRAWER - Loading component:', configFor, 'Current tab:', this.currentTabId);
|
|
@@ -6291,13 +6133,13 @@ class SettingsContainerComponent {
|
|
|
6291
6133
|
}
|
|
6292
6134
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: SettingsContainerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
6293
6135
|
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: SettingsContainerComponent, isStandalone: true, selector: "cide-lyt-settings-container", ngImport: i0, template: `
|
|
6294
|
-
<div class="tw-flex tw-h-full tw-bg-
|
|
6136
|
+
<div class="tw-flex tw-h-full tw-bg-[var(--cide-ele-bg-primary)] tw-text-[var(--cide-ele-text-primary)]">
|
|
6295
6137
|
<!-- Left Sidebar Navigation -->
|
|
6296
|
-
<div class="tw-w-64 tw-border-r tw-border-
|
|
6138
|
+
<div class="tw-w-64 tw-border-r tw-border-[var(--cide-ele-border-primary)] tw-bg-[var(--cide-ele-bg-secondary)] tw-flex tw-flex-col">
|
|
6297
6139
|
<!-- Header -->
|
|
6298
|
-
<div class="tw-px-4 tw-py-4 tw-border-b tw-border-
|
|
6299
|
-
<h2 class="tw-m-0 tw-text-base tw-font-semibold tw-text-
|
|
6300
|
-
<p class="tw-m-0 tw-mt-1 tw-text-xs tw-text-
|
|
6140
|
+
<div class="tw-px-4 tw-py-4 tw-border-b tw-border-[var(--cide-ele-border-primary)]">
|
|
6141
|
+
<h2 class="tw-m-0 tw-text-base tw-font-semibold tw-text-[var(--cide-ele-text-primary)]">Settings</h2>
|
|
6142
|
+
<p class="tw-m-0 tw-mt-1 tw-text-xs tw-text-[var(--cide-ele-text-secondary)]">Manage your preferences</p>
|
|
6301
6143
|
</div>
|
|
6302
6144
|
|
|
6303
6145
|
<!-- Navigation List -->
|
|
@@ -6308,10 +6150,10 @@ class SettingsContainerComponent {
|
|
|
6308
6150
|
cideEleButton
|
|
6309
6151
|
[ngClass]="{
|
|
6310
6152
|
'tw-bg-blue-50 dark:tw-bg-blue-900/20 tw-text-blue-600 dark:tw-text-blue-400': selectedSection() === section.id,
|
|
6311
|
-
'tw-text-
|
|
6153
|
+
'tw-text-[var(--cide-ele-text-secondary)]': selectedSection() !== section.id
|
|
6312
6154
|
}"
|
|
6313
6155
|
(click)="selectSection(section.id)"
|
|
6314
|
-
class="tw-w-full tw-flex tw-items-center tw-gap-3 tw-px-3 tw-py-2.5 tw-mb-1 tw-rounded-lg tw-transition-colors tw-text-left hover:tw-bg-
|
|
6156
|
+
class="tw-w-full tw-flex tw-items-center tw-gap-3 tw-px-3 tw-py-2.5 tw-mb-1 tw-rounded-lg tw-transition-colors tw-text-left hover:tw-bg-[var(--cide-ele-bg-hover)] tw-justify-start">
|
|
6315
6157
|
<cide-ele-icon class="tw-text-lg">{{ section.icon }}</cide-ele-icon>
|
|
6316
6158
|
<div class="tw-flex-1 tw-min-w-0">
|
|
6317
6159
|
<div class="tw-flex tw-items-center tw-gap-2">
|
|
@@ -6321,7 +6163,7 @@ class SettingsContainerComponent {
|
|
|
6321
6163
|
}
|
|
6322
6164
|
</div>
|
|
6323
6165
|
@if (section.description) {
|
|
6324
|
-
<p class="tw-m-0 tw-mt-0.5 tw-text-xs tw-text-
|
|
6166
|
+
<p class="tw-m-0 tw-mt-0.5 tw-text-xs tw-text-[var(--cide-ele-text-tertiary)] tw-truncate">{{ section.description }}</p>
|
|
6325
6167
|
}
|
|
6326
6168
|
</div>
|
|
6327
6169
|
</button>
|
|
@@ -6332,15 +6174,15 @@ class SettingsContainerComponent {
|
|
|
6332
6174
|
<!-- Main Content Area -->
|
|
6333
6175
|
<div class="tw-flex-1 tw-flex tw-flex-col tw-overflow-hidden">
|
|
6334
6176
|
<!-- Content Header -->
|
|
6335
|
-
<div class="tw-px-6 tw-py-4 tw-border-b tw-border-
|
|
6177
|
+
<div class="tw-px-6 tw-py-4 tw-border-b tw-border-[var(--cide-ele-border-primary)] tw-bg-[var(--cide-ele-bg-primary)]">
|
|
6336
6178
|
@if (currentSection()) {
|
|
6337
6179
|
<div class="tw-flex tw-items-center tw-justify-between">
|
|
6338
6180
|
<div>
|
|
6339
|
-
<h3 class="tw-m-0 tw-text-lg tw-font-semibold tw-text-
|
|
6181
|
+
<h3 class="tw-m-0 tw-text-lg tw-font-semibold tw-text-[var(--cide-ele-text-primary)]">
|
|
6340
6182
|
{{ currentSection()?.title }}
|
|
6341
6183
|
</h3>
|
|
6342
6184
|
@if (currentSection()?.description) {
|
|
6343
|
-
<p class="tw-m-0 tw-mt-1 tw-text-sm tw-text-
|
|
6185
|
+
<p class="tw-m-0 tw-mt-1 tw-text-sm tw-text-[var(--cide-ele-text-secondary)]">
|
|
6344
6186
|
{{ currentSection()?.description }}
|
|
6345
6187
|
</p>
|
|
6346
6188
|
}
|
|
@@ -6350,7 +6192,7 @@ class SettingsContainerComponent {
|
|
|
6350
6192
|
</div>
|
|
6351
6193
|
|
|
6352
6194
|
<!-- Content Body -->
|
|
6353
|
-
<div class="tw-flex-1 tw-overflow-y-auto tw-bg-
|
|
6195
|
+
<div class="tw-flex-1 tw-overflow-y-auto tw-bg-[var(--cide-ele-bg-primary)]">
|
|
6354
6196
|
@switch (selectedSection()) {
|
|
6355
6197
|
@case ('notifications') {
|
|
6356
6198
|
<cide-lyt-notification-settings></cide-lyt-notification-settings>
|
|
@@ -6385,13 +6227,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
|
|
|
6385
6227
|
NotificationSettingsComponent,
|
|
6386
6228
|
ShortcutsPanelComponent
|
|
6387
6229
|
], template: `
|
|
6388
|
-
<div class="tw-flex tw-h-full tw-bg-
|
|
6230
|
+
<div class="tw-flex tw-h-full tw-bg-[var(--cide-ele-bg-primary)] tw-text-[var(--cide-ele-text-primary)]">
|
|
6389
6231
|
<!-- Left Sidebar Navigation -->
|
|
6390
|
-
<div class="tw-w-64 tw-border-r tw-border-
|
|
6232
|
+
<div class="tw-w-64 tw-border-r tw-border-[var(--cide-ele-border-primary)] tw-bg-[var(--cide-ele-bg-secondary)] tw-flex tw-flex-col">
|
|
6391
6233
|
<!-- Header -->
|
|
6392
|
-
<div class="tw-px-4 tw-py-4 tw-border-b tw-border-
|
|
6393
|
-
<h2 class="tw-m-0 tw-text-base tw-font-semibold tw-text-
|
|
6394
|
-
<p class="tw-m-0 tw-mt-1 tw-text-xs tw-text-
|
|
6234
|
+
<div class="tw-px-4 tw-py-4 tw-border-b tw-border-[var(--cide-ele-border-primary)]">
|
|
6235
|
+
<h2 class="tw-m-0 tw-text-base tw-font-semibold tw-text-[var(--cide-ele-text-primary)]">Settings</h2>
|
|
6236
|
+
<p class="tw-m-0 tw-mt-1 tw-text-xs tw-text-[var(--cide-ele-text-secondary)]">Manage your preferences</p>
|
|
6395
6237
|
</div>
|
|
6396
6238
|
|
|
6397
6239
|
<!-- Navigation List -->
|
|
@@ -6402,10 +6244,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
|
|
|
6402
6244
|
cideEleButton
|
|
6403
6245
|
[ngClass]="{
|
|
6404
6246
|
'tw-bg-blue-50 dark:tw-bg-blue-900/20 tw-text-blue-600 dark:tw-text-blue-400': selectedSection() === section.id,
|
|
6405
|
-
'tw-text-
|
|
6247
|
+
'tw-text-[var(--cide-ele-text-secondary)]': selectedSection() !== section.id
|
|
6406
6248
|
}"
|
|
6407
6249
|
(click)="selectSection(section.id)"
|
|
6408
|
-
class="tw-w-full tw-flex tw-items-center tw-gap-3 tw-px-3 tw-py-2.5 tw-mb-1 tw-rounded-lg tw-transition-colors tw-text-left hover:tw-bg-
|
|
6250
|
+
class="tw-w-full tw-flex tw-items-center tw-gap-3 tw-px-3 tw-py-2.5 tw-mb-1 tw-rounded-lg tw-transition-colors tw-text-left hover:tw-bg-[var(--cide-ele-bg-hover)] tw-justify-start">
|
|
6409
6251
|
<cide-ele-icon class="tw-text-lg">{{ section.icon }}</cide-ele-icon>
|
|
6410
6252
|
<div class="tw-flex-1 tw-min-w-0">
|
|
6411
6253
|
<div class="tw-flex tw-items-center tw-gap-2">
|
|
@@ -6415,7 +6257,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
|
|
|
6415
6257
|
}
|
|
6416
6258
|
</div>
|
|
6417
6259
|
@if (section.description) {
|
|
6418
|
-
<p class="tw-m-0 tw-mt-0.5 tw-text-xs tw-text-
|
|
6260
|
+
<p class="tw-m-0 tw-mt-0.5 tw-text-xs tw-text-[var(--cide-ele-text-tertiary)] tw-truncate">{{ section.description }}</p>
|
|
6419
6261
|
}
|
|
6420
6262
|
</div>
|
|
6421
6263
|
</button>
|
|
@@ -6426,15 +6268,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
|
|
|
6426
6268
|
<!-- Main Content Area -->
|
|
6427
6269
|
<div class="tw-flex-1 tw-flex tw-flex-col tw-overflow-hidden">
|
|
6428
6270
|
<!-- Content Header -->
|
|
6429
|
-
<div class="tw-px-6 tw-py-4 tw-border-b tw-border-
|
|
6271
|
+
<div class="tw-px-6 tw-py-4 tw-border-b tw-border-[var(--cide-ele-border-primary)] tw-bg-[var(--cide-ele-bg-primary)]">
|
|
6430
6272
|
@if (currentSection()) {
|
|
6431
6273
|
<div class="tw-flex tw-items-center tw-justify-between">
|
|
6432
6274
|
<div>
|
|
6433
|
-
<h3 class="tw-m-0 tw-text-lg tw-font-semibold tw-text-
|
|
6275
|
+
<h3 class="tw-m-0 tw-text-lg tw-font-semibold tw-text-[var(--cide-ele-text-primary)]">
|
|
6434
6276
|
{{ currentSection()?.title }}
|
|
6435
6277
|
</h3>
|
|
6436
6278
|
@if (currentSection()?.description) {
|
|
6437
|
-
<p class="tw-m-0 tw-mt-1 tw-text-sm tw-text-
|
|
6279
|
+
<p class="tw-m-0 tw-mt-1 tw-text-sm tw-text-[var(--cide-ele-text-secondary)]">
|
|
6438
6280
|
{{ currentSection()?.description }}
|
|
6439
6281
|
</p>
|
|
6440
6282
|
}
|
|
@@ -6444,7 +6286,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
|
|
|
6444
6286
|
</div>
|
|
6445
6287
|
|
|
6446
6288
|
<!-- Content Body -->
|
|
6447
|
-
<div class="tw-flex-1 tw-overflow-y-auto tw-bg-
|
|
6289
|
+
<div class="tw-flex-1 tw-overflow-y-auto tw-bg-[var(--cide-ele-bg-primary)]">
|
|
6448
6290
|
@switch (selectedSection()) {
|
|
6449
6291
|
@case ('notifications') {
|
|
6450
6292
|
<cide-lyt-notification-settings></cide-lyt-notification-settings>
|
|
@@ -7327,7 +7169,7 @@ const layoutControlPannelChildRoutes = [{
|
|
|
7327
7169
|
},
|
|
7328
7170
|
{
|
|
7329
7171
|
path: "home",
|
|
7330
|
-
loadComponent: () => import('./cloud-ide-layout-home-wrapper.component-
|
|
7172
|
+
loadComponent: () => import('./cloud-ide-layout-home-wrapper.component-CsfkluH7.mjs').then(c => c.CideLytHomeWrapperComponent),
|
|
7331
7173
|
canActivate: [authGuard],
|
|
7332
7174
|
data: {
|
|
7333
7175
|
sypg_page_code: "cide_lyt_home" // Used by RequestService to fetch tab properties
|
|
@@ -7335,7 +7177,7 @@ const layoutControlPannelChildRoutes = [{
|
|
|
7335
7177
|
},
|
|
7336
7178
|
{
|
|
7337
7179
|
path: "dashboard-manager",
|
|
7338
|
-
loadComponent: () => import('./cloud-ide-layout-dashboard-manager.component-
|
|
7180
|
+
loadComponent: () => import('./cloud-ide-layout-dashboard-manager.component-BJArKBjQ.mjs').then(c => c.DashboardManagerComponent),
|
|
7339
7181
|
canActivate: [authGuard],
|
|
7340
7182
|
data: {
|
|
7341
7183
|
sypg_page_code: "cide_lyt_dashboard_manager"
|
|
@@ -9159,4 +9001,4 @@ var floatingEntitySelection_component = /*#__PURE__*/Object.freeze({
|
|
|
9159
9001
|
*/
|
|
9160
9002
|
|
|
9161
9003
|
export { AppStateHelperService as A, CideLytSharedWrapperComponent as C, ENVIRONMENT_CONFIG as E, NotificationSettingsService as N, RightsService as R, CideLytSidebarService as a, CideLytSidedrawerService as b, CideLytThemeService as c, CloudIdeLayoutService as d, CloudIdeLayoutComponent as e, CideLytSharedService as f, ComponentContextService as g, layoutControlPannelChildRoutes as h, CustomRouteReuseStrategy as i, AppStateService as j, CideLytUserStatusService as k, layoutRoutes as l, CacheManagerService as m, CideLytFileManagerService as n, CideLytFloatingEntityRightsSharingComponent as o, processThemeVariable as p, CideLytFloatingEntityRightsSharingService as q, CideLytFloatingEntitySelectionComponent as r, setCSSVariable as s, themeFactory as t, CideLytFloatingEntitySelectionService as u };
|
|
9162
|
-
//# sourceMappingURL=cloud-ide-layout-cloud-ide-layout-
|
|
9004
|
+
//# sourceMappingURL=cloud-ide-layout-cloud-ide-layout-C4dYqSYm.mjs.map
|