Griddy startpage

• ⚒️ Simple customizible startpage in grid layout style.
• 🖌️ With 6 diffrent themes, 5 options to customize and custom css.
• 💡 Inspired by eww widgets for linux.

How to customize:

a little summary

• you can edit custom css by clicking on the edit icon at right and there selecting custom css
• now the easiest way is to copy the content of ./variables.css file in this repo and just paste it there, from this you can now customize anything you want

• ps: it can overwrite the selected theme

customizing font

• click on edit icon, then select customCss, there add

@import url('https://fonts.googleapis.com/css2?family=<Your+Font>:wght@400;500&display=swap');
/* Font's each word should start with uppercased letter and use "+" as whitespace alternative */

:root {
   --font: "<YOUR FONT>", monospace; /* use monospace or sans-serif */
}

• example for Fira sans font:

@import url('https://fonts.googleapis.com/css2?family=Fira+Sans:wght@400;500&display=swap');

:root {
   --font: "fira sans", sans-serif;
}

customizing variables

• click on edit icon, then select customCss, there add

:root {
  --nameOfTheVariable: VALUE;
}

• you will find all the variables inside variables.css, then just customize the variables in customCss

same goes with custom css

• just click on edit icon, then select customCss, there add

/* some custom css here */

custom background image

• click on the edit icon, here select customCss, there add

:root {
   --background-url: url("https://example.com/path/to/image.png"); 
   /* default one is */
   --background-url: url("./assets/wal1.jpg");
}

Pictures