Hugging Face's logo

Spaces:
Toyshot
/
claude-s-shadowy-sanctuary
Running

App Files Community
Toyshot commited on
Commit
45a69fa
·
verified ·
1 Parent(s): af63db7

Delete the chats side bar I only want the interface

Browse files
Files changed (1) hide show
  1. index.html +1 -92
index.html CHANGED
@@ -53,69 +53,7 @@
53
  }
54
  </style>
55
  </head>
56
- <body class="h-full bg-dark-900 text-gray-100 flex">
57
- <!-- Left Sidebar -->
58
- <div id="sidebar" class="w-[240px] h-full bg-[#171617] flex flex-col border-r border-dark-700 transition-all duration-300 ease-in-out">
59
- <button id="sidebar-toggle" class="ml-2 w-6 h-6 bg-dark-700 rounded-full flex items-center justify-center border border-dark-600 shadow-lg hover:bg-dark-600 transition-colors">
60
- <i data-feather="menu" class="w-4 h-4 stroke-gray-400"></i>
61
- </button>
62
- <!-- Logo -->
63
- <div class="flex items-center p-4">
64
- <h1 class="text-xl serif text-[#EAE7E3] ml-2">Syntra</h1>
65
- </div>
66
- <!-- New Chat Button -->
67
- <div class="mx-4 mb-6 mt-[70px]">
68
- <button class="flex items-center gap-2 group">
69
- <div class="w-[30px] h-[30px] rounded-full bg-gradient-to-br from-[#FF6B3A] to-[#FF8D5C] flex items-center justify-center shadow-[0_0_15px_-3px_rgba(255,107,58,0.4)] group-hover:shadow-[0_0_20px_-2px_rgba(255,107,58,0.6)] transition-all duration-300">
70
- <i data-feather="plus" class="w-3.5 h-3.5 stroke-white stroke-[2.5px]"></i>
71
- </div>
72
- <span class="text-[13px] font-medium text-[#F5F5F5] group-hover:text-white transition-colors">New chat</span>
73
- </button>
74
- </div>
75
- <!-- Enhanced Navigation -->
76
- <nav class="px-4 space-y-3">
77
- <div class="border-t border-dark-700 my-2"></div>
78
- <a href="#" class="nav-item flex items-center gap-3">
79
- <i data-feather="message-square" class="w-5 h-5 stroke-[#A8A8A8] stroke-[1.5px]"></i>
80
- <span class="text-[14px] text-[#EDEDED]">Chats</span>
81
- </a>
82
- <a href="#" class="nav-item flex items-center gap-3">
83
- <i data-feather="folder" class="w-5 h-5 stroke-[#A8A8A8] stroke-[1.5px]"></i>
84
- <span class="text-[14px] text-[#EDEDED]">Projects</span>
85
- </a>
86
- <a href="#" class="nav-item flex items-center gap-3">
87
- <i data-feather="hexagon" class="w-5 h-5 stroke-[#A8A8A8] stroke-[1.5px]"></i>
88
- <span class="text-[14px] text-[#EDEDED]">Artifacts</span>
89
- </a>
90
- </nav>
91
- <!-- Enhanced Recents -->
92
- <div class="mt-6 px-4">
93
- <div class="border-t border-dark-700 my-3"></div>
94
- <p class="text-[11px] uppercase text-[#8F8F8F] tracking-wider">Recents</p>
95
- <div class="mt-3 space-y-3">
96
- <a href="#" class="chat-item block">
97
- <span class="text-[14px] text-[#DCDCDC]">Understanding electrolysis process</span>
98
- </a>
99
- <a href="#" class="chat-item block">
100
- <span class="text-[14px] text-[#DCDCDC]">Greeting</span>
101
- </a>
102
- <a href="#" class="chat-item block">
103
- <span class="text-[14px] text-[#DCDCDC]">Untitled</span>
104
- </a>
105
- </div>
106
- </div>
107
- <!-- Enhanced User Info -->
108
- <div class="mt-auto p-4 flex items-center border-t border-dark-700">
109
- <div class="w-10 h-10 rounded-full bg-[#3A3A3A] flex items-center justify-center">
110
- <span class="text-white font-bold">T</span>
111
- </div>
112
- <div class="ml-3">
113
- <p class="text-[14px] text-white">Toy</p>
114
- <p class="text-[12px] text-[#9A9A9A]">Free plan</p>
115
- </div>
116
- </div>
117
- </div>
118
-
119
  <!-- Main Content -->
120
  <main class="flex-1 flex flex-col items-center justify-center p-6 transition-all duration-300 ease-in-out">
121
  <!-- Plan Banner -->
@@ -174,25 +112,6 @@
174
 
175
  <script>
176
  feather.replace();
177
-
178
- // Sidebar toggle functionality
179
- const sidebar = document.getElementById('sidebar');
180
- const sidebarToggle = document.getElementById('sidebar-toggle');
181
- const chevron = sidebarToggle.querySelector('i');
182
- sidebarToggle.addEventListener('click', () => {
183
- sidebar.classList.toggle('w-[240px]');
184
- sidebar.classList.toggle('w-0');
185
- sidebar.classList.toggle('overflow-hidden');
186
-
187
- // Change icon based on state
188
- if (sidebar.classList.contains('w-0')) {
189
- chevron.setAttribute('data-feather', 'align-left');
190
- } else {
191
- chevron.setAttribute('data-feather', 'align-right');
192
- }
193
- feather.replace();
194
- });
195
-
196
  // Simple animation for the greeting star
197
  document.addEventListener('DOMContentLoaded', function() {
198
  const star = document.querySelector('[data-feather="star"]');
@@ -216,16 +135,6 @@ document.addEventListener('DOMContentLoaded', function() {
216
  loop: true,
217
  easing: 'easeInOutSine'
218
  });
219
-
220
- // Add subtle glow to sidebar
221
- anime({
222
- targets: '#sidebar',
223
- boxShadow: ['0 0 0 0 rgba(255,107,58,0)', '-5px 0 15px -5px rgba(255,107,58,0.08)'],
224
- duration: 2000,
225
- loop: true,
226
- direction: 'alternate',
227
- easing: 'easeInOutSine'
228
- });
229
  });
230
  </script>
231
  </body>
 
53
  }
54
  </style>
55
  </head>
56
+ <body class="h-full bg-dark-900 text-gray-100 flex justify-center">
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
57
  <!-- Main Content -->
58
  <main class="flex-1 flex flex-col items-center justify-center p-6 transition-all duration-300 ease-in-out">
59
  <!-- Plan Banner -->
 
112
 
113
  <script>
114
  feather.replace();
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
115
  // Simple animation for the greeting star
116
  document.addEventListener('DOMContentLoaded', function() {
117
  const star = document.querySelector('[data-feather="star"]');
 
135
  loop: true,
136
  easing: 'easeInOutSine'
137
  });
 
 
 
 
 
 
 
 
 
 
138
  });
139
  </script>
140
  </body>