@vuu-ui/vuu-shell 0.8.32 → 0.8.34

package/cjs/app-header/AppHeader.css

@@ -0,0 +1,24 @@
+.vuuAppHeader {
+  --saltButton-borderRadius: 6px;
+  --saltButton-text-color: var(--vuu-color-gray-50);
+  --saltButton-padding: 12px;
+  --vuuToolbarItem-height: 26px;
+  --vuuOverflowContainer-gap: 8px;
+  --vuu-icon-color: var(--vuu-color-gray-45);
+  --vuu-icon-size: 16px;
+  --vuuToolbar-background: var(--vuuAppHeader-background, var(--vuu-color-gray-28));
+  --vuuToolbar-borderWidth: 1px;
+  --vuuToolbar-borderStyle: solid; 
+  --vuuToolbar-borderColor: var(--vuu-color-gray-30);
+
+  align-items: center;
+  display: flex;
+  justify-content: flex-end;
+}
+
+.vuu-theme .vuuAppHeader {
+  border-radius: 8px;
+   
+  margin-bottom: 8px;
+}
+

package/cjs/connection-status/ConnectionStatusIcon.css

@@ -0,0 +1,68 @@
+.vuuStatus-container {
+	display: flex;
+}
+
+.vuuStatus-text {
+	align-self: center;
+}
+
+
+.vuuStatus {
+	--vuu-icon-height: 18px;
+	--vuu-icon-padding: var(--vuuStatus-padding, 6px);
+	--vuu-icon-width: var(--vuuStatus-width, auto);
+	--vuu-icon-min-width: var(--vuuStatus-min-width, 20px);
+	align-items: center;
+	display: inline-flex;
+	height: var(--vuu-icon-height);
+	justify-content: center;
+	min-width: var(--vuu-icon-min-width);
+	padding: 0 var(--vuu-icon-padding);
+	width: var(--vuu-icon-width);
+	position: relative;
+}
+
+.vuuStatus[data-icon]::after {
+	inset: 0 0 0 0;
+	content: '';
+	box-shadow: 0 0 0 0 black;
+	position: absolute;
+	mask: var(--vuu-icon-svg) center center/20px 20px no-repeat;
+	-webkit-mask: var(--vuu-icon-svg) center center/20px 20px no-repeat;
+}
+
+.vuuActiveStatus::after {
+	--vuu-icon-svg: var(--svg-active-status);
+	background-color: rgb(0, 255, 0);
+}
+
+.vuuConnectingStatus::after {
+	--vuu-icon-svg: var(--svg-connecting-status);
+	background-color: orange;
+	transform: scale(1);
+	animation: infinite pulse 1s;
+}
+
+.vuuDisconnectedStatus::after {
+	--vuu-icon-svg: var(--svg-disconnected-status);
+	background-color: red;
+	transform: scale(1);
+	animation: infinite pulse 0.5s;
+}
+
+@keyframes pulse {
+	0% {
+		transform: scale(0.95);
+		box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.7);
+	}
+
+	70% {
+		transform: scale(1);
+		box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
+	}
+
+	100% {
+		transform: scale(0.95);
+		box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
+	}
+}

package/cjs/feature-list/FeatureList.css

@@ -0,0 +1,21 @@
+.vuuFeatureList {
+    background: var(--vuuFeatureList-background, var(--salt-container-primary-background));
+    display: flex;
+    flex-direction: column;
+    height: 100%;
+    padding: 195px 32px 16px 24px;
+}
+
+.vuuFeatureList-header {
+    flex: 0 0 40px;
+    font-size: 12px;
+    font-weight: 700;
+    line-height: 2;
+}
+
+.vuuFeatureList-content {
+    flex: 1 1 auto;
+    font-size: 12px;
+    font-weight: 700;
+}
+

package/cjs/layout-management/LayoutList.css

@@ -0,0 +1,86 @@
+.vuuLayoutList {
+    --vuuLayoutList-width: 90%;
+    --vuuMeasuredContainer-flex: 1 1 1px;
+    align-self: stretch;
+    display: flex;
+    flex-direction: column;
+    height: 100%;
+    overflow: hidden;
+    padding-right: 6px;
+
+    /* compatible with Chrome, Edge, and Safari */
+    ::-webkit-scrollbar {
+        width: 4px;
+        height: 4px;
+    }
+
+    ::-webkit-scrollbar-track {
+        background: transparent;
+        margin-top: 15px;
+        margin-bottom: 15px;
+    }
+
+    ::-webkit-scrollbar-thumb {
+        border-radius: 4px;
+        background: #D9D9D9;
+    }
+}
+
+.vuuLayoutList-header {
+    display: flex;
+    flex: 0 0 47px;
+    width: var(--vuuLayoutList-width);
+    padding: 16px 0;
+    border-bottom: 1px solid rgba(119, 124, 148, 0.10);
+    color: var(--light-text-primary, #15171B);
+    font-weight: 700;
+    letter-spacing: 0.48px;
+    line-height: 200%;
+    text-transform: uppercase;
+}
+
+.vuuLayoutList-groupName {
+    display: flex;
+    padding-top: 24px;
+    width: var(--vuuLayoutList-width);
+    color: var(--light-text-secondary, #606477);
+    font-feature-settings: 'ss02' on, 'ss01' on, 'salt' on, 'liga' off;
+    font-family: Nunito Sans;
+    font-size: 12px;
+    font-style: normal;
+    font-weight: 700;
+    line-height: 200%;
+    letter-spacing: 0.48px;
+    text-transform: uppercase;
+}
+
+.vuuLayoutList-layoutContainer {
+    display: flex;
+    align-items: center;
+    width: 90%;
+    height: auto;
+    gap: 8px;
+    padding: 8px 0;
+    flex: 1 1 auto;
+    cursor: pointer;
+}
+
+.vuuLayoutList-layoutName {
+    color: var(--light-text-primary, #15171B);
+    font-weight: 600;
+    line-height: 133.333%;
+    text-transform: capitalize;
+}
+
+.vuuLayoutList-screenshot {
+    width: 60px;
+    height: 45.6px;
+    border: 1px solid #D6D7DA;
+}
+
+.vuuLayoutList-layoutDetails {
+    color: var(--light-text-secondary, #606477);
+    font-size: 10px;
+    font-weight: 600;
+    line-height: 150%;
+}

package/cjs/layout-management/LayoutTile.css

@@ -0,0 +1,28 @@
+.vuuLayoutTile-layoutTile {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  padding: 8px 0px;
+  flex: 1 1 auto;
+  cursor: pointer;
+}
+
+.vuuLayoutTile-layoutName {
+  color: var(--light-text-primary, #15171B);
+  font-weight: 600;
+  line-height: 133.333%;
+  text-transform: capitalize;
+}
+
+.vuuLayoutTile-screenshot {
+  width: 60px;
+  height: 45.6px;
+  border: 1px solid #D6D7DA;
+}
+
+.vuuLayoutTile-layoutDetails {
+  color: var(--light-text-secondary, #606477);
+  font-size: 10px;
+  font-weight: 600;
+  line-height: 150%;
+}

package/cjs/layout-management/SaveLayoutPanel.css

@@ -0,0 +1,130 @@
+.saveLayoutPanel {
+  --salt-selectable-foreground-hover: #6d18bdc3;
+  --salt-selectable-foreground-selected: #6D18BD;
+  --salt-selectable-borderColor-selected: #6D18BD;
+  --saltInputLegacy-fontSize: 12px;
+  --salt-text-label-fontSize: 10px;
+  --saltFormFieldLegacy-label-paddingLeft: 0;
+  --saltFormField-label-fontWeight: 400;
+  --saltText-color: var(--text-secondary-foreground, #606477);
+}
+
+.spinner{
+  width: 100px;
+  height:100px;
+  background-image: var(--svg-spinner);
+}
+
+.saveLayoutPanel-panelContainer {
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+}
+
+.saveLayoutPanel-panelContent {
+  display: flex;
+  align-items: flex-start;
+  gap: 32px;
+}
+
+.saveLayoutPanel-formContainer {
+  display: flex;
+  width: 217px;
+  flex-direction: column;
+  align-items: flex-start;
+  gap: 16px;
+}
+
+.saveLayoutPanel-formField {
+  display: flex;
+  flex-direction: column;
+  gap: 1px;
+}
+
+.saveLayoutPanel-inputText {
+  border: none;
+  color: var(--light-text-primary, #15171B);
+  font-family: Nunito Sans A-Variant, serif;
+  font-feature-settings: 'ss02' on, 'ss01' on, 'salt' on, 'liga' off;
+  font-size: 12px;
+  font-weight: 400;
+  line-height: 16px;
+  padding-left: 4px;
+  width: 100%;
+  outline: none;
+}
+
+.saveLayoutPanel-settingsGroup {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: flex-end;
+  gap: 10px;
+  width: 100%;
+  line-height: 16px;
+}
+
+.saveLayoutPanel-screenshotContainer {
+  display: flex;
+  width: 304px;
+  height: 208px;
+  padding: 11px 15.5px;
+  justify-content: center;
+  align-items: center;
+  border: 1px solid #E8E8E8;
+  background: var(--dark-text-primary, #FFF);
+}
+
+.saveLayoutPanel-screenshot {
+  background: lightgray 50% / cover no-repeat;
+  width: 273px;
+  height: 186px;
+}
+
+.saveLayoutPanel-buttonsContainer {
+  display: flex;
+  justify-content: flex-end;
+  align-items: flex-start;
+  align-self: stretch;
+  padding-top: 24px;
+  gap: 8px;
+}
+
+.saveLayoutPanel-cancelButton,
+.saveLayoutPanel-saveButton {
+  display: flex;
+  height: fit-content;
+  padding: 4px 8px;
+  align-items: flex-start;
+  gap: 8px;
+  border-radius: 6px;
+  font-size: 12px;
+  font-style: normal;
+  font-weight: 700;
+  line-height: 133.333%;
+  letter-spacing: 0.48px;
+  text-transform: uppercase;
+}
+
+.saveLayoutPanel-cancelButton {
+  color: var(--actionable-primary-foreground-default, #606477);
+  background: var(--actionable-primary-background-default, #FFF);
+}
+
+.saveLayoutPanel-saveButton {
+  background: #6D18BD;
+  border-color: #6D18BD;
+  color: white;
+}
+
+.saveLayoutPanel-saveButton.saltButton:disabled {
+  background: #6D18BD;
+  border-color: #6D18BD;
+  color: white;
+  opacity: 0.3;
+}
+
+.saveLayoutPanel-saveButton.saltButton:hover {
+  background: #F37880;
+  border-color: #F37880;
+  color: white;
+}

package/cjs/left-nav/LeftNav.css

@@ -0,0 +1,178 @@
+.vuuLeftNav {
+    --vuuOverflowContainer-height: auto;
+    --salt-navigable-fontWeight-active: 700;
+    --vuuTab-background-selected: rgba(255, 255, 255, 0.10);
+    --vuuTab-hover-background: rgba(255, 255, 255, 0.10);
+    --vuuTab-before-content: none;
+    --vuuTab-borderRadius: 6px;
+    --vuuTab-height: 40px;
+    --vuuTabstrip-fontWeight: 700;
+    --vuuTabstrip-width: 100%;
+    --svg-demo: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="M11.3333 11C11.52 11 11.6667 10.8533 11.6667 10.6667C11.6667 10.48 11.52 10.3333 11.3333 10.3333C11.1467 10.3333 11 10.48 11 10.6667C11 10.8533 11.1467 11 11.3333 11Z"/><path d="M5.99999 8.66667C6.36818 8.66667 6.66666 8.36819 6.66666 8C6.66666 7.63181 6.36818 7.33334 5.99999 7.33334C5.63181 7.33334 5.33333 7.63181 5.33333 8C5.33333 8.36819 5.63181 8.66667 5.99999 8.66667Z"/><path d="M8.66667 6C9.03486 6 9.33333 5.70152 9.33333 5.33333C9.33333 4.96514 9.03486 4.66667 8.66667 4.66667C8.29848 4.66667 8 4.96514 8 5.33333C8 5.70152 8.29848 6 8.66667 6Z"/><path d="M8.66667 11.3333C9.03486 11.3333 9.33333 11.0349 9.33333 10.6667C9.33333 10.2985 9.03486 10 8.66667 10C8.29848 10 8 10.2985 8 10.6667C8 11.0349 8.29848 11.3333 8.66667 11.3333Z"/><path d="M11.3333 8.33333C11.52 8.33333 11.6667 8.18666 11.6667 8C11.6667 7.81333 11.52 7.66666 11.3333 7.66666C11.1467 7.66666 11 7.81333 11 8C11 8.18666 11.1467 8.33333 11.3333 8.33333Z"/><path d="M8.66667 8.66667C9.03486 8.66667 9.33333 8.36819 9.33333 8C9.33333 7.63181 9.03486 7.33334 8.66667 7.33334C8.29848 7.33334 8 7.63181 8 8C8 8.36819 8.29848 8.66667 8.66667 8.66667Z"/><path d="M2 2H14V3.33333H2V2Z"/><path d="M3.33333 6.33333C3.88561 6.33333 4.33333 5.88562 4.33333 5.33333C4.33333 4.78105 3.88561 4.33333 3.33333 4.33333C2.78104 4.33333 2.33333 4.78105 2.33333 5.33333C2.33333 5.88562 2.78104 6.33333 3.33333 6.33333Z"/><path d="M3.33333 9C3.88561 9 4.33333 8.55228 4.33333 8C4.33333 7.44772 3.88561 7 3.33333 7C2.78104 7 2.33333 7.44772 2.33333 8C2.33333 8.55228 2.78104 9 3.33333 9Z"/><path d="M3.33333 11.6667C3.88561 11.6667 4.33333 11.2189 4.33333 10.6667C4.33333 10.1144 3.88561 9.66666 3.33333 9.66666C2.78104 9.66666 2.33333 10.1144 2.33333 10.6667C2.33333 11.2189 2.78104 11.6667 3.33333 11.6667Z"/><path d="M11.3333 5.66667C11.52 5.66667 11.6667 5.52 11.6667 5.33333C11.6667 5.14667 11.52 5 11.3333 5C11.1467 5 11 5.14667 11 5.33333C11 5.52 11.1467 5.66667 11.3333 5.66667Z"/><path d="M5.99999 11.3333C6.36818 11.3333 6.66666 11.0349 6.66666 10.6667C6.66666 10.2985 6.36818 10 5.99999 10C5.63181 10 5.33333 10.2985 5.33333 10.6667C5.33333 11.0349 5.63181 11.3333 5.99999 11.3333Z"/><path d="M5.99999 6C6.36818 6 6.66666 5.70152 6.66666 5.33333C6.66666 4.96514 6.36818 4.66667 5.99999 4.66667C5.63181 4.66667 5.33333 4.96514 5.33333 5.33333C5.33333 5.70152 5.63181 6 5.99999 6Z"/><path d="M2 12.6667H14V14H2V12.6667Z"/></svg>');
+    --svg-features: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="M15.3333 12.6667H14L14 3.33334H15.3333L15.3333 12.6667ZM12.6667 12.6667H11.3333L11.3333 3.33334H12.6667L12.6667 12.6667ZM1.33333 12.6667L9.33333 12.6667C9.69999 12.6667 9.99999 12.3667 9.99999 12V4.00001C9.99999 3.63334 9.69999 3.33334 9.33333 3.33334L1.33333 3.33334C0.966661 3.33334 0.666661 3.63334 0.666661 4.00001L0.666661 12C0.666661 12.3667 0.966661 12.6667 1.33333 12.6667ZM1.99999 4.66667L8.66666 4.66667V11.3333L1.99999 11.3333L1.99999 4.66667Z"/></svg>');
+    --svg-tables: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="M2 6H4.66667V3.33334H3.33333C2.6 3.33334 2 3.93334 2 4.66667V6ZM2 9.33334H4.66667V6.66667H2V9.33334ZM5.33333 9.33334H8V6.66667H5.33333V9.33334ZM8.66667 9.33334H11.3333V6.66667H8.66667V9.33334ZM5.33333 6H8V3.33334H5.33333V6ZM8.66667 3.33334V6H11.3333V3.33334H8.66667ZM12 9.33334H14.6667V6.66667H12V9.33334ZM3.33333 12.6667H4.66667V10H2V11.3333C2 12.0667 2.6 12.6667 3.33333 12.6667ZM5.33333 12.6667H8V10H5.33333V12.6667ZM8.66667 12.6667H11.3333V10H8.66667V12.6667ZM12 12.6667H13.3333C14.0667 12.6667 14.6667 12.0667 14.6667 11.3333V10H12V12.6667ZM12 3.33334V6H14.6667V4.66667C14.6667 3.93334 14.0667 3.33334 13.3333 3.33334H12Z"/></svg>');
+    --svg-layouts: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="M15.3333 10H14V11.3333H15.3333V10ZM15.3333 12.6667H14V14H15.3333V12.6667ZM15.3333 7.33333H14V8.66667H15.3333V7.33333ZM10 2H8.66667V3.33333H10V2ZM15.3333 4.66667H14V6H15.3333V4.66667ZM0.666672 14H7.33334V10H0.666672V14ZM2.00001 4.66667H0.666672V6H2.00001V4.66667ZM10 12.6667H8.66667V14H10V12.6667ZM12.6667 2H11.3333V3.33333H12.6667V2ZM15.3333 2H14V3.33333H15.3333V2ZM12.6667 12.6667H11.3333V14H12.6667V12.6667ZM2.00001 7.33333H0.666672V8.66667H2.00001V7.33333ZM7.33334 2H6.00001V3.33333H7.33334V2ZM4.66667 2H3.33334V3.33333H4.66667V2ZM2.00001 2H0.666672V3.33333H2.00001V2Z"/></svg>');
+    --vuu-light-text-primary: #15171b;
+
+    --menu-level-2-width: 0px;
+
+    box-shadow: 3px 4px 4px 0 rgba(0, 0, 0, 0.15);
+    display: flex;
+    height: calc(100% - 4px);
+    margin-bottom: 4px;
+    overflow: hidden;
+    position: relative;
+    transition: width .2s ease-out;
+    z-index: 0;
+    /* width: calc(var(--menu-width) + var(--menu-level-2-width)); */
+    /* width: 100%; */
+
+}
+
+.vuuLeftNav-menu-full {
+    --menu-width: var(--nav-menu-expanded-width);
+}
+
+.vuuLeftNav-menu-icons {
+    --menu-width: var(--nav-menu-collapsed-width);
+}
+
+.vuuLeftNav-menu-icons-content {
+    --menu-width: var(--nav-menu-collapsed-width);
+    --menu-level-2-width: var(--nav-menu-content-width);
+}
+
+.vuuLeftNav-menu-full-content {
+    --menu-width: var(--nav-menu-expanded-width);
+    --menu-level-2-width: var(--nav-menu-content-width);
+}
+
+.vuuLeftNav-menu-icons-content .vuuLeftNav-menu-secondary,
+.vuuLeftNav-menu-full-content .vuuLeftNav-menu-secondary {
+    display: flex;
+}
+
+.vuuLeftNav-menu-primary {
+    background-color: #2A015F;
+    container-type: inline-size;
+    display: flex;
+    flex-direction: column;
+    height: 100%;
+    padding: 32px 16px;
+    transition: flex-basis ease-out .2s;
+    flex-grow:0;
+    flex-shrink:0;
+    flex-basis: var(--menu-width);
+}
+
+.vuuLeftNav-menu-secondary {
+    flex: 1 1 auto;
+    display: none;
+    /* position: absolute; */
+    top:0;
+    right: 0;
+    flex-grow:0;
+    flex-shrink:0;
+    flex-basis: var(--nav-menu-content-width, 240px);
+    z-index: -1;
+}
+
+.vuuLeftNav .vuuTabstrip {
+    margin-top: 102px;
+}
+
+.vuuLeftNav .vuuTab {
+    --vuuTab-focusVisible-color: pink;
+    --vuu-icon-color: white;
+    --vuu-icon-left: 12px;
+    --vuu-icon-size: 16px;
+    border-left: solid 4px transparent;
+    padding: 0 0 0 48px;
+
+}
+
+.vuuLeftNav .vuuTab-selected {
+    --vuu-icon-color: var(--salt-navigable-indicator-active);
+    border-left: solid 4px var(--salt-navigable-indicator-active);
+}
+
+.vuuLeftNav-logo {
+    display: flex;
+    flex: 0 0 auto;
+    justify-content: center;
+}
+
+.vuuLeftNav-main {
+    flex: 1 1 auto;
+}
+
+.vuuLeftNav-menu {
+    color: white;
+    margin-top: 102px;
+    padding: 0;
+}
+
+
+.vuuLeftNav [data-icon='demo'] {
+    --vuu-icon-svg: var(--svg-demo);
+}
+
+.vuuLeftNav [data-icon='tables'] {
+    --vuu-icon-svg: var(--svg-tables);
+}
+
+.vuuLeftNav [data-icon='features'] {
+    --vuu-icon-svg: var(--svg-features);
+}
+
+.vuuLeftNav [data-icon='layouts'] {
+    --vuu-icon-svg: var(--svg-layouts);
+}
+
+
+@container (max-width: 100px) {
+    .vuuTab {
+        /* --vuu-icon-left: 12px !important; */
+        --vuuTab-padding: 0 0 0 42px;
+    }
+
+    .vuuTab-main {
+        display: none !important;
+    }
+}
+
+.vuuLeftNav-buttonBar {
+    align-items: center;
+    display: flex;
+    flex: 0 0 100px;
+    justify-content: center;
+}
+
+.vuuLeftNav-toggleButton {
+    --vuu-icon-color: var(--vuu-light-text-primary);
+    --vuu-icon-left: 11px;
+    --vuu-icon-top: 10px;
+    --vuu-icon-size: 16px;
+    background-color: var(--salt-navigable-indicator-active);
+    border-width: 0;
+    border-radius: 18px;
+    height: 36px;
+    position: relative;
+    width: 36px
+}
+
+.vuuLeftNav-toggleButton-open {
+    --vuu-icon-left: 9px;
+}
+
+.vuuLeftNav-drawer {
+    display: flex;
+    padding: 0 0 0 24px;
+    flex-direction: column;
+    align-items: flex-start;
+    flex-shrink: 0;
+    align-self: stretch;
+    background: #FFF;
+    box-shadow: 3px 4px 4px 0 rgba(0, 0, 0, 0.15);
+    height: 100%
+}

package/cjs/login/LoginPanel.css

@@ -0,0 +1,70 @@
+.vuuLoginPanel {
+  --saltInput-paddingLeft: 8px;
+  --login-width: 856px;
+  --login-height: 550px;
+  --hwTextInput-border: solid 1px #ccc;
+  --hwTextInput-height: 28px;
+  --hwTextInput-padding: 0 12px;
+  --hwTextInput-width: 100%;
+  --login-row-height: 60px;
+  border-radius: 16px;
+  box-shadow: 0px 24px 44px 0px rgba(0, 0, 0, 0.25);
+  display: flex;
+  height: var(--login-height);
+  margin: 0 auto;
+  width: var(--login-width);
+}
+
+.vuuLoginPanel .saltInput-primary {
+--saltInput-height: 36px;
+}
+
+.vuuLoginPanel-title {
+  justify-content: center;
+font-size: 28px;
+font-weight: 400;
+display: flex;
+}
+
+
+.vuuLoginPanel-branding {
+  align-items: center;
+  background-color: var(--vuu-color-purple-50);
+  border-radius: 16px 0 0 16px;
+  display: flex;
+  flex: 0 0 368px;
+  flex-direction: column;
+  gap: 40px;
+  justify-content: center;
+  padding: 40px 100px;
+}
+
+.vuuLoginPanel-form {
+  background-color: white;
+  border-radius: 0 16px 16px 0px;
+  display: flex;
+  flex: 1 1 auto;
+  flex-direction: column;
+  gap: 32px;
+  justify-content: center;
+  padding: 0 40px;
+}
+
+.vuuLoginPanel-password {
+  --vuu-icon-size: 16px;
+}
+
+.vuuLoginPanel-appName {
+  color: white;
+  font-size: 18px;
+  font-weight: 700;
+  text-transform: uppercase;
+}
+
+.vuuLoginPanel-login {
+  --saltButton-height: 36px;
+  --saltButton-borderRadius: 6px;
+  width: 100%
+}
+
+

package/cjs/node_modules/html-to-image/es/apply-style.js

@@ -0,0 +1,24 @@
+'use strict';
+
+function applyStyle(node, options) {
+    const { style } = node;
+    if (options.backgroundColor) {
+        style.backgroundColor = options.backgroundColor;
+    }
+    if (options.width) {
+        style.width = `${options.width}px`;
+    }
+    if (options.height) {
+        style.height = `${options.height}px`;
+    }
+    const manual = options.style;
+    if (manual != null) {
+        Object.keys(manual).forEach((key) => {
+            style[key] = manual[key];
+        });
+    }
+    return node;
+}
+
+exports.applyStyle = applyStyle;
+//# sourceMappingURL=apply-style.js.map

package/cjs/node_modules/html-to-image/es/apply-style.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"apply-style.js","sources":["../../../../../../node_modules/html-to-image/es/apply-style.js"],"sourcesContent":["export function applyStyle(node, options) {\n    const { style } = node;\n    if (options.backgroundColor) {\n        style.backgroundColor = options.backgroundColor;\n    }\n    if (options.width) {\n        style.width = `${options.width}px`;\n    }\n    if (options.height) {\n        style.height = `${options.height}px`;\n    }\n    const manual = options.style;\n    if (manual != null) {\n        Object.keys(manual).forEach((key) => {\n            style[key] = manual[key];\n        });\n    }\n    return node;\n}\n//# sourceMappingURL=apply-style.js.map"],"names":[],"mappings":";;AAAO,SAAS,UAAU,CAAC,IAAI,EAAE,OAAO,EAAE;AAC1C,IAAI,MAAM,EAAE,KAAK,EAAE,GAAG,IAAI,CAAC;AAC3B,IAAI,IAAI,OAAO,CAAC,eAAe,EAAE;AACjC,QAAQ,KAAK,CAAC,eAAe,GAAG,OAAO,CAAC,eAAe,CAAC;AACxD,KAAK;AACL,IAAI,IAAI,OAAO,CAAC,KAAK,EAAE;AACvB,QAAQ,KAAK,CAAC,KAAK,GAAG,CAAC,EAAE,OAAO,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC;AAC3C,KAAK;AACL,IAAI,IAAI,OAAO,CAAC,MAAM,EAAE;AACxB,QAAQ,KAAK,CAAC,MAAM,GAAG,CAAC,EAAE,OAAO,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC;AAC7C,KAAK;AACL,IAAI,MAAM,MAAM,GAAG,OAAO,CAAC,KAAK,CAAC;AACjC,IAAI,IAAI,MAAM,IAAI,IAAI,EAAE;AACxB,QAAQ,MAAM,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,OAAO,CAAC,CAAC,GAAG,KAAK;AAC7C,YAAY,KAAK,CAAC,GAAG,CAAC,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC;AACrC,SAAS,CAAC,CAAC;AACX,KAAK;AACL,IAAI,OAAO,IAAI,CAAC;AAChB;;;;","x_google_ignoreList":[0]}