Hugging Face's logo

Spaces:
jamesLeeeeeee
/
ocr
Running

App Files Community
ocr
File size: 3,055 Bytes 
6cd201c
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
33ce322
e08a831
6cd201c
0f7d155
6cd201c
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
 
class CustomHeader extends HTMLElement {
    connectedCallback() {
        this.attachShadow({ mode: 'open' });
        this.shadowRoot.innerHTML = `
            <style>
                nav {
                    background: rgba(255, 255, 255, 0.8);
                    backdrop-filter: blur(10px);
                    border-bottom: 1px solid rgba(14, 165, 233, 0.2);
                }
                .nav-link {
                    color: #0c4a6e;
                    transition: all 0.3s ease;
                    position: relative;
                }
                .nav-link:hover {
                    color: #0ea5e9;
                    transform: translateY(-2px);
                }
                .nav-link::after {
                    content: '';
                    position: absolute;
                    width: 0;
                    height: 2px;
                    bottom: -4px;
                    left: 50%;
                    background: #0ea5e9;
                    transition: all 0.3s ease;
                    transform: translateX(-50%);
                }
                .nav-link:hover::after {
                    width: 100%;
                }
                .logo {
                    background: linear-gradient(135deg, #0ea5e9 0%, #0369a1 100%);
                    -webkit-background-clip: text;
                    -webkit-text-fill-color: transparent;
                    background-clip: text;
                }
            </style>
            <nav class="sticky top-0 z-50">
                <div class="container mx-auto px-4 py-4">
                    <div class="flex items-center justify-between">
                        <a href="/" class="text-2xl font-bold logo undefined-pulse">Undefined🌀</a>
                        <div class="hidden md:flex space-x-8">
                            <a href="/" class="nav-link font-medium">홈</a>
                            <a href="/admin.html" class="nav-link font-medium">관리자</a>
                            <a href="/deployment.html" class="nav-link font-medium">작업 배포</a>
                            <a href="/admin-detail.html" class="nav-link font-medium">관리 상세</a>
                            <a href="/worker.html" class="nav-link font-medium">작업자</a>
                            <a href="/sample.html" class="nav-link font-medium">샘플 데이터</a>
                        </div>
<div class="flex items-center space-x-4">
                            <button class="bg-undefined-500 hover:bg-undefined-600 text-white px-4 py-2 rounded-full text-sm font-medium transition-all duration-300">
                                Get Started
                            </button>
                            <button class="md:hidden">
                                <i data-feather="menu" class="text-undefined-700"></i>
                            </button>
                        </div>
                    </div>
                </div>
            </nav>
        `;
    }
}

customElements.define('custom-header', CustomHeader);