feat: ⚡ new portal web for qr scan

2026-04-20 04:29:16 +00:00 · 2023-01-09 18:37:58 +01:00
parent 4e0d33c6bb
commit 3de5f4b77a
39 changed files with 2054 additions and 303 deletions
--- a/packages/portal/src/global.css
+++ b/packages/portal/src/global.css
@@ -0,0 +1,125 @@
+/**
+ * WHAT IS THIS FILE?
+ *
+ * Globally applied styles. No matter which components are in the page or matching route,
+ * the styles in here will be applied to the Document, without any sort of CSS scoping.
+ *
+ */
+
+:root {
+    --qwik-dark-blue: #1a1a1a;
+    --qwik-light-blue: #349713;
+    --qwik-light-purple: #73da51;
+    --qwik-dark-purple: #3f9622;
+}
+
+body {
+    background-color: #fafafa;
+    font-family: 'Inter', sans-serif, ui-sans-serif, system-ui, -apple-system,
+        BlinkMacSystemFont, sans-serif;
+    padding: 20px 20px 40px 20px;
+}
+
+main {
+    max-width: 760px;
+    margin: 0 auto;
+    background-color: white;
+    border-radius: 5px;
+    box-shadow: rgba(17, 12, 46, 0.15) 0px 48px 100px 0px;
+    overflow: hidden;
+}
+
+h1,
+h2 {
+    margin: 0 0 5px 0;
+}
+
+.lightning {
+    filter: hue-rotate(180deg);
+}
+
+section {
+    padding: 20px;
+}
+
+ul {
+    list-style-type: square;
+    margin: 5px 0 30px 0;
+    padding-left: 25px;
+}
+
+li {
+    padding: 8px 0;
+}
+
+li::marker {
+    color: var(--qwik-light-blue);
+}
+
+a,
+a:visited {
+    color: var(--qwik-dark-blue);
+}
+
+a:hover {
+    text-decoration: none;
+}
+
+table.commands {
+    margin: 0 0 30px 0;
+}
+
+.commands td {
+    padding: 5px;
+}
+
+.commands td:first-child {
+    white-space: nowrap;
+    padding-right: 20px;
+}
+
+code {
+    font-family: Menlo, Monaco, Courier New, monospace;
+    font-size: 0.9em;
+    background-color: rgb(224, 224, 224);
+    padding: 2px 4px;
+    border-radius: 3px;
+    border-bottom: 2px solid #bfbfbf;
+}
+
+footer {
+    padding: 15px;
+    text-align: center;
+    font-size: 0.8em;
+}
+
+footer a {
+    text-decoration: none;
+}
+
+footer a:hover {
+    text-decoration: underline;
+}
+
+a.mindblow {
+    margin: 0 auto;
+    display: block;
+    background: var(--qwik-dark-purple);
+    padding: 10px 20px;
+    border-radius: 10px;
+    border: 0;
+    color: white;
+    text-decoration: none;
+    font-size: 20px;
+    width: fit-content;
+    border-bottom: 4px solid black;
+    cursor: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'  width='40' height='48' viewport='0 0 100 100' style='fill:black;font-size:24px;'><text y='50%'>🤯</text></svg>")
+            16 0,
+        auto; /*!emojicursor.app*/
+}
+
+a.mindblow:hover {
+    border-bottom-width: 0px;
+    margin-bottom: 4px;
+    transform: translateY(4px);
+}