Mobile Navbar attempt

2023-02-16 17:51:43 -07:00 · 2023-02-16 17:51:43 -07:00 · ff7a0262b0
commit ff7a0262b0
parent 2d8e93b5fe
12 changed files with 381 additions and 25 deletions
--- a/Socials.html
+++ b/Socials.html
@ -6,7 +6,7 @@
    <link rel = "icon" href = "assets/branding/obo-icon.png">
    <title>LimePot - Socials</title>
    <link rel="stylesheet" href="mybulma/css/mystyles.css">
-
+    

  </head>
  <body>
@ -92,8 +92,7 @@
      </h1>
      <div class="content">
        <a href="https://snowdin.town/LimePotato">Fediverse</a>
-        <iframe allowfullscreen sandbox="allow-top-navigation allow-scripts allow-popups allow-popups-to-escape-sandbox" width="800" height="800" src="https://www.mastofeed.com/apiv2/feed?userurl=https%3A%2F%2Fsnowdin.town%2Fusers%2Flimepotato&theme=dark&size=100&header=true&replies=false&boosts=false"></iframe>
-        <br><br>
+        <br>
        <a href="https://limpot.xyz/redir/discord">Discord</a>
       
        <script src='https://storage.ko-fi.com/cdn/scripts/overlay-widget.js'></script>
@ -106,14 +105,20 @@
  });
 </script>
 <br><br><br>
-<a href="https://bulma.io">
-  <img
-    src="https://bulma.io/images/made-with-bulma.png"
-    alt="Made with Bulma"
-    width="128"
-    height="24">
+
+<br>
+
 </a>
-        </div>
+      </div>
+        <footer class="footer">
+          <div class="content has-text-centered">
+            <p>Created using <strong><a href="https://bulma.io">Bulma and Extensions</a></strong></p>
+            <br>
+            <p>
+              Website by <strong><a href="about.html">LimePotato / Luna-Nelle</a></strong>
+            </p>
+          </div>
+        </footer>
    </div>
  </section>
  </body>
--- a/index.html
+++ b/index.html
@ -7,7 +7,6 @@
    <title>LimePot - Home</title>
    <link rel="stylesheet" href="mybulma/css/mystyles.css">

-
  </head>
  <body>
    <nav class="navbar" role="navigation" aria-label="main navigation">
@ -16,15 +15,9 @@
            <img src="assets/obo-icon.png">
            LimePot
          </a>
-      
-          <a role="button" class="navbar-burger" aria-label="menu" aria-expanded="false" data-target="navbarBasicExample">
-            <span aria-hidden="true"></span>
-            <span aria-hidden="true"></span>
-            <span aria-hidden="true"></span>
-          </a>
        </div>
      
-        <div id="navbarBasicExample" class="navbar-menu">
+        <div class="navbar-menu">
          <div class="navbar-start">
            <a class="navbar-item" href="https://limepot.xyz/">
              Home
@ -78,7 +71,11 @@
          </div>
      
          <div class="navbar-end">
-            
+            <a role="button" class="navbar-burger" aria-label="menu" aria-expanded="false">
+              <span aria-hidden="true"></span>
+              <span aria-hidden="true"></span>
+              <span aria-hidden="true"></span>
+            </a>
              </div>
            </div>
          </div>
@ -93,8 +90,10 @@
      Hello World 
      </h1>
      <div class="content">
-        <br><br>
+        
+        <br>
        <a href="#">0 Days since last incident.</a>
+        <p>THIS WEBSITE IS BROKEN ON MOBILE <strong><a href="https://limepot.xyz/ALPHA">Please use the Alpha Site</a></strong></p>
        <br><br>
        <p class="subtitle">"Forever - is composed of Nows</p>
        <p class="subtitle">`Tis not a different time -</p>
@ -116,7 +115,7 @@
    'floating-chat.donateButton.text-color': '#fff'
  });
 </script>
-<br><br><br>
+<br><br>
 <a href="https://bulma.io">
  <img
    src="https://bulma.io/images/made-with-bulma.png"
--- a/node_modules/.package-lock.json
+++ b/node_modules/.package-lock.json
@ -1,5 +1,5 @@
 {
-  "name": "BETA",
+  "name": "limepot.xyz",
  "lockfileVersion": 2,
  "requires": true,
  "packages": {
@ -12,6 +12,11 @@
      "version": "0.0.5",
      "resolved": "https://registry.npmjs.org/bulma-start/-/bulma-start-0.0.5.tgz",
      "integrity": "sha512-Sl8mdbmxa8eZJmvAfvUqQ1yptGG/kC+VvxixH3oWj1n87rpzFetotcrIs0mldD8t6Cby3Nv+hxA/2pkzDwkaBQ=="
+    },
+    "node_modules/bulma-toast": {
+      "version": "2.4.2",
+      "resolved": "https://registry.npmjs.org/bulma-toast/-/bulma-toast-2.4.2.tgz",
+      "integrity": "sha512-c3ehyeXhhvxevKICP1VKsFtZlQH+H6/S+yYY4TFyLRfkbw3mh71eGazlNc/YEIvXQSbxHpD2f+WDc02xECuV9g=="
    }
  }
 }
--- a/node_modules/bulma-toast/LICENSE
+++ b/node_modules/bulma-toast/LICENSE
@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2018 Rafael Franco
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
--- a/node_modules/bulma-toast/README.md
+++ b/node_modules/bulma-toast/README.md
@ -0,0 +1,192 @@
+# bulma-toast
+
+[![npm version](https://badge.fury.io/js/bulma-toast.svg)](https://badge.fury.io/js/bulma-toast)
+![Publish](https://github.com/rfoel/bulma-toast/workflows/Publish/badge.svg)
+
+Bulma's pure JavaScript extension to display toasts. Basically a Bulma's [notification](https://bulma.io/documentation/elements/notification) implemented as a toast plugin.
+
+[Demo](https://rfoel.github.io/bulma-toast/)
+
+![Bulma Toast](https://raw.githubusercontent.com/rfoel/bulma-toast/master/bulma-toast.png)
+
+## Options
+
+The plugin comes with the following options:
+
+- `message`: The actual message to be displayed. It can be a string, a template string, or a DOM node. [See examples](#examples). This is **required**.
+- `type`: Essentially a Bulma's css class. It can be `is-primary`, `is-link`, `is-info`, `is-success`, `is-warning`, `is-danger`, or any other custom class. Default is a whitesmoke background with dark text as shown [here](https://bulma.io/documentation/elements/notification).
+- `duration`: Duration of the notification in milliseconds. Default is `2000` milliseconds.
+- `position`: Position where the notification will be shown. The default is `top-right`, so if you want it to be on the top-left just add `top-left` to this option. The available options are: `top-left`, `top-center`, `top-right`, `center`, `bottom-left`, `bottom-center`, and `bottom-right`.
+- `dismissible`: Whether the notification will have a close button or not. Default is `false`.
+- `pauseOnHover`: Pauses delay when hovering the notification. Default is `false`.
+- `single`: Only show a single toast in `appendTo`. Default is `false`.
+- `closeOnClick`: Dismisses the notification when clicked. Default is `true`.
+- `opacity`: The notification's container opacity. Default is `1`.
+- `animate`: [See here](#animate). Default is no animations.
+- `appendTo`: By default, the notification will be appended to [`document.body`](https://developer.mozilla.org/en-US/docs/Web/API/Document/body). Pass a different [Node](https://developer.mozilla.org/en-US/docs/Web/API/Node) to have it appended else where in the [DOM](https://developer.mozilla.org/en-US/docs/Web/API/Document_Object_Model).
+- `extraClasses`: Adds classes for styling the toast notification.
+## Install
+
+```
+  npm install bulma-toast
+```
+
+or
+
+```
+  yarn add bulma-toast
+```
+
+## Quick Start
+
+1.  Link to bulma-toast.min.js
+
+```html
+<script src="bulma-toast.min.js"></script>
+```
+
+2.  Use bulma-toast to display a toast
+
+```js
+bulmaToast.toast({ message: 'Hello There' })
+bulmaToast.toast({ message: 'General Kenobi', type: 'is-danger' })
+```
+
+## ES Modules
+
+```js
+// Import the toast function
+import * as bulmaToast from 'bulma-toast'
+// Or use
+// import { toast as superToast } from 'bulma-toast'
+// to rename your import
+
+toast({
+  message: 'Hello There',
+  type: 'is-success',
+  dismissible: true,
+  animate: { in: 'fadeIn', out: 'fadeOut' },
+})
+```
+
+## Default config
+
+A simple default object to prevent errors. Your options will be merged with these and the defaults will be used if the fields are not provided.
+
+```json
+{
+  "duration": 2000,
+  "position": "top-right",
+  "closeOnClick": true,
+  "opacity": 1,
+  "single": false,
+  "offsetTop": 0,
+  "offsetBottom": 0,
+  "offsetLeft": 0,
+  "offsetRight": 0
+}
+```
+
+The default config can be updated using the funcion `setDefaults`. Also, it's possible to reset to the default config using `resetDefaults`
+
+```js
+bulmaToast.setDefaults({
+  duration: 1000,
+  position: 'top-left',
+  closeOnClick: false,
+})
+```
+
+## Change document context
+
+```js
+bulmaToast.setDoc(window.document)
+```
+
+This can be changed before each toast call and can be set to eny element.
+
+## Animate
+
+Bulma Toast supports [animate.css](https://daneden.github.io/animate.css/) (and maybe others?). You MUST include [animate.css](https://daneden.github.io/animate.css/) on your document's `<head>`
+
+```html
+<head>
+  <link rel="stylesheet" href="animate.min.css" />
+  <!-- or -->
+  <link
+    rel="stylesheet"
+    href="https://cdn.jsdelivr.net/npm/animate.css@4.0.0/animate.min.css"
+  />
+  <!-- or -->
+  <link
+    rel="stylesheet"
+    href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.0.0/animate.min.css"
+  />
+</head>
+```
+
+Accepts a object with `in` and `out` with css classes to add animations. Using Animate.css you would pass a object like this:
+
+```js
+  {
+    message: "I'm animated! Yay!",
+    duration: 2000,
+    position: "top-right",
+    animate: { in: 'fadeIn', out: 'fadeOut' }
+  }
+```
+
+_Warning_: Don't use `opacity` when using animations. Some of them use the opacity property like fade in and fade out.
+
+## Examples
+
+```js
+import { toast } from 'bulma-toast'
+
+toast({
+  message: 'Hello There',
+  type: 'is-success',
+  dismissible: true,
+  pauseOnHover: true,
+})
+
+toast({
+  message: '<h1>LOOK HERE</h1>',
+  type: 'is-danger',
+  dismissible: true,
+  pauseOnHover: true,
+  animate: { in: 'fadeIn', out: 'fadeOut' },
+})
+
+const myMessage = `It's ${new Date().toDateString()}`
+
+toast({
+  message: myMessage,
+  type: 'is-primary',
+  position: 'center',
+  closeOnClick: true,
+  pauseOnHover: true,
+  opacity: 0.8,
+})
+
+const elm = document.createElement('a')
+elm.text = 'Visit my website!'
+elm.href = 'https://rfoel.com'
+
+toast({
+  message: elm,
+  type: 'is-warning',
+  position: 'center',
+  closeOnClick: true,
+  pauseOnHover: true,
+  animate: { in: 'fadeIn', out: 'fadeOut' },
+})
+```
+
+## Contributing
+
+Issues and pull requests are welcome.
+
+## License
+
+[MIT](https://github.com/rfoell/bulma-toast/blob/master/LICENSE)
--- a/node_modules/bulma-toast/dist/bulma-toast.cjs.js
+++ b/node_modules/bulma-toast/dist/bulma-toast.cjs.js
--- a/node_modules/bulma-toast/dist/bulma-toast.esm.js
+++ b/node_modules/bulma-toast/dist/bulma-toast.esm.js
--- a/node_modules/bulma-toast/dist/bulma-toast.min.js
+++ b/node_modules/bulma-toast/dist/bulma-toast.min.js
--- a/node_modules/bulma-toast/index.d.ts
+++ b/node_modules/bulma-toast/index.d.ts
@ -0,0 +1,46 @@
+export function toast(options: Options): void;
+
+export function setDefaults(options: Options): void;
+
+export function resetDefaults(): void;
+
+export interface Options {
+  message?: string | HTMLElement;
+  type?: ToastType;
+  duration?: number;
+  position?: ToastPosition;
+  dismissible?: boolean;
+  pauseOnHover?: boolean;
+  closeOnClick?: boolean;
+  single?: boolean;
+  opacity?: number;
+  animate?: ToastAnimation;
+  appendTo?: Node;
+  extraClasses?: string;
+}
+
+export type ToastType = 'is-primary'
+  | 'is-link'
+  | 'is-info'
+  | 'is-success'
+  | 'is-warning'
+  | 'is-danger'
+  | 'is-white'
+  | 'is-black'
+  | 'is-light'
+  | 'is-dark';
+
+export type ToastPosition = 'top-left'
+  | 'top-right'
+  | 'top-center'
+  | 'center'
+  | 'bottom-left'
+  | 'bottom-center'
+  | 'bottom-right';
+
+export interface ToastAnimation {
+  in?: string;
+  out?: string;
+}
+
+export function setDoc(newDoc: HTMLElement): void;
--- a/node_modules/bulma-toast/package.json
+++ b/node_modules/bulma-toast/package.json
@ -0,0 +1,58 @@
+{
+  "name": "bulma-toast",
+  "version": "2.4.2",
+  "description": "Bulma's pure JavaScript extension to display toasts",
+  "main": "dist/bulma-toast.cjs.js",
+  "module": "dist/bulma-toast.esm.js",
+  "browser": "dist/bulma-toast.min.js",
+  "scripts": {
+    "build": "rollup -c",
+    "prepare": "npm run build",
+    "start": "rollup -c -w",
+    "test": "jest"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/rfoel/bulma-toast.git"
+  },
+  "keywords": [
+    "bulma",
+    "bulma",
+    "extensions",
+    "bulma.io"
+  ],
+  "author": "@rfoel <rafaelfr@outlook.com>",
+  "license": "MIT",
+  "bugs": {
+    "url": "https://github.com/rfoel/bulma-toast/issues"
+  },
+  "homepage": "https://rfoel.com/bulma-toast",
+  "devDependencies": {
+    "@babel/preset-env": "^7.15.0",
+    "@semantic-release/changelog": "^5.0.1",
+    "@semantic-release/commit-analyzer": "^8.0.1",
+    "@semantic-release/git": "^9.0.0",
+    "@semantic-release/github": "^7.2.3",
+    "@semantic-release/npm": "^7.1.3",
+    "@semantic-release/release-notes-generator": "^9.0.3",
+    "jest": "^27.0.6",
+    "jest-environment-jsdom-sixteen": "^2.0.0",
+    "rollup": "^2.56.3",
+    "rollup-plugin-babel": "^4.4.0",
+    "rollup-plugin-babel-minify": "^10.0.0",
+    "semantic-release": "^17.4.6"
+  },
+  "files": [
+    "dist",
+    "index.d.ts"
+  ],
+  "types": "index.d.ts",
+  "jest": {
+    "collectCoverageFrom": [
+      "src/index.js",
+      "!**/node_modules/**",
+      "!**/dist/**"
+    ],
+    "testEnvironment": "jest-environment-jsdom-sixteen"
+  }
+}
--- a/package-lock.json
+++ b/package-lock.json
@ -1,12 +1,13 @@
 {
-  "name": "BETA",
+  "name": "limepot.xyz",
  "lockfileVersion": 2,
  "requires": true,
  "packages": {
    "": {
      "dependencies": {
        "bulma": "^0.9.4",
-        "bulma-start": "^0.0.5"
+        "bulma-start": "^0.0.5",
+        "bulma-toast": "^2.4.2"
      }
    },
    "node_modules/bulma": {
@ -18,6 +19,11 @@
      "version": "0.0.5",
      "resolved": "https://registry.npmjs.org/bulma-start/-/bulma-start-0.0.5.tgz",
      "integrity": "sha512-Sl8mdbmxa8eZJmvAfvUqQ1yptGG/kC+VvxixH3oWj1n87rpzFetotcrIs0mldD8t6Cby3Nv+hxA/2pkzDwkaBQ=="
+    },
+    "node_modules/bulma-toast": {
+      "version": "2.4.2",
+      "resolved": "https://registry.npmjs.org/bulma-toast/-/bulma-toast-2.4.2.tgz",
+      "integrity": "sha512-c3ehyeXhhvxevKICP1VKsFtZlQH+H6/S+yYY4TFyLRfkbw3mh71eGazlNc/YEIvXQSbxHpD2f+WDc02xECuV9g=="
    }
  },
  "dependencies": {
@ -30,6 +36,11 @@
      "version": "0.0.5",
      "resolved": "https://registry.npmjs.org/bulma-start/-/bulma-start-0.0.5.tgz",
      "integrity": "sha512-Sl8mdbmxa8eZJmvAfvUqQ1yptGG/kC+VvxixH3oWj1n87rpzFetotcrIs0mldD8t6Cby3Nv+hxA/2pkzDwkaBQ=="
+    },
+    "bulma-toast": {
+      "version": "2.4.2",
+      "resolved": "https://registry.npmjs.org/bulma-toast/-/bulma-toast-2.4.2.tgz",
+      "integrity": "sha512-c3ehyeXhhvxevKICP1VKsFtZlQH+H6/S+yYY4TFyLRfkbw3mh71eGazlNc/YEIvXQSbxHpD2f+WDc02xECuV9g=="
    }
  }
 }
--- a/package.json
+++ b/package.json
@ -1,6 +1,7 @@
 {
  "dependencies": {
    "bulma": "^0.9.4",
-    "bulma-start": "^0.0.5"
+    "bulma-start": "^0.0.5",
+    "bulma-toast": "^2.4.2"
  }
 }