File size: 4,089 Bytes
2cb3286
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
f78f3cd
 
 
2cb3286
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
f78f3cd
2cb3286
 
 
 
f78f3cd
2cb3286
 
 
 
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
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Sign In - VPS Linux</title>
    <style>
        :root {
            --bg-color: #0a0a0a;
            --card-bg: #111111;
            --text-color: #ffffff;
            --accent-color: #ff4d4d; /* Reddish accent similar to OpenClaw logo */
            --border-color: #333;
            --button-bg: #222;
            --button-hover: #333;
        }

        body {
            background-color: var(--bg-color);
            color: var(--text-color);
            font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
            display: flex;
            align-items: center;
            justify-content: center;
            height: 100vh;
            margin: 0;
        }

        .login-container {
            background-color: var(--card-bg);
            border: 1px solid var(--border-color);
            border-radius: 12px;
            padding: 40px;
            width: 100%;
            max-width: 360px;
            text-align: center;
            box-shadow: 0 4px 20px rgba(0, 0, 0, 0.5);
        }

        .logo {
            width: 64px;
            height: 64px;
            margin-bottom: 24px;
            margin-top: 10px; /* 位置下移 */
            /* Filled red robot icon */
            background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%23ff4d4d" d="M12 2a2 2 0 0 1 2 2c0 .74-.4 1.39-1 1.73V7h1a7 7 0 0 1 7 7h1a1 1 0 0 1 1 1v3a1 1 0 0 1-1 1h-1v1a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-1H2a1 1 0 0 1-1-1v-3a1 1 0 0 1 1-1h1a7 7 0 0 1 7-7V5.73C9.4 5.39 9 4.74 9 4a2 2 0 0 1 2-2M4.5 11a5.5 5.5 0 0 0 5.5 5.5 5.5 5.5 0 0 0 5.5-5.5H11v2h2v-2h2.5z"/></svg>');
            background-repeat: no-repeat;
            background-position: center;
            display: inline-block;
        }

        h1 {
            font-size: 24px;
            font-weight: 600;
            margin-bottom: 8px;
        }

        p {
            color: #888;
            margin-bottom: 32px;
            font-size: 14px;
        }

        .btn {
            display: block;
            width: 100%;
            padding: 12px;
            margin-bottom: 12px;
            border-radius: 6px;
            border: 1px solid var(--border-color);
            background-color: var(--button-bg);
            color: var(--text-color);
            font-size: 14px;
            font-weight: 500;
            cursor: pointer;
            text-decoration: none;
            transition: background-color 0.2s, transform 0.1s;
            box-sizing: border-box;
        }

        .btn:hover {
            background-color: var(--button-hover);
        }

        .btn:active {
            transform: scale(0.98);
        }

        .btn-github {
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 10px;
        }
        
        .btn-google {
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 10px;
        }

        .footer {
            margin-top: 32px;
            font-size: 12px;
            color: #444;
        }
    </style>
</head>
<body>
    <div class="login-container">
        <div class="logo"></div>
        <h1>Welcome Back</h1>
        <p>Sign in to access your VPS Linux environment</p>

        <!-- OAuth2 Proxy automatically injects the sign-in URL here, 
             but since we are customizing the page, we need to point to the start endpoint.
             The default template uses a form or simple links. -->
        
        <!-- Assuming we configured GitHub -->
        <form method="GET" action="/oauth2/start">
            <input type="hidden" name="rd" value="/">
            <button type="submit" class="btn btn-github">
                Sign in with Github
            </button>
        </form>

        <div class="footer">
            
        </div>
    </div>
</body>
</html>