BoobyBoobs commited on
Commit
2225b75
·
verified ·
1 Parent(s): 7386728

Add 3 files

Browse files
Files changed (3) hide show
  1. README.md +7 -5
  2. index.html +39 -17
  3. prompts.txt +1 -0
README.md CHANGED
@@ -1,10 +1,12 @@
1
  ---
2
- title: Sticky
3
- emoji: 🐢
4
- colorFrom: red
5
- colorTo: yellow
6
  sdk: static
7
  pinned: false
 
 
8
  ---
9
 
10
- Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
 
1
  ---
2
+ title: sticky
3
+ emoji: 🐳
4
+ colorFrom: blue
5
+ colorTo: purple
6
  sdk: static
7
  pinned: false
8
+ tags:
9
+ - deepsite
10
  ---
11
 
12
+ Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
index.html CHANGED
@@ -1,19 +1,41 @@
1
- <!doctype html>
2
  <html>
3
- <head>
4
- <meta charset="utf-8" />
5
- <meta name="viewport" content="width=device-width" />
6
- <title>My static Space</title>
7
- <link rel="stylesheet" href="style.css" />
8
- </head>
9
- <body>
10
- <div class="card">
11
- <h1>Welcome to your static Space!</h1>
12
- <p>You can modify this app directly by editing <i>index.html</i> in the Files and versions tab.</p>
13
- <p>
14
- Also don't forget to check the
15
- <a href="https://huggingface.co/docs/hub/spaces" target="_blank">Spaces documentation</a>.
16
- </p>
17
- </div>
18
- </body>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
19
  </html>
 
1
+ <!DOCTYPE html>
2
  <html>
3
+ <head>
4
+ <title>My app</title>
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0" />
6
+ <meta charset="utf-8">
7
+ <style>
8
+ body {
9
+ display: flex;
10
+ justify-content: center;
11
+ align-items: center;
12
+ overflow: hidden;
13
+ height: 100dvh;
14
+ font-family: "Arial", sans-serif;
15
+ text-align: center;
16
+ }
17
+ .arrow {
18
+ position: absolute;
19
+ bottom: 32px;
20
+ left: 0px;
21
+ width: 100px;
22
+ transform: rotate(30deg);
23
+ }
24
+ h1 {
25
+ font-size: 50px;
26
+ }
27
+ h1 span {
28
+ color: #acacac;
29
+ font-size: 32px;
30
+ }
31
+ </style>
32
+ </head>
33
+ <body>
34
+ <h1>
35
+ <span>I'm ready to work,</span><br />
36
+ Ask me anything.
37
+ </h1>
38
+ <img src="https://enzostvs-deepsite.hf.space/arrow.svg" class="arrow" />
39
+ <script></script>
40
+ <p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=BoobyBoobs/sticky" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
41
  </html>
prompts.txt ADDED
@@ -0,0 +1 @@
 
 
1
+ import React, { useState, useEffect } from 'react'; import axios from 'axios'; const EmotionControlPanel = () => { const [user, setUser] = useState(null); const [form, setForm] = useState({ username: '', password: '' }); const [errors, setErrors] = useState({ username: '', password: '', auth: '' }); const [mode, setMode] = useState('login'); // 'login' or 'register' const [settings, setSettings] = useState({ seduction: 50, curiosity: 50, pleasure: 50, depth: 50 }); const [active, setActive] = useState({ seduction: true, curiosity: true, pleasure: true, depth: true }); useEffect(() => { axios.get('/api/emotions') .then(res => { setSettings({ seduction: res.data.seduction, curiosity: res.data.curiosity, pleasure: res.data.pleasure, depth: res.data.depth }); setActive(res.data.active); setUser(true); }) .catch(() => setUser(false)); }, []); const validateForm = () => { let valid = true; const newErrors = { username: '', password: '', auth: '' }; if (!form.username.trim()) { newErrors.username = 'Username is required'; valid = false; } if (form.password.length < 6) { newErrors.password = 'Password must be at least 6 characters'; valid = false; } setErrors(newErrors); return valid; }; const handleAuth = async () => { if (!validateForm()) return; try { const url = mode === 'login' ? '/api/login' : '/api/register'; await axios.post(url, form); const res = await axios.get('/api/emotions'); setSettings(res.data); setActive(res.data.active); setUser(true); setErrors({ username: '', password: '', auth: '' }); } catch (err) { setErrors(prev => ({ ...prev, auth: err.response?.data?.error || 'Authentication failed' })); } }; const saveSettings = async () => { await axios.post('/api/emotions', { ...settings, active }); }; const handleSliderChange = (key, value) => { const updated = { ...settings, [key]: value }; setSettings(updated); saveSettings(); }; const handleToggle = (key) => { const updated = { ...active, [key]: !active[key] }; setActive(updated); saveSettings(); }; const handleLogout = async () => { await axios.post('/api/logout'); setUser(false); }; if (!user) { return ( <div className="p-6 max-w-md mx-auto bg-white shadow-lg rounded-lg"> <h2 className="text-2xl font-bold mb-4 text-center text-gray-800">{mode === 'login' ? 'Login' : 'Register'}</h2> <input type="text" placeholder="Username" className="mb-2 p-3 border rounded w-full focus:outline-none focus:ring-2 focus:ring-blue-500" value={form.username} onChange={(e) => setForm({ ...form, username: e.target.value })} /> {errors.username && <p className="text-red-600 text-sm mb-2">{errors.username}</p>} <input type="password" placeholder="Password" className="mb-2 p-3 border rounded w-full focus:outline-none focus:ring-2 focus:ring-blue-500" value={form.password} onChange={(e) => setForm({ ...form, password: e.target.value })} /> {errors.password && <p className="text-red-600 text-sm mb-2">{errors.password}</p>} {errors.auth && <p className="text-red-600 text-sm mb-4 text-center">{errors.auth}</p>} <button onClick={handleAuth} className="w-full bg-blue-600 hover:bg-blue-700 text-white py-3 rounded font-semibold"> {mode === 'login' ? 'Login' : 'Register'} </button> <button onClick={() => setMode(mode === 'login' ? 'register' : 'login')} className="mt-4 w-full text-blue-500 hover:text-blue-700 text-sm text-center" > {mode === 'login' ? 'Need to register?' : 'Already have an account?'} </button> </div> ); } return ( <div className="p-6 max-w-2xl mx-auto bg-white shadow-lg rounded-lg"> <h2 className="text-2xl font-bold mb-6 text-center text-gray-800">Emotional Tuning Panel</h2> {Object.keys(settings).map((key) => ( <div key={key} className="mb-6"> <label className="block font-semibold text-gray-700 mb-1"> {key.charAt(0).toUpperCase() + key.slice(1)} </label> <input type="range" min="0" max="100" value={settings[key]} onChange={(e) => handleSliderChange(key, parseInt(e.target.value))} className="w-full h-2 bg-gray-200 rounded-lg appearance-none cursor-pointer accent-pink-500" /> <label className="flex items-center mt-2 text-gray-600"> <input type="checkbox" checked={active[key]} onChange={() => handleToggle(key)} className="mr-2 accent-pink-500" /> Active </label> </div> ))} <button onClick={handleLogout} className="mt-6 bg-red-600 hover:bg-red-700 text-white py-3 px-6 rounded font-semibold w-full" > Logout </button> </div> ); }; export default EmotionControlPanel; The authentication forms and emotion sliders are now styled with Tailwind for enhanced visual appeal and user experience. Validation and error messaging are also integrated for better usability. Suggested next prompt: “Add support for password reset and ‘Remember Me’ functionality to the authentication system.”