Merge remote-tracking branch 'up/dewikification' into guides-app

3 files changed, 29 insertions, 199 deletions

diff --git a/pydis_site/static/css/base/notification.css b/pydis_site/static/css/base/notification.css
deleted file mode 100644
index b2824641..00000000
--- a/pydis_site/static/css/base/notification.css
+++ /dev/null
@@ -1,99 +0,0 @@
-/* On-page message styling */
-
-@keyframes message-slide-in {
-    0% {
-        transform: translateX(100%);
-    }
-
-    100% {
-        transform: translateX(0);
-    }
-}
-
-div.messages {
-    animation: 0.5s ease-out 0s 1 message-slide-in;
-    padding: 0.5rem;
-    position: fixed;
-    right: 0;
-    top: 76px;
-
-    z-index: 1000;  /* On top of everything else */
-}
-
-/* Discord light theme inspired notifications */
-
-.messages .notification {
-    background-color: #fdfdfd;  /* Discord embed background */
-    border: #eeeeee 1px solid;  /* Discord embed border */
-    border-left: #4f545c 4px solid;  /* Discord default embed colour */
-    color: #4a4a4a;  /* Bulma default colour */
-}
-
-.messages .notification.is-primary {
-    background-color: #fdfdfd;
-    border-left-color: #7289DA;
-    color: #4a4a4a;  /* Bulma default colour */
-}
-
-.messages .notification.is-info {
-    background-color: #fdfdfd;
-    border-left-color: #1c8ad3;  /* Bulma default colour */
-    color: #4a4a4a;  /* Bulma default colour */
-}
-
-.messages .notification.is-success {
-    background-color: #fdfdfd;
-    border-left-color: #21c65c;
-    color: #4a4a4a;  /* Bulma default colour */
-}
-
-.messages .notification.is-warning {
-    background-color: #fdfdfd;
-    border-left-color: #ffdd57;  /* Bulma default colour */
-    color: #4a4a4a;  /* Bulma default colour */
-}
-
-.messages .notification.is-danger {
-    background-color: #fdfdfd;
-    border-left-color: #ff3860;  /* Bulma default colour */
-    color: #4a4a4a;  /* Bulma default colour */
-}
-
-/* Discord dark theme inspired notifications */
-
-.messages .notification.is-dark {
-    background-color: #33353C;  /* Discord embed background */
-    border: #36393f 1px solid;  /* Discord embed border */
-    border-left: #4f545c 4px solid;  /* Discord default embed colour */
-    color: #fff;  /* Bulma default colour */
-}
-
-.messages .notification.is-dark.is-primary {
-    background-color: #33353C;
-    border-left-color: #7289DA;
-    color: #fff;  /* Bulma default colour */
-}
-
-.messages .notification.is-dark.is-info {
-    background-color: #33353C;
-    border-left-color: #1c8ad3;  /* Bulma default colour */
-    color: #fff;  /* Bulma default colour */
-}
-
-.messages .notification.is-dark.is-success {
-    background-color: #33353C;
-    border-left-color: #21c65c;
-    color: #fff;  /* Bulma default colour */
-}
-
-.messages .notification.is-dark.is-warning {
-    background-color: #33353C;
-    border-left-color: #ffdd57;  /* Bulma default colour */
-    color: #fff;  /* Bulma default colour */
-}
-
-.messages .notification.is-dark.is-danger {
-    background-color: #33353C;
-    border-left-color: #ff3860;  /* Bulma default colour */
-    color: #fff;  /* Bulma default colour */
-}
diff --git a/pydis_site/static/css/resources/resources.css b/pydis_site/static/css/resources/resources.css
new file mode 100644
index 00000000..cf4cb472
--- /dev/null
+++ b/pydis_site/static/css/resources/resources.css
@@ -0,0 +1,29 @@
+.box, .tile.is-parent {
+    transition: 0.1s ease-out;
+}
+.box {
+    min-height: 15vh;
+}
+.tile.is-parent:hover .box {
+    box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);
+}
+.tile.is-parent:hover {
+    padding: 0.65rem 0.85rem 0.85rem 0.65rem;
+    filter: saturate(1.1) brightness(1.1);
+}
+
+#readingBlock {
+    background-image: linear-gradient(141deg, #911eb4 0%, #b631de 71%, #cf4bf7 100%);
+}
+
+#interactiveBlock {
+    background-image: linear-gradient(141deg, #d05600 0%, #da722a 71%, #e68846 100%);
+}
+
+#communitiesBlock {
+    background-image: linear-gradient(141deg, #3b756f 0%, #3a847c 71%, #41948b 100%);
+}
+
+#podcastsBlock {
+    background-image: linear-gradient(141deg, #232382 0%, #30309c 71%, #4343ad 100%);
+}
diff --git a/pydis_site/static/js/base/modal.js b/pydis_site/static/js/base/modal.js
deleted file mode 100644
index eccc8845..00000000
--- a/pydis_site/static/js/base/modal.js
+++ /dev/null
@@ -1,100 +0,0 @@
-/*
- modal.js: A simple way to wire up Bulma modals.
-
- This library is intended to be used with Bulma's modals, as described in the
- official Bulma documentation. It's based on the JavaScript that Bulma
- themselves use for this purpose on the modals documentation page.
-
- Note that, just like that piece of JavaScript, this library assumes that
- you will only ever want to have one modal open at once.
- */
-
-"use strict";
-
-// Event handler for the "esc" key, for closing modals.
-
-document.addEventListener("keydown", (event) => {
-  const e = event || window.event;
-
-  if (e.code === "Escape" || e.keyCode === 27) {
-    closeModals();
-  }
-});
-
-// An array of all the modal buttons we've already set up
-
-const modal_buttons = [];
-
-// Public API functions
-
-function setupModal(target) {
-  // Set up a modal's events, given a DOM element. This can be
-  // used later in order to set up a modal that was added after
-  // this library has been run.
-
-  // We need to collect a bunch of elements to work with
-  const modal_background = Array.from(target.getElementsByClassName("modal-background"));
-  const modal_close = Array.from(target.getElementsByClassName("modal-close"));
-
-  const modal_head = Array.from(target.getElementsByClassName("modal-card-head"));
-  const modal_foot = Array.from(target.getElementsByClassName("modal-card-foot"));
-
-  const modal_delete = [];
-  const modal_button = [];
-
-  modal_head.forEach((element) => modal_delete.concat(Array.from(element.getElementsByClassName("delete"))));
-  modal_foot.forEach((element) => modal_button.concat(Array.from(element.getElementsByClassName("button"))));
-
-  // Collect all the elements that can be used to close modals
-  const modal_closers = modal_background.concat(modal_close).concat(modal_delete).concat(modal_button);
-
-  // Assign click events for closing modals
-  modal_closers.forEach((element) => {
-    element.addEventListener("click", () => {
-      closeModals();
-    });
-  });
-
-  setupOpeningButtons();
-}
-
-function setupOpeningButtons() {
-  // Wire up all the opening buttons, avoiding buttons we've already wired up.
-  const modal_opening_buttons = Array.from(document.getElementsByClassName("modal-button"));
-
-  modal_opening_buttons.forEach((element) => {
-    if (!modal_buttons.includes(element)) {
-      element.addEventListener("click", () => {
-        openModal(element.dataset.target);
-      });
-
-      modal_buttons.push(element);
-    }
-  });
-}
-
-function openModal(target) {
-  // Open a modal, given a string ID
-  const element = document.getElementById(target);
-
-  document.documentElement.classList.add("is-clipped");
-  element.classList.add("is-active");
-}
-
-function closeModals() {
-  // Close all open modals
-  const modals = Array.from(document.getElementsByClassName("modal"));
-  document.documentElement.classList.remove("is-clipped");
-
-  modals.forEach((element) => {
-    element.classList.remove("is-active");
-  });
-}
-
-(function () {
-  // Set up all the modals currently on the page
-  const modals = Array.from(document.getElementsByClassName("modal"));
-
-  modals.forEach((modal) => setupModal(modal));
-  setupOpeningButtons();
-}());