Skip to content

Commit 90665c7

Browse files
committed
feat: Add static website inspired by rustup.rs
- Create static/ directory with minimal one-page website - Design inspired by rustup.rs with clean, modern aesthetic - Features: - Gradient background with card-based layout - Copy-to-clipboard functionality for code snippets - Responsive design for mobile and desktop - Language tags showing all 10 supported languages - Feature highlights with icons and descriptions - Quick start section with installation examples - Includes index.html, style.css, and README.md - Website is ready to serve with any static web server - Tested locally and working correctly
1 parent 89fb976 commit 90665c7

File tree

3 files changed

+398
-0
lines changed

3 files changed

+398
-0
lines changed

static/README.md

Lines changed: 46 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,46 @@
1+
# CipherScope Website
2+
3+
This directory contains the static website files for CipherScope.
4+
5+
## Files
6+
7+
- `index.html` - Main website page
8+
- `style.css` - Additional CSS styles
9+
- `README.md` - This file
10+
11+
## Design
12+
13+
The website is inspired by [rustup.rs](https://rustup.rs) with a clean, minimal design featuring:
14+
15+
- **Gradient background** with modern card-based layout
16+
- **Copy-to-clipboard functionality** for code snippets
17+
- **Responsive design** that works on mobile and desktop
18+
- **Language tags** showing all 10 supported programming languages
19+
- **Feature highlights** with icons and descriptions
20+
- **Quick start section** with installation and usage examples
21+
22+
## Usage
23+
24+
Simply serve the `index.html` file with any static web server:
25+
26+
```bash
27+
# Using Python
28+
python -m http.server 8000
29+
30+
# Using Node.js
31+
npx serve .
32+
33+
# Using any web server
34+
# Point to the static/ directory
35+
```
36+
37+
## Customization
38+
39+
To customize the website:
40+
41+
1. Edit `index.html` for content changes
42+
2. Modify `style.css` for styling updates
43+
3. Update GitHub links and repository URLs as needed
44+
4. Add your own favicon and meta tags
45+
46+
The design is intentionally minimal and focused on the core functionality, similar to rustup.rs.

static/index.html

Lines changed: 272 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,272 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6+
<title>CipherScope</title>
7+
<style>
8+
* {
9+
margin: 0;
10+
padding: 0;
11+
box-sizing: border-box;
12+
}
13+
14+
body {
15+
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
16+
line-height: 1.6;
17+
color: #333;
18+
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
19+
min-height: 100vh;
20+
display: flex;
21+
align-items: center;
22+
justify-content: center;
23+
}
24+
25+
.container {
26+
background: white;
27+
border-radius: 12px;
28+
box-shadow: 0 20px 40px rgba(0,0,0,0.1);
29+
padding: 3rem;
30+
max-width: 800px;
31+
width: 90%;
32+
text-align: center;
33+
}
34+
35+
h1 {
36+
font-size: 3rem;
37+
font-weight: 700;
38+
color: #2c3e50;
39+
margin-bottom: 1rem;
40+
background: linear-gradient(135deg, #667eea, #764ba2);
41+
-webkit-background-clip: text;
42+
-webkit-text-fill-color: transparent;
43+
background-clip: text;
44+
}
45+
46+
.subtitle {
47+
font-size: 1.2rem;
48+
color: #666;
49+
margin-bottom: 2rem;
50+
font-weight: 400;
51+
}
52+
53+
.description {
54+
font-size: 1.1rem;
55+
color: #555;
56+
margin-bottom: 2.5rem;
57+
line-height: 1.7;
58+
}
59+
60+
.install-section {
61+
background: #f8f9fa;
62+
border-radius: 8px;
63+
padding: 2rem;
64+
margin: 2rem 0;
65+
border-left: 4px solid #667eea;
66+
}
67+
68+
.install-title {
69+
font-size: 1.3rem;
70+
font-weight: 600;
71+
color: #2c3e50;
72+
margin-bottom: 1rem;
73+
}
74+
75+
.code-block {
76+
background: #2c3e50;
77+
color: #ecf0f1;
78+
padding: 1.5rem;
79+
border-radius: 6px;
80+
font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace;
81+
font-size: 1rem;
82+
margin: 1rem 0;
83+
overflow-x: auto;
84+
position: relative;
85+
}
86+
87+
.copy-btn {
88+
position: absolute;
89+
top: 0.5rem;
90+
right: 0.5rem;
91+
background: #667eea;
92+
color: white;
93+
border: none;
94+
padding: 0.5rem 1rem;
95+
border-radius: 4px;
96+
cursor: pointer;
97+
font-size: 0.9rem;
98+
transition: background 0.2s;
99+
}
100+
101+
.copy-btn:hover {
102+
background: #5a6fd8;
103+
}
104+
105+
.features {
106+
display: grid;
107+
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
108+
gap: 1.5rem;
109+
margin: 2rem 0;
110+
}
111+
112+
.feature {
113+
background: #f8f9fa;
114+
padding: 1.5rem;
115+
border-radius: 8px;
116+
border-top: 3px solid #667eea;
117+
}
118+
119+
.feature h3 {
120+
color: #2c3e50;
121+
margin-bottom: 0.5rem;
122+
font-size: 1.1rem;
123+
}
124+
125+
.feature p {
126+
color: #666;
127+
font-size: 0.95rem;
128+
}
129+
130+
.languages {
131+
display: flex;
132+
flex-wrap: wrap;
133+
justify-content: center;
134+
gap: 0.5rem;
135+
margin: 1.5rem 0;
136+
}
137+
138+
.lang-tag {
139+
background: #667eea;
140+
color: white;
141+
padding: 0.4rem 0.8rem;
142+
border-radius: 20px;
143+
font-size: 0.9rem;
144+
font-weight: 500;
145+
}
146+
147+
.footer {
148+
margin-top: 2rem;
149+
padding-top: 2rem;
150+
border-top: 1px solid #eee;
151+
color: #666;
152+
font-size: 0.9rem;
153+
}
154+
155+
.footer a {
156+
color: #667eea;
157+
text-decoration: none;
158+
}
159+
160+
.footer a:hover {
161+
text-decoration: underline;
162+
}
163+
164+
@media (max-width: 600px) {
165+
.container {
166+
padding: 2rem 1.5rem;
167+
}
168+
169+
h1 {
170+
font-size: 2.5rem;
171+
}
172+
173+
.code-block {
174+
font-size: 0.9rem;
175+
padding: 1rem;
176+
}
177+
}
178+
</style>
179+
</head>
180+
<body>
181+
<div class="container">
182+
<h1>CipherScope</h1>
183+
<p class="subtitle">Fast static scanner for cryptographic libraries</p>
184+
185+
<p class="description">
186+
Find third-party cryptographic libraries and call sites across 10 programming languages
187+
with low false positives and high performance.
188+
</p>
189+
190+
<div class="install-section">
191+
<h3 class="install-title">Install & Run</h3>
192+
<div class="code-block">
193+
<button class="copy-btn" onclick="copyToClipboard('cargo install --git https://github.com/your-org/cipherscope')">Copy</button>
194+
cargo install --git https://github.com/your-org/cipherscope
195+
</div>
196+
<p style="margin-top: 1rem; color: #666; font-size: 0.9rem;">
197+
Or build from source: <code>cargo build --release</code>
198+
</p>
199+
</div>
200+
201+
<div class="features">
202+
<div class="feature">
203+
<h3>🚀 Fast & Efficient</h3>
204+
<p>Parallel processing with Aho-Corasick prefiltering and pattern caching for maximum speed.</p>
205+
</div>
206+
<div class="feature">
207+
<h3>🎯 Low False Positives</h3>
208+
<p>Smart pattern matching with comment stripping and import validation to reduce noise.</p>
209+
</div>
210+
<div class="feature">
211+
<h3>📊 Multiple Outputs</h3>
212+
<p>Pretty tables, JSONL, and SARIF formats for integration with CI/CD pipelines.</p>
213+
</div>
214+
</div>
215+
216+
<div>
217+
<h3 style="color: #2c3e50; margin-bottom: 1rem;">Supported Languages</h3>
218+
<div class="languages">
219+
<span class="lang-tag">C</span>
220+
<span class="lang-tag">C++</span>
221+
<span class="lang-tag">Java</span>
222+
<span class="lang-tag">Go</span>
223+
<span class="lang-tag">Rust</span>
224+
<span class="lang-tag">Python</span>
225+
<span class="lang-tag">PHP</span>
226+
<span class="lang-tag">Swift</span>
227+
<span class="lang-tag">Objective-C</span>
228+
<span class="lang-tag">Kotlin</span>
229+
</div>
230+
</div>
231+
232+
<div class="install-section">
233+
<h3 class="install-title">Quick Start</h3>
234+
<div class="code-block">
235+
<button class="copy-btn" onclick="copyToClipboard('cryptofind . --progress')">Copy</button>
236+
cryptofind . --progress
237+
</div>
238+
<p style="margin-top: 1rem; color: #666; font-size: 0.9rem;">
239+
Scan current directory with progress bar
240+
</p>
241+
</div>
242+
243+
<div class="footer">
244+
<p>
245+
<a href="https://github.com/your-org/cipherscope">GitHub</a>
246+
<a href="https://github.com/your-org/cipherscope/blob/main/README.md">Documentation</a>
247+
<a href="https://github.com/your-org/cipherscope/issues">Issues</a>
248+
</p>
249+
<p style="margin-top: 0.5rem;">
250+
CipherScope is an open-source project for security teams and developers.
251+
</p>
252+
</div>
253+
</div>
254+
255+
<script>
256+
function copyToClipboard(text) {
257+
navigator.clipboard.writeText(text).then(function() {
258+
const btn = event.target;
259+
const originalText = btn.textContent;
260+
btn.textContent = 'Copied!';
261+
btn.style.background = '#27ae60';
262+
setTimeout(() => {
263+
btn.textContent = originalText;
264+
btn.style.background = '#667eea';
265+
}, 2000);
266+
}).catch(function(err) {
267+
console.error('Could not copy text: ', err);
268+
});
269+
}
270+
</script>
271+
</body>
272+
</html>

0 commit comments

Comments
 (0)