/flat-startpage

Flat startpage

Primary LanguageHTML

Flat Startpage

Flat minimal start page made for elegant look and simple at same time.

Figma for anyone who seeks interactive view.

Flat startpage look!

Pack as web-ext

  1. Clone the repo
git clone https://github.com/mahmoudk1000/flat-startpage.git
  1. You need to install web--ext tool by runing terminal
sudo npm install -g web-ext

  1. Check Firefox ext-packing guide

  2. Last step run in terminal in same dir where repo cloned

web-ext sign --api-key "YOUR_USER_KEY" --api-secret "YOUR_SECRET"

Weather

For setting up the Weather widget you're going to need an API Key in: https://openweathermap.org/. Once you have your Key you'll need to set yourlatitude and longitude, you can use: https://www.latlong.net/ to get them. Then you just have to fill them in the weather.js in the js folder:

// Use your own key for the Weather, Get it here: https://openweathermap.org/
const key = "XXXXXXXXXXXXXXXXXXXXXXXXXXX";

setPosition();

function setPosition(position) {
  // Here you can change your position
  // You can use https://www.latlong.net/ to get it! (I use San Francisco as an example)
  let latitude = 37.774929;
  let longitude = -122.419418;

  getWeather(latitude, longitude);
}

Update Pic photo

replace pic.png from images folder with the one you want.
Note: The image could be square the rounded code from css. so i recommend to be square, and also it would be good if it in 150px height and 150px wight too.

Credits

migueravila/Bento For time, date and weather script and weather guide.
MCotocel/startpage For DuckDuckGo search script