From d99b9efb266a3f28bef3b6f89b4310b0bafb968d Mon Sep 17 00:00:00 2001
From: nbitzz <77242831+nbitzz@users.noreply.github.com>
Date: Wed, 8 Feb 2023 18:40:07 -0800
Subject: [PATCH] wip

---
 src/style/app/pulldown.scss               |  1 +
 src/style/app/pulldown/accounts.scss      |  3 ++-
 src/style/app/pulldown/files.scss         | 29 +++++++++++++++++++++++
 src/style/app/uploader/add_new_files.scss |  1 +
 src/svelte/App.svelte                     | 11 ++++++---
 src/svelte/elem/pulldowns/Files.svelte    | 28 ++++++++++++++++++++--
 src/svelte/elem/pulldowns/Help.svelte     |  2 ++
 src/svelte/elem/stores.mjs                |  3 +++
 8 files changed, 72 insertions(+), 6 deletions(-)
 create mode 100644 src/style/app/pulldown/files.scss
 create mode 100644 src/svelte/elem/stores.mjs

diff --git a/src/style/app/pulldown.scss b/src/style/app/pulldown.scss
index c5fb3ce..b3d6a42 100644
--- a/src/style/app/pulldown.scss
+++ b/src/style/app/pulldown.scss
@@ -1,6 +1,7 @@
 @use "../base";
 @use "pulldown/help";
 @use "pulldown/accounts";
+@use "pulldown/files";
 
 #overlay {
     position:absolute;
diff --git a/src/style/app/pulldown/accounts.scss b/src/style/app/pulldown/accounts.scss
index eaf97d5..ade4a27 100644
--- a/src/style/app/pulldown/accounts.scss
+++ b/src/style/app/pulldown/accounts.scss
@@ -8,7 +8,8 @@
             text-align:center;
 
             @media screen and (max-width:500px) {
-                transform:scale(1.35) translateY(-50%);
+                /* lazy */
+                transform:scale(1.15) translateY(-50%);
             }
 
             h1 {
diff --git a/src/style/app/pulldown/files.scss b/src/style/app/pulldown/files.scss
new file mode 100644
index 0000000..da89940
--- /dev/null
+++ b/src/style/app/pulldown/files.scss
@@ -0,0 +1,29 @@
+.pulldown_display[name=files] {
+    .notLoggedIn {
+        position:absolute;
+        top:100%;
+        transform:translateY(-100%);
+        width:100%;
+        text-align:center;
+        background-color:#202020;
+
+        .flavor {
+            font-size:16px;
+            color:#999999;
+            margin: 0 0 10px 0;
+        }
+
+        button {
+            background-color: #232323;
+            color:#999999;
+            font-size:14px;
+            border:1px solid #999999;
+            padding:2px 10px 2px 10px;
+            cursor:pointer;
+
+            &:hover {
+                background-color:#333333;
+            }
+        }
+    }
+}
\ No newline at end of file
diff --git a/src/style/app/uploader/add_new_files.scss b/src/style/app/uploader/add_new_files.scss
index d6ac942..9d03f5f 100644
--- a/src/style/app/uploader/add_new_files.scss
+++ b/src/style/app/uploader/add_new_files.scss
@@ -49,6 +49,7 @@
                 background-color:#333333;
                 color:#DDDDDD;
                 border:none;
+                border-radius: 0px;
                 outline:none;
                 padding:5px;
                 
diff --git a/src/svelte/App.svelte b/src/svelte/App.svelte
index 0811c3d..148cd58 100644
--- a/src/svelte/App.svelte
+++ b/src/svelte/App.svelte
@@ -3,6 +3,7 @@
     import Topbar from "./elem/Topbar.svelte";
     import PulldownManager from "./elem/PulldownManager.svelte";
     import UploadWindow from "./elem/UploadWindow.svelte";
+    import { pulldownManager } from "./elem/stores.mjs";
     
     /** 
      * @type Topbar
@@ -12,12 +13,16 @@
     /**
      * @type PulldownManager
     */
-    let pulldownManager;
+    let pulldown;
+
+    onMount(() => {
+        pulldownManager.set(pulldown)
+    })
 </script>
 
-<Topbar bind:this={topbar} pulldown={pulldownManager} />
+<Topbar bind:this={topbar} pulldown={pulldown} />
 <div id="appContent">
-    <PulldownManager bind:this={pulldownManager} />
+    <PulldownManager bind:this={pulldown} />
 
     <UploadWindow/>
 </div>
\ No newline at end of file
diff --git a/src/svelte/elem/pulldowns/Files.svelte b/src/svelte/elem/pulldowns/Files.svelte
index 7fb91ab..0226913 100644
--- a/src/svelte/elem/pulldowns/Files.svelte
+++ b/src/svelte/elem/pulldowns/Files.svelte
@@ -1,7 +1,31 @@
 <script>
     import Pulldown from "./Pulldown.svelte"
+    import { pulldownManager } from "../stores.mjs";
 </script>
 
-<Pulldown>
-    <p>no</p>
+<Pulldown name="files">
+
+    <div class="notLoggedIn">
+        <div style:height="2px" style:background-color="#66AAFF" />
+        <div style:height="10px" />
+        <p class="flavor"><em>Log in to view uploads & collections</em></p>
+        <button on:click={$pulldownManager.openPulldown("account")}>OK</button>
+        <div style:height="14px" />
+    </div>
+
+    <!-- 
+        put scrolling div containing options here
+        if not logged in, most options will be hidden
+        & the div containing the options will be resized
+        (actually, maybe we could use flexbox for this)
+    -->
+
+    <!--
+        <div>
+            <h2>Anonymous file deletion</h2>
+            <p>Enter your deletion code</p>
+            <input placeholder="0000 0000 0000 0000">
+        </div>
+    -->
+
 </Pulldown>
\ No newline at end of file
diff --git a/src/svelte/elem/pulldowns/Help.svelte b/src/svelte/elem/pulldowns/Help.svelte
index 5f5adcf..a74e52b 100644
--- a/src/svelte/elem/pulldowns/Help.svelte
+++ b/src/svelte/elem/pulldowns/Help.svelte
@@ -1,3 +1,5 @@
+<!-- i'm lazy, could probably just use plain html here but hwatever, mgiht make this grab from the server idk -->
+
 <script>
     import Pulldown from "./Pulldown.svelte"
 
diff --git a/src/svelte/elem/stores.mjs b/src/svelte/elem/stores.mjs
new file mode 100644
index 0000000..873963a
--- /dev/null
+++ b/src/svelte/elem/stores.mjs
@@ -0,0 +1,3 @@
+import { writable } from "svelte/store"
+
+export let pulldownManager = writable(0)
\ No newline at end of file