Compare commits

..

No commits in common. "ab9d9a184994b92fa69235b489006276e09e2d5f" and "1faabe03c78c018f8b862a7abb7c5f30d95b35d4" have entirely different histories.

5 changed files with 75 additions and 95 deletions

102
README.md
View File

@ -1,82 +1,80 @@
# 🌟 JSTAR Tab # 🌟 JSTAR Tab v2.6.0
Welcome to **JSTAR Tab**, the ultimate customizable new tab extension for your browser! Whether you're looking for a sleek, modern design or powerful personalization options, JSTAR Tab has you covered. 🚀 Welcome to **JSTAR Tab v2.6.0**! This version builds upon the previous release with new features and improvements to enhance your browsing experience even further. 🚀
Transform your browsing experience with custom greetings, themes, shortcuts, and more. 🎉 ## 🎉 What's New in v2.6.0?
## ✨ Features - **Enhanced Onboarding Process**: The onboarding experience has been revamped to include options for starting fresh or importing data, making it easier to get started.
- **Keyboard Shortcuts**: Added the ability to configure keyboard shortcuts for quicker navigation and actions.
- **Improved Data Management**: Enhanced import/export functionality with better validation and error handling.
- **Custom Greeting Enhancements**: Added new format variables for custom greetings, allowing for more personalized messages.
- **UI and UX Improvements**: Various updates to the user interface for a more seamless experience, including responsive design adjustments.
- **Custom Greeting Formats**: Create personalized greetings using dynamic format tags: ## 📥 Installation
- `{name}`: Your display name
- `{greeting}`: Time-based greeting (e.g., Good morning)
- `{time}`: Current time
- `{date}`: Current date
- `{day}`: Day of the week
- `{month}`: Current month
- `{year}`: Current year
Examples: 1. Visit [JSTAR Tab Website](https://jstartab.netlify.app)
- "Hello {name}, it's {time} on {day}!"
- "{greeting}, {name}! Today is {date}"
- "Happy {day}, {name}!"
- **Customizable Themes**: Switch between light and dark modes to suit your mood. 🌗
- **Shortcut Management**: Add, edit, and remove shortcuts to your favorite websites.
- **Search Engine Selection**: Choose your preferred search engine for quick and efficient browsing.
- **Keyboard Shortcuts**: Set up custom keybinds for various actions:
- Open settings
- Add a new shortcut
- Toggle anonymous mode
- Change themes
- Redirect to a specific URL (with a notification and "Redirecting to..." message)
- **Data Backup and Restore**: Export and import your settings and shortcuts effortlessly.
## 🌐 Getting Started
### Installation
1. Visit [JSTAR Tab Website](https://jstartab.netlify.app).
2. Select your browser or mobile browser from the available options. 2. Select your browser or mobile browser from the available options.
3. Follow the installation instructions specific to your browser. 3. Follow the installation instructions specific to your browser.
### Alternative Manual Installation Alternative Manual Installation:
1. **Download the Latest Release**: [JSTAR Tab v2.6.0](https://github.com/DevJSTAR/JSTAR-Tab/releases/latest)
1. **Download the Latest Release**: [JSTAR Tab GitHub Releases](https://github.com/DevJSTAR/JSTAR-Tab/releases/latest).
2. **Extract the Files**: Unzip the downloaded file to a directory of your choice. 2. **Extract the Files**: Unzip the downloaded file to a directory of your choice.
3. **Load the Extension**: 3. **Load the Extension**:
- Open your browser and navigate to the extensions page. - Open your browser and navigate to the extensions page.
- Enable "Developer mode" (usually a toggle in the top right corner). - Enable "Developer mode" (usually a toggle in the top right corner).
- Click "Load unpacked" and select the directory where you extracted the files. - Click "Load unpacked" and select the directory where you extracted the files.
## 🎨 Customizing Your Experience ## 🛠️ Features
### **Greeting Formats** - **Custom Greeting Format**: Create unique greetings using various format tags. 📝
Personalize your greeting with dynamic tags listed above. Example: "Good {greeting}, {name}! It's {time} on {day}!" - **Customizable Themes**: Choose between light and dark themes to suit your mood. 🌗
- **Search Engine Selection**: Choose your preferred search engine from a variety of options.
- **Shortcut Management**: Easily add, edit, and remove shortcuts to your favorite sites.
- **Data Backup and Restore**: Export your settings and shortcuts to a file and import them back anytime.
- **Onboarding Process**: A step-by-step guide to help you set up your new tab with ease.
- **Keyboard Shortcuts**: Configure shortcuts for quick access to features.
### **Themes** ## 🎨 Customizing Your Greeting
Toggle between light and dark themes from the settings panel.
### **Shortcuts** 1. **Format Tags**: Use these tags in your custom greeting:
Manage your favorite sites effortlessly: - `{name}`: Your display name
- Add shortcuts with the "+" button. - `{greeting}`: Time-based greeting (e.g., Good morning)
- Edit or delete shortcuts by right-clicking on them. - `{time}`: Current time
- `{date}`: Current date
- `{day}`: Day of the week
- `{month}`: Current month
- `{year}`: Current year
2. **Examples**:
- "Hello {name}, it's {time} on {day}!"
- "{greeting}, {name}! Today is {date}"
- "Happy {day}, {name}!"
### **Keyboard Shortcuts** ## 📚 Usage
Set up custom keybinds for quick actions like opening settings or switching themes.
## ❤️ Acknowledgments - **Settings**: Click the settings icon ⚙️ to open the settings panel where you can customize your experience.
- **Custom Greeting**: Enter your preferred greeting format in the settings panel.
- **Add Shortcuts**: Click the "+" button to add a new shortcut. Enter the name and URL, then save.
- **Edit Shortcuts**: Right-click on a shortcut to edit or delete it.
- **Theme Toggle**: Switch between light and dark themes using the theme toggle button.
- **Keyboard Shortcuts**: Use configured shortcuts for quick actions.
Special thanks to **[Equa](https://github.com/EquaTechnologies)** for contributing amazing hover animations for shortcuts, settings, and the "Add Shortcut" button. Your work is truly appreciated! 🌟 ## 📝 Contributing
We welcome contributions! If you have suggestions or improvements, feel free to fork the repository and submit a pull request. For major changes, please open an issue first to discuss what you would like to change.
## 📄 License ## 📄 License
This project is licensed under the [MIT License](https://github.com/DevJSTAR/JSTAR-Tab/blob/main/LICENSE). This project is licensed under the [MIT License](https://github.com/DevJSTAR/JSTAR-Tab/blob/main/LICENSE).
## ❤️ Acknowledgments
- **Font Awesome**: For the beautiful icons used throughout the extension.
- **Google Fonts**: For the sleek and modern typography.
## 🌐 Connect with Us ## 🌐 Connect with Us
- **[Linktree](https://linktr.ee/jstarsdev)** - **[Linktree](https://linktr.ee/jstarsdev)**
- **[Patreon](https://patreon.com/jstarsdev)** - **[Patreon](https://patreon.com/jstarsdev)**
- **[GitHub Releases](https://github.com/DevJSTAR/JSTAR-Tab/releases/latest)** - **[Latest Release](https://github.com/DevJSTAR/JSTAR-Tab/releases/latest)**
Thank you for choosing JSTAR Tab! We hope you enjoy the seamless and personalized browsing experience it brings. 🚀 Thank you for using JSTAR Tab! We hope it makes your browsing experience more enjoyable and productive. 🙂

View File

@ -251,7 +251,7 @@
<div class="settings-section"> <div class="settings-section">
<h3>About</h3> <h3>About</h3>
<div class="about-content"> <div class="about-content">
<p>JSTAR Tab v2.6.2</p> <p>JSTAR Tab v2.6.0</p>
<p>Homepage: <a href="https://github.com/DevJSTAR/JSTAR-Tab" target="_blank">GitHub Repository</a></p> <p>Homepage: <a href="https://github.com/DevJSTAR/JSTAR-Tab" target="_blank">GitHub Repository</a></p>
<p>Latest Update: <a href="https://github.com/DevJSTAR/JSTAR-Tab/releases/latest" target="_blank">Check for updates</a></p> <p>Latest Update: <a href="https://github.com/DevJSTAR/JSTAR-Tab/releases/latest" target="_blank">Check for updates</a></p>
<p>License: <a href="https://github.com/DevJSTAR/JSTAR-Tab/blob/main/LICENSE" target="_blank">MIT License</a></p> <p>License: <a href="https://github.com/DevJSTAR/JSTAR-Tab/blob/main/LICENSE" target="_blank">MIT License</a></p>
@ -310,9 +310,6 @@
<!-- Context Menu --> <!-- Context Menu -->
<div id="context-menu" class="context-menu hidden"> <div id="context-menu" class="context-menu hidden">
<div class="context-menu-item" data-action="open-new-tab">
<i class="fas fa-external-link-alt"></i> Open in New Tab
</div>
<div class="context-menu-item" data-action="edit"> <div class="context-menu-item" data-action="edit">
<i class="fas fa-edit"></i> Edit <i class="fas fa-edit"></i> Edit
</div> </div>

View File

@ -255,15 +255,7 @@ const shortcuts = {
} }
} else if (action === 'delete') { } else if (action === 'delete') {
shortcuts.remove(index); shortcuts.remove(index);
} else if (action === 'open-new-tab') { }
const currentShortcuts = Storage.get('shortcuts') || [];
const shortcut = currentShortcuts[index];
// Open the URL of the shortcut in a new tab
if (shortcut && shortcut.url) {
window.open(shortcut.url, '_blank');
}
}
contextMenu.classList.add('hidden'); contextMenu.classList.add('hidden');
}); });

View File

@ -1,7 +1,7 @@
{ {
"manifest_version": 3, "manifest_version": 3,
"name": "JSTAR Tab", "name": "JSTAR Tab",
"version": "2.6.2", "version": "2.6.0",
"description": "JSTAR Tab is a sleek, customizable new tab extension with personalized greetings, shortcuts, anonymous mode, search engine settings, themes, data management, and more, for an enhanced browsing experience.", "description": "JSTAR Tab is a sleek, customizable new tab extension with personalized greetings, shortcuts, anonymous mode, search engine settings, themes, data management, and more, for an enhanced browsing experience.",
"chrome_url_overrides": { "chrome_url_overrides": {
"newtab": "index.html" "newtab": "index.html"

View File

@ -246,8 +246,8 @@ input[type="text"]:focus {
} }
.search-engine-option.selected { .search-engine-option.selected {
background: #dddddd; background: #eeeeee;
border: 2px solid #dddddd; border: 2px solid var(--border);
} }
.search-engine-option img { .search-engine-option img {
@ -310,12 +310,10 @@ input[type="text"]:focus {
border: none; border: none;
cursor: pointer; cursor: pointer;
transition: background 0.2s ease; transition: background 0.2s ease;
transition: transform 0.2s ease;
} }
#add-shortcut:hover { #add-shortcut:hover {
background: var(--primary-hover); background: var(--primary-hover);
transform: scale(1.1);
} }
#shortcuts-grid { #shortcuts-grid {
@ -339,7 +337,7 @@ input[type="text"]:focus {
} }
.shortcut:hover { .shortcut:hover {
transform: scale(1.079); transform: translateY(-2px);
box-shadow: 0 4px 15px var(--shadow); box-shadow: 0 4px 15px var(--shadow);
} }
@ -370,7 +368,7 @@ input[type="text"]:focus {
} }
/* Settings styles */ /* Settings styles */
.settings-button { .settings-button {
position: fixed; position: fixed;
bottom: 2rem; bottom: 2rem;
right: 2rem; right: 2rem;
@ -386,17 +384,12 @@ input[type="text"]:focus {
font-size: 1.25rem; font-size: 1.25rem;
color: var(--text); color: var(--text);
box-shadow: 0 4px 24px var(--shadow); box-shadow: 0 4px 24px var(--shadow);
transition: transform 0.4s ease; }
}
.settings-button:hover {
transform: rotate(180deg);
}
.settings-button:active {
transform: rotate(360deg);
}
.settings-button:hover {
transform: translateY(-2px);
box-shadow: 0 8px 32px var(--shadow);
}
.settings-panel { .settings-panel {
max-height: 80vh; max-height: 80vh;