-
+
+
-
Minimum
-
+ Minimum
+
- OS: Meta Horizon OS
- Chipset: Qualcomm Snapdragon XR2.
- GPU: Qualcomm Adreno 650.
@@ -82,6 +86,13 @@
+
+
diff --git a/web/main.css b/web/main.css
index ef89110..7dfa117 100644
--- a/web/main.css
+++ b/web/main.css
@@ -521,18 +521,33 @@
}
}
@layer utilities {
+ .absolute {
+ position: absolute;
+ }
.fixed {
position: fixed;
}
.top-0 {
top: calc(var(--spacing) * 0);
}
+ .top-\[50\%\] {
+ top: 50%;
+ }
.right-0 {
right: calc(var(--spacing) * 0);
}
.left-0 {
left: calc(var(--spacing) * 0);
}
+ .left-\[50\%\] {
+ left: 50%;
+ }
+ .mx-\[2\.5\%\] {
+ margin-inline: 2.5%;
+ }
+ .my-2 {
+ margin-block: calc(var(--spacing) * 2);
+ }
.ml-10 {
margin-left: calc(var(--spacing) * 10);
}
@@ -548,15 +563,36 @@
.h-40 {
height: calc(var(--spacing) * 40);
}
+ .h-60 {
+ height: calc(var(--spacing) * 60);
+ }
+ .h-\[30vw\] {
+ height: 30vw;
+ }
.h-fit {
height: fit-content;
}
+ .h-full {
+ height: 100%;
+ }
.h-screen {
height: 100vh;
}
.w-2\/3 {
width: calc(2/3 * 100%);
}
+ .w-3\/4 {
+ width: calc(3/4 * 100%);
+ }
+ .w-\[20\%\] {
+ width: 20%;
+ }
+ .w-\[30vw\] {
+ width: 30vw;
+ }
+ .w-\[40vw\] {
+ width: 40vw;
+ }
.w-fit {
width: fit-content;
}
@@ -566,6 +602,17 @@
.w-screen {
width: 100vw;
}
+ .translate-\[-50\%\] {
+ --tw-translate-x: -50%;
+ --tw-translate-y: -50%;
+ translate: var(--tw-translate-x) var(--tw-translate-y);
+ }
+ .cursor-pointer {
+ cursor: pointer;
+ }
+ .cursor-text {
+ cursor: text;
+ }
.flex-col {
flex-direction: column;
}
@@ -578,9 +625,12 @@
.self-center {
align-self: center;
}
- .border-b-4 {
- border-bottom-style: var(--tw-border-style);
- border-bottom-width: 4px;
+ .rounded-md {
+ border-radius: var(--radius-md);
+ }
+ .border-2 {
+ border-style: var(--tw-border-style);
+ border-width: 2px;
}
.border-black {
border-color: var(--color-black);
@@ -606,9 +656,15 @@
line-height: 1.5rem;
font-weight: 400;
}
+ .bg-slate-200 {
+ background-color: var(--color-slate-200);
+ }
.p-1 {
padding: calc(var(--spacing) * 1);
}
+ .px-1 {
+ padding-inline: calc(var(--spacing) * 1);
+ }
.px-2\.5 {
padding-inline: calc(var(--spacing) * 2.5);
}
@@ -618,9 +674,15 @@
.px-\[15vw\] {
padding-inline: 15vw;
}
+ .py-4 {
+ padding-block: calc(var(--spacing) * 4);
+ }
.py-8 {
padding-block: calc(var(--spacing) * 8);
}
+ .py-10 {
+ padding-block: calc(var(--spacing) * 10);
+ }
.pt-28 {
padding-top: calc(var(--spacing) * 28);
}
@@ -630,6 +692,9 @@
.pb-10 {
padding-bottom: calc(var(--spacing) * 10);
}
+ .text-center {
+ text-align: center;
+ }
.text-justify {
text-align: justify;
}
@@ -637,10 +702,26 @@
font-size: var(--text-2xl);
line-height: var(--tw-leading, var(--text-2xl--line-height));
}
+ .text-4xl {
+ font-size: var(--text-4xl);
+ line-height: var(--tw-leading, var(--text-4xl--line-height));
+ }
.font-bold {
--tw-font-weight: var(--font-weight-bold);
font-weight: var(--font-weight-bold);
}
+ .backdrop\:opacity-75 {
+ &::backdrop {
+ opacity: 75%;
+ }
+ }
+ .hover\:bg-slate-200 {
+ &:hover {
+ @media (hover: hover) {
+ background-color: var(--color-slate-200);
+ }
+ }
+ }
}
@keyframes spin {
to {
@@ -668,6 +749,21 @@
animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
}
}
+@property --tw-translate-x {
+ syntax: "*";
+ inherits: false;
+ initial-value: 0;
+}
+@property --tw-translate-y {
+ syntax: "*";
+ inherits: false;
+ initial-value: 0;
+}
+@property --tw-translate-z {
+ syntax: "*";
+ inherits: false;
+ initial-value: 0;
+}
@property --tw-border-style {
syntax: "*";
inherits: false;
diff --git a/web/profile.html b/web/profile.html
new file mode 100644
index 0000000..b5c0ef9
--- /dev/null
+++ b/web/profile.html
@@ -0,0 +1,104 @@
+
+
+
+
+
+
Solace Of Service
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/web/profile.js b/web/profile.js
new file mode 100644
index 0000000..07b1032
--- /dev/null
+++ b/web/profile.js
@@ -0,0 +1,21 @@
+
+
+
+
+
+const signInDialog = document.getElementById("signInDialog");
+const signUpDialog = document.getElementById("signUpDialog");
+document.addEventListener("DOMContentLoaded", (event) => {});
+
+function ShowSignIn() {
+ // signUpDialog.close();
+ signInDialog.showModal();
+ console.log("sign in showed");
+}
+function ShowSignUp() {
+ signInDialog.close()
+ signUpDialog.showModal()
+ console.log("sign up showed")
+
+}
+