Skip to content

Commit

Permalink
Update
Browse files Browse the repository at this point in the history
  • Loading branch information
@babarot
babarot committed Feb 7, 2025
1 parent 3129ca0 commit ea5c7a7
Show file tree
Hide file tree
Showing 2 changed files with 102 additions and 58 deletions.
40 changes: 23 additions & 17 deletions docs/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,44 +3,49 @@
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>gomi - Modern Trash Management CLI</title>
<title>gomi - A Safer Alternative to the UNIX rm Command</title>

<!-- SEO Meta Tags -->
<meta name="title" content="gomi - Modern Trash Management CLI">
<meta name="description" content="A safer alternative to the rm command. Move files to trash instead of permanent deletion.">
<meta name="title" content="gomi - A Safer Alternative to the UNIX rm Command">
<meta name="description" content="Never worry about accidentally deleting important files again. gomi moves them to trash instead of permanent deletion, giving you peace of mind in the command line.">

<!-- Open Graph / Facebook -->
<meta property="og:type" content="website">
<meta property="og:url" content="https://github.com/babarot/gomi">
<meta property="og:title" content="gomi - Modern Trash Management CLI">
<meta property="og:description" content="A safer alternative to the rm command. Move files to trash instead of permanent deletion.">
<meta property="og:title" content="gomi - A Safer Alternative to the UNIX rm Command">
<meta property="og:description" content="Never worry about accidentally deleting important files again. gomi moves them to trash instead of permanent deletion, giving you peace of mind in the command line.">
<meta property="og:image" content="./preview-dark.png">

<!-- Twitter -->
<meta property="twitter:card" content="summary_large_image">
<meta property="twitter:url" content="https://github.com/babarot/gomi">
<meta property="twitter:title" content="gomi - Modern Trash Management CLI">
<meta property="twitter:description" content="A safer alternative to the rm command. Move files to trash instead of permanent deletion.">
<meta property="twitter:title" content="gomi - A Safer Alternative to the UNIX rm Command">
<meta property="twitter:description" content="Never worry about accidentally deleting important files again. gomi moves them to trash instead of permanent deletion, giving you peace of mind in the command line.">
<meta property="twitter:image" content="./preview-dark.png">

<!-- External Resources -->
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Orbitron:wght@400;500;700&display=swap">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/hack-font/3.3.0/web/hack.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css">

<!-- Custom Styles -->
<link rel="stylesheet" href="main.css">
</head>
<body>
<main>
<!-- Hero Section -->
<section class="hero">
<h1>gomi</h1>
<p><b>Replacement for UNIX rm!</b></p>
<p><b>A Safer Alternative to the UNIX rm Command!</b></p>
<div class="hero-stats">
<img alt="GitHub Repo stars" src="https://img.shields.io/github/stars/babarot/gomi">
</div>
</section>

<!-- Demo Section -->
<section class="demo-section">
<h2 class="demo-heading">See gomi in Action</h2>
<p class="demo-description">Watch how easily you can manage your trash with simple commands</p>
<h2 class="demo-heading">Safety First, Always</h2>
<p class="demo-description">Never worry about accidentally deleting important files again. gomi moves them to trash instead of permanent deletion, giving you peace of mind while working in the command line.</p>
<div class="demo-container">
<img src="demo-mini.gif"
alt="gomi CLI demonstration"
Expand All @@ -54,16 +59,16 @@ <h2 class="demo-heading">See gomi in Action</h2>
<div class="container">
<div class="features-grid">
<article class="feature">
<h3>🗑️ Safe File Removal</h3>
<p>Works just like the familiar <code>rm</code> command, but moves files to trash instead of permanent deletion. Supports most <code>rm</code> command flags for seamless transition.</p>
<h3>🗑️ Safe File Handler</h3>
<p>Works exactly like <code>rm</code> but with a safety net. Seamlessly replace your existing <code>rm</code> command with gomi using a simple alias, maintaining all your familiar command flags.</p>
</article>
<article class="feature">
<h3>🔄 Easy Restoration</h3>
<p>Simple and intuitive restoration process with a user-friendly interface. Find and restore your files effortlessly when you need them back.</p>
<h3>🔄 Quick Recovery</h3>
<p>Made a mistake? No problem. Quickly restore files to their original location with a simple <code>gomi --restore</code> command. Includes an intuitive interface for browsing and selecting files to restore.</p>
</article>
<article class="feature">
<h3>🔍 Fuzzy Search</h3>
<p>Quickly locate deleted files using powerful fuzzy search capabilities. No need to remember exact file names or locations.</p>
<h3>⚙️ Rich Configuration</h3>
<p>Tailor gomi to your workflow with extensive YAML configuration. Customize everything from file filters and color schemes to preview options and UI density. Your CLI, your rules.</p>
</article>
</div>
</div>
Expand All @@ -83,6 +88,7 @@ <h2>Installation</h2>
</button>
</div>

<h2>Usage</h2>
<div class="cli-demo">
<pre><span class="command">$ gomi example.txt</span>
<span class="output">Moving example.txt to trash...</span>
Expand All @@ -104,7 +110,7 @@ <h2>Installation</h2>
<footer class="footer">
<div class="footer-content">
<div class="footer-author">
<a href="https://github.com/babarot"
<a href="https://babarot.me"
class="footer-avatar-link"
target="_blank"
rel="noopener noreferrer">
Expand Down
120 changes: 79 additions & 41 deletions docs/main.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -35,34 +35,34 @@
--transition-default: all 0.3s ease;
}

/* Reset */
/* Reset & Base Styles */
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}

/* Base styles */
body {
font-family: var(--font-system);
line-height: 1.6;
color: var(--text-primary);
background: var(--bg-primary);
}

code {
font-family: var(--font-hack);
padding: 2px 4px;
border-radius: var(--radius-sm);
}

/* Layout */
/* Common Layout Styles */
.container {
max-width: 1200px;
margin: 0 auto;
padding: 0 var(--space-md);
}

/* Common Text Styles */
code {
font-family: var(--font-hack);
padding: 2px 4px;
border-radius: var(--radius-sm);
}

/* Hero Section */
.hero {
background: linear-gradient(135deg, var(--bg-primary) 0%, var(--bg-secondary) 100%);
Expand All @@ -83,10 +83,25 @@ code {
font-family: var(--font-orbitron);
font-size: 1.5rem;
color: var(--text-secondary);
max-width: 600px;
max-width: 650px;
margin: 0 auto;
}

.hero-stats {
margin-top: var(--space-md);
}

.hero-stats img {
height: 20px;
filter: brightness(1.1);
transition: var(--transition-default);
}

.hero-stats img:hover {
transform: translateY(-2px);
filter: brightness(1.2);
}

/* Demo Section */
.demo-section {
background: var(--bg-secondary);
Expand Down Expand Up @@ -170,20 +185,32 @@ code {
margin-bottom: var(--space-md);
}

/* Code Block Styles */
/* Code Blocks - Common Styles */
.code-container,
.cli-demo {
max-width: 600px;
margin: var(--space-md) auto;
text-align: left;
background: var(--bg-primary);
padding: var(--space-md);
border-radius: var(--radius-md);
border: var(--border-default);
width: 100%;
}

/* Installation Code Block */
.code-container {
position: relative;
display: inline-block;
}

.code {
background: var(--bg-primary);
padding: var(--space-md) var(--space-lg) var(--space-md) var(--space-md);
border-radius: var(--radius-md);
text-align: left;
.code pre {
margin: 0;
white-space: pre;
font-family: var(--font-hack);
margin: var(--space-sm) 0;
border: var(--border-default);
font-size: 1.1rem;
line-height: 1.8;
padding-left: 1rem;
padding-right: 100px;
}

.copy-button {
Expand All @@ -209,28 +236,24 @@ code {
background: var(--success);
}

/* CLI Demo */
.cli-demo {
background: var(--bg-primary);
padding: var(--space-md);
border-radius: var(--radius-md);
margin: var(--space-md) auto;
max-width: 600px;
font-family: var(--font-hack);
border: var(--border-default);
}

/* CLI Demo Block */
.cli-demo pre {
margin: 0;
white-space: pre-wrap;
font-family: var(--font-hack);
font-size: 1.1rem;
line-height: 1.8;
padding-left: 1rem;
}

.command {
.cli-demo .command {
color: var(--success);
}

.output {
.cli-demo .output {
color: var(--text-secondary);
display: inline-block;
width: 100%;
}

/* Common Button Style */
Expand All @@ -252,7 +275,7 @@ code {
transform: translateY(-2px);
}

/* Footer */
/* Footer Styles */
.footer {
background: var(--bg-secondary);
padding: var(--space-lg) var(--space-md);
Expand All @@ -279,7 +302,7 @@ code {

.footer-avatar-link {
display: block;
transition: transform 0.2s ease;
transition: var(--transition-default);
}

.footer-avatar-link:hover {
Expand Down Expand Up @@ -314,8 +337,6 @@ code {
max-width: 300px;
overflow-wrap: break-word;
word-wrap: break-word;
-webkit-hyphens: auto;
-ms-hyphens: auto;
hyphens: auto;
}

Expand All @@ -335,7 +356,6 @@ code {
transition: var(--transition-default);
display: flex;
align-items: center;
gap: 8px;
}

.footer-link i {
Expand All @@ -347,10 +367,6 @@ code {
transform: translateY(-2px);
}

.footer-link:hover i {
transform: scale(1.1);
}

.footer-link-separator {
color: var(--text-secondary);
opacity: 0.5;
Expand All @@ -362,3 +378,25 @@ code {
color: var(--text-secondary);
font-size: 0.9rem;
}

/* Responsive Styles */
@media (max-width: 480px) {
.code-container,
.cli-demo {
margin: var(--space-sm);
font-size: 0.9rem;
}

.code pre,
.cli-demo pre {
padding-left: 0.5rem;
}

.hero h1 {
font-size: 3rem;
}

.hero p {
font-size: 1.2rem;
}
}

0 comments on commit ea5c7a7

Please sign in to comment.