@propbinder/mobile-design 0.0.24 → 0.0.26
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.
|
@@ -4296,7 +4296,7 @@ class DsMobileAppLayoutComponent {
|
|
|
4296
4296
|
<ng-content></ng-content>
|
|
4297
4297
|
</ion-content>
|
|
4298
4298
|
}
|
|
4299
|
-
`, isInline: true, styles: [":host{display:block;height:100vh;height:100svh}ion-tabs{
|
|
4299
|
+
`, isInline: true, styles: [":host{display:block;height:100vh;height:100svh}ion-tabs{background:transparent;position:sticky;height:-moz-fit-content;height:fit-content}ion-header{background:var(--color-brand-secondary);box-shadow:none;position:relative;z-index:10}ion-header:after{content:\"\";position:absolute;bottom:0;left:0;right:0;height:30px;background:linear-gradient(to bottom,var(--color-brand-secondary) 0%,transparent 100%);pointer-events:none;z-index:1}ion-header ion-toolbar{--background: var(--color-brand-secondary);--border-width: 0;--box-shadow: none;--padding-top: var(--ion-safe-area-top, 0px);--padding-bottom: 0;--padding-start: 0;--padding-end: 0}ion-header.header-translucent ion-toolbar{--backdrop-filter: none}ion-content{--background: transparent;--padding-top: 0;--padding-start: 0;--padding-end: 0;--padding-bottom: 0;isolation:auto;border-radius:24px;overflow:hidden}ion-content::part(scroll){-webkit-overflow-scrolling:touch;overscroll-behavior-y:none}ion-refresher{z-index:0}ion-refresher-content{--color: white}ion-tab-bar{--background: var(--color-background-neutral-primary);padding:8px 0}ion-tab-bar[slot=bottom]{border-top:1px solid var(--border-color-default);padding-bottom:calc(var(--ion-safe-area-bottom, 0px) + 8px);padding-top:8px}ion-tab-bar[slot=top]{--background: transparent;position:absolute;top:0;left:0;right:0;z-index:100;border-bottom:none;padding:12px 0;max-width:1400px;margin:0 auto;display:flex;justify-content:flex-start;gap:8px}@media (min-width: 769px){ion-tab-bar{padding-bottom:var(--ion-safe-area-bottom, 0px)}}@media (display-mode: standalone){ion-tab-bar{padding-bottom:var(--ion-safe-area-bottom, 0px)!important}}ion-tab-button{--color: var(--text-color-default-tertiary);--color-selected: var(--color-brand-base);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px}@media (min-width: 768px){ion-tab-button{flex-direction:row;height:36px;padding:0 12px;border-radius:40px;transition:background-color .2s ease;width:-moz-fit-content;width:fit-content;min-width:auto;flex:0 0 auto}ion-tab-button .button-native{width:auto;padding:0}ion-tab-button a,ion-tab-button span{width:auto}ion-tab-button ds-icon{margin-right:4px}ion-tab-button.tab-selected{background:var(--color-brand-base)}}ion-tab-button ion-label{font-size:var(--font-size-2xs)}@media (min-width: 768px){ion-tab-button ion-label{font-size:var(--font-size-base);font-weight:500;line-height:24px;letter-spacing:-.64px;color:#fff}}ion-tab-button ds-icon{color:var(--text-color-default-tertiary)}ion-tab-button.tab-selected ds-icon{color:var(--color-brand-base)}@media (min-width: 768px){ion-tab-button ds-icon{color:#fff;width:20px;height:20px}ion-tab-button.tab-selected ds-icon{color:#fff}}.header-home{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;padding-top:calc(12px + var(--ion-safe-area-top, 0px));background:var(--color-brand-secondary);position:relative;z-index:2}.logomark{height:28px;width:auto;flex-shrink:0}.header-home__actions{display:flex;align-items:center;gap:8px;cursor:pointer}.header-home__actions ds-avatar{cursor:pointer;transition:opacity var(--transition-duration-fast) var(--ease-smooth)}.header-home__actions ds-avatar:hover{opacity:.9}.header-home__actions ds-avatar:active{opacity:.8}.header-simple{padding:12px 16px;padding-top:calc(12px + var(--ion-safe-area-top, 0px));background:transparent}.header-simple .header-title{font-size:var(--font-size-xl);font-weight:600;color:#fff;margin:0}.header-back{display:flex;align-items:center;gap:12px;padding:12px 16px;padding-top:calc(12px + var(--ion-safe-area-top, 0px));background:transparent}.back-button{background:none;border:none;padding:0;display:flex;align-items:center;justify-content:center;cursor:pointer;color:#fff;transition:opacity var(--transition-duration-fast) var(--ease-smooth)}.back-button:hover{opacity:.8}.back-button:active{opacity:.6}.back-button ds-icon{color:#fff}.header-back .header-title{font-size:var(--font-size-xl);font-weight:600;color:#fff;margin:0;flex:1}.header-expandable{background:var(--color-brand-secondary);padding:24px 16px;color:#fff;position:sticky;top:0;z-index:10}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: IonTabs, selector: "ion-tabs" }, { kind: "component", type: IonTabBar, selector: "ion-tab-bar", inputs: ["color", "mode", "selectedTab", "translucent"] }, { kind: "component", type: IonTabButton, selector: "ion-tab-button", inputs: ["disabled", "download", "href", "layout", "mode", "rel", "selected", "tab", "target"] }, { kind: "component", type: IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { kind: "component", type: IonHeader, selector: "ion-header", inputs: ["collapse", "mode", "translucent"] }, { kind: "component", type: IonToolbar, selector: "ion-toolbar", inputs: ["color", "mode"] }, { kind: "component", type: IonContent, selector: "ion-content", inputs: ["color", "fixedSlotPlacement", "forceOverscroll", "fullscreen", "scrollEvents", "scrollX", "scrollY"] }, { kind: "component", type: IonRefresher, selector: "ion-refresher", inputs: ["closeDuration", "disabled", "mode", "pullFactor", "pullMax", "pullMin", "snapbackDuration"] }, { kind: "component", type: IonRefresherContent, selector: "ion-refresher-content", inputs: ["pullingIcon", "pullingText", "refreshingSpinner", "refreshingText"] }, { kind: "component", type: DsIconComponent, selector: "ds-icon", inputs: ["name", "size", "color", "interactive"] }, { kind: "component", type: DsAvatarComponent, selector: "ds-avatar", inputs: ["type", "size", "initials", "src", "alt", "iconName", "iconColor"] }] });
|
|
4300
4300
|
}
|
|
4301
4301
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: DsMobileAppLayoutComponent, decorators: [{
|
|
4302
4302
|
type: Component,
|
|
@@ -4395,7 +4395,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImpo
|
|
|
4395
4395
|
<ng-content></ng-content>
|
|
4396
4396
|
</ion-content>
|
|
4397
4397
|
}
|
|
4398
|
-
`, styles: [":host{display:block;height:100vh;height:100svh}ion-tabs{
|
|
4398
|
+
`, styles: [":host{display:block;height:100vh;height:100svh}ion-tabs{background:transparent;position:sticky;height:-moz-fit-content;height:fit-content}ion-header{background:var(--color-brand-secondary);box-shadow:none;position:relative;z-index:10}ion-header:after{content:\"\";position:absolute;bottom:0;left:0;right:0;height:30px;background:linear-gradient(to bottom,var(--color-brand-secondary) 0%,transparent 100%);pointer-events:none;z-index:1}ion-header ion-toolbar{--background: var(--color-brand-secondary);--border-width: 0;--box-shadow: none;--padding-top: var(--ion-safe-area-top, 0px);--padding-bottom: 0;--padding-start: 0;--padding-end: 0}ion-header.header-translucent ion-toolbar{--backdrop-filter: none}ion-content{--background: transparent;--padding-top: 0;--padding-start: 0;--padding-end: 0;--padding-bottom: 0;isolation:auto;border-radius:24px;overflow:hidden}ion-content::part(scroll){-webkit-overflow-scrolling:touch;overscroll-behavior-y:none}ion-refresher{z-index:0}ion-refresher-content{--color: white}ion-tab-bar{--background: var(--color-background-neutral-primary);padding:8px 0}ion-tab-bar[slot=bottom]{border-top:1px solid var(--border-color-default);padding-bottom:calc(var(--ion-safe-area-bottom, 0px) + 8px);padding-top:8px}ion-tab-bar[slot=top]{--background: transparent;position:absolute;top:0;left:0;right:0;z-index:100;border-bottom:none;padding:12px 0;max-width:1400px;margin:0 auto;display:flex;justify-content:flex-start;gap:8px}@media (min-width: 769px){ion-tab-bar{padding-bottom:var(--ion-safe-area-bottom, 0px)}}@media (display-mode: standalone){ion-tab-bar{padding-bottom:var(--ion-safe-area-bottom, 0px)!important}}ion-tab-button{--color: var(--text-color-default-tertiary);--color-selected: var(--color-brand-base);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px}@media (min-width: 768px){ion-tab-button{flex-direction:row;height:36px;padding:0 12px;border-radius:40px;transition:background-color .2s ease;width:-moz-fit-content;width:fit-content;min-width:auto;flex:0 0 auto}ion-tab-button .button-native{width:auto;padding:0}ion-tab-button a,ion-tab-button span{width:auto}ion-tab-button ds-icon{margin-right:4px}ion-tab-button.tab-selected{background:var(--color-brand-base)}}ion-tab-button ion-label{font-size:var(--font-size-2xs)}@media (min-width: 768px){ion-tab-button ion-label{font-size:var(--font-size-base);font-weight:500;line-height:24px;letter-spacing:-.64px;color:#fff}}ion-tab-button ds-icon{color:var(--text-color-default-tertiary)}ion-tab-button.tab-selected ds-icon{color:var(--color-brand-base)}@media (min-width: 768px){ion-tab-button ds-icon{color:#fff;width:20px;height:20px}ion-tab-button.tab-selected ds-icon{color:#fff}}.header-home{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;padding-top:calc(12px + var(--ion-safe-area-top, 0px));background:var(--color-brand-secondary);position:relative;z-index:2}.logomark{height:28px;width:auto;flex-shrink:0}.header-home__actions{display:flex;align-items:center;gap:8px;cursor:pointer}.header-home__actions ds-avatar{cursor:pointer;transition:opacity var(--transition-duration-fast) var(--ease-smooth)}.header-home__actions ds-avatar:hover{opacity:.9}.header-home__actions ds-avatar:active{opacity:.8}.header-simple{padding:12px 16px;padding-top:calc(12px + var(--ion-safe-area-top, 0px));background:transparent}.header-simple .header-title{font-size:var(--font-size-xl);font-weight:600;color:#fff;margin:0}.header-back{display:flex;align-items:center;gap:12px;padding:12px 16px;padding-top:calc(12px + var(--ion-safe-area-top, 0px));background:transparent}.back-button{background:none;border:none;padding:0;display:flex;align-items:center;justify-content:center;cursor:pointer;color:#fff;transition:opacity var(--transition-duration-fast) var(--ease-smooth)}.back-button:hover{opacity:.8}.back-button:active{opacity:.6}.back-button ds-icon{color:#fff}.header-back .header-title{font-size:var(--font-size-xl);font-weight:600;color:#fff;margin:0;flex:1}.header-expandable{background:var(--color-brand-secondary);padding:24px 16px;color:#fff;position:sticky;top:0;z-index:10}\n"] }]
|
|
4399
4399
|
}], ctorParameters: () => [{ type: i1$1.Router }, { type: i0.ElementRef }, { type: i2$1.BreakpointObserver }], propDecorators: { ionContent: [{
|
|
4400
4400
|
type: ViewChild,
|
|
4401
4401
|
args: [IonContent, { static: false }]
|
|
@@ -4558,7 +4558,7 @@ let DsMobileTabsComponent$1 = class DsMobileTabsComponent {
|
|
|
4558
4558
|
</div>
|
|
4559
4559
|
</ion-tab-bar>
|
|
4560
4560
|
</ion-tabs>
|
|
4561
|
-
`, isInline: true, styles: [":host{display:block;height:100vh;height:100dvh}ion-tab-button:before,ion-tab-button:after{content:none!important;display:none!important}ion-tab-button[title]:before,ion-tab-button[title]:after{display:none!important}ion-tab-button::part(native):before,ion-tab-button::part(native):after{display:none!important}ion-tabs{
|
|
4561
|
+
`, isInline: true, styles: [":host{display:block;height:100vh;height:100dvh}ion-tab-button:before,ion-tab-button:after{content:none!important;display:none!important}ion-tab-button[title]:before,ion-tab-button[title]:after{display:none!important}ion-tab-button::part(native):before,ion-tab-button::part(native):after{display:none!important}ion-tabs{background:transparent;position:sticky;height:-moz-fit-content;height:fit-content}.ds-tab-bar{--background: var(--color-background-neutral-primary);transition:transform .2s ease-in-out}ion-tab-bar[slot=bottom]{border-top:1px solid var(--border-color-default);padding-top:8px;padding-bottom:calc(var(--ion-safe-area-bottom, 34px) - 4px)}@media (max-width: 767px){ion-tab-bar[slot=bottom]{position:fixed;bottom:0;left:0;right:0;z-index:100}}@media (max-width: 767px){ion-tabs:has(ds-mobile-page-details) .ds-tab-bar{transform:translateY(100%);transition:transform .3s ease}}.ds-tab-bar__logo,.ds-tab-bar__actions{display:none}.ds-tab-bar__tabs{display:flex;width:100%;justify-content:space-around;align-items:center}@media (min-width: 769px){ion-tab-bar[slot=bottom]{padding-bottom:env(safe-area-inset-bottom,0px)}}@media (display-mode: standalone){ion-tab-bar[slot=bottom]{padding-bottom:env(safe-area-inset-bottom,0px)!important}}@media (min-width: 768px){ion-tab-bar[slot=top]{--background: var(--color-brand-secondary);position:relative;display:flex;align-items:center;padding:12px 24px;height:64px;max-width:none}.ds-tab-bar__logo{display:flex;position:absolute;left:24px;align-items:center}.ds-tab-bar__actions{display:flex;position:absolute;right:24px;align-items:center;gap:12px}.ds-tab-bar__tabs{display:flex;gap:8px;align-items:center;max-width:640px;width:100%;margin:0 auto;justify-content:center;padding-left:var(--content-padding-md);padding-right:var(--content-padding-md)}.logomark{height:28px;width:auto;flex-shrink:0}}@media (min-width: 992px){.ds-tab-bar__tabs{max-width:640px;padding-left:var(--content-padding-lg);padding-right:var(--content-padding-lg);justify-content:center}}@media (min-width: 1440px){.ds-tab-bar__tabs{max-width:640px;padding-left:var(--content-padding-xl);padding-right:var(--content-padding-xl)}}@media (min-width: 1768px){.ds-tab-bar__tabs{max-width:640px;padding-left:var(--content-padding-2xl);padding-right:var(--content-padding-2xl)}}@media (min-width: 1920px){.ds-tab-bar__tabs{max-width:640px;padding-left:var(--content-padding-3xl);padding-right:var(--content-padding-3xl)}}ion-tab-button{--color: var(--text-color-default-tertiary);--color-selected: var(--color-brand-base);display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;overflow:visible;pointer-events:auto}ion-tab-button[title]:before{content:attr(title);position:absolute;opacity:0;pointer-events:none}.tab-icon-ripple{position:absolute;left:50%;top:50%;width:40px;height:40px;border-radius:50%;background:var(--color-brand-base);transform:translate(-50%,-50%) scale(0);opacity:0;pointer-events:none;transition:all .6s cubic-bezier(.36,1.2,.04,1.4);z-index:0}.tab-selected .tab-icon-ripple{transform:translate(-50%,-50%) scale(2);opacity:.05;animation:ripple-fade .6s cubic-bezier(.36,.5,.04,1.8) forwards}@keyframes ripple-fade{0%{opacity:0;transform:translate(-50%,-50%) scale(0)}30%{opacity:.1}to{opacity:0;transform:translate(-50%,-50%) scale(2)}}ion-tab-button::part(native){overflow:visible}ion-tab-button ion-ripple-effect{color:var(--color-brand-base);border-radius:1000px}ion-tab-button ion-label{font-size:var(--font-size-xs);font-weight:400;letter-spacing:-.3px;margin-top:0}.tab-icon-wrapper{position:relative;width:24px;height:24px;display:flex;align-items:center;justify-content:center;z-index:1;margin-bottom:4px}.tab-icon-inactive,.tab-icon-active{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);transition:all .8s cubic-bezier(.36,1,.04,1)}.tab-icon-inactive{opacity:1;transform:translate(-50%,-50%) scale(1)}.tab-icon-active{opacity:0;transform:translate(-50%,calc(-50% - 12px)) scale(.5)}.tab-selected .tab-icon-inactive{opacity:0;transform:translate(-50%,-50%) scale(.5)}.tab-selected .tab-icon-active{opacity:1;transform:translate(-50%,-50%) scale(1)}@media (min-width: 768px){.ds-tab-button{flex-direction:row;height:40px;padding:0 16px!important;border-radius:40px;transition:all .2s ease;width:-moz-fit-content;width:fit-content;min-width:auto;flex:0 0 auto;--color: rgba(255, 255, 255, .7);--color-selected: white;background:#ffffff1a;position:relative;overflow:hidden}.tab-icon-wrapper,.tab-icon-ripple{width:20px;height:20px}.ds-tab-button::part(native){border-radius:40px}.ds-tab-button:hover{--color: white;--color-selected: white}.ds-tab-button.tab-selected{background:var(--color-background-brand);--color-selected: white}.ds-tab-button .button-native{width:auto;padding:0}.ds-tab-button ion-label{font-size:var(--font-size-sm);font-weight:500;margin:0;color:inherit}.ds-tab-button .tab-icon-wrapper{margin-right:4px;margin-bottom:0}.ds-tab-button ion-ripple-effect{color:#ffffff4d;border-radius:1000px;transform:scale(1.5)}}@media (min-width: 768px){.ds-tab-bar__actions ds-avatar{cursor:pointer;transition:transform .2s ease}.ds-tab-bar__actions ds-avatar:hover{transform:scale(1.05)}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "component", type: IonTabs, selector: "ion-tabs" }, { kind: "component", type: IonTab, selector: "ion-tab", inputs: ["component", "tab"] }, { kind: "component", type: IonTabBar, selector: "ion-tab-bar", inputs: ["color", "mode", "selectedTab", "translucent"] }, { kind: "component", type: IonTabButton, selector: "ion-tab-button", inputs: ["disabled", "download", "href", "layout", "mode", "rel", "selected", "tab", "target"] }, { kind: "component", type: IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { kind: "component", type: DsIconComponent, selector: "ds-icon", inputs: ["name", "size", "color", "interactive"] }, { kind: "component", type: DsAvatarComponent, selector: "ds-avatar", inputs: ["type", "size", "initials", "src", "alt", "iconName", "iconColor"] }] });
|
|
4562
4562
|
};
|
|
4563
4563
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: DsMobileTabsComponent$1, decorators: [{
|
|
4564
4564
|
type: Component,
|
|
@@ -4635,7 +4635,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImpo
|
|
|
4635
4635
|
</div>
|
|
4636
4636
|
</ion-tab-bar>
|
|
4637
4637
|
</ion-tabs>
|
|
4638
|
-
`, styles: [":host{display:block;height:100vh;height:100dvh}ion-tab-button:before,ion-tab-button:after{content:none!important;display:none!important}ion-tab-button[title]:before,ion-tab-button[title]:after{display:none!important}ion-tab-button::part(native):before,ion-tab-button::part(native):after{display:none!important}ion-tabs{
|
|
4638
|
+
`, styles: [":host{display:block;height:100vh;height:100dvh}ion-tab-button:before,ion-tab-button:after{content:none!important;display:none!important}ion-tab-button[title]:before,ion-tab-button[title]:after{display:none!important}ion-tab-button::part(native):before,ion-tab-button::part(native):after{display:none!important}ion-tabs{background:transparent;position:sticky;height:-moz-fit-content;height:fit-content}.ds-tab-bar{--background: var(--color-background-neutral-primary);transition:transform .2s ease-in-out}ion-tab-bar[slot=bottom]{border-top:1px solid var(--border-color-default);padding-top:8px;padding-bottom:calc(var(--ion-safe-area-bottom, 34px) - 4px)}@media (max-width: 767px){ion-tab-bar[slot=bottom]{position:fixed;bottom:0;left:0;right:0;z-index:100}}@media (max-width: 767px){ion-tabs:has(ds-mobile-page-details) .ds-tab-bar{transform:translateY(100%);transition:transform .3s ease}}.ds-tab-bar__logo,.ds-tab-bar__actions{display:none}.ds-tab-bar__tabs{display:flex;width:100%;justify-content:space-around;align-items:center}@media (min-width: 769px){ion-tab-bar[slot=bottom]{padding-bottom:env(safe-area-inset-bottom,0px)}}@media (display-mode: standalone){ion-tab-bar[slot=bottom]{padding-bottom:env(safe-area-inset-bottom,0px)!important}}@media (min-width: 768px){ion-tab-bar[slot=top]{--background: var(--color-brand-secondary);position:relative;display:flex;align-items:center;padding:12px 24px;height:64px;max-width:none}.ds-tab-bar__logo{display:flex;position:absolute;left:24px;align-items:center}.ds-tab-bar__actions{display:flex;position:absolute;right:24px;align-items:center;gap:12px}.ds-tab-bar__tabs{display:flex;gap:8px;align-items:center;max-width:640px;width:100%;margin:0 auto;justify-content:center;padding-left:var(--content-padding-md);padding-right:var(--content-padding-md)}.logomark{height:28px;width:auto;flex-shrink:0}}@media (min-width: 992px){.ds-tab-bar__tabs{max-width:640px;padding-left:var(--content-padding-lg);padding-right:var(--content-padding-lg);justify-content:center}}@media (min-width: 1440px){.ds-tab-bar__tabs{max-width:640px;padding-left:var(--content-padding-xl);padding-right:var(--content-padding-xl)}}@media (min-width: 1768px){.ds-tab-bar__tabs{max-width:640px;padding-left:var(--content-padding-2xl);padding-right:var(--content-padding-2xl)}}@media (min-width: 1920px){.ds-tab-bar__tabs{max-width:640px;padding-left:var(--content-padding-3xl);padding-right:var(--content-padding-3xl)}}ion-tab-button{--color: var(--text-color-default-tertiary);--color-selected: var(--color-brand-base);display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;overflow:visible;pointer-events:auto}ion-tab-button[title]:before{content:attr(title);position:absolute;opacity:0;pointer-events:none}.tab-icon-ripple{position:absolute;left:50%;top:50%;width:40px;height:40px;border-radius:50%;background:var(--color-brand-base);transform:translate(-50%,-50%) scale(0);opacity:0;pointer-events:none;transition:all .6s cubic-bezier(.36,1.2,.04,1.4);z-index:0}.tab-selected .tab-icon-ripple{transform:translate(-50%,-50%) scale(2);opacity:.05;animation:ripple-fade .6s cubic-bezier(.36,.5,.04,1.8) forwards}@keyframes ripple-fade{0%{opacity:0;transform:translate(-50%,-50%) scale(0)}30%{opacity:.1}to{opacity:0;transform:translate(-50%,-50%) scale(2)}}ion-tab-button::part(native){overflow:visible}ion-tab-button ion-ripple-effect{color:var(--color-brand-base);border-radius:1000px}ion-tab-button ion-label{font-size:var(--font-size-xs);font-weight:400;letter-spacing:-.3px;margin-top:0}.tab-icon-wrapper{position:relative;width:24px;height:24px;display:flex;align-items:center;justify-content:center;z-index:1;margin-bottom:4px}.tab-icon-inactive,.tab-icon-active{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);transition:all .8s cubic-bezier(.36,1,.04,1)}.tab-icon-inactive{opacity:1;transform:translate(-50%,-50%) scale(1)}.tab-icon-active{opacity:0;transform:translate(-50%,calc(-50% - 12px)) scale(.5)}.tab-selected .tab-icon-inactive{opacity:0;transform:translate(-50%,-50%) scale(.5)}.tab-selected .tab-icon-active{opacity:1;transform:translate(-50%,-50%) scale(1)}@media (min-width: 768px){.ds-tab-button{flex-direction:row;height:40px;padding:0 16px!important;border-radius:40px;transition:all .2s ease;width:-moz-fit-content;width:fit-content;min-width:auto;flex:0 0 auto;--color: rgba(255, 255, 255, .7);--color-selected: white;background:#ffffff1a;position:relative;overflow:hidden}.tab-icon-wrapper,.tab-icon-ripple{width:20px;height:20px}.ds-tab-button::part(native){border-radius:40px}.ds-tab-button:hover{--color: white;--color-selected: white}.ds-tab-button.tab-selected{background:var(--color-background-brand);--color-selected: white}.ds-tab-button .button-native{width:auto;padding:0}.ds-tab-button ion-label{font-size:var(--font-size-sm);font-weight:500;margin:0;color:inherit}.ds-tab-button .tab-icon-wrapper{margin-right:4px;margin-bottom:0}.ds-tab-button ion-ripple-effect{color:#ffffff4d;border-radius:1000px;transform:scale(1.5)}}@media (min-width: 768px){.ds-tab-bar__actions ds-avatar{cursor:pointer;transition:transform .2s ease}.ds-tab-bar__actions ds-avatar:hover{transform:scale(1.05)}}\n"] }]
|
|
4639
4639
|
}], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { tabs: [{
|
|
4640
4640
|
type: Input
|
|
4641
4641
|
}], avatarType: [{
|
|
@@ -12600,5 +12600,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImpo
|
|
|
12600
12600
|
* Generated bundle index. Do not edit.
|
|
12601
12601
|
*/
|
|
12602
12602
|
|
|
12603
|
-
export { ActionCommentComponent$1 as ActionCommentComponent, ActionLikeComponent$1 as ActionLikeComponent, ContentRowComponent, DsMobileActionsBottomSheetComponent, DsMobileAppLayoutComponent, DsMobileBottomSheetService, DsMobileActionsBottomSheetComponent as DsMobileCommentActionsBottomSheetComponent, DsMobileCommentComponent, DsMobileContactListItemComponent, DsMobileContentComponent, DsMobileContentSectionComponent, DsMobileHandbookFolderComponent, DsMobileHandbookFolderMiniComponent, DsMobileHeaderContentComponent, DsMobileHeaderContentTileComponent, DsMobileInlinePhotoComponent, DsMobileInteractiveListItemInquiryComponent, DsMobileInteractiveListItemMessageComponent, DsMobileInteractiveListItemPostComponent, DsMobileLightboxImageComponent as DsMobileLightboxComponent, DsMobileLightboxFooterComponent, DsMobileLightboxHeaderComponent, DsMobileLightboxImageComponent, DsMobileLightboxPdfComponent, DsMobileLightboxService, DsMobileListItemComponent, DsMobileLongPressDirective, DsMobileModalService, DsMobilePageDetailsComponent, DsMobilePageMainComponent, DsMobileActionsBottomSheetComponent as DsMobilePostActionsBottomSheetComponent, DsMobilePostCardComponent, DsMobilePostComposerComponent, DsMobilePostCreateBottomSheetComponent, DsMobilePostDetailModalComponent, DsMobilePostDetailModalService, DsMobileTabsComponent$1 as DsMobileTabsComponent, MobileCommunityPageComponent, MobileHandbookPageComponent, MobileHomePageComponent, MobileInquiriesPageComponent, MobileInquiryDetailPageComponent, MobilePageBase, MobilePostDetailPageComponent, MobileTabsExampleComponent, PostActionsComponent$1 as PostActionsComponent, PostAttachmentsComponent$1 as PostAttachmentsComponent, PostContentComponent$1 as PostContentComponent, PostCreatePageComponent, PostMediaComponent$1 as PostMediaComponent, PostPdfAttachmentComponent, PostTextComponent$1 as PostTextComponent, SectionHeaderComponent, TileContentComponent, TileIconComponent, TileLabelComponent, TileValueComponent, UserService, WhitelabelDemoPage, customBackTransition, customPageTransition };
|
|
12603
|
+
export { ActionCommentComponent$1 as ActionCommentComponent, ActionLikeComponent$1 as ActionLikeComponent, ContentRowComponent, DsMobileActionsBottomSheetComponent, DsMobileAppLayoutComponent, DsMobileBottomSheetService, DsMobileActionsBottomSheetComponent as DsMobileCommentActionsBottomSheetComponent, DsMobileCommentComponent, DsMobileContactListItemComponent, DsMobileContentComponent, DsMobileContentSectionComponent, DsMobileHandbookDetailModalComponent, DsMobileHandbookDetailModalService, DsMobileHandbookFolderComponent, DsMobileHandbookFolderMiniComponent, DsMobileHeaderContentComponent, DsMobileHeaderContentTileComponent, DsMobileInlinePhotoComponent, DsMobileInteractiveListItemInquiryComponent, DsMobileInteractiveListItemMessageComponent, DsMobileInteractiveListItemPostComponent, DsMobileLightboxImageComponent as DsMobileLightboxComponent, DsMobileLightboxFooterComponent, DsMobileLightboxHeaderComponent, DsMobileLightboxImageComponent, DsMobileLightboxPdfComponent, DsMobileLightboxService, DsMobileListItemComponent, DsMobileLongPressDirective, DsMobileModalService, DsMobilePageDetailsComponent, DsMobilePageMainComponent, DsMobileActionsBottomSheetComponent as DsMobilePostActionsBottomSheetComponent, DsMobilePostCardComponent, DsMobilePostComposerComponent, DsMobilePostCreateBottomSheetComponent, DsMobilePostDetailModalComponent, DsMobilePostDetailModalService, DsMobileTabsComponent$1 as DsMobileTabsComponent, MobileCommunityPageComponent, MobileHandbookPageComponent, MobileHomePageComponent, MobileInquiriesPageComponent, MobileInquiryDetailPageComponent, MobilePageBase, MobilePostDetailPageComponent, MobileTabsExampleComponent, PostActionsComponent$1 as PostActionsComponent, PostAttachmentsComponent$1 as PostAttachmentsComponent, PostContentComponent$1 as PostContentComponent, PostCreatePageComponent, PostMediaComponent$1 as PostMediaComponent, PostPdfAttachmentComponent, PostTextComponent$1 as PostTextComponent, SectionHeaderComponent, TileContentComponent, TileIconComponent, TileLabelComponent, TileValueComponent, UserService, WhitelabelDemoPage, customBackTransition, customPageTransition };
|
|
12604
12604
|
//# sourceMappingURL=propbinder-mobile-design.mjs.map
|