npm - @things-factory/operato-wms - Versions diffs - 7.0.0-alpha.9 → 7.0.0 - Mend

@things-factory/operato-wms 7.0.0-alpha.9 → 7.0.0

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.

Files changed (371) hide show

package/_index.html CHANGED Viewed

@@ -1,4 +1,4 @@
-<!DOCTYPE html>
+<!doctype html>
 <html lang="en">
   <head>
     <meta charset="utf-8" />
@@ -52,6 +52,10 @@
     <!-- Performance tip: hint to the browser to start the handshake for the fonts site -->
     <link rel="preconnect" href="https://fonts.gstatic.com/" crossorigin />
     <link href="/node_modules/@material-design-icons/font/index.css" rel="stylesheet" />
+    <link href="/node_modules/material-symbols/index.css" rel="stylesheet" />
+    <link href="/node_modules/@fontsource/roboto/index.css" rel="stylesheet" />
+    <link rel="stylesheet" href="/theme.css" />
     <style>
       body {
         margin: 0;
@@ -65,7 +69,8 @@
         line-height: 1.5;
         -webkit-font-smoothing: antialiased;
-        accent-color: var(--primary-color);
+        accent-color: var(--md-sys-color-primary);
+        background-color: var(--md-sys-color-background);
       }
     </style>
@@ -89,7 +94,7 @@
       }
     </script>
   </head>
-  <body>
+  <body class="light">
     <things-app></things-app>
     <noscript> Please enable JavaScript to view this website. </noscript>
     <!-- Load webcomponents-loader.js to check and load any polyfills your browser needs -->

package/client/apptools/dashboard-tool.js CHANGED Viewed

@@ -3,7 +3,7 @@ import { connect } from 'pwa-helpers/connect-mixin.js'
 import '@material/mwc-icon'
-import { navigate, store } from '@things-factory/shell'
+import { navigate, store } from '@operato/shell'
 export class DashboardTool extends connect(store)(LitElement) {
   static get properties() {

package/client/bootstrap.js CHANGED Viewed

@@ -1,5 +1,6 @@
 import '@things-factory/barcode-base'
 import '@things-factory/notification'
+import '@things-factory/setting-ui/dist-client' /* theme-mode-setting-let */
 import '@things-factory/system'
 import '@operato/i18n/ox-i18n.js'
@@ -7,21 +8,21 @@ import gql from 'graphql-tag'
 import { html } from 'lit'
 import { setupMenuPart } from '@things-factory/meta-ui'
-import { ADD_MORENDA } from '@things-factory/more-base'
+import { ADD_MORENDA } from '@things-factory/more-base/client'
 import { registerDefaultGroups } from '@operato/board/register-default-groups.js'
-import { APPEND_APP_TOOL } from '@things-factory/apptool-base'
-import { setupAppToolPart } from '@things-factory/apptool-ui'
+import { APPEND_APP_TOOL } from '@things-factory/apptool-base/client'
+import { setupAppToolPart } from '@things-factory/apptool-ui/dist-client'
 import { auth } from '@things-factory/auth-base/dist-client'
-import { setAuthManagementMenus } from '@things-factory/auth-ui'
-import { setupContextUIPart } from '@things-factory/context-ui'
-import { i18next } from '@things-factory/i18n-base'
+import { setAuthManagementMenus } from '@things-factory/auth-ui/dist-client'
+import { setupContextUIPart } from '@things-factory/context-ui/dist-client'
+import { i18next } from '@operato/i18n'
 import { appendViewpart, openPopup, toggleOverlay, TOOL_POSITION, VIEWPART_POSITION } from '@operato/layout'
 import { updateMenuProvider } from '@things-factory/menu-base'
 import { USE_ROLE_BY_MENUS_MANAGEMENT } from '@things-factory/menu-base/client/actions/menu'
 import { ADD_REFRESH_HANDLER, ADD_SETTING } from '@things-factory/setting-base'
 import { client, store, UPDATE_BASE_URL } from '@things-factory/shell'
 import { ReleaseNoteNotice } from '@things-factory/system/client/viewparts/release-note-notice'
-import { isMobileDevice } from '@things-factory/utils'
+import { isMobileDevice } from '@operato/utils'
 import { UPDATE_DASHBOARD_SETTINGS } from './actions/dashboard-settings'
 import { fetchBoardSettings } from './fetch-board-settings'
@@ -77,6 +78,14 @@ export default async function bootstrap() {
     }
   })
+  store.dispatch({
+    type: ADD_SETTING,
+    setting: {
+      seq: 10,
+      template: html` <theme-mode-setting-let></theme-mode-setting-let> `
+    }
+  })
   store.dispatch({
     type: ADD_SETTING,
     setting: {
@@ -99,7 +108,7 @@ export default async function bootstrap() {
   store.dispatch({
     type: ADD_MORENDA,
     morenda: {
-      icon: html` <mwc-icon>settings</mwc-icon> `,
+      icon: html` <md-icon>settings</md-icon> `,
       name: html` <ox-i18n msgid="label.setting"></ox-i18n> `,
       action: () => {
         navigate('setting')
@@ -126,7 +135,7 @@ export default async function bootstrap() {
   store.dispatch({
     type: ADD_MORENDA,
     morenda: {
-      icon: html`<mwc-icon>help</mwc-icon>`,
+      icon: html`<md-icon>help</md-icon>`,
       name: html`<ox-i18n msgid="text.help"></ox-i18n>`,
       action: () => {
         navigate('help')

package/client/fetch-board-settings.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { client } from '@things-factory/shell'
+import { client } from '@operato/graphql'
 import gql from 'graphql-tag'
 export async function fetchBoardSettings() {

package/client/fetch-location-sorting-rule.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { client } from '@things-factory/shell'
+import { client } from '@operato/graphql'
 import gql from 'graphql-tag'
 export async function fetchLocationSortingRule(sortingRule) {

package/client/fetch-setting-value.js CHANGED Viewed

@@ -1,6 +1,6 @@
 import gql from 'graphql-tag'
-import { client } from '@things-factory/shell'
+import { client } from '@operato/graphql'
 export async function fetchSettingRule(setting, partnerDomainId) {
   const response = await client.query({

package/client/pages/adjustment/transfer-inventory.js CHANGED Viewed

@@ -1,11 +1,11 @@
 import '@things-factory/barcode-ui'
 import { MultiColumnFormStyles, SingleColumnFormStyles } from '@things-factory/form-ui'
 import '@operato/data-grist'
-import { i18next, localize } from '@things-factory/i18n-base'
+import { i18next, localize } from '@operato/i18n'
 import { openPopup } from '@operato/layout'
 import { client, CustomAlert, PageView, store } from '@things-factory/shell'
 import { CommonButtonStyles } from '@things-factory/styles'
-import { isMobileDevice } from '@things-factory/utils'
+import { isMobileDevice } from '@operato/utils'
 import gql from 'graphql-tag'
 import { css, html } from 'lit'
 import { connect } from 'pwa-helpers/connect-mixin.js'
@@ -39,7 +39,7 @@ class TransferInventory extends connect(store)(localize(i18next)(PageView)) {
         .grist {
           min-height: 180px;
-          background-color: var(--main-section-background-color);
+          background-color: var(--md-sys-color-background);
           display: flex;
           flex: 1;
           overflow: auto;
@@ -60,7 +60,7 @@ class TransferInventory extends connect(store)(localize(i18next)(PageView)) {
           margin: var(--grist-title-margin);
           border: var(--grist-title-border);
           font: var(--grist-title-font);
-          color: var(--secondary-color);
+          color: var(--md-sys-color-secondary);
         }
         .grist h2 mwc-icon {
@@ -114,7 +114,7 @@ class TransferInventory extends connect(store)(localize(i18next)(PageView)) {
         .content {
           font-size: 14px !important;
           font-weight: bold !important;
-          color: var(--primary-color) !important;
+          color: var(--md-sys-color-primary) !important;
           margin-botton: 5px;
         }
       `

package/client/pages/billing/claim-chit/claim-chit-detail.js CHANGED Viewed

@@ -1,10 +1,10 @@
 import { MultiColumnFormStyles } from '@things-factory/form-ui'
 import '@things-factory/form-ui'
 import '@operato/data-grist'
-import { i18next, localize } from '@things-factory/i18n-base'
+import { i18next, localize } from '@operato/i18n'
 import { getCodeByName } from '@things-factory/code-base'
 import { client, PageView, store, UPDATE_CONTEXT } from '@things-factory/shell'
-import { isMobileDevice } from '@things-factory/utils'
+import { isMobileDevice } from '@operato/utils'
 import { CommonButtonStyles } from '@things-factory/styles'
 import gql from 'graphql-tag'
 import { css, html } from 'lit'
@@ -27,7 +27,7 @@ class ClaimChitDetail extends connect(store)(localize(i18next)(PageView)) {
         .grist,
         .summary {
-          background-color: var(--main-section-background-color);
+          background-color: var(--md-sys-color-background);
           display: flex;
           flex-direction: column;
           overflow-y: auto;
@@ -66,7 +66,7 @@ class ClaimChitDetail extends connect(store)(localize(i18next)(PageView)) {
           border-bottom: var(--subtitle-border-bottom);
           margin: var(--grist-title-margin);
           border: var(--grist-title-border);
-          color: var(--secondary-color);
+          color: var(--md-sys-color-secondary);
         }
         h2 mwc-icon {

package/client/pages/billing/claim-chit/claim-chit-list.js CHANGED Viewed

@@ -4,9 +4,9 @@ import '@operato/data-grist'
 import { PageView, client, navigate, store } from '@things-factory/shell'
 import { css, html } from 'lit'
 import { flattenObject, isMobileDevice } from '@things-factory/utils'
-import { i18next, localize } from '@things-factory/i18n-base'
+import { i18next, localize } from '@operato/i18n'
-import { ScrollbarStyles } from '@things-factory/styles'
+import { ScrollbarStyles } from '@operato/styles'
 import { connect } from 'pwa-helpers/connect-mixin'
 import gql from 'graphql-tag'
@@ -343,10 +343,10 @@ class ClaimChitList extends connect(store)(localize(i18next)(PageView)) {
             field.type === 'text'
               ? field.value
               : field.type === 'checkbox'
-              ? field.checked
-              : field.type === 'number'
-              ? parseFloat(field.value)
-              : field.value,
+                ? field.checked
+                : field.type === 'number'
+                  ? parseFloat(field.value)
+                  : field.value,
           operator: field.getAttribute('searchOper')
         }
       })

package/client/pages/billing/claim-chit/create-claim-chit.js CHANGED Viewed

@@ -2,9 +2,9 @@ import { getCodeByName } from '@things-factory/code-base'
 import '@things-factory/form-ui'
 import { MultiColumnFormStyles } from '@things-factory/form-ui'
 import '@operato/data-grist'
-import { i18next, localize } from '@things-factory/i18n-base'
+import { i18next, localize } from '@operato/i18n'
 import { client, PageView, store } from '@things-factory/shell'
-import { isMobileDevice } from '@things-factory/utils'
+import { isMobileDevice } from '@operato/utils'
 import { CommonButtonStyles } from '@things-factory/styles'
 import gql from 'graphql-tag'
 import { css, html } from 'lit'
@@ -23,7 +23,7 @@ class CreateClaimChit extends connect(store)(localize(i18next)(PageView)) {
         .grist,
         .summary {
-          background-color: var(--main-section-background-color);
+          background-color: var(--md-sys-color-background);
           display: flex;
           flex-direction: column;
           overflow-y: auto;
@@ -62,7 +62,7 @@ class CreateClaimChit extends connect(store)(localize(i18next)(PageView)) {
           border-bottom: var(--subtitle-border-bottom);
           margin: var(--grist-title-margin);
           border: var(--grist-title-border);
-          color: var(--secondary-color);
+          color: var(--md-sys-color-secondary);
         }
         h2 mwc-icon {

package/client/pages/billing/transport-summary-report.js CHANGED Viewed

@@ -1,7 +1,7 @@
 import '@things-factory/form-ui'
 import { MultiColumnFormStyles } from '@things-factory/form-ui'
 import '@operato/data-grist'
-import { i18next, localize } from '@things-factory/i18n-base'
+import { i18next, localize } from '@operato/i18n'
 import { client, PageView, store } from '@things-factory/shell'
 import { flattenObject, isMobileDevice } from '@things-factory/utils'
 import gql from 'graphql-tag'
@@ -20,7 +20,7 @@ class TransportSummaryReport extends connect(store)(localize(i18next)(PageView))
           overflow-x: auto;
         }
         .grist {
-          background-color: var(--main-section-background-color);
+          background-color: var(--md-sys-color-background);
           display: flex;
           flex-direction: column;
           flex: 1;
@@ -40,7 +40,7 @@ class TransportSummaryReport extends connect(store)(localize(i18next)(PageView))
           margin: var(--grist-title-margin);
           border: var(--grist-title-border);
           font: var(--grist-title-font);
-          color: var(--secondary-color);
+          color: var(--md-sys-color-secondary);
         }
         .grist h2 mwc-icon {

package/client/pages/bulk-operation/bulk-operation.js CHANGED Viewed

@@ -8,7 +8,7 @@ import { css, html } from 'lit'
 import XLSX from 'xlsx'
 import { MultiColumnFormStyles } from '@things-factory/form-ui'
-import { i18next, localize } from '@things-factory/i18n-base'
+import { i18next, localize } from '@operato/i18n'
 import { openPopup } from '@operato/layout'
 import { client, PageView, navigate, CustomAlert } from '@things-factory/shell'
 import { fetchSettingRule } from '../../fetch-setting-value'
@@ -25,7 +25,7 @@ class BulkOperation extends localize(i18next)(PageView) {
         }
         ul {
-          margin: var(--margin-wide) 0;
+          margin: var(--spacing-large) 0;
           padding: 0;
           overflow: hidden;
           list-style: none;
@@ -34,31 +34,31 @@ class BulkOperation extends localize(i18next)(PageView) {
         li {
           display: block;
           float: left;
-          background-color: var(--main-section-background-color);
+          background-color: var(--md-sys-color-background);
           border-radius: var(--border-radius);
-          border: 1px solid var(--main-section-background-color);
+          border: 1px solid var(--md-sys-color-background);
           box-shadow: var(--box-shadow);
-          margin: var(--margin-narrow) var(--margin-default) var(--margin-default) 0;
-          padding: var(--padding-default) var(--padding-default) var(--padding-narrow) var(--padding-default);
+          margin: var(--spacing-small) var(--spacing-medium) var(--spacing-medium) 0;
+          padding: var(--spacing-medium) var(--spacing-medium) var(--spacing-small) var(--spacing-medium);
           text-align: center;
         }
         li:hover {
-          border: 1px solid var(--primary-color);
+          border: 1px solid var(--md-sys-color-primary);
         }
         a {
           cursor: pointer;
           text-decoration: none;
-          color: var(--secondary-color);
+          color: var(--md-sys-color-secondary);
         }
         mwc-icon {
           font-size: 18px;
-          color: var(--primary-color);
+          color: var(--md-sys-color-primary);
           border: 1px solid rgba(0, 0, 0, 0.2);
           border-radius: var(--border-radius);
-          background-color: var(--theme-white-color);
+          background-color: var(--md-sys-color-surface);
         }
         a,
@@ -96,7 +96,7 @@ class BulkOperation extends localize(i18next)(PageView) {
         [attachment-wrap] file-uploader {
           flex: 1;
-          background-color: var(--theme-white-color);
+          background-color: var(--md-sys-color-surface-variant);
         }
         .button-container {
@@ -111,7 +111,7 @@ class BulkOperation extends localize(i18next)(PageView) {
           ul {
             display: grid;
             grid-template-columns: 50% 50%;
-            grid-gap: var(--padding-narrow);
+            grid-gap: var(--spacing-small);
           }
           [field] {
             grid-column: span 2;

package/client/pages/bulk-operation/validate-gan-popup.js CHANGED Viewed

@@ -4,9 +4,9 @@ import '@operato/data-grist'
 import gql from 'graphql-tag'
 import { css, html, LitElement } from 'lit'
-import { i18next, localize } from '@things-factory/i18n-base'
+import { i18next, localize } from '@operato/i18n'
 import { client, CustomAlert } from '@things-factory/shell'
-import { ScrollbarStyles } from '@things-factory/styles'
+import { ScrollbarStyles } from '@operato/styles'
 import { isMobileDevice, sleep } from '@things-factory/utils'
 class ValidateGanPopup extends localize(i18next)(LitElement) {
@@ -27,7 +27,7 @@ class ValidateGanPopup extends localize(i18next)(LitElement) {
           display: flex;
           flex-direction: column;
           overflow: hidden;
-          background-color: white;
+          background-color: var(--md-sys-color-surface);
           --grid-record-emphasized-background-color: #ffdbdb;
           --grid-record-emphasized-color: #703f3f;

package/client/pages/bulk-operation/validate-ro-popup.js CHANGED Viewed

@@ -4,10 +4,10 @@ import '@operato/data-grist'
 import gql from 'graphql-tag'
 import { css, html, LitElement } from 'lit'
-import { i18next, localize } from '@things-factory/i18n-base'
+import { i18next, localize } from '@operato/i18n'
 import { client, CustomAlert } from '@things-factory/shell'
-import { ScrollbarStyles } from '@things-factory/styles'
-import { isMobileDevice } from '@things-factory/utils'
+import { ScrollbarStyles } from '@operato/styles'
+import { isMobileDevice } from '@operato/utils'
 class ValidateRoPopup extends localize(i18next)(LitElement) {
   static get properties() {
@@ -26,7 +26,7 @@ class ValidateRoPopup extends localize(i18next)(LitElement) {
           display: flex;
           flex-direction: column;
           overflow: hidden;
-          background-color: white;
+          background-color: var(--md-sys-color-surface);
           --grid-record-emphasized-background-color: #ffdbdb;
           --grid-record-emphasized-color: #703f3f;

package/client/pages/components/attachment-viewer.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { i18next, localize } from '@things-factory/i18n-base'
+import { i18next, localize } from '@operato/i18n'
 import { css, html, LitElement } from 'lit'
 class AttachmentViewer extends localize(i18next)(LitElement) {
@@ -19,7 +19,7 @@ class AttachmentViewer extends localize(i18next)(LitElement) {
           display: flex;
           flex-direction: column;
           overflow-x: overlay;
-          background-color: var(--main-section-background-color);
+          background-color: var(--md-sys-color-background);
         }
         .container {
           display: flex;

package/client/pages/components/image-viewer.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { i18next, localize } from '@things-factory/i18n-base'
+import { i18next, localize } from '@operato/i18n'
 import { css, html, LitElement } from 'lit'
 class ImageViewer extends localize(i18next)(LitElement) {
@@ -19,7 +19,7 @@ class ImageViewer extends localize(i18next)(LitElement) {
           display: flex;
           flex-direction: column;
           overflow-x: overlay;
-          background-color: var(--main-section-background-color);
+          background-color: var(--md-sys-color-background);
         }
         .container {
           display: flex;

package/client/pages/components/partner-selector.js CHANGED Viewed

@@ -1,34 +1,31 @@
-import '@material/mwc-button'
+import '@material/web/icon/icon.js'
 import '@things-factory/form-ui'
 import '@operato/data-grist'
 import gql from 'graphql-tag'
 import { css, html, LitElement } from 'lit'
-import { i18next } from '@things-factory/i18n-base'
-import { client } from '@things-factory/shell'
-import { isMobileDevice } from '@things-factory/utils'
+import { i18next } from '@operato/i18n'
+import { client } from '@operato/graphql'
+import { isMobileDevice } from '@operato/utils'
+import { ButtonContainerStyles } from '@operato/styles'
 class PartnerSelector extends LitElement {
   static get styles() {
     return [
+      ButtonContainerStyles,
       css`
         :host {
           display: flex;
           flex-direction: column;
           overflow: hidden;
-          background-color: white;
+          background-color: var(--md-sys-color-surface);
         }
         ox-grist {
           flex: 1;
         }
-        .button-container {
-          padding: var(--button-container-padding);
-          margin: var(--button-container-margin);
-          text-align: var(--button-container-align);
-          background-color: var(--button-container-background);
-          height: var(--button-container-height);
-        }
       `
     ]
   }
@@ -52,7 +49,9 @@ class PartnerSelector extends LitElement {
       ></ox-grist>
       <div class="button-container">
-        <mwc-button raised @click="${this.select.bind(this)}">${i18next.t('button.select')}</mwc-button>
+        <button @click="${this.select.bind(this)}">
+          <md-icon>select_check_box</md-icon>${i18next.t('button.select')}
+        </button>
       </div>
     `
   }

package/client/pages/components/popup-note.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { i18next, localize } from '@things-factory/i18n-base'
+import { i18next, localize } from '@operato/i18n'
 import { css, html, LitElement } from 'lit'
 class PopupNote extends localize(i18next)(LitElement) {
@@ -17,7 +17,7 @@ class PopupNote extends localize(i18next)(LitElement) {
           display: flex;
           flex-direction: column;
           overflow-x: overlay;
-          background-color: var(--main-section-background-color);
+          background-color: var(--md-sys-color-background);
         }
         .container {
           display: flex;
@@ -27,7 +27,7 @@ class PopupNote extends localize(i18next)(LitElement) {
         .container > textarea {
           flex: 1;
           resize: none;
-          border-color: var(--primary-color);
+          border-color: var(--md-sys-color-primary);
           padding: 5px;
           margin: 10px;
           outline: none;
@@ -37,7 +37,7 @@ class PopupNote extends localize(i18next)(LitElement) {
           font: var(--grist-title-font);
           margin: var(--grist-title-margin);
           border: var(--grist-title-border);
-          color: var(--secondary-color);
+          color: var(--md-sys-color-secondary);
         }
         h2 mwc-icon {
           vertical-align: middle;

package/client/pages/components/popup-reusable-pallet.js CHANGED Viewed

@@ -2,8 +2,8 @@ import gql from 'graphql-tag'
 import { css, html, LitElement } from 'lit'
 import { SingleColumnFormStyles } from '@things-factory/form-ui'
-import { i18next, localize } from '@things-factory/i18n-base'
-import { client } from '@things-factory/shell'
+import { i18next, localize } from '@operato/i18n'
+import { client } from '@operato/graphql'
 import { PALLET_STATUS } from '../constants'
@@ -25,7 +25,7 @@ class PopupReusablePallet extends localize(i18next)(LitElement) {
           display: flex;
           flex-direction: column;
           overflow-x: overlay;
-          background-color: var(--main-section-background-color);
+          background-color: var(--md-sys-color-background);
         }
         .container {
           display: flex;
@@ -35,7 +35,7 @@ class PopupReusablePallet extends localize(i18next)(LitElement) {
         .container > barcode-scanable-input {
           flex: 1;
           resize: none;
-          border-color: var(--primary-color);
+          border-color: var(--md-sys-color-primary);
           padding: 5px;
           margin: 10px;
           outline: none;

package/client/pages/components/select-inventory-popup.js CHANGED Viewed

@@ -4,10 +4,10 @@ import gql from 'graphql-tag'
 import { css, html, LitElement } from 'lit'
 import { getCodeByName } from '@things-factory/code-base'
-import { i18next, localize } from '@things-factory/i18n-base'
-import { client } from '@things-factory/shell'
-import { ScrollbarStyles } from '@things-factory/styles'
-import { isMobileDevice } from '@things-factory/utils'
+import { i18next, localize } from '@operato/i18n'
+import { client } from '@operato/graphql'
+import { ScrollbarStyles } from '@operato/styles'
+import { isMobileDevice } from '@operato/utils'
 import { GROUP_TYPES, INVENTORY_STATUS } from '../constants'
@@ -33,7 +33,7 @@ class SelectInventoryPopUp extends localize(i18next)(LitElement) {
           display: flex;
           flex-direction: column;
           overflow: hidden;
-          background-color: white;
+          background-color: var(--md-sys-color-surface);
         }
         search-form {

package/client/pages/components/select-product-popup.js CHANGED Viewed

@@ -3,10 +3,10 @@ import '@operato/data-grist'
 import gql from 'graphql-tag'
 import { css, html, LitElement } from 'lit'
-import { i18next, localize } from '@things-factory/i18n-base'
-import { client } from '@things-factory/shell'
-import { ScrollbarStyles } from '@things-factory/styles'
-import { isMobileDevice } from '@things-factory/utils'
+import { i18next, localize } from '@operato/i18n'
+import { client } from '@operato/graphql'
+import { ScrollbarStyles } from '@operato/styles'
+import { isMobileDevice } from '@operato/utils'
 class SelectProductPopup extends localize(i18next)(LitElement) {
   static get properties() {
@@ -30,7 +30,7 @@ class SelectProductPopup extends localize(i18next)(LitElement) {
           display: flex;
           flex-direction: column;
           overflow: hidden;
-          background-color: white;
+          background-color: var(--md-sys-color-surface);
         }
         search-form {

package/client/pages/components/vas-templates/vas-pallet-add-popup.js CHANGED Viewed

@@ -1,7 +1,7 @@
-import { localize, i18next } from '@things-factory/i18n-base'
+import { localize, i18next } from '@operato/i18n'
 import { SingleColumnFormStyles } from '@things-factory/form-ui'
 import { LitElement, html, css } from 'lit'
-import { client } from '@things-factory/shell'
+import { client } from '@operato/graphql'
 import gql from 'graphql-tag'
 import '@things-factory/barcode-ui'
@@ -14,7 +14,7 @@ class VasPalletAddPopup extends localize(i18next)(LitElement) {
           display: flex;
           flex-direction: column;
           overflow-x: overlay;
-          background-color: var(--main-section-background-color);
+          background-color: var(--md-sys-color-background);
           padding: 20px;
         }
         .button-container {
@@ -32,7 +32,7 @@ class VasPalletAddPopup extends localize(i18next)(LitElement) {
           margin: var(--button-container-button-margin);
           padding: var(--button-padding);
-          color: var(--theme-white-color);
+          color: var(--md-sys-color-on-primary);
           font: var(--button-font);
           text-transform: var(--button-text-transform);
         }