griddy-startpage

KO | EN

gitlite — search

#javascript #python #ai #go #android #rust #docker #macos #nodejs #windows #cli #kubernetes #awesome-list #security

griddy-startpage

(★ 9)

Simple customizible startpage in grid layout style ⚒️

griddy-startpage Latest Version Download

Download Latest Version (.zip)

// repository documentation

Was this content helpful?

★ 0 (0 ratings)

# 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.

![Screenshot](https://user-images.githubusercontent.com/89579269/221627883-48f35ff3-396c-484e-add7-3ee7f8916457.png)

# 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
```css
@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:
```css
@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
```css
: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
```css
/* some custom css here */
```

## custom background image
- click on the edit icon, here select `customCss`, there add
```css
:root {
   --background-url: url("https://example.com/path/to/image.png"); 
   /* default one is */
   --background-url: url("./assets/wal1.jpg");
}
```

# Pictures

![Snímek obrazovky_2023-02-27_18-16-47](https://user-images.githubusercontent.com/89579269/222229712-f73ea77c-2683-4ba8-aa75-9e136eb07844.png)
![Snímek obrazovky_2023-03-01_19-12-02](https://user-images.githubusercontent.com/89579269/222229979-72b5e943-56d4-42c4-b892-a725a40129ca.png)
![Snímek obrazovky_2023-03-01_19-22-40](https://user-images.githubusercontent.com/89579269/222230011-fe864bcf-3548-4f71-9ea2-160efcb68b0c.png)
![Snímek obrazovky_2023-03-01_19-40-45](https://user-images.githubusercontent.com/89579269/222234793-852f2674-656e-488c-a059-b3008a96973e.png)

griddy-startpage

griddy-startpage Latest Version Download

Today's picks

Was this content helpful?

Recent Feedback

griddy-startpage

griddy-startpage Latest Version Download

Today's picks

Was this content helpful?

Recent Feedback

Download README