rename frontend to web and update contributing guide (#2509)

* rename frontend to web and update contributing guide

* rename this time

* fix build

* restructure rust code

* update documentation

* update descriptions

* Update CONTRIBUTING.md

Co-authored-by: J H <2364004+Blu-J@users.noreply.github.com>

---------

Co-authored-by: Aiden McClelland <me@drbonez.dev>
Co-authored-by: Aiden McClelland <3732071+dr-bonez@users.noreply.github.com>
Co-authored-by: J H <2364004+Blu-J@users.noreply.github.com>

web/projects/shared/styles/shared.scss

@@ -0,0 +1,159 @@
+$wide-modal: 900px;
+
+body {
+  -webkit-user-select: text;
+  -moz-user-select: text;
+  -ms-user-select: text;
+  user-select: text;
+}
+
+ion-input {
+  caret-color: gray;
+}
+
+ion-alert {
+  .alert-wrapper {
+    --min-width: 320px;
+  }
+}
+
+.swiper {
+  .swiper-slide {
+    display: unset;
+  }
+}
+
+ion-modal {
+  --max-height: 600px;
+  &::part(content) {
+    width: 90% !important;
+    left: 5%;
+  
+    border-radius: 6px;
+    border: 2px solid rgba(255, 255, 255, 0.03);
+    box-shadow: 0 32px 64px rgba(0, 0, 0, 0.2);
+  }
+}
+
+.alertlike-modal {
+  &::part(content) {
+    max-height: 380px !important;
+    top: 25% !important;
+    width: 90% !important;
+    left: 5% !important;
+    --box-shadow: none !important;
+  }
+}
+
+@media (min-width: 1000px) {
+  ion-modal::part(content) {
+    width: $wide-modal !important;
+    left: calc((100vw - $wide-modal) / 2) !important;
+  }
+
+  .alertlike-modal {
+    &::part(content) {
+      width: $wide-modal !important;
+      left: calc((100vw - $wide-modal) / 2) !important;
+    }
+  }
+
+  ion-alert {
+    .alert-wrapper {
+      --width: 50%;
+      --max-width: 500px;
+    }
+  }
+}
+
+.item-interactive {
+  --highlight-background: var(--ion-color-light) !important;
+}
+
+.hidden-scrollbar {
+  overflow: auto;
+  white-space: nowrap;
+  height: 60px;
+
+  /* Hide scrollbar for Chrome, Safari and Opera */
+  &::-webkit-scrollbar {
+    width: 0;
+    height: 0;
+  }
+
+  /* Hide scrollbar for IE, Edge and Firefox */
+  /* IE and Edge */
+  -ms-overflow-style: none;
+  /* Firefox */
+  scrollbar-width: none;
+}
+
+.divider {
+  background: linear-gradient(90deg,
+      var(--ion-color-light) 0,
+      var(--ion-color-dark) 50%,
+      var(--ion-color-light) 100%);
+  height: 1px;
+}
+
+.loading-dots:after {
+  content: '...';
+  overflow: hidden;
+  display: inline-block;
+  vertical-align: bottom;
+  animation: ellipsis-dot 1s infinite 0.3s;
+  animation-fill-mode: forwards;
+  width: 1em;
+}
+
+.courier-new {
+  font-family: 'Courier New';
+}
+
+.montserrat {
+  font-family: 'Montserrat', sans-serif !important;
+}
+
+.color-success-shade {
+  color: var(--ion-color-success-shade)
+}
+
+.color-primary-shade {
+  color: var(--ion-color-primary-shade)
+}
+
+@keyframes ellipsis-dot {
+  25% {
+    content: '';
+  }
+
+  50% {
+    content: '.';
+  }
+
+  75% {
+    content: '..';
+  }
+
+  100% {
+    content: '...';
+  }
+}
+
+.alert-error-message {
+  .alert-title {
+    color: var(--ion-color-danger);
+  }
+}
+
+.alert-warning-message {
+  .alert-title {
+    color: var(--ion-color-warning);
+  }
+}
+
+.alert-success-message {
+  .alert-title {
+    color: var(--ion-color-success);
+  }
+}