diff --git a/settings.php b/settings.php
new file mode 100644
index 0000000..13d3d3a
--- /dev/null
+++ b/settings.php
@@ -0,0 +1,44 @@
+
+
+
+
+
+
diff --git a/styles/colours.css b/styles/colours.css
index 287d9f0..aac47e3 100644
--- a/styles/colours.css
+++ b/styles/colours.css
@@ -27,6 +27,9 @@
--background: white;
--background-dark: #121212;
+ --foreground: black;
+ --foreground-dark: white;
+
color-scheme: light dark;
}
@@ -107,8 +110,15 @@ input[data-com-onepassword-filled="dark"] {
}
@media screen and (prefers-color-scheme: dark) {
+ :root {
+ --background: #121212;
+ --foreground: white;
+
+ color-scheme: light dark;
+ }
+
html {
- background: var(--background-dark, #121212);
+ background: var(--background, #121212);
}
button.primary, .button.primary {
@@ -126,7 +136,6 @@ input[data-com-onepassword-filled="dark"] {
}
input, textarea {
-
background-color: #2c2c2c77;
}
diff --git a/styles/profiles.css b/styles/profiles.css
index 01c8d67..fb02a44 100644
--- a/styles/profiles.css
+++ b/styles/profiles.css
@@ -1,5 +1,5 @@
-#profile {
+#mini_profile {
display: flex;
gap: 1rem;
padding: 1rem;
@@ -12,18 +12,18 @@
background: var(--grey-0);
}
-#profile > .avatar {
+#mini_profile > .avatar {
height: 150px;
border-radius: 1em;
}
-#profile > .info > .displayname {
+#mini_profile > .info > .displayname {
font-size: 2.5rem;
font-weight: bolder;
}
-#profile > .info > .bcid {
+#mini_profile > .info > .bcid {
font-size: 1.5rem;
}
@@ -63,7 +63,7 @@
}
@media screen and (prefers-color-scheme: dark) {
- #profile {
+ #mini_profile {
background: var(--grey-9);
}
}
diff --git a/styles/settings.css b/styles/settings.css
new file mode 100644
index 0000000..86ad52f
--- /dev/null
+++ b/styles/settings.css
@@ -0,0 +1,69 @@
+
+#settings_split {
+ display: grid;
+
+ grid-template-columns: 1fr 4fr;
+}
+
+#mini_profile {
+ display: flex;
+ flex-direction: column;
+
+ border-radius: 1.5rem;
+ overflow: clip;
+}
+
+#mini_profile .image_container {
+ display: flex;
+ background: linear-gradient(to bottom, white, var(--background) 90%);
+}
+
+#mini_profile .image_container img {
+ width: 50%;
+ margin: 0.5rem auto auto;
+ padding-top: 0.5rem;
+ border-radius: 1rem;
+}
+
+#mini_profile .texts {
+ text-align: center;
+ display: flex;
+ flex-direction: column;
+
+ padding-top: 1rem;
+}
+
+#mini_profile .texts .displayname {
+ font-size: 2rem;
+ font-weight: bold;
+}
+
+#settings_list {
+ list-style: none;
+}
+
+#settings_list > h1 {
+ margin: 0 0 1rem 0;
+}
+
+#settings_list li {
+ border-top: var(--foreground) 1px solid;
+}
+
+#settings_list li:first-child {
+ border-top: none;
+}
+
+#settings_list li > a {
+ display: block;
+ padding: 1rem 0;
+
+ color: var(--foreground);
+ text-decoration: none;
+
+ transition: color 0.2s ease-in-out;
+}
+
+#settings_list li > a:hover {
+ color: var(--flax)
+}
+
+
+
+ />
+
+
+ = htmlspecialchars(get_display_name($user['id'], false)) ?>
+ = format_bcid($user['id']) ?>
+
+ -
+
- + + + Account + + +
- + + + Return to Dashboard + + +