fix formatting

CVHS-student-sites · May 3, 2024 · 6f8289b · 6f8289b
1 parent cec0b9f
commit 6f8289b
Show file tree

Hide file tree

Showing 26 changed files with 579 additions and 566 deletions.
diff --git a/src/lib/components/Topnav.svelte b/src/lib/components/Topnav.svelte
@@ -1,40 +1,3 @@
-<div class="top">
- <div class="logo-cont">
- <a href="/"><img alt="cv logo" class="logo" loading="eager" rel="preload" src="/CVHS-logo.png"/></a>
- <div class="top-text">CVHS Locker System</div>
- </div>
-
- <div class="icon-cont">
- <a href="/">
- <div class="icon-stack">
- <div class="material-symbols-outlined">home</div>
- <div class="stack-text">Home</div>
- </div>
- </a>
-
- <a href="/register">
- <div class="icon-stack">
- <div class="material-symbols-outlined">person_add</div>
- <div class="stack-text">Register</div>
- </div>
- </a>
-
- <a href="/lookup">
- <div class="icon-stack">
- <div class="material-symbols-outlined">search</div>
- <div class="stack-text">Lookup</div>
- </div>
- </a>
-
- <a href="/help">
- <div class="icon-stack">
- <div class="material-symbols-outlined">help</div>
- <div class="stack-text">Help</div>
- </div>
- </a>
- </div>
-</div>
-
 <style>
  .logo-cont a {
  display: inherit;
@@ -138,9 +101,46 @@
  }
 
  @media only screen and (max-width: 600px) {
- .top{
+ .top {
  display: none;
  }
 
  }
 </style>
+
+<div class="top">
+ <div class="logo-cont">
+ <a href="/"><img alt="cv logo" class="logo" loading="eager" rel="preload" src="/CVHS-logo.png"/></a>
+ <div class="top-text">CVHS Locker System</div>
+ </div>
+
+ <div class="icon-cont">
+ <a href="/">
+ <div class="icon-stack">
+ <div class="material-symbols-outlined">home</div>
+ <div class="stack-text">Home</div>
+ </div>
+ </a>
+
+ <a href="/register">
+ <div class="icon-stack">
+ <div class="material-symbols-outlined">person_add</div>
+ <div class="stack-text">Register</div>
+ </div>
+ </a>
+
+ <a href="/lookup">
+ <div class="icon-stack">
+ <div class="material-symbols-outlined">search</div>
+ <div class="stack-text">Lookup</div>
+ </div>
+ </a>
+
+ <a href="/help">
+ <div class="icon-stack">
+ <div class="material-symbols-outlined">help</div>
+ <div class="stack-text">Help</div>
+ </div>
+ </a>
+ </div>
+</div>
diff --git a/src/lib/components/admin/Chart.svelte b/src/lib/components/admin/Chart.svelte
@@ -20,7 +20,7 @@
  ],
  };
 
- import { Doughnut } from "svelte-chartjs";
+ import {Doughnut} from "svelte-chartjs";
 
  import {
  Chart as ChartJS,
@@ -34,4 +34,4 @@
  ChartJS.register(Title, Tooltip, Legend, ArcElement, CategoryScale);
 </script>
 
-<Doughnut {data} width={100} options={{ maintainAspectRatio: false }} />
+<Doughnut {data} width={100} options={{ maintainAspectRatio: false }}/>
diff --git a/src/lib/components/admin/Topadmin.svelte b/src/lib/components/admin/Topadmin.svelte
@@ -30,7 +30,7 @@
  color: #d6d6d6;
  }
 
- a{
+ a {
  height: 100%;
  }
 </style>

diff --git a/src/lib/components/app/Map.svelte b/src/lib/components/app/Map.svelte
@@ -1,6 +1,6 @@
 <script>
- import { onMount } from "svelte";
- import { draw } from "svelte/transition";
+ import {onMount} from "svelte";
+ import {draw} from "svelte/transition";
 
  let objects = [];
  let selected = [];
@@ -31,7 +31,7 @@
 
 <style>
 
- .main{
+ .main {
  width: 100vw;
  height: 100vh;
  display: flex;
@@ -87,42 +87,46 @@
 </style>
 
 
- <div class="box">
-  <svg viewBox="0 0 1880 1500" class="img">
-  <image
+<div class="box">
+ <svg viewBox="0 0 1880 1500" class="img">
+ <image
  href="/maps_big.jpg"
  width="173%"
  x="-720"
  y="-142"
- />
-
- <text class="texts" x="570" y="310" font-size="100" z="1" fill="blue"
- >1000</text
- >
- <text class="texts" x="110" y="310" font-size="100" z="1" fill="blue"
- >2000</text
- >
- <text class="texts" x="1500" y="895" font-size="100" fill="blue"
- >7000</text
- >
- <text class="texts" x="1106" y="895" font-size="80" fill="blue"
- >5000</text
- >
-
- <g>
- {#each objects as feature, i}
- <!-- svelte-ignore a11y-click-events-have-key-events -->
- <!-- svelte-ignore a11y-no-static-element-interactions -->
- <path
+ />
+
+ <text class="texts" x="570" y="310" font-size="100" z="1" fill="blue"
+ >1000
+ </text
+ >
+ <text class="texts" x="110" y="310" font-size="100" z="1" fill="blue"
+ >2000
+ </text
+ >
+ <text class="texts" x="1500" y="895" font-size="100" fill="blue"
+ >7000
+ </text
+ >
+ <text class="texts" x="1106" y="895" font-size="80" fill="blue"
+ >5000
+ </text
+ >
+
+ <g>
+ {#each objects as feature, i}
+ <!-- svelte-ignore a11y-click-events-have-key-events -->
+ <!-- svelte-ignore a11y-no-static-element-interactions -->
+ <path
  stroke="blue"
  d={feature.data}
  on:click={() => (selected = feature)}
  class={`state ${i === select && "flash"}`}
  in:draw={{ delay: i * 200, duration: 1500 }}
  stroke-width="14"
-  />
-  {/each}
-  </g>
-  </svg>
- </div>
+ />
+ {/each}
+ </g>
+ </svg>
+</div>
 
diff --git a/src/lib/components/app/Select.svelte b/src/lib/components/app/Select.svelte
@@ -1,9 +1,12 @@
 <script>
- import Select from 'svelte-select';
+  import Select from 'svelte-select';
 
  export let items;
  export let value = null;
 
  export let placeholder;
 </script>
-<Select {items} bind:value clearable={false} searchable={false} showChevron={true} placeholder={placeholder} inputStyles="caret-color: transparent;" --list-border-radius="4px" --background="#17171c" --border="2px solid #005cb3" --border-hover="2px solid #577db2" --border-focused="2px solid #577db2" --list-background="#1a3c69" --item-color="#d6d6d6" --item-hover-bg="#0084ff"/>
+<Select {items} bind:value clearable={false} searchable={false} showChevron={true} placeholder={placeholder}
+ inputStyles="caret-color: transparent;" --list-border-radius="4px" --background="#17171c"
+ --border="2px solid #005cb3" --border-hover="2px solid #577db2" --border-focused="2px solid #577db2"
+ --list-background="#1a3c69" --item-color="#d6d6d6" --item-hover-bg="#0084ff"/>
diff --git a/src/lib/components/global/Switch.svelte b/src/lib/components/global/Switch.svelte
@@ -25,10 +25,10 @@
 {#if design == "inner"}
  <div class="s s--inner">
  <button
- role="switch"
- aria-checked={checked}
- aria-labelledby={`switch-${uniqueID}`}
- on:click={handleClick}
+  role="switch"
+  aria-checked={checked}
+  aria-labelledby={`switch-${uniqueID}`}
+  on:click={handleClick}
  >
  <span>on</span>
  <span>off</span>
@@ -37,28 +37,28 @@
 {:else if design == "slider"}
  <div class="s s--slider" style="font-size:{fontSize}px">
  <button
- role="switch"
- aria-checked={checked}
- aria-labelledby={`switch-${uniqueID}`}
- on:click={handleClick}
+  role="switch"
+  aria-checked={checked}
+  aria-labelledby={`switch-${uniqueID}`}
+  on:click={handleClick}
  >
  </button>
  </div>
 {:else}
  <div class="s s--multi">
  <div
- role="radiogroup"
- class="group-container"
- aria-labelledby={`label-${uniqueID}`}
- style="font-size:{fontSize}px"
- id={`group-${uniqueID}`}
+  role="radiogroup"
+  class="group-container"
+  aria-labelledby={`label-${uniqueID}`}
+  style="font-size:{fontSize}px"
+  id={`group-${uniqueID}`}
  >
  {#each options as option}
  <input
- type="radio"
- id={`${option}-${uniqueID}`}
- value={option}
- bind:group={value}
+  type="radio"
+  id={`${option}-${uniqueID}`}
+  value={option}
+  bind:group={value}
  />
  <label for={`${option}-${uniqueID}`}>
  {option}
@@ -73,12 +73,14 @@
  --accent-color: #0084ff;
  --gray: #ccc;
  }
+
  /* Inner Design Option */
  .s--inner button {
  padding: 0.5em;
  background-color: #fff;
  border: 1px solid var(--gray);
  }
+
  [role="switch"][aria-checked="true"] :first-child,
  [role="switch"][aria-checked="false"] :last-child {
  display: none;