-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge branch 'main' of https://github.com/RIR360/Clean-New-Tab
- Loading branch information
Showing
1 changed file
with
25 additions
and
17 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,26 +1,34 @@ | ||
# Clean-New-Tab | ||
# Clean-New-Tab V2.0 | ||
|
||
You may have used several extensions on google chrome. Just like that, you can also use an extension to change your basic new tab page. But do you know how to build it from scratch? Here is a simple example of that. | ||
![image](https://user-images.githubusercontent.com/50569315/131299857-65590074-01d5-4314-9634-6ae5bf842037.png) | ||
|
||
This is custom "New Tab" extension designed for Chromium browser (Google Chrome). It can replace the new tab of the chrome browser. Designed by [Rejwan Islam Rizvy](https://www.linkedin.com/in/linked-rir360) | ||
This is custom "New Tab" extension designed for Chromium browser (Google Chrome). It can replace the new tab of the chrome browser. Designed by [Rejwan Islam Rizvy](https://www.linkedin.com/in/linked-rir360). Detailed info below: | ||
|
||
## Features | ||
* Clean Interface | ||
* Time and Date | ||
* Changes background on each refresh | ||
* Common links section | ||
* CSS and JavaScript animation | ||
* Visited indicator system for links that tells whether the link is visited today or not | ||
* Can remember visited status with localstorage | ||
## About | ||
This extension project shows you the use of JavaScript local storage. Using that I taught JavaScript to run a function only once a day. That way the extension will know which link you've visited on a particular day. | ||
* Day and Date | ||
* Changes background on each reload | ||
* Temporary common links section | ||
* Bookmark accordion list | ||
|
||
# Temporary Common Links - Features | ||
* This section toggles upon you click the "Daily links" button. | ||
* You can add a link or remove. | ||
* Links will be stored in the localstorage. | ||
* There'll a status that will indicate if the link is visited or not. | ||
|
||
In order to try this extension, you don't have to install it on your browser. You can find the source code in the GitHub repository below. | ||
# Bookmark Accordion List - Features | ||
* This section toggles upon you click the "Bookamrks" button | ||
* Here you will find the list of all the bookmark folders. | ||
* Only those bookmarks will show up that are inside a folder. | ||
* It uses "Chrome API" to fetch the bookmakrs collections. | ||
|
||
It's not packed for real chrome extension because the normal users can't add any link or any image to the page. That's obviously a feature I want to implement in the future. | ||
## About | ||
This is a remake of the previous version "Clean New Tab V1.0". This version is more professional and clean. And additionally bookmarks folder list and creating/removing temporary links ability is included.<br/> | ||
In This extension project You'll find the use of localstorage and chrome API.<br/> | ||
It's not packed yet. In order to try this extension, you can download the repo and load unpacked from your browser.<br/> | ||
|
||
## Preview | ||
[Watch Youtube Video](https://youtu.be/BVyTt3QJfIA) | ||
## Screenshots | ||
![normal](https://user-images.githubusercontent.com/50569315/114199091-cfb68200-9975-11eb-88e3-6d585ef5ca7c.png) | ||
![links open](https://user-images.githubusercontent.com/50569315/114199080-cd542800-9975-11eb-8318-fbb06d754f3d.png) | ||
![image](https://user-images.githubusercontent.com/50569315/131299610-5f5f6028-02ba-47eb-aa70-c308f8bf3502.png) | ||
![image](https://user-images.githubusercontent.com/50569315/131299857-65590074-01d5-4314-9634-6ae5bf842037.png) | ||
![image](https://user-images.githubusercontent.com/50569315/131299648-060d8466-047a-484e-bdab-3cc521cdd125.png) |