user page without inline css :tada:

1 files changed, 46 insertions, 0 deletions

diff --git a/styles/user.css b/styles/user.css
new file mode 100644
index 0000000..d66fa94
--- /dev/null
+++ b/styles/user.css
@@ -0,0 +1,46 @@
+.infosection .inner {
+	height: 64px;
+}
+
+/* editable field status */
+*[contenteditable] {
+	box-shadow: inset 0 0 0 0px var(--foreground);
+}
+*[contenteditable="true"]:focus {
+	box-shadow: inset 0 0 0 2px var(--accent);
+}
+*[contenteditable="true"] {
+	background-color: var(--background);
+	color: var(--text-alt);
+	padding: 8px;
+	box-shadow: inset 0 0 0 2px var(--foreground);
+}
+
+.accountHeader .userInfo {
+	margin-left: var(--spacing-medium);
+	width: calc(100% - 128px - var(--spacing-medium));
+}
+
+.accountHeader .userInfo .username {
+	font-size: 2rem;
+}
+
+.accountHeader .userInfo .status {
+	transition-duration: .3s;
+	margin-top: var(--spacing-small);
+}
+
+.infoModule .iconWrapper {
+	left: 50%;
+	transform: translateX(-50%);
+}
+
+.infoModule .labelWrapper {
+	top: calc(24px + var(--spacing-small));
+}
+
+.infoModule .labelWrapper .label {
+	top: 50%;
+	transform: translateY(-50%);
+}
+