This project is blazing fast ⚡, it only contains an html, css and javascript files.
Root was created to be lightweight, fast and easy to customize.
To change the colors used in the startpage edit styles.css.
:root {
--primary: #dd2e44;
--text-light: #eeeeee;
--background: #1e1c21;
--background-light: #333138;
}This project uses Remix Icons.
To change the default name and edit the cards, edit app.js. It should look something like this:
const NAME = "John Doe";
const CARDS = [
{
name: "Twitter",
icon: "ri-twitter-fill",
link: "https://twitter.com",
},
{
name: "Github",
icon: "ri-github-fill",
link: "https://github.com/",
},
];To add a new card, just append a new object to the CARDS constant. The object should look something like this:
{
name: "<Webpage Name>",
icon: "<Icon Class-Name>",
link: "<Webpage Link>",
clipboard: true,
color: '#550499'
},To get the icon class-name, just go to Remix Icons, select the desired icon. You should see something like this:
<i class="this-is-the-class-name"></i>.
If you prefer to copy the link to the clipboard instead of the default behavior, just add
clipboard: trueto the card object.
Optional individual card accent color can be achieved by setting a
color: stringproperty in the card object.
To use 24 hour time simply change the time section of app.js to
// Update the Time
currentTime.innerHTML = `${currentHour}:${currentMinute}`;
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent