Bton commited on
Commit
6b3b321
·
verified ·
1 Parent(s): 77e934a

Theres text just sitting on the page that says

Browse files

`; } } customElements.define('custom-navbar', CustomNavbar);

Files changed (1) hide show
  1. style.css +1 -54
style.css CHANGED
@@ -1,54 +1 @@
1
- class CustomNavbar extends HTMLElement {
2
- connectedCallback() {
3
- this.attachShadow({ mode: 'open' });
4
- this.shadowRoot.innerHTML = `
5
- <style>
6
- .navbar {
7
- background-color: white;
8
- box-shadow: 0 2px 4px rgba(0,0,0,0.05);
9
- }
10
- .notification-dot {
11
- width: 8px;
12
- height: 8px;
13
- top: -2px;
14
- right: -2px;
15
- }
16
- .profile-img {
17
- width: 32px;
18
- height: 32px;
19
- }
20
- </style>
21
- <nav class="navbar px-6 py-4 sticky top-0 z-10">
22
- <div class="max-w-7xl mx-auto flex items-center justify-between">
23
- <div class="flex items-center space-x-2">
24
- <i data-feather="message-square" class="text-blue-600"></i>
25
- <span class="text-xl font-bold text-blue-600">EduPulse</span>
26
- </div>
27
-
28
- <div class="hidden md:flex items-center space-x-6">
29
- <div class="relative">
30
- <select class="appearance-none bg-gray-100 border-0 rounded-lg px-4 py-2 pr-8 focus:ring-2 focus:ring-blue-500">
31
- <option>CS 101</option>
32
- <option>MATH 202</option>
33
- <option>PHYS 101</option>
34
- </select>
35
- <i data-feather="chevron-down" class="absolute right-3 top-1/2 transform -translate-y-1/2 text-gray-500 pointer-events-none"></i>
36
- </div>
37
- </div>
38
-
39
- <div class="flex items-center space-x-4">
40
- <button class="p-2 rounded-full hover:bg-gray-100 relative">
41
- <i data-feather="bell"></i>
42
- <span class="notification-dot bg-red-500 rounded-full absolute"></span>
43
- </button>
44
- <div class="flex items-center space-x-2">
45
- <img src="http://static.photos/people/200x200/1" alt="Profile" class="profile-img rounded-full">
46
- <span class="hidden md:inline font-medium">Student</span>
47
- </div>
48
- </div>
49
- </div>
50
- </nav>
51
- `;
52
- }
53
- }
54
- customElements.define('custom-navbar', CustomNavbar);
 
1
+