@masterteam/brand-display 0.0.7 → 0.0.9
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/assets/brand-display.css
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */
|
|
2
|
-
@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-space-y-reverse:0;--tw-border-style:solid;--tw-font-weight:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000}}}@layer theme{:root,:host{--font-sans:ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--font-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--color-gray-300:oklch(87.2% .01 258.338);--color-gray-400:oklch(70.7% .022 261.325);--color-gray-500:oklch(55.1% .027 264.364);--color-gray-600:oklch(44.6% .03 256.802);--color-white:#fff;--spacing:.25rem;--text-xs:.75rem;--text-xs--line-height:calc(1 / .75);--text-sm:.875rem;--text-sm--line-height:calc(1.25 / .875);--text-base:1rem;--text-base--line-height:calc(1.5 / 1);--text-lg:1.125rem;--text-lg--line-height:calc(1.75 / 1.125);--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--radius-lg:.5rem;--radius-xl:.75rem;--radius-2xl:1rem;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4, 0, .2, 1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono)}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab, currentcolor 50%, transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.absolute{position:absolute}.relative{position:relative}.static{position:static}.inset-0{inset:calc(var(--spacing) * 0)}.start{inset-inline-start:var(--spacing)}.end{inset-inline-end:var(--spacing)}.z-10{z-index:10}.order-1{order:1}.order-2{order:2}.col-span-1{grid-column:span 1/span 1}.mx-1{margin-inline:calc(var(--spacing) * 1)}.mx-auto{margin-inline:auto}.mt-2{margin-top:calc(var(--spacing) * 2)}.mt-3{margin-top:calc(var(--spacing) * 3)}.mt-4{margin-top:calc(var(--spacing) * 4)}.mt-5{margin-top:calc(var(--spacing) * 5)}.mt-6{margin-top:calc(var(--spacing) * 6)}.mt-7{margin-top:calc(var(--spacing) * 7)}.mt-8{margin-top:calc(var(--spacing) * 8)}.mt-12{margin-top:calc(var(--spacing) * 12)}.mb-1{margin-bottom:calc(var(--spacing) * 1)}.mb-2{margin-bottom:calc(var(--spacing) * 2)}.mb-3{margin-bottom:calc(var(--spacing) * 3)}.mb-4{margin-bottom:calc(var(--spacing) * 4)}.block{display:block}.flex{display:flex}.grid{display:grid}.hidden{display:none}.aspect-\[4\/5\]{aspect-ratio:4/5}.size-10{width:calc(var(--spacing) * 10);height:calc(var(--spacing) * 10)}.h-10{height:calc(var(--spacing) * 10)}.h-\[16rem\]{height:16rem}.h-full{height:100%}.min-h-0{min-height:calc(var(--spacing) * 0)}.min-h-\[var\(--header-height\)\]{min-height:var(--header-height)}.w-10{width:calc(var(--spacing) * 10)}.w-14{width:calc(var(--spacing) * 14)}.w-full{width:100%}.w-px{width:1px}.max-w-\[15rem\]{max-width:15rem}.max-w-\[30rem\]{max-width:30rem}.min-w-0{min-width:calc(var(--spacing) * 0)}.min-w-max{min-width:max-content}.flex-1{flex:1}.flex-shrink-0,.shrink-0{flex-shrink:0}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.justify-start{justify-content:flex-start}.gap-1{gap:calc(var(--spacing) * 1)}.gap-2{gap:calc(var(--spacing) * 2)}.gap-3{gap:calc(var(--spacing) * 3)}.gap-4{gap:calc(var(--spacing) * 4)}.gap-5{gap:calc(var(--spacing) * 5)}.gap-6{gap:calc(var(--spacing) * 6)}:where(.space-y-3>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 3) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse)))}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.overflow-hidden{overflow:hidden}.overflow-x-auto{overflow-x:auto}.overflow-x-hidden{overflow-x:hidden}.overflow-y-auto{overflow-y:auto}.overscroll-y-auto{overscroll-behavior-y:auto}.rounded{border-radius:.25rem}.rounded-lg{border-radius:var(--radius-lg)}.rounded-xl{border-radius:var(--radius-xl)}.rounded-s-2xl{border-start-start-radius:var(--radius-2xl);border-end-start-radius:var(--radius-2xl)}.rounded-t-2xl{border-top-left-radius:var(--radius-2xl);border-top-right-radius:var(--radius-2xl)}.border{border-style:var(--tw-border-style);border-width:1px}.border-e-1{border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px}.border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.border-dashed{--tw-border-style:dashed;border-style:dashed}.border-gray-300{border-color:var(--color-gray-300)}.border-surface{border-color:var(--p-content-border-color)}.border-surface-300{border-color:var(--p-surface-300)}@supports (color:color-mix(in lab, red, red)){.border-surface-300{border-color:color-mix(in srgb, var(--p-surface-300) calc(100% * 1), transparent)}}.bg-primary{background-color:var(--p-primary-color)}@supports (color:color-mix(in lab, red, red)){.bg-primary{background-color:color-mix(in srgb, var(--p-primary-color) calc(100% * 1), transparent)}}.bg-white{background-color:var(--color-white)}.bg-cover{background-size:cover}.bg-center{background-position:50%}.p-2{padding:calc(var(--spacing) * 2)}.p-3{padding:calc(var(--spacing) * 3)}.p-4{padding:calc(var(--spacing) * 4)}.px-1\.5{padding-inline:calc(var(--spacing) * 1.5)}.px-3{padding-inline:calc(var(--spacing) * 3)}.px-4{padding-inline:calc(var(--spacing) * 4)}.py-2{padding-block:calc(var(--spacing) * 2)}.py-3{padding-block:calc(var(--spacing) * 3)}.py-4{padding-block:calc(var(--spacing) * 4)}.pb-1{padding-bottom:calc(var(--spacing) * 1)}.pb-3{padding-bottom:calc(var(--spacing) * 3)}.text-center{text-align:center}.text-base{font-size:var(--text-base);line-height:var(--tw-leading,var(--text-base--line-height))}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.text-\[8px\]{font-size:8px}.text-\[9px\]{font-size:9px}.text-\[10px\]{font-size:10px}.text-\[11px\]{font-size:11px}.text-\[14px\]{font-size:14px}.font-bold{--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold)}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.text-color{color:var(--p-text-color)}.text-gray-400{color:var(--color-gray-400)}.text-gray-500{color:var(--color-gray-500)}.text-gray-600{color:var(--color-gray-600)}.text-primary{color:var(--p-primary-color)}@supports (color:color-mix(in lab, red, red)){.text-primary{color:color-mix(in srgb, var(--p-primary-color) calc(100% * 1), transparent)}}.text-white{color:var(--color-white)}.shadow-xl{--tw-shadow:0 20px 25px -5px var(--tw-shadow-color,#0000001a), 0 8px 10px -6px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}@media (hover:hover){.hover\:bg-surface-100:hover{background-color:var(--p-surface-100)}@supports (color:color-mix(in lab, red, red)){.hover\:bg-surface-100:hover{background-color:color-mix(in srgb, var(--p-surface-100) calc(100% * 1), transparent)}}}@media not all and (min-width:640px){.max-\[640px\]\:order-1{order:1}.max-\[640px\]\:order-2{order:2}.max-\[640px\]\:w-full{width:100%}.max-\[640px\]\:flex-none{flex:none}.max-\[640px\]\:flex-col{flex-direction:column}.max-\[640px\]\:justify-center{justify-content:center}.max-\[640px\]\:gap-4{gap:calc(var(--spacing) * 4)}}@media (min-width:40rem){.sm\:aspect-\[16\/10\]{aspect-ratio:16/10}.sm\:size-\[47px\]{width:47px;height:47px}.sm\:h-3\/4{height:75%}.sm\:h-12{height:calc(var(--spacing) * 12)}.sm\:h-\[18rem\]{height:18rem}.sm\:w-12{width:calc(var(--spacing) * 12)}.sm\:w-16{width:calc(var(--spacing) * 16)}.sm\:w-60{width:calc(var(--spacing) * 60)}.sm\:gap-4{gap:calc(var(--spacing) * 4)}.sm\:p-4{padding:calc(var(--spacing) * 4)}.sm\:p-8{padding:calc(var(--spacing) * 8)}.sm\:px-2{padding-inline:calc(var(--spacing) * 2)}.sm\:px-4{padding-inline:calc(var(--spacing) * 4)}.sm\:px-6{padding-inline:calc(var(--spacing) * 6)}.sm\:py-6{padding-block:calc(var(--spacing) * 6)}.sm\:pb-4{padding-bottom:calc(var(--spacing) * 4)}.sm\:text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.sm\:text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.sm\:text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}}@media (min-width:48rem){.md\:w-auto{width:auto}.md\:flex-row{flex-direction:row}.md\:items-end{align-items:flex-end}.md\:justify-between{justify-content:space-between}}@media (min-width:80rem){.xl\:sticky{position:sticky}.xl\:top-4{top:calc(var(--spacing) * 4)}.xl\:grid-cols-\[minmax\(0\,3fr\)_minmax\(20rem\,2fr\)\]{grid-template-columns:minmax(0,3fr) minmax(20rem,2fr)}.xl\:gap-10{gap:calc(var(--spacing) * 10)}.xl\:self-start{align-self:flex-start}}}@keyframes enter{0%{opacity:var(--p-enter-opacity,1);transform:translate3d(var(--p-enter-translate-x,0), var(--p-enter-translate-y,0), 0) scale3d(var(--p-enter-scale,1), var(--p-enter-scale,1), var(--p-enter-scale,1)) rotate(var(--p-enter-rotate,0))}}@keyframes leave{to{opacity:var(--p-leave-opacity,1);transform:translate3d(var(--p-leave-translate-x,0), var(--p-leave-translate-y,0), 0) scale3d(var(--p-leave-scale,1), var(--p-leave-scale,1), var(--p-leave-scale,1)) rotate(var(--p-leave-rotate,0))}}@property --tw-space-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}
|
|
2
|
+
@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-space-y-reverse:0;--tw-border-style:solid;--tw-font-weight:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000}}}@layer theme{:root,:host{--font-sans:ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--font-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--color-gray-600:oklch(44.6% .03 256.802);--color-black:#000;--color-white:#fff;--spacing:.25rem;--text-xs:.75rem;--text-xs--line-height:calc(1 / .75);--text-sm:.875rem;--text-sm--line-height:calc(1.25 / .875);--text-base:1rem;--text-base--line-height:calc(1.5 / 1);--text-lg:1.125rem;--text-lg--line-height:calc(1.75 / 1.125);--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--radius-xs:.125rem;--radius-md:.375rem;--radius-lg:.5rem;--radius-xl:.75rem;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4, 0, .2, 1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono)}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab, currentcolor 50%, transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.absolute{position:absolute}.relative{position:relative}.static{position:static}.inset-0{inset:calc(var(--spacing) * 0)}.start{inset-inline-start:var(--spacing)}.end{inset-inline-end:var(--spacing)}.z-10{z-index:10}.order-1{order:1}.order-2{order:2}.col-span-1{grid-column:span 1/span 1}.mx-1{margin-inline:calc(var(--spacing) * 1)}.mx-auto{margin-inline:auto}.mt-2{margin-top:calc(var(--spacing) * 2)}.mt-3{margin-top:calc(var(--spacing) * 3)}.mt-4{margin-top:calc(var(--spacing) * 4)}.mt-5{margin-top:calc(var(--spacing) * 5)}.mt-6{margin-top:calc(var(--spacing) * 6)}.mt-7{margin-top:calc(var(--spacing) * 7)}.mt-8{margin-top:calc(var(--spacing) * 8)}.mt-12{margin-top:calc(var(--spacing) * 12)}.mb-1{margin-bottom:calc(var(--spacing) * 1)}.mb-2{margin-bottom:calc(var(--spacing) * 2)}.mb-3{margin-bottom:calc(var(--spacing) * 3)}.mb-4{margin-bottom:calc(var(--spacing) * 4)}.block{display:block}.flex{display:flex}.grid{display:grid}.hidden{display:none}.aspect-\[4\/5\]{aspect-ratio:4/5}.size-10{width:calc(var(--spacing) * 10);height:calc(var(--spacing) * 10)}.h-8{height:calc(var(--spacing) * 8)}.h-10{height:calc(var(--spacing) * 10)}.h-\[16rem\]{height:16rem}.h-full{height:100%}.min-h-0{min-height:calc(var(--spacing) * 0)}.min-h-14{min-height:calc(var(--spacing) * 14)}.w-14{width:calc(var(--spacing) * 14)}.w-49{width:calc(var(--spacing) * 49)}.w-full{width:100%}.w-px{width:1px}.max-w-\[15rem\]{max-width:15rem}.max-w-\[30rem\]{max-width:30rem}.min-w-0{min-width:calc(var(--spacing) * 0)}.min-w-max{min-width:max-content}.flex-1{flex:1}.flex-shrink-0,.shrink-0{flex-shrink:0}.cursor-pointer{cursor:pointer}.flex-col{flex-direction:column}.items-center{align-items:center}.items-start{align-items:flex-start}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.justify-start{justify-content:flex-start}.gap-2{gap:calc(var(--spacing) * 2)}.gap-3{gap:calc(var(--spacing) * 3)}.gap-4{gap:calc(var(--spacing) * 4)}.gap-5{gap:calc(var(--spacing) * 5)}.gap-6{gap:calc(var(--spacing) * 6)}:where(.space-y-3>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 3) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse)))}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.overflow-hidden{overflow:hidden}.overflow-x-auto{overflow-x:auto}.overflow-x-hidden{overflow-x:hidden}.overflow-y-auto{overflow-y:auto}.overscroll-y-auto{overscroll-behavior-y:auto}.rounded{border-radius:.25rem}.rounded-full{border-radius:3.40282e38px}.rounded-lg{border-radius:var(--radius-lg)}.rounded-xl{border-radius:var(--radius-xl)}.rounded-xs{border-radius:var(--radius-xs)}.rounded-s-md{border-start-start-radius:var(--radius-md);border-end-start-radius:var(--radius-md)}.rounded-e-md{border-start-end-radius:var(--radius-md);border-end-end-radius:var(--radius-md)}.rounded-e-none\!{border-start-end-radius:0!important;border-end-end-radius:0!important}.border{border-style:var(--tw-border-style);border-width:1px}.border-e-1{border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px}.border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.border-dashed{--tw-border-style:dashed;border-style:dashed}.border-black\/10{border-color:#0000001a}@supports (color:color-mix(in lab, red, red)){.border-black\/10{border-color:color-mix(in oklab, var(--color-black) 10%, transparent)}}.border-surface{border-color:var(--p-content-border-color)}.border-surface-200{border-color:var(--p-surface-200)}@supports (color:color-mix(in lab, red, red)){.border-surface-200{border-color:color-mix(in srgb, var(--p-surface-200) calc(100% * 1), transparent)}}.border-surface-300{border-color:var(--p-surface-300)}@supports (color:color-mix(in lab, red, red)){.border-surface-300{border-color:color-mix(in srgb, var(--p-surface-300) calc(100% * 1), transparent)}}.bg-primary{background-color:var(--p-primary-color)}@supports (color:color-mix(in lab, red, red)){.bg-primary{background-color:color-mix(in srgb, var(--p-primary-color) calc(100% * 1), transparent)}}.bg-surface-100{background-color:var(--p-surface-100)}@supports (color:color-mix(in lab, red, red)){.bg-surface-100{background-color:color-mix(in srgb, var(--p-surface-100) calc(100% * 1), transparent)}}.bg-white{background-color:var(--color-white)}.bg-white\/90{background-color:#ffffffe6}@supports (color:color-mix(in lab, red, red)){.bg-white\/90{background-color:color-mix(in oklab, var(--color-white) 90%, transparent)}}.bg-cover{background-size:cover}.bg-center{background-position:50%}.p-1\.5{padding:calc(var(--spacing) * 1.5)}.p-2{padding:calc(var(--spacing) * 2)}.p-4{padding:calc(var(--spacing) * 4)}.px-1\.5{padding-inline:calc(var(--spacing) * 1.5)}.px-3{padding-inline:calc(var(--spacing) * 3)}.px-4{padding-inline:calc(var(--spacing) * 4)}.py-0{padding-block:calc(var(--spacing) * 0)}.py-0\.5{padding-block:calc(var(--spacing) * .5)}.py-2{padding-block:calc(var(--spacing) * 2)}.py-2\.5{padding-block:calc(var(--spacing) * 2.5)}.py-3{padding-block:calc(var(--spacing) * 3)}.py-4{padding-block:calc(var(--spacing) * 4)}.ps-3{padding-inline-start:calc(var(--spacing) * 3)}.pb-1{padding-bottom:calc(var(--spacing) * 1)}.pb-3{padding-bottom:calc(var(--spacing) * 3)}.text-center{text-align:center}.text-base{font-size:var(--text-base);line-height:var(--tw-leading,var(--text-base--line-height))}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.text-\[8px\]{font-size:8px}.text-\[9px\]{font-size:9px}.text-\[10px\]{font-size:10px}.text-\[11px\]{font-size:11px}.text-\[14px\]{font-size:14px}.font-bold{--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold)}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.text-color{color:var(--p-text-color)}.text-gray-600\!{color:var(--color-gray-600)!important}.text-primary{color:var(--p-primary-color)}@supports (color:color-mix(in lab, red, red)){.text-primary{color:color-mix(in srgb, var(--p-primary-color) calc(100% * 1), transparent)}}.text-surface-600{color:var(--p-surface-600)}@supports (color:color-mix(in lab, red, red)){.text-surface-600{color:color-mix(in srgb, var(--p-surface-600) calc(100% * 1), transparent)}}.text-white{color:var(--color-white)}.opacity-60{opacity:.6}.shadow-sm{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a), 0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}@media (hover:hover){.hover\:bg-black\/5:hover{background-color:#0000000d}@supports (color:color-mix(in lab, red, red)){.hover\:bg-black\/5:hover{background-color:color-mix(in oklab, var(--color-black) 5%, transparent)}}.hover\:bg-surface-100:hover{background-color:var(--p-surface-100)}@supports (color:color-mix(in lab, red, red)){.hover\:bg-surface-100:hover{background-color:color-mix(in srgb, var(--p-surface-100) calc(100% * 1), transparent)}}}@media not all and (min-width:640px){.max-\[640px\]\:order-1{order:1}.max-\[640px\]\:order-2{order:2}.max-\[640px\]\:w-full{width:100%}.max-\[640px\]\:flex-none{flex:none}.max-\[640px\]\:flex-col{flex-direction:column}.max-\[640px\]\:justify-center{justify-content:center}.max-\[640px\]\:gap-4{gap:calc(var(--spacing) * 4)}}@media (min-width:40rem){.sm\:aspect-\[16\/10\]{aspect-ratio:16/10}.sm\:size-\[47px\]{width:47px;height:47px}.sm\:h-3\/4{height:75%}.sm\:h-12{height:calc(var(--spacing) * 12)}.sm\:h-\[18rem\]{height:18rem}.sm\:w-12{width:calc(var(--spacing) * 12)}.sm\:w-16{width:calc(var(--spacing) * 16)}.sm\:w-60{width:calc(var(--spacing) * 60)}.sm\:p-8{padding:calc(var(--spacing) * 8)}.sm\:px-2{padding-inline:calc(var(--spacing) * 2)}.sm\:px-6{padding-inline:calc(var(--spacing) * 6)}.sm\:py-6{padding-block:calc(var(--spacing) * 6)}.sm\:text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}}@media (min-width:48rem){.md\:w-auto{width:auto}.md\:flex-row{flex-direction:row}.md\:items-end{align-items:flex-end}.md\:justify-between{justify-content:space-between}}@media (min-width:80rem){.xl\:sticky{position:sticky}.xl\:top-4{top:calc(var(--spacing) * 4)}.xl\:grid-cols-\[minmax\(0\,3fr\)_minmax\(20rem\,2fr\)\]{grid-template-columns:minmax(0,3fr) minmax(20rem,2fr)}.xl\:gap-10{gap:calc(var(--spacing) * 10)}.xl\:self-start{align-self:flex-start}}}@keyframes enter{0%{opacity:var(--p-enter-opacity,1);transform:translate3d(var(--p-enter-translate-x,0), var(--p-enter-translate-y,0), 0) scale3d(var(--p-enter-scale,1), var(--p-enter-scale,1), var(--p-enter-scale,1)) rotate(var(--p-enter-rotate,0))}}@keyframes leave{to{opacity:var(--p-leave-opacity,1);transform:translate3d(var(--p-leave-translate-x,0), var(--p-leave-translate-y,0), 0) scale3d(var(--p-leave-scale,1), var(--p-leave-scale,1), var(--p-leave-scale,1)) rotate(var(--p-leave-rotate,0))}}@property --tw-space-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}
|
package/assets/i18n/ar.json
CHANGED
|
@@ -7,6 +7,7 @@
|
|
|
7
7
|
"header": "الشريط العلوي",
|
|
8
8
|
"side-bar": "الشريط الجانبي",
|
|
9
9
|
"content-area": "منطقة المحتوى",
|
|
10
|
+
"page-layout": "ألوان التخطيط",
|
|
10
11
|
"layout": "تخطيط",
|
|
11
12
|
"content-layout": "تخطيط المحتوى",
|
|
12
13
|
"brand-name": "اسم البراند ",
|
|
@@ -63,6 +64,34 @@
|
|
|
63
64
|
"workspaces": "مساحات العمل",
|
|
64
65
|
"product-settings-nav": "إعدادات المنتج",
|
|
65
66
|
"brand-settings-nav": "إعدادات العلامة التجارية",
|
|
66
|
-
"others": "أخرى"
|
|
67
|
+
"others": "أخرى",
|
|
68
|
+
"header-background-color": "لون خلفية الشريط العلوي",
|
|
69
|
+
"header-text-color": "لون نص الشريط العلوي",
|
|
70
|
+
"side-bar-background-color": "لون خلفية الشريط الجانبي",
|
|
71
|
+
"side-bar-text-color": "لون نص الشريط الجانبي",
|
|
72
|
+
"content-background-color": "لون خلفية منطقة المحتوى",
|
|
73
|
+
"preview-settings": "الإعدادات",
|
|
74
|
+
"preview-organizations": "المنظمات",
|
|
75
|
+
"preview-users": "المستخدمون",
|
|
76
|
+
"preview-documents": "المستندات",
|
|
77
|
+
"preview-content-row": "صف المحتوى",
|
|
78
|
+
"project-management-system": "نظام إدارة المشاريع",
|
|
79
|
+
"signin": "تسجيل الدخول",
|
|
80
|
+
"sign-in": "تسجيل الدخول",
|
|
81
|
+
"tagline": "نظام ذكي للنخب، تحكّم وتميّز",
|
|
82
|
+
"info-msg": "سجل الدخول باستخدام بيانات المستخدم المسجلة لديك!",
|
|
83
|
+
"username": "اسم المستخدم",
|
|
84
|
+
"password": "كلمة المرور"
|
|
85
|
+
},
|
|
86
|
+
"login": {
|
|
87
|
+
"preview": "معاينة",
|
|
88
|
+
"signin": "تسجيل الدخول",
|
|
89
|
+
"sign-in": "تسجيل الدخول",
|
|
90
|
+
"tagline": "نظام ذكي للنخب، تحكّم وتميّز",
|
|
91
|
+
"info-msg": "سجل الدخول باستخدام بيانات المستخدم المسجلة لديك! إذا لم يكن لديك حساب، يرجى",
|
|
92
|
+
"username": "اسم المستخدم",
|
|
93
|
+
"password": "كلمة المرور",
|
|
94
|
+
"project-management-system": "نظام إدارة المشاريع",
|
|
95
|
+
"portfolio-management-system": "نظام إدارة المحافظ"
|
|
67
96
|
}
|
|
68
97
|
}
|
package/assets/i18n/en.json
CHANGED
|
@@ -7,6 +7,7 @@
|
|
|
7
7
|
"header": "Header",
|
|
8
8
|
"side-bar": "Side Bar",
|
|
9
9
|
"content-area": "Content Area",
|
|
10
|
+
"page-layout": "Layout Colors",
|
|
10
11
|
"layout": "Layout",
|
|
11
12
|
"content-layout": "Content Layout",
|
|
12
13
|
"brand-name": "Brand Name",
|
|
@@ -63,6 +64,34 @@
|
|
|
63
64
|
"workspaces": "Workspaces",
|
|
64
65
|
"product-settings-nav": "Product Settings",
|
|
65
66
|
"brand-settings-nav": "Brand Settings",
|
|
66
|
-
"others": "Others"
|
|
67
|
+
"others": "Others",
|
|
68
|
+
"header-background-color": "Header Background Color",
|
|
69
|
+
"header-text-color": "Header Text Color",
|
|
70
|
+
"side-bar-background-color": "Side Bar Background Color",
|
|
71
|
+
"side-bar-text-color": "Side Bar Text Color",
|
|
72
|
+
"content-background-color": "Content Background Color",
|
|
73
|
+
"preview-settings": "Settings",
|
|
74
|
+
"preview-organizations": "Organizations",
|
|
75
|
+
"preview-users": "Users",
|
|
76
|
+
"preview-documents": "Documents",
|
|
77
|
+
"preview-content-row": "Content row",
|
|
78
|
+
"project-management-system": "Project Management System",
|
|
79
|
+
"signin": "Sign In",
|
|
80
|
+
"sign-in": "Sign In",
|
|
81
|
+
"tagline": "A Smart System for Elites, Control and Excel",
|
|
82
|
+
"info-msg": "Sign in with your registered user! If you don't have an account, please",
|
|
83
|
+
"username": "Username",
|
|
84
|
+
"password": "Password"
|
|
85
|
+
},
|
|
86
|
+
"login": {
|
|
87
|
+
"preview": "Preview",
|
|
88
|
+
"signin": "Sign In",
|
|
89
|
+
"sign-in": "Sign In",
|
|
90
|
+
"tagline": "A Smart System for Elites, Control and Excel",
|
|
91
|
+
"info-msg": "Sign in with your registered user! If you don't have an account, please",
|
|
92
|
+
"username": "Username",
|
|
93
|
+
"password": "Password",
|
|
94
|
+
"project-management-system": "Project Management System",
|
|
95
|
+
"portfolio-management-system": "Portfolio Management System"
|
|
67
96
|
}
|
|
68
97
|
}
|
|
@@ -69,10 +69,18 @@ const defaultBrandDisplayData = {
|
|
|
69
69
|
repeated: false,
|
|
70
70
|
},
|
|
71
71
|
login: {
|
|
72
|
-
backgroundColor: '#
|
|
72
|
+
backgroundColor: '#00313F',
|
|
73
|
+
textColor: '#ffffff',
|
|
73
74
|
repeated: false,
|
|
74
75
|
formWizardPosition: 'start',
|
|
75
76
|
},
|
|
77
|
+
pageLayout: {
|
|
78
|
+
headerBackgroundColor: '#ffffff',
|
|
79
|
+
headerTextColor: '#0a0a0a',
|
|
80
|
+
sidebarBackgroundColor: '#EBEBF0',
|
|
81
|
+
sidebarTextColor: '#0a0a0a',
|
|
82
|
+
contentBackgroundColor: '#ffffff',
|
|
83
|
+
},
|
|
76
84
|
loginLogo: 'pplus.svg',
|
|
77
85
|
brandLogoWhite: 'pplus-white.svg',
|
|
78
86
|
};
|
|
@@ -355,12 +363,14 @@ class ManageBrndingService {
|
|
|
355
363
|
sidebarData = computed(() => this.brandDisplayData()?.sidebar, ...(ngDevMode ? [{ debugName: "sidebarData" }] : /* istanbul ignore next */ []));
|
|
356
364
|
contentAreaData = computed(() => this.brandDisplayData()?.contentArea, ...(ngDevMode ? [{ debugName: "contentAreaData" }] : /* istanbul ignore next */ []));
|
|
357
365
|
loginData = computed(() => this.brandDisplayData()?.login, ...(ngDevMode ? [{ debugName: "loginData" }] : /* istanbul ignore next */ []));
|
|
366
|
+
pageLayoutData = computed(() => this.brandDisplayData()?.pageLayout, ...(ngDevMode ? [{ debugName: "pageLayoutData" }] : /* istanbul ignore next */ []));
|
|
358
367
|
// Draft data computed signals for preview components
|
|
359
368
|
draftMainData = computed(() => this.draftBrandDisplayData()?.main, ...(ngDevMode ? [{ debugName: "draftMainData" }] : /* istanbul ignore next */ []));
|
|
360
369
|
draftHeaderData = computed(() => this.draftBrandDisplayData()?.header, ...(ngDevMode ? [{ debugName: "draftHeaderData" }] : /* istanbul ignore next */ []));
|
|
361
370
|
draftSidebarData = computed(() => this.draftBrandDisplayData()?.sidebar, ...(ngDevMode ? [{ debugName: "draftSidebarData" }] : /* istanbul ignore next */ []));
|
|
362
371
|
draftContentAreaData = computed(() => this.draftBrandDisplayData()?.contentArea, ...(ngDevMode ? [{ debugName: "draftContentAreaData" }] : /* istanbul ignore next */ []));
|
|
363
372
|
draftLoginData = computed(() => this.draftBrandDisplayData()?.login, ...(ngDevMode ? [{ debugName: "draftLoginData" }] : /* istanbul ignore next */ []));
|
|
373
|
+
draftPageLayoutData = computed(() => this.draftBrandDisplayData()?.pageLayout, ...(ngDevMode ? [{ debugName: "draftPageLayoutData" }] : /* istanbul ignore next */ []));
|
|
364
374
|
// Images for main brandDisplayData
|
|
365
375
|
productBrandLogo = computed(() => {
|
|
366
376
|
return this.mainData()?.logoSettings?.productBrandImage?.fileName;
|
|
@@ -448,6 +458,24 @@ class ManageBrndingService {
|
|
|
448
458
|
}
|
|
449
459
|
});
|
|
450
460
|
});
|
|
461
|
+
effect(() => {
|
|
462
|
+
const layout = this.pageLayoutData();
|
|
463
|
+
const defaults = this.DEFAULT_DISPLAY_DATA()?.pageLayout;
|
|
464
|
+
untracked(() => {
|
|
465
|
+
const root = document.documentElement;
|
|
466
|
+
root.style.setProperty('--mt-cp-sidebar-bg', layout?.sidebarBackgroundColor ||
|
|
467
|
+
defaults?.sidebarBackgroundColor ||
|
|
468
|
+
'#EBEBF0');
|
|
469
|
+
root.style.setProperty('--mt-cp-sidebar-text', layout?.sidebarTextColor || defaults?.sidebarTextColor || '#0a0a0a');
|
|
470
|
+
root.style.setProperty('--mt-cp-header-bg', layout?.headerBackgroundColor ||
|
|
471
|
+
defaults?.headerBackgroundColor ||
|
|
472
|
+
'#ffffff');
|
|
473
|
+
root.style.setProperty('--mt-cp-header-text', layout?.headerTextColor || defaults?.headerTextColor || '#0a0a0a');
|
|
474
|
+
root.style.setProperty('--mt-cp-content-bg', layout?.contentBackgroundColor ||
|
|
475
|
+
defaults?.contentBackgroundColor ||
|
|
476
|
+
'#FFFFFF');
|
|
477
|
+
});
|
|
478
|
+
});
|
|
451
479
|
}
|
|
452
480
|
buildBackgroundStyles(data, defaultBgColor) {
|
|
453
481
|
const styles = {};
|
|
@@ -563,7 +591,7 @@ class PreviewBrand {
|
|
|
563
591
|
},
|
|
564
592
|
], ...(ngDevMode ? [{ debugName: "pages" }] : /* istanbul ignore next */ []));
|
|
565
593
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: PreviewBrand, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
566
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.8", type: PreviewBrand, isStandalone: true, selector: "mt-preview-brand", ngImport: i0, template: "<ng-container *transloco=\"let t\">\r\n <div\r\n class=\"flex overflow-hidden rounded-lg border border-surface-300 bg-white\"\r\n >\r\n <div class=\"flex overflow-hidden bg-white rounded-s-
|
|
594
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.8", type: PreviewBrand, isStandalone: true, selector: "mt-preview-brand", ngImport: i0, template: "<ng-container *transloco=\"let t\">\r\n <div\r\n class=\"flex overflow-hidden rounded-lg border border-surface-300 bg-white\"\r\n >\r\n <div class=\"flex overflow-hidden bg-white rounded-s-md\">\r\n <div\r\n class=\"flex h-full w-14 shrink-0 flex-col items-center gap-3 border-e-1 border-surface-300 bg-cover bg-center px-1.5 py-4 sm:w-16 sm:px-2 sm:py-6\"\r\n [style]=\"sidebarStyles()\"\r\n [style.backgroundImage]=\"\r\n sidebarBackgroundImage()\r\n ? (sidebarBackgroundImage() | secureImage)\r\n : null\r\n \"\r\n >\r\n <div class=\"mb-2\">\r\n <mt-icon icon=\"general.menu-01\"></mt-icon>\r\n </div>\r\n @for (page of pages(); track page.title; let first = $first) {\r\n <a\r\n [style.background-color]=\"first ? lightPrimaryColor() : null\"\r\n class=\"flex size-10 items-center justify-center rounded-xl transition-colors hover:bg-surface-100 sm:size-[47px]\"\r\n >\r\n <mt-icon\r\n [icon]=\"page.icon\"\r\n [style.color]=\"\r\n first ? primaryColor() : manageBrnding.draftSidebarIconColor()\r\n \"\r\n />\r\n </a>\r\n }\r\n </div>\r\n </div>\r\n <div class=\"min-w-0 flex-1\">\r\n <div\r\n class=\"flex min-h-14 items-center justify-between gap-3 rounded-e-md bg-cover bg-center px-3 py-0\"\r\n [style]=\"headerStyles()\"\r\n [style.backgroundImage]=\"\r\n headerBackgroundImage()\r\n ? (headerBackgroundImage() | secureImage)\r\n : null\r\n \"\r\n >\r\n <div class=\"flex min-w-0 items-center gap-2\">\r\n <img\r\n [src]=\"\r\n productBrandLogo()\r\n ? (productBrandLogo() | secureImage: true)\r\n : DEFAULT_DISPLAY_DATA()?.brandLogoWhite\r\n \"\r\n alt=\"Logo\"\r\n class=\"h-8 shrink-0\"\r\n />\r\n <div\r\n class=\"h-10 w-px shrink-0 sm:h-3/4\"\r\n [style.background-color]=\"headerFontColor()\"\r\n ></div>\r\n <div class=\"flex min-w-0 flex-col\">\r\n <h2\r\n class=\"truncate text-[8px] font-semibold sm:text-sm\"\r\n [style.color]=\"headerFontColor()\"\r\n >\r\n {{ productName() }}\r\n </h2>\r\n <span\r\n class=\"truncate text-[8px] font-semibold\"\r\n [style.color]=\"headerFontColor()\"\r\n >\r\n {{ productTagline() }}\r\n </span>\r\n </div>\r\n </div>\r\n <div class=\"flex shrink-0 items-center gap-2\">\r\n <mt-button\r\n icon=\"alert.bell-01\"\r\n severity=\"secondary\"\r\n variant=\"text\"\r\n [style.color]=\"headerFontColor()\"\r\n ></mt-button>\r\n </div>\r\n </div>\r\n <div\r\n [style]=\"contentAreaStyles()\"\r\n [style.color]=\"contentAreaBodyColor()\"\r\n [style.backgroundImage]=\"\r\n contentAreaBackgroundImage()\r\n ? (contentAreaBackgroundImage() | secureImage)\r\n : null\r\n \"\r\n class=\"h-[16rem] overflow-x-hidden overflow-y-auto overscroll-y-auto bg-cover bg-center ps-3 pb-3 sm:h-[18rem]\"\r\n >\r\n <mt-card class=\"w-full h-full rounded-e-none!\">\r\n <p class=\"text-sm\">{{ t(\"preview-content\") }}</p>\r\n </mt-card>\r\n </div>\r\n </div>\r\n </div>\r\n</ng-container>\r\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: Button, selector: "mt-button", inputs: ["icon", "label", "tooltip", "class", "type", "styleClass", "severity", "badge", "variant", "badgeSeverity", "size", "iconPos", "autofocus", "fluid", "raised", "rounded", "text", "plain", "outlined", "link", "disabled", "loading", "pInputs"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "component", type: Icon, selector: "mt-icon", inputs: ["icon"] }, { kind: "directive", type: TranslocoDirective, selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoPrefix", "translocoLang", "translocoLoadingTpl"] }, { kind: "component", type: Card, selector: "mt-card", inputs: ["class", "title", "paddingless"] }, { kind: "pipe", type: SecureImagePipe, name: "secureImage" }] });
|
|
567
595
|
}
|
|
568
596
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: PreviewBrand, decorators: [{
|
|
569
597
|
type: Component,
|
|
@@ -574,7 +602,40 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImpor
|
|
|
574
602
|
TranslocoDirective,
|
|
575
603
|
SecureImagePipe,
|
|
576
604
|
Card,
|
|
577
|
-
], template: "<ng-container *transloco=\"let t\">\r\n <div\r\n class=\"flex overflow-hidden rounded-lg border border-surface-300 bg-white\"\r\n >\r\n <div class=\"flex overflow-hidden bg-white rounded-s-
|
|
605
|
+
], template: "<ng-container *transloco=\"let t\">\r\n <div\r\n class=\"flex overflow-hidden rounded-lg border border-surface-300 bg-white\"\r\n >\r\n <div class=\"flex overflow-hidden bg-white rounded-s-md\">\r\n <div\r\n class=\"flex h-full w-14 shrink-0 flex-col items-center gap-3 border-e-1 border-surface-300 bg-cover bg-center px-1.5 py-4 sm:w-16 sm:px-2 sm:py-6\"\r\n [style]=\"sidebarStyles()\"\r\n [style.backgroundImage]=\"\r\n sidebarBackgroundImage()\r\n ? (sidebarBackgroundImage() | secureImage)\r\n : null\r\n \"\r\n >\r\n <div class=\"mb-2\">\r\n <mt-icon icon=\"general.menu-01\"></mt-icon>\r\n </div>\r\n @for (page of pages(); track page.title; let first = $first) {\r\n <a\r\n [style.background-color]=\"first ? lightPrimaryColor() : null\"\r\n class=\"flex size-10 items-center justify-center rounded-xl transition-colors hover:bg-surface-100 sm:size-[47px]\"\r\n >\r\n <mt-icon\r\n [icon]=\"page.icon\"\r\n [style.color]=\"\r\n first ? primaryColor() : manageBrnding.draftSidebarIconColor()\r\n \"\r\n />\r\n </a>\r\n }\r\n </div>\r\n </div>\r\n <div class=\"min-w-0 flex-1\">\r\n <div\r\n class=\"flex min-h-14 items-center justify-between gap-3 rounded-e-md bg-cover bg-center px-3 py-0\"\r\n [style]=\"headerStyles()\"\r\n [style.backgroundImage]=\"\r\n headerBackgroundImage()\r\n ? (headerBackgroundImage() | secureImage)\r\n : null\r\n \"\r\n >\r\n <div class=\"flex min-w-0 items-center gap-2\">\r\n <img\r\n [src]=\"\r\n productBrandLogo()\r\n ? (productBrandLogo() | secureImage: true)\r\n : DEFAULT_DISPLAY_DATA()?.brandLogoWhite\r\n \"\r\n alt=\"Logo\"\r\n class=\"h-8 shrink-0\"\r\n />\r\n <div\r\n class=\"h-10 w-px shrink-0 sm:h-3/4\"\r\n [style.background-color]=\"headerFontColor()\"\r\n ></div>\r\n <div class=\"flex min-w-0 flex-col\">\r\n <h2\r\n class=\"truncate text-[8px] font-semibold sm:text-sm\"\r\n [style.color]=\"headerFontColor()\"\r\n >\r\n {{ productName() }}\r\n </h2>\r\n <span\r\n class=\"truncate text-[8px] font-semibold\"\r\n [style.color]=\"headerFontColor()\"\r\n >\r\n {{ productTagline() }}\r\n </span>\r\n </div>\r\n </div>\r\n <div class=\"flex shrink-0 items-center gap-2\">\r\n <mt-button\r\n icon=\"alert.bell-01\"\r\n severity=\"secondary\"\r\n variant=\"text\"\r\n [style.color]=\"headerFontColor()\"\r\n ></mt-button>\r\n </div>\r\n </div>\r\n <div\r\n [style]=\"contentAreaStyles()\"\r\n [style.color]=\"contentAreaBodyColor()\"\r\n [style.backgroundImage]=\"\r\n contentAreaBackgroundImage()\r\n ? (contentAreaBackgroundImage() | secureImage)\r\n : null\r\n \"\r\n class=\"h-[16rem] overflow-x-hidden overflow-y-auto overscroll-y-auto bg-cover bg-center ps-3 pb-3 sm:h-[18rem]\"\r\n >\r\n <mt-card class=\"w-full h-full rounded-e-none!\">\r\n <p class=\"text-sm\">{{ t(\"preview-content\") }}</p>\r\n </mt-card>\r\n </div>\r\n </div>\r\n </div>\r\n</ng-container>\r\n" }]
|
|
606
|
+
}] });
|
|
607
|
+
|
|
608
|
+
class PreviewLayoutPage {
|
|
609
|
+
manageBrnding = inject(ManageBrndingService);
|
|
610
|
+
DEFAULT = this.manageBrnding.DEFAULT_DISPLAY_DATA;
|
|
611
|
+
draft = this.manageBrnding.draftPageLayoutData;
|
|
612
|
+
headerBg = computed(() => this.draft()?.headerBackgroundColor ||
|
|
613
|
+
this.DEFAULT()?.pageLayout?.headerBackgroundColor ||
|
|
614
|
+
'#ffffff', ...(ngDevMode ? [{ debugName: "headerBg" }] : /* istanbul ignore next */ []));
|
|
615
|
+
headerText = computed(() => this.draft()?.headerTextColor ||
|
|
616
|
+
this.DEFAULT()?.pageLayout?.headerTextColor ||
|
|
617
|
+
'#0a0a0a', ...(ngDevMode ? [{ debugName: "headerText" }] : /* istanbul ignore next */ []));
|
|
618
|
+
sidebarBg = computed(() => this.draft()?.sidebarBackgroundColor ||
|
|
619
|
+
this.DEFAULT()?.pageLayout?.sidebarBackgroundColor ||
|
|
620
|
+
'#EBEBF0', ...(ngDevMode ? [{ debugName: "sidebarBg" }] : /* istanbul ignore next */ []));
|
|
621
|
+
sidebarText = computed(() => this.draft()?.sidebarTextColor ||
|
|
622
|
+
this.DEFAULT()?.pageLayout?.sidebarTextColor ||
|
|
623
|
+
'#0a0a0a', ...(ngDevMode ? [{ debugName: "sidebarText" }] : /* istanbul ignore next */ []));
|
|
624
|
+
contentBg = computed(() => this.draft()?.contentBackgroundColor ||
|
|
625
|
+
this.DEFAULT()?.pageLayout?.contentBackgroundColor ||
|
|
626
|
+
'#FFFFFF', ...(ngDevMode ? [{ debugName: "contentBg" }] : /* istanbul ignore next */ []));
|
|
627
|
+
mockMenuItems = [
|
|
628
|
+
{ icon: 'general.building-02', label: 'preview-organizations', count: 12 },
|
|
629
|
+
{ icon: 'custom.user-pp', label: 'preview-users', count: 48 },
|
|
630
|
+
{ icon: 'alert.bell-02', label: 'preview-documents', count: 156 },
|
|
631
|
+
{ icon: 'general.settings-01', label: 'preview-settings', count: 7 },
|
|
632
|
+
];
|
|
633
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: PreviewLayoutPage, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
634
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.8", type: PreviewLayoutPage, isStandalone: true, selector: "mt-preview-layout-page", ngImport: i0, template: "<ng-container *transloco=\"let t; prefix: 'brand-display'\">\r\n <h3 class=\"text-sm font-medium mb-3\">{{ t(\"preview\") }}</h3>\r\n\r\n <!-- Client Page Mockup -->\r\n <div\r\n class=\"overflow-hidden rounded-xl border border-surface-200 shadow-sm\"\r\n style=\"height: 420px\"\r\n >\r\n <div class=\"flex h-full\">\r\n <!-- Left Sidebar -->\r\n <div\r\n class=\"flex w-49 shrink-0 flex-col overflow-hidden\"\r\n [style.background-color]=\"sidebarBg()\"\r\n >\r\n <!-- Sidebar Header -->\r\n <div class=\"flex items-center gap-2 border-b border-black/10 px-4 py-3\">\r\n <mt-icon [icon]=\"'general.settings-01'\" />\r\n <span class=\"text-xs font-semibold\" [style.color]=\"sidebarText()\">{{\r\n t(\"preview-settings\")\r\n }}</span>\r\n </div>\r\n\r\n <!-- Sidebar Items -->\r\n <div class=\"flex-1 overflow-y-auto p-2\">\r\n @for (item of mockMenuItems; track item.label) {\r\n <div\r\n class=\"mb-1 flex cursor-pointer items-center gap-2 rounded-lg px-3 py-2 transition-colors hover:bg-black/5\"\r\n >\r\n <div class=\"p-1.5 bg-surface-100 flex items-center rounded-xs\">\r\n <mt-icon [icon]=\"item.icon\" />\r\n </div>\r\n <span\r\n [style.color]=\"sidebarText()\"\r\n class=\"min-w-0 flex-1 truncate text-xs font-medium\"\r\n >{{ t(item.label) }}</span\r\n >\r\n <span\r\n [style.color]=\"headerText()\"\r\n class=\"shrink-0 rounded-full px-1.5 py-0.5 text-[10px] font-semibold opacity-60\"\r\n [style.background-color]=\"sidebarText() + '22'\"\r\n >{{ item.count }}</span\r\n >\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n\r\n <!-- Right Panel -->\r\n <div class=\"flex min-w-0 flex-1 flex-col overflow-hidden\">\r\n <!-- Right Header -->\r\n <div\r\n class=\"flex shrink-0 items-center justify-between border-b border-black/10 px-4 py-3\"\r\n [style.background-color]=\"headerBg()\"\r\n >\r\n <div class=\"flex items-center gap-2\">\r\n <div class=\"p-1.5 bg-surface-100 flex items-center rounded-xs\">\r\n <mt-icon [icon]=\"'general.building-02'\" />\r\n </div>\r\n\r\n <span class=\"text-xs font-semibold\" [style.color]=\"headerText()\">{{\r\n t(\"preview-organizations\")\r\n }}</span>\r\n </div>\r\n </div>\r\n\r\n <!-- Right Content -->\r\n <div\r\n class=\"flex-1 overflow-y-auto p-4\"\r\n [style.background-color]=\"contentBg()\"\r\n >\r\n <div class=\"flex flex-col gap-2\">\r\n @for (i of [1, 2, 3, 4, 5]; track i) {\r\n <div\r\n class=\"rounded-lg bg-surface-100 px-3 py-2.5 text-xs text-surface-600 border border-surface-200\"\r\n >\r\n {{ t(\"preview-content-row\") }} {{ i }}\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</ng-container>\r\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: Icon, selector: "mt-icon", inputs: ["icon"] }, { kind: "directive", type: TranslocoDirective, selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoPrefix", "translocoLang", "translocoLoadingTpl"] }] });
|
|
635
|
+
}
|
|
636
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: PreviewLayoutPage, decorators: [{
|
|
637
|
+
type: Component,
|
|
638
|
+
args: [{ selector: 'mt-preview-layout-page', standalone: true, imports: [CommonModule, Icon, TranslocoDirective], template: "<ng-container *transloco=\"let t; prefix: 'brand-display'\">\r\n <h3 class=\"text-sm font-medium mb-3\">{{ t(\"preview\") }}</h3>\r\n\r\n <!-- Client Page Mockup -->\r\n <div\r\n class=\"overflow-hidden rounded-xl border border-surface-200 shadow-sm\"\r\n style=\"height: 420px\"\r\n >\r\n <div class=\"flex h-full\">\r\n <!-- Left Sidebar -->\r\n <div\r\n class=\"flex w-49 shrink-0 flex-col overflow-hidden\"\r\n [style.background-color]=\"sidebarBg()\"\r\n >\r\n <!-- Sidebar Header -->\r\n <div class=\"flex items-center gap-2 border-b border-black/10 px-4 py-3\">\r\n <mt-icon [icon]=\"'general.settings-01'\" />\r\n <span class=\"text-xs font-semibold\" [style.color]=\"sidebarText()\">{{\r\n t(\"preview-settings\")\r\n }}</span>\r\n </div>\r\n\r\n <!-- Sidebar Items -->\r\n <div class=\"flex-1 overflow-y-auto p-2\">\r\n @for (item of mockMenuItems; track item.label) {\r\n <div\r\n class=\"mb-1 flex cursor-pointer items-center gap-2 rounded-lg px-3 py-2 transition-colors hover:bg-black/5\"\r\n >\r\n <div class=\"p-1.5 bg-surface-100 flex items-center rounded-xs\">\r\n <mt-icon [icon]=\"item.icon\" />\r\n </div>\r\n <span\r\n [style.color]=\"sidebarText()\"\r\n class=\"min-w-0 flex-1 truncate text-xs font-medium\"\r\n >{{ t(item.label) }}</span\r\n >\r\n <span\r\n [style.color]=\"headerText()\"\r\n class=\"shrink-0 rounded-full px-1.5 py-0.5 text-[10px] font-semibold opacity-60\"\r\n [style.background-color]=\"sidebarText() + '22'\"\r\n >{{ item.count }}</span\r\n >\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n\r\n <!-- Right Panel -->\r\n <div class=\"flex min-w-0 flex-1 flex-col overflow-hidden\">\r\n <!-- Right Header -->\r\n <div\r\n class=\"flex shrink-0 items-center justify-between border-b border-black/10 px-4 py-3\"\r\n [style.background-color]=\"headerBg()\"\r\n >\r\n <div class=\"flex items-center gap-2\">\r\n <div class=\"p-1.5 bg-surface-100 flex items-center rounded-xs\">\r\n <mt-icon [icon]=\"'general.building-02'\" />\r\n </div>\r\n\r\n <span class=\"text-xs font-semibold\" [style.color]=\"headerText()\">{{\r\n t(\"preview-organizations\")\r\n }}</span>\r\n </div>\r\n </div>\r\n\r\n <!-- Right Content -->\r\n <div\r\n class=\"flex-1 overflow-y-auto p-4\"\r\n [style.background-color]=\"contentBg()\"\r\n >\r\n <div class=\"flex flex-col gap-2\">\r\n @for (i of [1, 2, 3, 4, 5]; track i) {\r\n <div\r\n class=\"rounded-lg bg-surface-100 px-3 py-2.5 text-xs text-surface-600 border border-surface-200\"\r\n >\r\n {{ t(\"preview-content-row\") }} {{ i }}\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</ng-container>\r\n" }]
|
|
578
639
|
}] });
|
|
579
640
|
|
|
580
641
|
class WhiteLabel {
|
|
@@ -586,6 +647,7 @@ class WhiteLabel {
|
|
|
586
647
|
const selectedTab = this.route.snapshot.firstChild?.data['componentType'];
|
|
587
648
|
this.selectedTab.set(selectedTab || 'main');
|
|
588
649
|
}
|
|
650
|
+
isPageLayoutTab = computed(() => this.selectedTab() === 'page-layout', ...(ngDevMode ? [{ debugName: "isPageLayoutTab" }] : /* istanbul ignore next */ []));
|
|
589
651
|
tabsList = [
|
|
590
652
|
{
|
|
591
653
|
label: this.translocoService.translate('brand-display.main'),
|
|
@@ -603,6 +665,10 @@ class WhiteLabel {
|
|
|
603
665
|
label: this.translocoService.translate('brand-display.content-area'),
|
|
604
666
|
value: 'content-area',
|
|
605
667
|
},
|
|
668
|
+
{
|
|
669
|
+
label: this.translocoService.translate('brand-display.page-layout'),
|
|
670
|
+
value: 'page-layout',
|
|
671
|
+
},
|
|
606
672
|
];
|
|
607
673
|
onTabChange(event) {
|
|
608
674
|
if (event) {
|
|
@@ -610,11 +676,18 @@ class WhiteLabel {
|
|
|
610
676
|
}
|
|
611
677
|
}
|
|
612
678
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: WhiteLabel, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
613
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
|
|
679
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.8", type: WhiteLabel, isStandalone: true, selector: "mt-white-label", ngImport: i0, template: "<ng-container *transloco=\"let t; prefix: 'brand-display'\">\r\n <div class=\"mt-7 overflow-x-auto pb-1\">\r\n <mt-tabs\r\n class=\"min-w-max\"\r\n [(active)]=\"selectedTab\"\r\n [options]=\"tabsList\"\r\n size=\"large\"\r\n (onChange)=\"onTabChange($event)\"\r\n />\r\n </div>\r\n <div\r\n class=\"mt-4 grid min-h-0 gap-6 xl:grid-cols-[minmax(0,3fr)_minmax(20rem,2fr)] xl:gap-10\"\r\n >\r\n <div class=\"min-w-0\">\r\n <router-outlet />\r\n </div>\r\n <div class=\"min-w-0 xl:sticky xl:top-4 xl:self-start\">\r\n @if (isPageLayoutTab()) {\r\n <mt-preview-layout-page />\r\n } @else {\r\n <h3 class=\"text-sm font-medium mb-3\">{{ t(\"preview\") }}</h3>\r\n <mt-preview-brand></mt-preview-brand>\r\n }\r\n </div>\r\n </div>\r\n</ng-container>\r\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: Tabs, selector: "mt-tabs", inputs: ["options", "optionLabel", "optionValue", "active", "mode", "size", "fluid", "disabled"], outputs: ["activeChange", "onChange"] }, { kind: "directive", type: RouterOutlet, selector: "router-outlet", inputs: ["name", "routerOutletData"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }, { kind: "component", type: PreviewBrand, selector: "mt-preview-brand" }, { kind: "component", type: PreviewLayoutPage, selector: "mt-preview-layout-page" }, { kind: "directive", type: TranslocoDirective, selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoPrefix", "translocoLang", "translocoLoadingTpl"] }] });
|
|
614
680
|
}
|
|
615
681
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: WhiteLabel, decorators: [{
|
|
616
682
|
type: Component,
|
|
617
|
-
args: [{ selector: 'mt-white-label', standalone: true, imports: [
|
|
683
|
+
args: [{ selector: 'mt-white-label', standalone: true, imports: [
|
|
684
|
+
CommonModule,
|
|
685
|
+
Tabs,
|
|
686
|
+
RouterOutlet,
|
|
687
|
+
PreviewBrand,
|
|
688
|
+
PreviewLayoutPage,
|
|
689
|
+
TranslocoDirective,
|
|
690
|
+
], template: "<ng-container *transloco=\"let t; prefix: 'brand-display'\">\r\n <div class=\"mt-7 overflow-x-auto pb-1\">\r\n <mt-tabs\r\n class=\"min-w-max\"\r\n [(active)]=\"selectedTab\"\r\n [options]=\"tabsList\"\r\n size=\"large\"\r\n (onChange)=\"onTabChange($event)\"\r\n />\r\n </div>\r\n <div\r\n class=\"mt-4 grid min-h-0 gap-6 xl:grid-cols-[minmax(0,3fr)_minmax(20rem,2fr)] xl:gap-10\"\r\n >\r\n <div class=\"min-w-0\">\r\n <router-outlet />\r\n </div>\r\n <div class=\"min-w-0 xl:sticky xl:top-4 xl:self-start\">\r\n @if (isPageLayoutTab()) {\r\n <mt-preview-layout-page />\r\n } @else {\r\n <h3 class=\"text-sm font-medium mb-3\">{{ t(\"preview\") }}</h3>\r\n <mt-preview-brand></mt-preview-brand>\r\n }\r\n </div>\r\n </div>\r\n</ng-container>\r\n" }]
|
|
618
691
|
}] });
|
|
619
692
|
|
|
620
693
|
class MainDisplay {
|
|
@@ -953,6 +1026,10 @@ class PreviewLogin {
|
|
|
953
1026
|
return (value?.backgroundColor ||
|
|
954
1027
|
this.DEFAULT_DISPLAY_DATA()?.login?.backgroundColor);
|
|
955
1028
|
}, ...(ngDevMode ? [{ debugName: "previewBackgroundColor" }] : /* istanbul ignore next */ []));
|
|
1029
|
+
previewTextColor = computed(() => {
|
|
1030
|
+
const value = this.manageBrnding.draftLoginData();
|
|
1031
|
+
return value?.textColor || this.DEFAULT_DISPLAY_DATA()?.login?.textColor;
|
|
1032
|
+
}, ...(ngDevMode ? [{ debugName: "previewTextColor" }] : /* istanbul ignore next */ []));
|
|
956
1033
|
repeated = computed(() => {
|
|
957
1034
|
const v = this.manageBrnding.draftLoginData();
|
|
958
1035
|
return v?.repeated || this.DEFAULT_DISPLAY_DATA()?.login?.repeated;
|
|
@@ -968,11 +1045,11 @@ class PreviewLogin {
|
|
|
968
1045
|
}, ...(ngDevMode ? [{ debugName: "previewLogoSrc" }] : /* istanbul ignore next */ []));
|
|
969
1046
|
backgroundImage = this.manageBrnding.draftLoginBackgroundImage;
|
|
970
1047
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: PreviewLogin, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
971
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.8", type: PreviewLogin, isStandalone: true, selector: "mt-preview-login", ngImport: i0, template: "<ng-container *transloco=\"let t; prefix: '
|
|
1048
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.8", type: PreviewLogin, isStandalone: true, selector: "mt-preview-login", ngImport: i0, template: "<ng-container *transloco=\"let t; prefix: 'brand-display'\">\r\n <div class=\"xl:sticky xl:top-4\">\r\n <h3 class=\"text-sm font-medium mb-3\">{{ t(\"preview\") }}</h3>\r\n <div\r\n class=\"relative overflow-hidden rounded-lg aspect-[4/5] sm:aspect-[16/10]\"\r\n [style]=\"{\r\n 'background-color': previewBackgroundColor(),\r\n 'background-size': repeated() ? 'auto' : 'cover',\r\n 'background-repeat': repeated() ? 'repeat' : 'no-repeat',\r\n 'background-position': 'center',\r\n }\"\r\n [style.backgroundImage]=\"\r\n backgroundImage() ? (backgroundImage() | secureImage) : null\r\n \"\r\n >\r\n <div\r\n class=\"absolute inset-0 flex items-center p-4 max-[640px]:flex-col max-[640px]:justify-center max-[640px]:gap-4 sm:p-8\"\r\n >\r\n @if (previewFormPosition() !== \"center\") {\r\n <div\r\n class=\"logo flex min-w-0 mx-auto flex-col items-start gap-2 max-[640px]:order-1 max-[640px]:w-full max-[640px]:flex-none\"\r\n [class]=\"{\r\n 'order-2': previewFormPosition() === 'start',\r\n 'order-1': previewFormPosition() === 'end',\r\n }\"\r\n >\r\n <img\r\n [src]=\"\r\n previewLogoSrc()\r\n ? (previewLogoSrc() | secureImage: true)\r\n : DEFAULT_DISPLAY_DATA()?.loginLogo\r\n \"\r\n alt=\"Logo\"\r\n class=\"h-8 sm:h-12 sm:w-12\"\r\n />\r\n <div\r\n class=\"text-center text-base text-white text-xs\"\r\n [style.color]=\"previewTextColor()\"\r\n >\r\n {{ t(\"project-management-system\") }}\r\n </div>\r\n </div>\r\n }\r\n\r\n <div\r\n class=\"flex-shrink-0 max-[640px]:order-2 max-[640px]:w-full\"\r\n [class]=\"{\r\n 'order-1': previewFormPosition() === 'start',\r\n 'order-2': previewFormPosition() === 'end',\r\n 'mx-auto': previewFormPosition() === 'center',\r\n }\"\r\n >\r\n @if (previewFormPosition() === \"center\") {\r\n <div class=\"logo flex flex-col items-center gap-2 mb-4\">\r\n <img\r\n [src]=\"\r\n previewLogoSrc()\r\n ? (previewLogoSrc() | secureImage: true)\r\n : DEFAULT_DISPLAY_DATA()?.loginLogo\r\n \"\r\n alt=\"Logo\"\r\n class=\"h-8 sm:h-12 sm:w-12\"\r\n />\r\n <div\r\n class=\"text-center text-base text-white text-xs\"\r\n [style.color]=\"previewTextColor()\"\r\n >\r\n {{ t(\"portfolio-management-system\") }}\r\n </div>\r\n </div>\r\n }\r\n\r\n <div\r\n class=\"glass-card relative z-10 w-full max-w-[15rem] rounded-lg px-4 py-3 sm:w-60 sm:px-6\"\r\n [style.color]=\"previewTextColor()\"\r\n >\r\n <div class=\"text-center mb-3 mt-4\">\r\n <h4 class=\"text-[14px] font-bold mb-1\">{{ t(\"signin\") }}</h4>\r\n <p class=\"text-[8px]\">{{ t(\"info-msg\") }}</p>\r\n </div>\r\n\r\n <div class=\"space-y-3\">\r\n <div>\r\n <label class=\"text-[8px] block text-xs mb-1\">{{\r\n t(\"username\")\r\n }}</label>\r\n <div\r\n class=\"text-[8px] rounded px-3 py-2 bg-white/90 text-gray-600!\"\r\n >\r\n {{ t(\"username\") }}\r\n </div>\r\n </div>\r\n <div>\r\n <label class=\"text-[8px] block mb-1\">{{ t(\"password\") }}</label>\r\n <div\r\n class=\"text-[8px] rounded px-3 py-2 bg-white/90 text-gray-600!\"\r\n >\r\n {{ t(\"password\") }}\r\n </div>\r\n </div>\r\n <button\r\n class=\"w-full mb-1 bg-primary text-white rounded py-2 text-[9px] font-medium\"\r\n >\r\n {{ t(\"sign-in\") }}\r\n </button>\r\n <div class=\"text-center\">\r\n <a class=\"text-[11px] text-primary\"> English </a>\r\n </div>\r\n </div>\r\n\r\n <div class=\"text-center mt-3 text-[8px]\">\r\n {{ t(\"tagline\") }}\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</ng-container>\r\n", styles: ["@charset \"UTF-8\";.glass-card{background:#ffffff26;backdrop-filter:blur(24px) saturate(180%);-webkit-backdrop-filter:blur(24px) saturate(180%);box-shadow:0 8px 32px #0003}.glass-card{color:#fff}.glass-card *:not(input):not(button):not([class*=p-]){color:inherit!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: TranslocoDirective, selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoPrefix", "translocoLang", "translocoLoadingTpl"] }, { kind: "pipe", type: SecureImagePipe, name: "secureImage" }] });
|
|
972
1049
|
}
|
|
973
1050
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: PreviewLogin, decorators: [{
|
|
974
1051
|
type: Component,
|
|
975
|
-
args: [{ selector: 'mt-preview-login', standalone: true, imports: [CommonModule, TranslocoDirective, SecureImagePipe], template: "<ng-container *transloco=\"let t; prefix: '
|
|
1052
|
+
args: [{ selector: 'mt-preview-login', standalone: true, imports: [CommonModule, TranslocoDirective, SecureImagePipe], template: "<ng-container *transloco=\"let t; prefix: 'brand-display'\">\r\n <div class=\"xl:sticky xl:top-4\">\r\n <h3 class=\"text-sm font-medium mb-3\">{{ t(\"preview\") }}</h3>\r\n <div\r\n class=\"relative overflow-hidden rounded-lg aspect-[4/5] sm:aspect-[16/10]\"\r\n [style]=\"{\r\n 'background-color': previewBackgroundColor(),\r\n 'background-size': repeated() ? 'auto' : 'cover',\r\n 'background-repeat': repeated() ? 'repeat' : 'no-repeat',\r\n 'background-position': 'center',\r\n }\"\r\n [style.backgroundImage]=\"\r\n backgroundImage() ? (backgroundImage() | secureImage) : null\r\n \"\r\n >\r\n <div\r\n class=\"absolute inset-0 flex items-center p-4 max-[640px]:flex-col max-[640px]:justify-center max-[640px]:gap-4 sm:p-8\"\r\n >\r\n @if (previewFormPosition() !== \"center\") {\r\n <div\r\n class=\"logo flex min-w-0 mx-auto flex-col items-start gap-2 max-[640px]:order-1 max-[640px]:w-full max-[640px]:flex-none\"\r\n [class]=\"{\r\n 'order-2': previewFormPosition() === 'start',\r\n 'order-1': previewFormPosition() === 'end',\r\n }\"\r\n >\r\n <img\r\n [src]=\"\r\n previewLogoSrc()\r\n ? (previewLogoSrc() | secureImage: true)\r\n : DEFAULT_DISPLAY_DATA()?.loginLogo\r\n \"\r\n alt=\"Logo\"\r\n class=\"h-8 sm:h-12 sm:w-12\"\r\n />\r\n <div\r\n class=\"text-center text-base text-white text-xs\"\r\n [style.color]=\"previewTextColor()\"\r\n >\r\n {{ t(\"project-management-system\") }}\r\n </div>\r\n </div>\r\n }\r\n\r\n <div\r\n class=\"flex-shrink-0 max-[640px]:order-2 max-[640px]:w-full\"\r\n [class]=\"{\r\n 'order-1': previewFormPosition() === 'start',\r\n 'order-2': previewFormPosition() === 'end',\r\n 'mx-auto': previewFormPosition() === 'center',\r\n }\"\r\n >\r\n @if (previewFormPosition() === \"center\") {\r\n <div class=\"logo flex flex-col items-center gap-2 mb-4\">\r\n <img\r\n [src]=\"\r\n previewLogoSrc()\r\n ? (previewLogoSrc() | secureImage: true)\r\n : DEFAULT_DISPLAY_DATA()?.loginLogo\r\n \"\r\n alt=\"Logo\"\r\n class=\"h-8 sm:h-12 sm:w-12\"\r\n />\r\n <div\r\n class=\"text-center text-base text-white text-xs\"\r\n [style.color]=\"previewTextColor()\"\r\n >\r\n {{ t(\"portfolio-management-system\") }}\r\n </div>\r\n </div>\r\n }\r\n\r\n <div\r\n class=\"glass-card relative z-10 w-full max-w-[15rem] rounded-lg px-4 py-3 sm:w-60 sm:px-6\"\r\n [style.color]=\"previewTextColor()\"\r\n >\r\n <div class=\"text-center mb-3 mt-4\">\r\n <h4 class=\"text-[14px] font-bold mb-1\">{{ t(\"signin\") }}</h4>\r\n <p class=\"text-[8px]\">{{ t(\"info-msg\") }}</p>\r\n </div>\r\n\r\n <div class=\"space-y-3\">\r\n <div>\r\n <label class=\"text-[8px] block text-xs mb-1\">{{\r\n t(\"username\")\r\n }}</label>\r\n <div\r\n class=\"text-[8px] rounded px-3 py-2 bg-white/90 text-gray-600!\"\r\n >\r\n {{ t(\"username\") }}\r\n </div>\r\n </div>\r\n <div>\r\n <label class=\"text-[8px] block mb-1\">{{ t(\"password\") }}</label>\r\n <div\r\n class=\"text-[8px] rounded px-3 py-2 bg-white/90 text-gray-600!\"\r\n >\r\n {{ t(\"password\") }}\r\n </div>\r\n </div>\r\n <button\r\n class=\"w-full mb-1 bg-primary text-white rounded py-2 text-[9px] font-medium\"\r\n >\r\n {{ t(\"sign-in\") }}\r\n </button>\r\n <div class=\"text-center\">\r\n <a class=\"text-[11px] text-primary\"> English </a>\r\n </div>\r\n </div>\r\n\r\n <div class=\"text-center mt-3 text-[8px]\">\r\n {{ t(\"tagline\") }}\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</ng-container>\r\n", styles: ["@charset \"UTF-8\";.glass-card{background:#ffffff26;backdrop-filter:blur(24px) saturate(180%);-webkit-backdrop-filter:blur(24px) saturate(180%);box-shadow:0 8px 32px #0003}.glass-card{color:#fff}.glass-card *:not(input):not(button):not([class*=p-]){color:inherit!important}\n"] }]
|
|
976
1053
|
}] });
|
|
977
1054
|
|
|
978
1055
|
class LoginDisplay {
|
|
@@ -981,6 +1058,7 @@ class LoginDisplay {
|
|
|
981
1058
|
DEFAULT_DISPLAY_DATA = this.facade.defaultBrandDisplayData;
|
|
982
1059
|
loginFormControl = new FormControl({
|
|
983
1060
|
backgroundColor: this.DEFAULT_DISPLAY_DATA()?.login?.backgroundColor,
|
|
1061
|
+
textColor: this.DEFAULT_DISPLAY_DATA()?.login?.textColor,
|
|
984
1062
|
repeated: this.DEFAULT_DISPLAY_DATA()?.login?.repeated,
|
|
985
1063
|
formWizardPosition: this.DEFAULT_DISPLAY_DATA()?.login?.formWizardPosition,
|
|
986
1064
|
});
|
|
@@ -1011,6 +1089,13 @@ class LoginDisplay {
|
|
|
1011
1089
|
order: 3,
|
|
1012
1090
|
colSpan: 6,
|
|
1013
1091
|
},
|
|
1092
|
+
{
|
|
1093
|
+
key: 'textColor',
|
|
1094
|
+
type: 'color-picker',
|
|
1095
|
+
label: this.translocoService.translate('brand-display.text-color'),
|
|
1096
|
+
order: 4,
|
|
1097
|
+
colSpan: 6,
|
|
1098
|
+
},
|
|
1014
1099
|
new UploadFileFieldConfig({
|
|
1015
1100
|
key: 'backgroundImage',
|
|
1016
1101
|
label: this.translocoService.translate('brand-display.background-image'),
|
|
@@ -1101,9 +1186,95 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImpor
|
|
|
1101
1186
|
], template: "<ng-container *transloco=\"let t; prefix: 'brand-display'\">\r\n <div\r\n class=\"mt-6 grid min-h-0 gap-6 xl:grid-cols-[minmax(0,3fr)_minmax(20rem,2fr)] xl:gap-10\"\r\n >\r\n <!-- Left Side - Login Settings -->\r\n <div class=\"min-w-0\">\r\n <mt-card id=\"login-settings\" [title]=\"t('login-settings')\">\r\n <form class=\"col-span-1 p-2\">\r\n <mt-dynamic-form\r\n [formConfig]=\"loginFormConfig()\"\r\n [formControl]=\"loginFormControl\"\r\n />\r\n </form>\r\n </mt-card>\r\n </div>\r\n\r\n <!-- Right Side - Preview -->\r\n <div class=\"min-w-0 xl:sticky xl:top-4 xl:self-start\">\r\n <mt-preview-login></mt-preview-login>\r\n </div>\r\n </div>\r\n</ng-container>\r\n" }]
|
|
1102
1187
|
}], ctorParameters: () => [] });
|
|
1103
1188
|
|
|
1189
|
+
class PageLayoutDisplay {
|
|
1190
|
+
translocoService = inject(TranslocoService);
|
|
1191
|
+
facade = inject(BrandDisplayFacade);
|
|
1192
|
+
DEFAULT_DISPLAY_DATA = this.facade.defaultBrandDisplayData;
|
|
1193
|
+
brandDisplayData = this.facade.draftBrandDisplayData;
|
|
1194
|
+
pageLayoutFormControl = new FormControl({
|
|
1195
|
+
headerBackgroundColor: this.DEFAULT_DISPLAY_DATA()?.pageLayout?.headerBackgroundColor,
|
|
1196
|
+
headerTextColor: this.DEFAULT_DISPLAY_DATA()?.pageLayout?.headerTextColor,
|
|
1197
|
+
sidebarBackgroundColor: this.DEFAULT_DISPLAY_DATA()?.pageLayout?.sidebarBackgroundColor,
|
|
1198
|
+
sidebarTextColor: this.DEFAULT_DISPLAY_DATA()?.pageLayout?.sidebarTextColor,
|
|
1199
|
+
contentBackgroundColor: this.DEFAULT_DISPLAY_DATA()?.pageLayout?.contentBackgroundColor,
|
|
1200
|
+
});
|
|
1201
|
+
ngOnInit() {
|
|
1202
|
+
const localFormData = {
|
|
1203
|
+
...this.pageLayoutFormControl.value,
|
|
1204
|
+
...this.brandDisplayData()?.pageLayout,
|
|
1205
|
+
};
|
|
1206
|
+
this.pageLayoutFormControl.patchValue(localFormData, { emitEvent: false });
|
|
1207
|
+
this.pageLayoutFormControl.valueChanges.subscribe((value) => {
|
|
1208
|
+
this.facade.updateBrandDisplayDataLocally({
|
|
1209
|
+
pageLayout: {
|
|
1210
|
+
headerBackgroundColor: value.headerBackgroundColor,
|
|
1211
|
+
headerTextColor: value.headerTextColor,
|
|
1212
|
+
sidebarBackgroundColor: value.sidebarBackgroundColor,
|
|
1213
|
+
sidebarTextColor: value.sidebarTextColor,
|
|
1214
|
+
contentBackgroundColor: value.contentBackgroundColor,
|
|
1215
|
+
},
|
|
1216
|
+
});
|
|
1217
|
+
});
|
|
1218
|
+
}
|
|
1219
|
+
pageLayoutConfig = signal({
|
|
1220
|
+
sections: [
|
|
1221
|
+
{
|
|
1222
|
+
key: 'pageLayoutSection',
|
|
1223
|
+
label: '',
|
|
1224
|
+
type: 'none',
|
|
1225
|
+
order: 1,
|
|
1226
|
+
fields: [
|
|
1227
|
+
new ColorPickerFieldConfig({
|
|
1228
|
+
key: 'headerBackgroundColor',
|
|
1229
|
+
label: this.translocoService.translate('brand-display.header-background-color'),
|
|
1230
|
+
order: 3,
|
|
1231
|
+
colSpan: 6,
|
|
1232
|
+
}),
|
|
1233
|
+
new ColorPickerFieldConfig({
|
|
1234
|
+
key: 'headerTextColor',
|
|
1235
|
+
label: this.translocoService.translate('brand-display.header-text-color'),
|
|
1236
|
+
order: 4,
|
|
1237
|
+
colSpan: 6,
|
|
1238
|
+
}),
|
|
1239
|
+
new ColorPickerFieldConfig({
|
|
1240
|
+
key: 'sidebarBackgroundColor',
|
|
1241
|
+
label: this.translocoService.translate('brand-display.side-bar-background-color'),
|
|
1242
|
+
order: 1,
|
|
1243
|
+
colSpan: 6,
|
|
1244
|
+
}),
|
|
1245
|
+
new ColorPickerFieldConfig({
|
|
1246
|
+
key: 'sidebarTextColor',
|
|
1247
|
+
label: this.translocoService.translate('brand-display.side-bar-text-color'),
|
|
1248
|
+
order: 2,
|
|
1249
|
+
colSpan: 6,
|
|
1250
|
+
}),
|
|
1251
|
+
new ColorPickerFieldConfig({
|
|
1252
|
+
key: 'contentBackgroundColor',
|
|
1253
|
+
label: this.translocoService.translate('brand-display.content-background-color'),
|
|
1254
|
+
order: 5,
|
|
1255
|
+
colSpan: 6,
|
|
1256
|
+
}),
|
|
1257
|
+
],
|
|
1258
|
+
},
|
|
1259
|
+
],
|
|
1260
|
+
}, ...(ngDevMode ? [{ debugName: "pageLayoutConfig" }] : /* istanbul ignore next */ []));
|
|
1261
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: PageLayoutDisplay, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1262
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.8", type: PageLayoutDisplay, isStandalone: true, selector: "mt-page-layout-display", ngImport: i0, template: "<ng-container *transloco=\"let t; prefix: 'brand-display'\">\r\n <mt-card id=\"page-layout\" [title]=\"t('page-layout')\">\r\n <form class=\"col-span-1 p-2\">\r\n <mt-dynamic-form\r\n [formConfig]=\"pageLayoutConfig()\"\r\n [formControl]=\"pageLayoutFormControl\"\r\n />\r\n </form>\r\n </mt-card>\r\n</ng-container>\r\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: Card, selector: "mt-card", inputs: ["class", "title", "paddingless"] }, { kind: "directive", type: TranslocoDirective, selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoPrefix", "translocoLang", "translocoLoadingTpl"] }, { kind: "component", type: DynamicForm, selector: "mt-dynamic-form", inputs: ["formConfig", "forcedHiddenFieldKeys", "preserveForcedHiddenValues", "visibleSectionKeys"], outputs: ["runtimeMessagesChange"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] });
|
|
1263
|
+
}
|
|
1264
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: PageLayoutDisplay, decorators: [{
|
|
1265
|
+
type: Component,
|
|
1266
|
+
args: [{ selector: 'mt-page-layout-display', standalone: true, imports: [
|
|
1267
|
+
CommonModule,
|
|
1268
|
+
Card,
|
|
1269
|
+
TranslocoDirective,
|
|
1270
|
+
DynamicForm,
|
|
1271
|
+
ReactiveFormsModule,
|
|
1272
|
+
], template: "<ng-container *transloco=\"let t; prefix: 'brand-display'\">\r\n <mt-card id=\"page-layout\" [title]=\"t('page-layout')\">\r\n <form class=\"col-span-1 p-2\">\r\n <mt-dynamic-form\r\n [formConfig]=\"pageLayoutConfig()\"\r\n [formControl]=\"pageLayoutFormControl\"\r\n />\r\n </form>\r\n </mt-card>\r\n</ng-container>\r\n" }]
|
|
1273
|
+
}] });
|
|
1274
|
+
|
|
1104
1275
|
/**
|
|
1105
1276
|
* Generated bundle index. Do not edit.
|
|
1106
1277
|
*/
|
|
1107
1278
|
|
|
1108
|
-
export { BrandDisplay, BrandDisplayActionKey, BrandDisplayFacade, BrandDisplayState, ContentArea, FaviconService, GetBrandDisplay, HeaderSidebarDisplay, LoginDisplay, MainDisplay, ManageBrndingService, PreviewBrand, PreviewLogin, UpdateBrandDisplayData, UpdateBrandDisplayDataLocally, WhiteLabel };
|
|
1279
|
+
export { BrandDisplay, BrandDisplayActionKey, BrandDisplayFacade, BrandDisplayState, ContentArea, FaviconService, GetBrandDisplay, HeaderSidebarDisplay, LoginDisplay, MainDisplay, ManageBrndingService, PageLayoutDisplay, PreviewBrand, PreviewLayoutPage, PreviewLogin, UpdateBrandDisplayData, UpdateBrandDisplayDataLocally, WhiteLabel };
|
|
1109
1280
|
//# sourceMappingURL=masterteam-brand-display.mjs.map
|