diff --git a/index.html b/index.html index 7fa71b3..b8c9ecb 100644 --- a/index.html +++ b/index.html @@ -22,7 +22,7 @@ - + \ No newline at end of file diff --git a/package-lock.json b/package-lock.json index 9b1bd19..f76b990 100644 --- a/package-lock.json +++ b/package-lock.json @@ -9,6 +9,8 @@ "version": "0.0.0", "license": "MIT", "dependencies": { + "@vaadin/app-layout": "^23.0.10", + "@vaadin/tabs": "^23.0.10", "lit": "^2.2.3" }, "devDependencies": { @@ -2223,8 +2225,7 @@ "node_modules/@open-wc/dedupe-mixin": { "version": "1.3.0", "resolved": "https://registry.npmjs.org/@open-wc/dedupe-mixin/-/dedupe-mixin-1.3.0.tgz", - "integrity": "sha512-UfdK1MPnR6T7f3svzzYBfu3qBkkZ/KsPhcpc3JYhsUY4hbpwNF9wEQtD4Z+/mRqMTJrKg++YSxIxE0FBhY3RIw==", - "dev": true + "integrity": "sha512-UfdK1MPnR6T7f3svzzYBfu3qBkkZ/KsPhcpc3JYhsUY4hbpwNF9wEQtD4Z+/mRqMTJrKg++YSxIxE0FBhY3RIw==" }, "node_modules/@open-wc/eslint-config": { "version": "4.3.0", @@ -2298,6 +2299,49 @@ "lit-html": "^2.0.0" } }, + "node_modules/@polymer/iron-flex-layout": { + "version": "3.0.1", + "resolved": "https://registry.npmjs.org/@polymer/iron-flex-layout/-/iron-flex-layout-3.0.1.tgz", + "integrity": "sha512-7gB869czArF+HZcPTVSgvA7tXYFze9EKckvM95NB7SqYF+NnsQyhoXgKnpFwGyo95lUjUW9TFDLUwDXnCYFtkw==", + "dependencies": { + "@polymer/polymer": "^3.0.0" + } + }, + "node_modules/@polymer/iron-icon": { + "version": "3.0.1", + "resolved": "https://registry.npmjs.org/@polymer/iron-icon/-/iron-icon-3.0.1.tgz", + "integrity": "sha512-QLPwirk+UPZNaLnMew9VludXA4CWUCenRewgEcGYwdzVgDPCDbXxy6vRJjmweZobMQv/oVLppT2JZtJFnPxX6g==", + "dependencies": { + "@polymer/iron-flex-layout": "^3.0.0-pre.26", + "@polymer/iron-meta": "^3.0.0-pre.26", + "@polymer/polymer": "^3.0.0" + } + }, + "node_modules/@polymer/iron-iconset-svg": { + "version": "3.0.1", + "resolved": "https://registry.npmjs.org/@polymer/iron-iconset-svg/-/iron-iconset-svg-3.0.1.tgz", + "integrity": "sha512-XNwURbNHRw6u2fJe05O5fMYye6GSgDlDqCO+q6K1zAnKIrpgZwf2vTkBd5uCcZwsN0FyCB3mvNZx4jkh85dRDw==", + "dependencies": { + "@polymer/iron-meta": "^3.0.0-pre.26", + "@polymer/polymer": "^3.0.0" + } + }, + "node_modules/@polymer/iron-meta": { + "version": "3.0.1", + "resolved": "https://registry.npmjs.org/@polymer/iron-meta/-/iron-meta-3.0.1.tgz", + "integrity": "sha512-pWguPugiLYmWFV9UWxLWzZ6gm4wBwQdDy4VULKwdHCqR7OP7u98h+XDdGZsSlDPv6qoryV/e3tGHlTIT0mbzJA==", + "dependencies": { + "@polymer/polymer": "^3.0.0" + } + }, + "node_modules/@polymer/polymer": { + "version": "3.5.0", + "resolved": "https://registry.npmjs.org/@polymer/polymer/-/polymer-3.5.0.tgz", + "integrity": "sha512-0OyN+LQ68tudbWYm7BeU4WELiqXvRn1HIpSnW0u7iFTdxJakJGLehh7PFgKL1noe9a0HHSKznQIfz+hMxzgBtA==", + "dependencies": { + "@webcomponents/shadycss": "^1.9.1" + } + }, "node_modules/@rollup/plugin-babel": { "version": "5.3.1", "resolved": "https://registry.npmjs.org/@rollup/plugin-babel/-/plugin-babel-5.3.1.tgz", @@ -2949,6 +2993,139 @@ "url": "https://opencollective.com/typescript-eslint" } }, + "node_modules/@vaadin/app-layout": { + "version": "23.0.10", + "resolved": "https://registry.npmjs.org/@vaadin/app-layout/-/app-layout-23.0.10.tgz", + "integrity": "sha512-UEEA11XdlyicSoz4PYdmG3aG0HpS96t7N7Tb7Ea03bZwpU93PABK1v2X5kPmP9hYvQT4TIF+E+TAPVLZX5H36Q==", + "dependencies": { + "@polymer/polymer": "^3.0.0", + "@vaadin/button": "^23.0.10", + "@vaadin/component-base": "^23.0.10", + "@vaadin/vaadin-lumo-styles": "^23.0.10", + "@vaadin/vaadin-material-styles": "^23.0.10", + "@vaadin/vaadin-themable-mixin": "^23.0.10" + } + }, + "node_modules/@vaadin/button": { + "version": "23.0.10", + "resolved": "https://registry.npmjs.org/@vaadin/button/-/button-23.0.10.tgz", + "integrity": "sha512-zEuqKx0Epk4uODe8zqATFQoT05cw+pM2NyH2zzIByiPgsrLenDmo1nUr3sHyM6ZJX5d7M+73vTMRygR1bIt5Mw==", + "dependencies": { + "@polymer/polymer": "^3.0.0", + "@vaadin/component-base": "^23.0.10", + "@vaadin/vaadin-lumo-styles": "^23.0.10", + "@vaadin/vaadin-material-styles": "^23.0.10", + "@vaadin/vaadin-themable-mixin": "^23.0.10" + } + }, + "node_modules/@vaadin/component-base": { + "version": "23.0.10", + "resolved": "https://registry.npmjs.org/@vaadin/component-base/-/component-base-23.0.10.tgz", + "integrity": "sha512-4+dH/op6+C25HtnuhFc4ge+iDN24iKsVr8yG0T1Ssl2b89pyjc9znQzEv3odbfl8MzJjZ6q36gBtGxsvkAAPKw==", + "dependencies": { + "@open-wc/dedupe-mixin": "^1.3.0", + "@polymer/polymer": "^3.0.0", + "@vaadin/vaadin-development-mode-detector": "^2.0.0", + "@vaadin/vaadin-usage-statistics": "^2.1.0", + "lit": "^2.0.0" + } + }, + "node_modules/@vaadin/icon": { + "version": "23.0.10", + "resolved": "https://registry.npmjs.org/@vaadin/icon/-/icon-23.0.10.tgz", + "integrity": "sha512-5pEqMLcxUhoL6R4Hy8ZE0KYNv00JrEnPlqAVqWwOH9u5GmT1X4ns9uebFEp6vNt2Ib1/8XgHJof6Oypq257HKQ==", + "dependencies": { + "@polymer/polymer": "^3.0.0", + "@vaadin/component-base": "^23.0.10", + "@vaadin/vaadin-lumo-styles": "^23.0.10", + "@vaadin/vaadin-themable-mixin": "^23.0.10", + "lit": "^2.0.0" + } + }, + "node_modules/@vaadin/item": { + "version": "23.0.10", + "resolved": "https://registry.npmjs.org/@vaadin/item/-/item-23.0.10.tgz", + "integrity": "sha512-MIjDB6myzvFCGyCBf4g77RHPsi1DqE9JRDyKLzD4Oi+R3D6+plTdbGJZ2iAiWXJfXTHGPl017fC7uPlJnB9ddw==", + "dependencies": { + "@open-wc/dedupe-mixin": "^1.3.0", + "@polymer/polymer": "^3.0.0", + "@vaadin/component-base": "^23.0.10", + "@vaadin/vaadin-lumo-styles": "^23.0.10", + "@vaadin/vaadin-material-styles": "^23.0.10", + "@vaadin/vaadin-themable-mixin": "^23.0.10" + } + }, + "node_modules/@vaadin/tabs": { + "version": "23.0.10", + "resolved": "https://registry.npmjs.org/@vaadin/tabs/-/tabs-23.0.10.tgz", + "integrity": "sha512-gpo1PiKTF8T7lAHIKjyXH0axVL+w2EWubkEc2m28muLQf7uHaaC1pAeJaHwOZgSF74bq+YCpVw1JTE3FdOSD7Q==", + "dependencies": { + "@polymer/polymer": "^3.0.0", + "@vaadin/component-base": "^23.0.10", + "@vaadin/item": "^23.0.10", + "@vaadin/vaadin-list-mixin": "^23.0.10", + "@vaadin/vaadin-lumo-styles": "^23.0.10", + "@vaadin/vaadin-material-styles": "^23.0.10", + "@vaadin/vaadin-themable-mixin": "^23.0.10" + } + }, + "node_modules/@vaadin/vaadin-development-mode-detector": { + "version": "2.0.5", + "resolved": "https://registry.npmjs.org/@vaadin/vaadin-development-mode-detector/-/vaadin-development-mode-detector-2.0.5.tgz", + "integrity": "sha512-miirBQw10UHjKwRv29iZniXCo41cLg3wFotoyTeUZ2PTGIDk/fZVFr4Q4WVKZrp3D15878vz94nNQROSmPLjdg==" + }, + "node_modules/@vaadin/vaadin-list-mixin": { + "version": "23.0.10", + "resolved": "https://registry.npmjs.org/@vaadin/vaadin-list-mixin/-/vaadin-list-mixin-23.0.10.tgz", + "integrity": "sha512-E6H0dLGKhRVE6St3aOPP4htSm/TGEzQWdYJ6jCU2p9FDrQiZx7G92bcXVBLrcFwM3996psgUl+8sasr+J6bozA==", + "dependencies": { + "@open-wc/dedupe-mixin": "^1.3.0", + "@polymer/polymer": "^3.0.0", + "@vaadin/component-base": "^23.0.10" + } + }, + "node_modules/@vaadin/vaadin-lumo-styles": { + "version": "23.0.10", + "resolved": "https://registry.npmjs.org/@vaadin/vaadin-lumo-styles/-/vaadin-lumo-styles-23.0.10.tgz", + "integrity": "sha512-wDxiwA47fJ66xhZVSDCEKtRCLgyYrpxw7OWiZ5WvfmZX0nL6l5ki2/bQqA+PceWN0jrrL7dl25iuN4Etx+TdLQ==", + "dependencies": { + "@polymer/iron-icon": "^3.0.0", + "@polymer/iron-iconset-svg": "^3.0.0", + "@polymer/polymer": "^3.0.0", + "@vaadin/icon": "^23.0.10", + "@vaadin/vaadin-themable-mixin": "^23.0.10" + } + }, + "node_modules/@vaadin/vaadin-material-styles": { + "version": "23.0.10", + "resolved": "https://registry.npmjs.org/@vaadin/vaadin-material-styles/-/vaadin-material-styles-23.0.10.tgz", + "integrity": "sha512-H1q7wxSeX1t5TFK2T8uVWLcIILvRitm11ak1wG6QuoOT86nMrFwDiqsjVONrW7EU46dYZpupJmDzi4qaM/57Ig==", + "dependencies": { + "@polymer/polymer": "^3.0.0", + "@vaadin/vaadin-themable-mixin": "^23.0.10" + } + }, + "node_modules/@vaadin/vaadin-themable-mixin": { + "version": "23.0.10", + "resolved": "https://registry.npmjs.org/@vaadin/vaadin-themable-mixin/-/vaadin-themable-mixin-23.0.10.tgz", + "integrity": "sha512-+YWjrnIGPYkSF62uUml1CWI87VLkwtVxMpT4VfODAIwi1DkX8NDOyLZ4AURB9reXytU7hyjuA1aiW0AS4Ao3rA==", + "dependencies": { + "@open-wc/dedupe-mixin": "^1.3.0", + "lit": "^2.0.0" + } + }, + "node_modules/@vaadin/vaadin-usage-statistics": { + "version": "2.1.2", + "resolved": "https://registry.npmjs.org/@vaadin/vaadin-usage-statistics/-/vaadin-usage-statistics-2.1.2.tgz", + "integrity": "sha512-xKs1PvRfTXsG0eWWcImLXWjv7D+f1vfoIvovppv6pZ5QX8xgcxWUdNgERlOOdGt3CTuxQXukTBW3+Qfva+OXSg==", + "hasInstallScript": true, + "dependencies": { + "@vaadin/vaadin-development-mode-detector": "^2.0.0" + }, + "engines": { + "node": "^12.20.0 || ^14.13.1 || >=16.0.0" + } + }, "node_modules/@web/browser-logs": { "version": "0.2.5", "resolved": "https://registry.npmjs.org/@web/browser-logs/-/browser-logs-0.2.5.tgz", @@ -3667,8 +3844,7 @@ "node_modules/@webcomponents/shadycss": { "version": "1.11.0", "resolved": "https://registry.npmjs.org/@webcomponents/shadycss/-/shadycss-1.11.0.tgz", - "integrity": "sha512-L5O/+UPum8erOleNjKq6k58GVl3fNsEQdSOyh0EUhNmi7tHUyRuCJy1uqJiWydWcLARE5IPsMoPYMZmUGrz1JA==", - "dev": true + "integrity": "sha512-L5O/+UPum8erOleNjKq6k58GVl3fNsEQdSOyh0EUhNmi7tHUyRuCJy1uqJiWydWcLARE5IPsMoPYMZmUGrz1JA==" }, "node_modules/@webcomponents/webcomponentsjs": { "version": "2.6.0", @@ -14528,8 +14704,7 @@ "@open-wc/dedupe-mixin": { "version": "1.3.0", "resolved": "https://registry.npmjs.org/@open-wc/dedupe-mixin/-/dedupe-mixin-1.3.0.tgz", - "integrity": "sha512-UfdK1MPnR6T7f3svzzYBfu3qBkkZ/KsPhcpc3JYhsUY4hbpwNF9wEQtD4Z+/mRqMTJrKg++YSxIxE0FBhY3RIw==", - "dev": true + "integrity": "sha512-UfdK1MPnR6T7f3svzzYBfu3qBkkZ/KsPhcpc3JYhsUY4hbpwNF9wEQtD4Z+/mRqMTJrKg++YSxIxE0FBhY3RIw==" }, "@open-wc/eslint-config": { "version": "4.3.0", @@ -14594,6 +14769,49 @@ "lit-html": "^2.0.0" } }, + "@polymer/iron-flex-layout": { + "version": "3.0.1", + "resolved": "https://registry.npmjs.org/@polymer/iron-flex-layout/-/iron-flex-layout-3.0.1.tgz", + "integrity": "sha512-7gB869czArF+HZcPTVSgvA7tXYFze9EKckvM95NB7SqYF+NnsQyhoXgKnpFwGyo95lUjUW9TFDLUwDXnCYFtkw==", + "requires": { + "@polymer/polymer": "^3.0.0" + } + }, + "@polymer/iron-icon": { + "version": "3.0.1", + "resolved": "https://registry.npmjs.org/@polymer/iron-icon/-/iron-icon-3.0.1.tgz", + "integrity": "sha512-QLPwirk+UPZNaLnMew9VludXA4CWUCenRewgEcGYwdzVgDPCDbXxy6vRJjmweZobMQv/oVLppT2JZtJFnPxX6g==", + "requires": { + "@polymer/iron-flex-layout": "^3.0.0-pre.26", + "@polymer/iron-meta": "^3.0.0-pre.26", + "@polymer/polymer": "^3.0.0" + } + }, + "@polymer/iron-iconset-svg": { + "version": "3.0.1", + "resolved": "https://registry.npmjs.org/@polymer/iron-iconset-svg/-/iron-iconset-svg-3.0.1.tgz", + "integrity": "sha512-XNwURbNHRw6u2fJe05O5fMYye6GSgDlDqCO+q6K1zAnKIrpgZwf2vTkBd5uCcZwsN0FyCB3mvNZx4jkh85dRDw==", + "requires": { + "@polymer/iron-meta": "^3.0.0-pre.26", + "@polymer/polymer": "^3.0.0" + } + }, + "@polymer/iron-meta": { + "version": "3.0.1", + "resolved": "https://registry.npmjs.org/@polymer/iron-meta/-/iron-meta-3.0.1.tgz", + "integrity": "sha512-pWguPugiLYmWFV9UWxLWzZ6gm4wBwQdDy4VULKwdHCqR7OP7u98h+XDdGZsSlDPv6qoryV/e3tGHlTIT0mbzJA==", + "requires": { + "@polymer/polymer": "^3.0.0" + } + }, + "@polymer/polymer": { + "version": "3.5.0", + "resolved": "https://registry.npmjs.org/@polymer/polymer/-/polymer-3.5.0.tgz", + "integrity": "sha512-0OyN+LQ68tudbWYm7BeU4WELiqXvRn1HIpSnW0u7iFTdxJakJGLehh7PFgKL1noe9a0HHSKznQIfz+hMxzgBtA==", + "requires": { + "@webcomponents/shadycss": "^1.9.1" + } + }, "@rollup/plugin-babel": { "version": "5.3.1", "resolved": "https://registry.npmjs.org/@rollup/plugin-babel/-/plugin-babel-5.3.1.tgz", @@ -15129,6 +15347,135 @@ "eslint-visitor-keys": "^2.0.0" } }, + "@vaadin/app-layout": { + "version": "23.0.10", + "resolved": "https://registry.npmjs.org/@vaadin/app-layout/-/app-layout-23.0.10.tgz", + "integrity": "sha512-UEEA11XdlyicSoz4PYdmG3aG0HpS96t7N7Tb7Ea03bZwpU93PABK1v2X5kPmP9hYvQT4TIF+E+TAPVLZX5H36Q==", + "requires": { + "@polymer/polymer": "^3.0.0", + "@vaadin/button": "^23.0.10", + "@vaadin/component-base": "^23.0.10", + "@vaadin/vaadin-lumo-styles": "^23.0.10", + "@vaadin/vaadin-material-styles": "^23.0.10", + "@vaadin/vaadin-themable-mixin": "^23.0.10" + } + }, + "@vaadin/button": { + "version": "23.0.10", + "resolved": "https://registry.npmjs.org/@vaadin/button/-/button-23.0.10.tgz", + "integrity": "sha512-zEuqKx0Epk4uODe8zqATFQoT05cw+pM2NyH2zzIByiPgsrLenDmo1nUr3sHyM6ZJX5d7M+73vTMRygR1bIt5Mw==", + "requires": { + "@polymer/polymer": "^3.0.0", + "@vaadin/component-base": "^23.0.10", + "@vaadin/vaadin-lumo-styles": "^23.0.10", + "@vaadin/vaadin-material-styles": "^23.0.10", + "@vaadin/vaadin-themable-mixin": "^23.0.10" + } + }, + "@vaadin/component-base": { + "version": "23.0.10", + "resolved": "https://registry.npmjs.org/@vaadin/component-base/-/component-base-23.0.10.tgz", + "integrity": "sha512-4+dH/op6+C25HtnuhFc4ge+iDN24iKsVr8yG0T1Ssl2b89pyjc9znQzEv3odbfl8MzJjZ6q36gBtGxsvkAAPKw==", + "requires": { + "@open-wc/dedupe-mixin": "^1.3.0", + "@polymer/polymer": "^3.0.0", + "@vaadin/vaadin-development-mode-detector": "^2.0.0", + "@vaadin/vaadin-usage-statistics": "^2.1.0", + "lit": "^2.0.0" + } + }, + "@vaadin/icon": { + "version": "23.0.10", + "resolved": "https://registry.npmjs.org/@vaadin/icon/-/icon-23.0.10.tgz", + "integrity": "sha512-5pEqMLcxUhoL6R4Hy8ZE0KYNv00JrEnPlqAVqWwOH9u5GmT1X4ns9uebFEp6vNt2Ib1/8XgHJof6Oypq257HKQ==", + "requires": { + "@polymer/polymer": "^3.0.0", + "@vaadin/component-base": "^23.0.10", + "@vaadin/vaadin-lumo-styles": "^23.0.10", + "@vaadin/vaadin-themable-mixin": "^23.0.10", + "lit": "^2.0.0" + } + }, + "@vaadin/item": { + "version": "23.0.10", + "resolved": "https://registry.npmjs.org/@vaadin/item/-/item-23.0.10.tgz", + "integrity": "sha512-MIjDB6myzvFCGyCBf4g77RHPsi1DqE9JRDyKLzD4Oi+R3D6+plTdbGJZ2iAiWXJfXTHGPl017fC7uPlJnB9ddw==", + "requires": { + "@open-wc/dedupe-mixin": "^1.3.0", + "@polymer/polymer": "^3.0.0", + "@vaadin/component-base": "^23.0.10", + "@vaadin/vaadin-lumo-styles": "^23.0.10", + "@vaadin/vaadin-material-styles": "^23.0.10", + "@vaadin/vaadin-themable-mixin": "^23.0.10" + } + }, + "@vaadin/tabs": { + "version": "23.0.10", + "resolved": "https://registry.npmjs.org/@vaadin/tabs/-/tabs-23.0.10.tgz", + "integrity": "sha512-gpo1PiKTF8T7lAHIKjyXH0axVL+w2EWubkEc2m28muLQf7uHaaC1pAeJaHwOZgSF74bq+YCpVw1JTE3FdOSD7Q==", + "requires": { + "@polymer/polymer": "^3.0.0", + "@vaadin/component-base": "^23.0.10", + "@vaadin/item": "^23.0.10", + "@vaadin/vaadin-list-mixin": "^23.0.10", + "@vaadin/vaadin-lumo-styles": "^23.0.10", + "@vaadin/vaadin-material-styles": "^23.0.10", + "@vaadin/vaadin-themable-mixin": "^23.0.10" + } + }, + "@vaadin/vaadin-development-mode-detector": { + "version": "2.0.5", + "resolved": "https://registry.npmjs.org/@vaadin/vaadin-development-mode-detector/-/vaadin-development-mode-detector-2.0.5.tgz", + "integrity": "sha512-miirBQw10UHjKwRv29iZniXCo41cLg3wFotoyTeUZ2PTGIDk/fZVFr4Q4WVKZrp3D15878vz94nNQROSmPLjdg==" + }, + "@vaadin/vaadin-list-mixin": { + "version": "23.0.10", + "resolved": "https://registry.npmjs.org/@vaadin/vaadin-list-mixin/-/vaadin-list-mixin-23.0.10.tgz", + "integrity": "sha512-E6H0dLGKhRVE6St3aOPP4htSm/TGEzQWdYJ6jCU2p9FDrQiZx7G92bcXVBLrcFwM3996psgUl+8sasr+J6bozA==", + "requires": { + "@open-wc/dedupe-mixin": "^1.3.0", + "@polymer/polymer": "^3.0.0", + "@vaadin/component-base": "^23.0.10" + } + }, + "@vaadin/vaadin-lumo-styles": { + "version": "23.0.10", + "resolved": "https://registry.npmjs.org/@vaadin/vaadin-lumo-styles/-/vaadin-lumo-styles-23.0.10.tgz", + "integrity": "sha512-wDxiwA47fJ66xhZVSDCEKtRCLgyYrpxw7OWiZ5WvfmZX0nL6l5ki2/bQqA+PceWN0jrrL7dl25iuN4Etx+TdLQ==", + "requires": { + "@polymer/iron-icon": "^3.0.0", + "@polymer/iron-iconset-svg": "^3.0.0", + "@polymer/polymer": "^3.0.0", + "@vaadin/icon": "^23.0.10", + "@vaadin/vaadin-themable-mixin": "^23.0.10" + } + }, + "@vaadin/vaadin-material-styles": { + "version": "23.0.10", + "resolved": "https://registry.npmjs.org/@vaadin/vaadin-material-styles/-/vaadin-material-styles-23.0.10.tgz", + "integrity": "sha512-H1q7wxSeX1t5TFK2T8uVWLcIILvRitm11ak1wG6QuoOT86nMrFwDiqsjVONrW7EU46dYZpupJmDzi4qaM/57Ig==", + "requires": { + "@polymer/polymer": "^3.0.0", + "@vaadin/vaadin-themable-mixin": "^23.0.10" + } + }, + "@vaadin/vaadin-themable-mixin": { + "version": "23.0.10", + "resolved": "https://registry.npmjs.org/@vaadin/vaadin-themable-mixin/-/vaadin-themable-mixin-23.0.10.tgz", + "integrity": "sha512-+YWjrnIGPYkSF62uUml1CWI87VLkwtVxMpT4VfODAIwi1DkX8NDOyLZ4AURB9reXytU7hyjuA1aiW0AS4Ao3rA==", + "requires": { + "@open-wc/dedupe-mixin": "^1.3.0", + "lit": "^2.0.0" + } + }, + "@vaadin/vaadin-usage-statistics": { + "version": "2.1.2", + "resolved": "https://registry.npmjs.org/@vaadin/vaadin-usage-statistics/-/vaadin-usage-statistics-2.1.2.tgz", + "integrity": "sha512-xKs1PvRfTXsG0eWWcImLXWjv7D+f1vfoIvovppv6pZ5QX8xgcxWUdNgERlOOdGt3CTuxQXukTBW3+Qfva+OXSg==", + "requires": { + "@vaadin/vaadin-development-mode-detector": "^2.0.0" + } + }, "@web/browser-logs": { "version": "0.2.5", "resolved": "https://registry.npmjs.org/@web/browser-logs/-/browser-logs-0.2.5.tgz", @@ -15710,8 +16057,7 @@ "@webcomponents/shadycss": { "version": "1.11.0", "resolved": "https://registry.npmjs.org/@webcomponents/shadycss/-/shadycss-1.11.0.tgz", - "integrity": "sha512-L5O/+UPum8erOleNjKq6k58GVl3fNsEQdSOyh0EUhNmi7tHUyRuCJy1uqJiWydWcLARE5IPsMoPYMZmUGrz1JA==", - "dev": true + "integrity": "sha512-L5O/+UPum8erOleNjKq6k58GVl3fNsEQdSOyh0EUhNmi7tHUyRuCJy1uqJiWydWcLARE5IPsMoPYMZmUGrz1JA==" }, "@webcomponents/webcomponentsjs": { "version": "2.6.0", diff --git a/package.json b/package.json index 04892a4..960be70 100644 --- a/package.json +++ b/package.json @@ -5,6 +5,7 @@ "author": "web-brain", "version": "0.0.0", "scripts": { + "clean": "rimraf out-tsc", "lint": "eslint --ext .ts,.html . --ignore-path .gitignore && prettier \"**/*.ts\" --check --ignore-path .gitignore", "format": "eslint --ext .ts,.html . --fix --ignore-path .gitignore && prettier \"**/*.ts\" --write --ignore-path .gitignore", "test": "tsc && wtr --coverage", @@ -89,4 +90,4 @@ ] }, "customElements": "custom-elements.json" -} \ No newline at end of file +} diff --git a/src/WebBrain-old.ts b/src/WebBrain-old.ts new file mode 100644 index 0000000..436745d --- /dev/null +++ b/src/WebBrain-old.ts @@ -0,0 +1,81 @@ +import { LitElement, html, css } from 'lit'; +import { customElement, property } from 'lit/decorators.js'; + +const logo = new URL('../../assets/open-wc-logo.svg', import.meta.url).href; + +@customElement('web-brain') +export class WebBrain extends LitElement { + @property({ type: String }) title = 'My app'; + + static styles = css` + :host { + min-height: 100vh; + display: flex; + flex-direction: column; + align-items: center; + justify-content: flex-start; + font-size: calc(10px + 2vmin); + color: #1a2b42; + max-width: 960px; + margin: 0 auto; + text-align: center; + background-color: var(--web-brain-background-color); + } + + main { + flex-grow: 1; + } + + .logo { + margin-top: 36px; + animation: app-logo-spin infinite 20s linear; + } + + @keyframes app-logo-spin { + from { + transform: rotate(0deg); + } + to { + transform: rotate(360deg); + } + } + + .app-footer { + font-size: calc(12px + 0.5vmin); + align-items: center; + } + + .app-footer a { + margin-left: 5px; + } + `; + + render() { + return html` +
+ +

${this.title}

+ +

Edit src/WebBrain.ts and save to reload.

+ + Code examples + +
+ +

+ 🚽 Made with love by + open-wc. +

+ `; + } +} diff --git a/src/WebBrain.ts b/src/WebBrain.ts index 049036f..b24a7c9 100644 --- a/src/WebBrain.ts +++ b/src/WebBrain.ts @@ -1,80 +1,34 @@ import { LitElement, html, css } from 'lit'; -import { property } from 'lit/decorators.js'; - -const logo = new URL('../../assets/open-wc-logo.svg', import.meta.url).href; +import { customElement, property } from 'lit/decorators.js'; +@customElement('web-brain') export class WebBrain extends LitElement { - @property({ type: String }) title = 'My app'; + @property({ type: String }) title = 'Web brain'; + + @property({ type: String }) search = ''; static styles = css` :host { - min-height: 100vh; - display: flex; - flex-direction: column; - align-items: center; - justify-content: flex-start; - font-size: calc(10px + 2vmin); - color: #1a2b42; - max-width: 960px; - margin: 0 auto; - text-align: center; - background-color: var(--web-brain-background-color); } - main { - flex-grow: 1; - } - - .logo { - margin-top: 36px; - animation: app-logo-spin infinite 20s linear; - } - - @keyframes app-logo-spin { - from { - transform: rotate(0deg); - } - to { - transform: rotate(360deg); - } - } - - .app-footer { - font-size: calc(12px + 0.5vmin); - align-items: center; - } - - .app-footer a { - margin-left: 5px; - } `; render() { return html` +

${this.title}

+ + +
+ Here comes the search bar + +
+ +
- -

${this.title}

+ The content will come here +
-

Edit src/WebBrain.ts and save to reload.

- - Code examples - - - -

- 🚽 Made with love by - open-wc. -

+ `; } } diff --git a/src/web-brain.ts b/src/web-brain.ts deleted file mode 100644 index 49cbd89..0000000 --- a/src/web-brain.ts +++ /dev/null @@ -1,3 +0,0 @@ -import { WebBrain } from './WebBrain.js'; - -customElements.define('web-brain', WebBrain);