All Projects → KraXen72 → glide

KraXen72 / glide

Licence: other
a modular but comfy startpage for many scenarios

Programming Languages

javascript
184084 projects - #8 most used programming language
CSS
56736 projects
HTML
75241 projects

Projects that are alternatives of or similar to glide

vanilla-js
Projects using pure JavaScript without any external libraries or frameworks
Stars: ✭ 129 (+230.77%)
Mutual labels:  css3, css-grid
unitscss
UNITS is a simple and beautiful CSS component set.
Stars: ✭ 13 (-66.67%)
Mutual labels:  css3, css-grid
hangman-game
A responsive hangman game built with vanilla javascript, html, and css. Animated with GSAP and canvas animations.
Stars: ✭ 22 (-43.59%)
Mutual labels:  css3, css-grid
grid-garden
Solutions to CSS Grid Garden
Stars: ✭ 79 (+102.56%)
Mutual labels:  css3, css-grid
Gridlex
Just a CSS Flexbox Grid System
Stars: ✭ 1,328 (+3305.13%)
Mutual labels:  css3, css-grid
advanced-web-developer-bootcamp-notes-examples-and-exercises
Examples and Exercises compiled. From the awesome Advanced Web Developer Bootcamp
Stars: ✭ 24 (-38.46%)
Mutual labels:  css3, css-grid
Katana
Katana is CSS Layout System made with Flexbox
Stars: ✭ 57 (+46.15%)
Mutual labels:  css3, css-grid
Smart Css Grid
SMART CSS GRID - CSS Framework
Stars: ✭ 291 (+646.15%)
Mutual labels:  css3, css-grid
Cirrus
☁️ The CSS framework for the modern web.
Stars: ✭ 716 (+1735.9%)
Mutual labels:  css3, css-grid
Responsive Grid Of Hexagons
CSS responsive grid of hexagons
Stars: ✭ 481 (+1133.33%)
Mutual labels:  css3, css-grid
Griddle
A CSS Grid Framework
Stars: ✭ 215 (+451.28%)
Mutual labels:  css3, css-grid
Box Css Framework
Box - CSS Framework
Stars: ✭ 138 (+253.85%)
Mutual labels:  css3, css-grid
React Grid Table
A modular table, based on a CSS grid layout, optimized for customization.
Stars: ✭ 57 (+46.15%)
Mutual labels:  modular, css-grid
To-Do-List
A task management app that allows adding and removing tasks to a to-do list. The data is stored locally in the browser local storage therefore it persists when the user closes the browser. It is built with JavaScript, HTML and CSS.
Stars: ✭ 16 (-58.97%)
Mutual labels:  css3
startpage
A React library which provides tools that help creating browser startpages in react.
Stars: ✭ 32 (-17.95%)
Mutual labels:  startpage
hugo-piercer-theme
Piercer is a very customizable, fast and simple Hugo theme designed under the mobile-first philosophy.
Stars: ✭ 27 (-30.77%)
Mutual labels:  css3
Portfolio-Website
Portfolio Website build using HTML5, CSS3, JavaScript and jQuery
Stars: ✭ 109 (+179.49%)
Mutual labels:  css3
smart-webcomponents-community
Material & Bootstrap Web Components built with Smart
Stars: ✭ 30 (-23.08%)
Mutual labels:  css3
platframe
Structured, scalable and modular frontend development platform.
Stars: ✭ 38 (-2.56%)
Mutual labels:  modular
PlayPiano
Implement and simulate piano on web page.
Stars: ✭ 16 (-58.97%)
Mutual labels:  css3

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
  • 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)

I included a simple manifest.json so you can import it as a chrome extension.
just clone this repo and load unpacked extension. (you have to enable developer mode)
unpacked
you can also install this in firefox or any browser, just set the index.html to your new tab page / create an addon which replaces the new tab page with this index.html

custom images

if you want a custom image, put it in the img folder. 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 (wow, unheard of)

thanks to:

  • this startpage for inspiration & original html/css boilerplate
  • image floccinauci.jpg - album cover of Floccinaucinihilipilification (feat. Grim Salvo)
  • images/reze screenshots from chainsawman, (lightly - heavily edited by me) 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

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].