aboutsummaryrefslogtreecommitdiff
path: root/src/lib/Header.svelte
diff options
context:
space:
mode:
Diffstat (limited to 'src/lib/Header.svelte')
-rw-r--r--src/lib/Header.svelte36
1 files changed, 35 insertions, 1 deletions
diff --git a/src/lib/Header.svelte b/src/lib/Header.svelte
index 27c7d09..a5ec702 100644
--- a/src/lib/Header.svelte
+++ b/src/lib/Header.svelte
@@ -21,7 +21,7 @@
}}
>
<input
- class="enter-username-button"
+ class="enter-username-input"
type="text"
placeholder="Enter username"
name="user-search"
@@ -34,3 +34,37 @@
/>
</form>
</header>
+
+<style>
+ header {
+ background-color: var(--theme-background);
+ box-shadow: 0 0 1em rgba(0, 0, 0, 0.8);
+ padding: 0.5rem 10%;
+ }
+
+ .user-form {
+ display: inline-block;
+ text-align: center;
+ font-size: 1.25rem;
+ /* center the forms */
+ margin: 0 auto;
+ width: max-content;
+ }
+
+ .enter-username-input {
+ box-shadow: none;
+ /* add a slight shadow on the form in the index page */
+ max-width: calc(90vw - 8em);
+ }
+
+ .back-arrow {
+ float: left;
+ transition: stroke 200ms;
+ stroke: var(--theme-darker-text);
+ margin-top: 0.4em;
+ margin-right: 1em;
+ }
+ .back-arrow:hover {
+ stroke: var(--theme-main-text);
+ }
+</style>