Git Product home page Git Product logo

glide's Introduction

glide

a modular but comfy startpage for many scenarios

main layout settings

features:

  • fully modular layout! combine options to create your own unique startpage layout!
  • 2/3 columns, search, image, clock, category labels, greeting
  • drag and drop link editor! visual settings!
  • image carousel option (shuffle or cycle in-order)
  • rosebox color scheme & ability to customize color scheme
  • saving to localstorage, importing and exporting of settings
  • instant load/startup (looking at you, nightTab)
  • click bottom right โ— to toggle the visibility of the image
  • click bottom left โš™ to open the settings popup

installation

chrome / chromium

  1. Clone this repo / download the zip and unzip it
  2. go to chrome://extensions and enable developer mode (top right)
  3. Click Load unpacked and select the folder which has a manifest.json file in it
  4. If there are some warnings/errors, but the new tab works, ignore them. unpacked

firefox-based browsers

Note

This extension will currently only work for Firefox ESR, Developer Edition, Nightly or Floorp (and othe firefox-based browsers) - Reasoning
It will not work in normal Firefox Stable! This is planned for the future.

  1. First, download this repository as a .zip file or zip the contents of the repository if you cloned it.
  2. In Firefox open Settings > Extension & Themes.
  3. Click on the settings icon at the top and choose "Install Add-on from file..." and choose the .zip file.
  4. Firefox will warn you that the extension is unsafe (due to it being unverified), but it is safe to use.

Note

Firefox has gone out of their way to make setting a local html file as a new tab page as hard as possible

  • Unsigned extensions are not supported, and even if signed, you'd have to re-package & sign it a lot if you change the images folder
  • Since version 41 or something, they removed browser.newtab.url from about:config, which was an easy way to set a custom new tab
  • Extensions like New Tab Override are still crippled by the fact that firefox doesen't allow file:// (local files) url's to be set as a new tab - you'd have to host the extension online (won't work without internet connection), or run a local server, which is absolutely ridiculous

customization

custom images

if you want a custom image(s), put it in the img folder (or a subfolder). the image should be either a standard portrait image (good for left image) or a wide slice/landscape image (good for top image).

After you put it in the img folder you can just change the image path in settings to the filename (don't add img/)

custom css

you can create a custom.css to apply custom css (more info in extension settings)

custom font

place your custom font in /fonts in format woff2. set the filename in extension settings.

support development

Recurring donation via Liberapay One-time donation via ko-fi.com
Any donations are highly appreciated! <3

thanks to:

  • this startpage for inspiration & original html/css boilerplate
  • lucide icon pack for nice icons for settings and toggle image
  • image floccinauci.jpg - album cover of Floccinaucinihilipilification (feat. Grim Salvo)
  • images/reze, images/yoruasa screenshots from chainsawman, (edited by me) found online
  • images from "Smoking with you behind the supermarket" manga, found online
  • i do not own most of the included images. I will provide credit/remove from the repo if requested.

libraries used:

object-observer to automatically update layout when object changes - repo
sortablejs to enable drag and drop reordering of links - repo
circle-assign to enable deep object assigning (i can't believe js does not have it by default)
tinydate super small date formatting library (modified to fit startpage's needs)

commit history (before inital release here): commit history

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.