diff --git a/README.md b/README.md index 96322d4..37ff7ca 100644 --- a/README.md +++ b/README.md @@ -1,20 +1,14 @@ -# [LiveTerm - Make Terminal styled websites in minutes!](https://cveinnt.com) +# [LiveTerm - Make terminal styled websites in minutes!](https://liveterm.vercel.app) -Highly customizable, easy-to-use, and minimal terminal styled website template, written in Next.js. +Highly customizable, easy-to-use, and minimal terminal styled website template, powered by Next.js. -# Table of Contents: +To build a simple terminal styled website with LiveTerm, you only need to work with one file: `config.json`. After you filled out the config file, simply run `yarn install && yarn dev` to build your website! -- [LiveTerm - Make Terminal styled websites in minutes!](#liveterm---make-terminal-styled-websites-in-minutes) -- [Table of Contents:](#table-of-contents) - - [Showcase](#showcase) - - [Quick Start](#quick-start) - - [Configuration](#configuration) - - [Basic Configuration](#basic-configuration) - - [Favicons](#favicons) - - [Banner](#banner) - - [Advanced Configuration](#advanced-configuration) - - [Deploy on Vercel](#deploy-on-vercel) - - [Credit](#credit) +LiveTerm can be used to build a variety of websites: a personal website, a project page, a startpage, or just a cool browser music player...you name it! + +Source files for LiveTerm are all less than 150 lines of codes in length, with great emphasis towards readability and customizability. + +Feel free to play with the web demo! ## Showcase @@ -23,14 +17,14 @@ Highly customizable, easy-to-use, and minimal terminal styled website template, Default LiveTerm

-Live version [here](https://cveinnt.com) +Live version: https://liveterm.vercel.app


my personal website

-Live version [here](https://cveinnt.com) +Live version: https://cveinnt.com ## Quick Start @@ -66,25 +60,34 @@ Most of the configuration is done through the `config.json` file. ```javascript { - "readmeUrl": //create a Github README and link it here! - "title": //title of the website - "name": //returned by the command of the same name + "readmeUrl": // create a Github README and link it here! + "title": // title of the website + "name": // returned by the command of the same name + "ascii": // ascii art to display "social": { "github": // your handle "linkedin": // your handle }, "email": // your email - "ps1_hostname": //hostname in prompt - "ps1_username": "guest", // username in prompt + "ps1_hostname": "liveterm" // hostname in prompt + "ps1_username": "visitor", // username in prompt + "resume_url": "~/Resume.pdf", // path to your resume "non_terminal_url": "W", "colors": { - ... // you can use existing templates in themes.json or use your own! + "light": { + ... + }, + "dark": { + ... // you can use existing templates in themes.json or use your own! + } } } ``` Feel free to change it as you see fit! +### Themes + You can find several pre-configured themes in `themes.json`, and you can replace the colors in `config.json` with the theme color you like! The themes are based on the themes on [this website](https://glitchbone.github.io/vscode-base16-term/#/).

@@ -92,7 +95,7 @@ You can find several pre-configured themes in `themes.json`, and you can replace different LiveTerm themes

-Just replace `"light"` or `"dark"` in the `"color"` part of the config file! +For a better preview of the themes, checkout the images in the `demo` folder. ### Favicons diff --git a/config.json b/config.json index 0c214d9..d1fa47c 100644 --- a/config.json +++ b/config.json @@ -4,13 +4,13 @@ "name": "John Doe", "ascii": "liveterm", "social": { - "github": "", - "linkedin": "" + "github": "github", + "linkedin": "linkedin" }, - "email": "contact@johndoe.com", + "email": "contact@email.com", "ps1_hostname": "liveterm", "ps1_username": "visitor", - "non_terminal_url": "https://github.com/Cveinnt/LiveTerm", + "repo": "https://github.com/Cveinnt/LiveTerm", "resume_url": "https://upload.wikimedia.org/wikipedia/commons/c/cc/Resume.pdf", "donate_urls": { "paypal": "https://paypal.me/cveinnt", diff --git a/demo/demo.png b/demo/demo.png index e8cc37d..243e1d0 100644 Binary files a/demo/demo.png and b/demo/demo.png differ diff --git a/src/components/history/History.tsx b/src/components/history/History.tsx index d218a36..e67513a 100644 --- a/src/components/history/History.tsx +++ b/src/components/history/History.tsx @@ -19,7 +19,7 @@ export const History: React.FC<{ history: Array }> = ({

diff --git a/src/utils/bin/commands.ts b/src/utils/bin/commands.ts index e0ad093..66443c9 100644 --- a/src/utils/bin/commands.ts +++ b/src/utils/bin/commands.ts @@ -19,14 +19,13 @@ export const help = async (args: string[]): Promise => { [tab]: trigger completion. [ctrl+l]/clear: clear terminal.\n Type 'sumfetch' to display summary. -Type 'gui' or click here for a simpler version. `; }; // Redirection -export const gui = async (args: string[]): Promise => { - window.open(`${config.non_terminal_url}`); - return 'Opening GUI version...'; +export const repo = async (args: string[]): Promise => { + window.open(`${config.repo}`); + return 'Opening Github repository...'; }; // About @@ -114,7 +113,7 @@ export const emacs = async (args?: string[]): Promise => { }; export const sudo = async (args?: string[]): Promise => { - window.open('https://www.youtube.com/watch?v=dQw4w9WgXcQ', '_blank'); // good ol' rick roll + window.open('https://www.youtube.com/watch?v=dQw4w9WgXcQ', '_blank'); // ...I'm sorry return `Permission denied: with little power comes... no responsibility? `; }; @@ -129,8 +128,9 @@ export const banner = (args?: string[]): string => { ░███ █ ░███ ░░███ ███ ░███░░░ ░███ ░███░░░ ░███ ░███ ░███ ░███ ███████████ █████ ░░█████ ░░██████ █████ ░░██████ █████ █████░███ █████ ░░░░░░░░░░░ ░░░░░ ░░░░░ ░░░░░░ ░░░░░ ░░░░░░ ░░░░░ ░░░░░ ░░░ ░░░░░ + Type 'help' to see the list of available commands. Type 'sumfetch' to display summary. -Type 'gui' or click here for a simpler version. +Type 'repo' or click here for the Github repository. `; }; diff --git a/src/utils/bin/sumfetch.ts b/src/utils/bin/sumfetch.ts index 537e92f..e55686e 100644 --- a/src/utils/bin/sumfetch.ts +++ b/src/utils/bin/sumfetch.ts @@ -9,7 +9,7 @@ const sumfetch = async (args: string[]): Promise => { @@ @@  ${config.name} @@ @@ ﰩ ${config.ps1_hostname} @@ @@@ @@  resume -@@ @@@ @@ 爵 alt website +@@ @@@ @@ 爵 Github repo @@ @@ ----------- @@ .@@@@@@@@@@. @@  CONTACT @@ @@ @@ @@  ${config.email} @@ -28,7 +28,7 @@ const sumfetch = async (args: string[]): Promise => { ▓▓▀ ▄▓▀  ▐▓▓ ▀▓▓  ▓▓▄   ABOUT ▄▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓   ${config.name} ▓▓ ▓▓▓  ▐▓▓  ▐▓▓  ▓▓   resume -▐▓▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▓ 爵 alt website +▐▓▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▓ 爵 Github repo ▐▓  ▐▓ ----------- ▐▓  > L I V E T E R M ▐▓  CONTACT ▐▓  ▐▓  ${config.email}