mbkauthe 1.3.4 → 1.4.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,236 +1,256 @@
1
- <html>
1
+ <!DOCTYPE html>
2
+ <html lang="en">
2
3
 
3
4
  <head>
5
+ <meta charset="UTF-8">
6
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
4
7
  <title>Version and Configuration Information</title>
5
8
  <link rel="icon" type="image/x-icon" href="https://mbktechstudio.com/Assets/Images/Icon/dgicon.svg">
6
-
9
+ <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
10
+ {{> sharedStyles}}
7
11
  <style>
8
- :root {
9
- --bg-color: #121212;
10
- --card-bg: #1e1e1e;
11
- --text-color: #e0e0e0;
12
- --text-secondary: #a0a0a0;
13
- --primary: #bb86fc;
14
- --primary-dark: #3700b3;
15
- --secondary: #03dac6;
16
- --border-color: #333;
17
- --success: #4caf50;
18
- --warning: #ff9800;
19
- --error: #f44336;
20
- --key-color: #bb86fc;
21
- --string-color: #03dac6;
22
- --number-color: #ff7043;
23
- --boolean-color: #7986cb;
24
- }
25
-
26
- body {
27
- font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
28
- margin: 0;
29
- padding: 20px;
30
- background-color: var(--bg-color);
31
- color: var(--text-color);
32
- }
33
-
34
- .container {
35
- max-width: 1000px;
36
- margin: 0 auto;
37
- padding: 20px;
38
- background: var(--card-bg);
39
- border-radius: 8px;
40
- box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
41
- }
42
-
43
- h1 {
44
- color: var(--primary);
12
+ .info-box {
13
+ background: rgba(10, 20, 20, 0.95);
14
+ backdrop-filter: blur(10px);
15
+ border-radius: var(--border-radius);
16
+ padding: 2.5rem;
17
+ width: 100%;
18
+ max-width: 900px;
19
+ box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4);
20
+ border: 1px solid rgba(0, 184, 148, 0.2);
21
+ position: relative;
22
+ z-index: 2;
23
+ transition: var(--transition);
24
+ }
25
+
26
+ .info-box:hover {
27
+ box-shadow: 0 12px 40px rgba(0, 0, 0, 0.5);
28
+ border-color: rgba(0, 184, 148, 0.3);
29
+ }
30
+
31
+ .info-title {
45
32
  text-align: center;
46
- margin-bottom: 30px;
47
- padding-bottom: 10px;
48
- border-bottom: 1px solid var(--border-color);
49
- font-weight: bold;
50
- letter-spacing: 1px;
33
+ margin-bottom: 2rem;
34
+ font-size: 2rem;
35
+ position: relative;
36
+ color: var(--light);
37
+ }
38
+
39
+ .info-title::after {
40
+ content: '';
41
+ position: absolute;
42
+ bottom: -10px;
43
+ left: 50%;
44
+ transform: translateX(-50%);
45
+ width: 100px;
46
+ height: 4px;
47
+ background-color: var(--accent);
48
+ border-radius: 2px;
51
49
  }
52
50
 
53
51
  .info-section {
54
- margin-bottom: 25px;
55
- padding: 20px;
56
- border: 1px solid var(--border-color);
57
- border-radius: 8px;
58
- background-color: rgba(30, 30, 30, 0.7);
59
- transition: all 0.3s ease;
52
+ margin-bottom: 2rem;
53
+ padding: 1.5rem;
54
+ border: 1px solid rgba(0, 184, 148, 0.2);
55
+ border-radius: var(--border-radius);
56
+ background-color: rgba(0, 0, 0, 0.2);
57
+ transition: var(--transition);
60
58
  }
61
59
 
62
60
  .info-section:hover {
63
- border-color: var(--primary);
64
- box-shadow: 0 0 0 1px var(--primary);
61
+ border-color: rgba(0, 184, 148, 0.4);
62
+ background-color: rgba(0, 0, 0, 0.3);
65
63
  }
66
64
 
67
65
  .info-section h2 {
68
- color: var(--primary);
69
- border-bottom: 2px solid var(--primary-dark);
70
- padding-bottom: 8px;
66
+ color: var(--accent);
67
+ border-bottom: 2px solid rgba(0, 184, 148, 0.3);
68
+ padding-bottom: 10px;
71
69
  margin-top: 0;
72
- margin-bottom: 15px;
73
- font-size: 1.2em;
70
+ margin-bottom: 1.5rem;
71
+ font-size: 1.4rem;
74
72
  display: flex;
75
- justify-content: space-between;
76
73
  align-items: center;
74
+ gap: 10px;
75
+ }
76
+
77
+ .info-section h2 i {
78
+ font-size: 1.2rem;
77
79
  }
78
80
 
79
81
  .info-row {
80
82
  display: flex;
81
- margin-bottom: 10px;
82
- padding-bottom: 10px;
83
- border-bottom: 1px solid var(--border-color);
83
+ margin-bottom: 1rem;
84
+ padding-bottom: 1rem;
85
+ border-bottom: 1px solid rgba(0, 184, 148, 0.1);
86
+ align-items: center;
87
+ }
88
+
89
+ .info-row:last-child {
90
+ border-bottom: none;
91
+ margin-bottom: 0;
92
+ padding-bottom: 0;
84
93
  }
85
94
 
86
95
  .info-label {
87
96
  font-weight: 600;
88
- color: var(--text-secondary);
89
- min-width: 220px;
90
- font-size: 0.95em;
97
+ color: var(--text-light);
98
+ min-width: 240px;
99
+ font-size: 1rem;
91
100
  }
92
101
 
93
102
  .info-value {
94
103
  flex: 1;
95
104
  word-break: break-word;
96
- color: var(--text-color);
105
+ color: var(--text);
106
+ font-size: 1rem;
97
107
  }
98
108
 
99
109
  .version-status {
100
- display: inline-block;
101
- padding: 3px 10px;
102
- border-radius: 12px;
103
- font-size: 0.8em;
110
+ display: inline-flex;
111
+ align-items: center;
112
+ gap: 6px;
113
+ padding: 4px 12px;
114
+ border-radius: 20px;
115
+ font-size: 0.85rem;
104
116
  font-weight: 600;
105
117
  margin-left: 10px;
106
118
  }
107
119
 
108
120
  .version-up-to-date {
109
- background: rgba(76, 175, 80, 0.2);
121
+ background: rgba(67, 233, 123, 0.2);
110
122
  color: var(--success);
111
123
  border: 1px solid var(--success);
112
124
  }
113
125
 
114
126
  .version-outdated {
115
- background: rgba(244, 67, 54, 0.2);
116
- color: var(--error);
117
- border: 1px solid var(--error);
127
+ background: rgba(255, 118, 117, 0.2);
128
+ color: var(--danger);
129
+ border: 1px solid var(--danger);
118
130
  }
119
131
 
120
132
  .version-fetch-error {
121
- background: rgba(255, 152, 0, 0.2);
133
+ background: rgba(255, 209, 102, 0.2);
122
134
  color: var(--warning);
123
135
  border: 1px solid var(--warning);
124
136
  }
125
137
 
126
- ::-webkit-scrollbar {
127
- width: 8px;
128
- height: 8px;
129
- }
138
+ @media (max-width: 768px) {
139
+ .info-box {
140
+ padding: 2rem;
141
+ max-width: 100%;
142
+ }
130
143
 
131
- ::-webkit-scrollbar-track {
132
- background: #2d2d2d;
133
- border-radius: 4px;
134
- }
144
+ .info-title {
145
+ font-size: 1.8rem;
146
+ }
135
147
 
136
- ::-webkit-scrollbar-thumb {
137
- background: #555;
138
- border-radius: 4px;
139
- }
148
+ .info-row {
149
+ flex-direction: column;
150
+ align-items: flex-start;
151
+ gap: 0.5rem;
152
+ }
140
153
 
141
- ::-webkit-scrollbar-thumb:hover {
142
- background: var(--primary);
143
- }
154
+ .info-label {
155
+ min-width: unset;
156
+ }
144
157
 
145
- /* Tooltip for copy button */
146
- .tooltip {
147
- position: relative;
148
- display: inline-block;
158
+ .info-section h2 {
159
+ font-size: 1.2rem;
160
+ }
149
161
  }
150
162
 
151
- .tooltip .tooltiptext {
152
- visibility: hidden;
153
- width: 120px;
154
- background-color: #333;
155
- color: #fff;
156
- text-align: center;
157
- border-radius: 6px;
158
- padding: 5px;
159
- position: absolute;
160
- z-index: 1;
161
- bottom: 125%;
162
- left: 50%;
163
- margin-left: -60px;
164
- opacity: 0;
165
- transition: opacity 0.3s;
166
- font-size: 0.8em;
167
- }
163
+ @media (max-width: 576px) {
164
+ .info-box {
165
+ padding: 1.5rem;
166
+ }
168
167
 
169
- .tooltip:hover .tooltiptext {
170
- visibility: visible;
171
- opacity: 1;
168
+ .info-section {
169
+ padding: 1rem;
170
+ }
172
171
  }
173
172
  </style>
174
- <link href="https://fonts.googleapis.com/css2?family=Fira+Code:wght@400;500&display=swap" rel="stylesheet">
175
173
  </head>
176
174
 
177
175
  <body>
178
- <div class="container">
179
- <h1>Version and Configuration Dashboard</h1>
180
-
181
- <div class="info-section">
182
- <h2>Version Information</h2>
183
- <div class="info-row">
184
- <div class="info-label">Current Version:</div>
185
- <div class="info-value" id="CurrentVersion">{{version}}</div>
186
- </div>
187
- <div class="info-row">
188
- <div class="info-label">Latest Version:</div>
189
- <div class="info-value">
190
- {{latestVersion}}
176
+ <header>
177
+ <div class="header-container">
178
+ <a class="logo">
179
+ <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 90 90" class="iconAboveSlogan">
180
+ <g id="8db2a7f9-6efc-4f7e-ae5b-8ba33875da43" transform="matrix(2.8125,0,0,2.8125,0,0)" stroke="none"
181
+ fill="#00b894">
182
+ <path
183
+ d="M0 32h32V0H0v32zm19.377-19.492l6.936-6.936v20.855h-6.936V12.508zM5.688 5.572l6.936 6.936v13.919H5.688V5.572z">
184
+ </path>
185
+ </g>
186
+ </svg>
187
+ <span class="logo-text">{{mbkautheVar.APP_NAME}} <span class="logo-comp">MBKTECHStudio</span></span>
188
+ </a>
189
+ </div>
190
+ </header>
191
191
 
192
- {{#if (eq latestVersion version)}}
193
- <span class="version-status version-up-to-date">Up to date</span>
194
- {{/if}}
192
+ <section class="login-container">
193
+ <i class="fas fa-info-circle ai-element"></i>
194
+ <i class="fas fa-cogs ai-element"></i>
195
+ <i class="fas fa-server ai-element"></i>
196
+ <i class="fas fa-code-branch ai-element"></i>
195
197
 
198
+ <div class="info-box">
199
+ <h1 class="info-title">System Information</h1>
200
+
201
+ <div class="info-section">
202
+ <h2><i class="fas fa-code-branch"></i> Version Information</h2>
203
+ <div class="info-row">
204
+ <div class="info-label">Current Version:</div>
205
+ <div class="info-value" id="CurrentVersion">{{version}}</div>
206
+ </div>
207
+ <div class="info-row">
208
+ <div class="info-label">Latest Version:</div>
209
+ <div class="info-value">
210
+ {{latestVersion}}
211
+ {{#if (eq latestVersion version)}}
212
+ <span class="version-status version-up-to-date">
213
+ <i class="fas fa-check-circle"></i> Up to date
214
+ </span>
215
+ {{/if}}
216
+ </div>
196
217
  </div>
197
218
  </div>
198
- </div>
199
219
 
200
- <div class="info-section">
201
- <h2>Configuration Information</h2>
202
- <div class="info-row">
203
- <div class="info-label">APP_NAME:</div>
204
- <div class="info-value">{{mbkautheVar.APP_NAME}}</div>
205
- </div>
206
- <div class="info-row">
207
- <div class="info-label">MBKAUTH_TWO_FA_ENABLE:</div>
208
- <div class="info-value">{{mbkautheVar.MBKAUTH_TWO_FA_ENABLE}}</div>
209
- </div>
210
- <div class="info-row">
211
- <div class="info-label">COOKIE_EXPIRE_TIME:</div>
212
- <div class="info-value">{{mbkautheVar.COOKIE_EXPIRE_TIME}} Days</div>
213
- </div>
214
- <div class="info-row">
215
- <div class="info-label">IS_DEPLOYED:</div>
216
- <div class="info-value">{{mbkautheVar.IS_DEPLOYED}}</div>
217
- </div>
218
- <div class="info-row">
219
- <div class="info-label">DOMAIN:</div>
220
- <div class="info-value">{{mbkautheVar.DOMAIN}}</div>
221
- </div>
222
- <div class="info-row">
223
- <div class="info-label">Login Redirect URL:</div>
224
- <div class="info-value">{{mbkautheVar.loginRedirectURL}}</div>
225
- </div>
220
+ <div class="info-section">
221
+ <h2><i class="fas fa-cog"></i> Configuration Information</h2>
222
+ <div class="info-row">
223
+ <div class="info-label">APP_NAME:</div>
224
+ <div class="info-value">{{mbkautheVar.APP_NAME}}</div>
225
+ </div>
226
+ <div class="info-row">
227
+ <div class="info-label">Two Factor Authentication:</div>
228
+ <div class="info-value">{{mbkautheVar.MBKAUTH_TWO_FA_ENABLE}}</div>
229
+ </div>
230
+ <div class="info-row">
231
+ <div class="info-label">Cookie Expiration:</div>
232
+ <div class="info-value">{{mbkautheVar.COOKIE_EXPIRE_TIME}} Days</div>
233
+ </div>
226
234
  <div class="info-row">
227
- <div class="info-label">GitHub Login Enabled:</div>
228
- <div class="info-value">{{mbkautheVar.GITHUB_LOGIN_ENABLED}}</div>
235
+ <div class="info-label">Deployment Status:</div>
236
+ <div class="info-value">{{mbkautheVar.IS_DEPLOYED}}</div>
237
+ </div>
238
+ <div class="info-row">
239
+ <div class="info-label">Domain:</div>
240
+ <div class="info-value">{{mbkautheVar.DOMAIN}}</div>
241
+ </div>
242
+ <div class="info-row">
243
+ <div class="info-label">Login Redirect URL:</div>
244
+ <div class="info-value">{{mbkautheVar.loginRedirectURL}}</div>
245
+ </div>
229
246
  </div>
230
247
  </div>
248
+ </section>
231
249
 
250
+ <!-- Version Info -->
251
+ <div class="version-info">
252
+ v{{version}}
232
253
  </div>
233
-
234
254
  </body>
235
255
 
236
256
  </html>