Update nui_simulator.html
This commit is contained in:
@@ -1,10 +1,12 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html lang="ro">
|
<html lang="ro">
|
||||||
|
|
||||||
<head>
|
<head>
|
||||||
<meta charset="UTF-8">
|
<meta charset="UTF-8">
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
<title>Red Valley — NUI Simulator</title>
|
<title>Red Valley — NUI Simulator</title>
|
||||||
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet">
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap"
|
||||||
|
rel="stylesheet">
|
||||||
<style>
|
<style>
|
||||||
* {
|
* {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
@@ -196,9 +198,20 @@
|
|||||||
flex-shrink: 0;
|
flex-shrink: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.tag-custom { background: rgba(34, 197, 94, 0.15); color: #22c55e; }
|
.tag-custom {
|
||||||
.tag-vendor { background: rgba(96, 165, 250, 0.15); color: #60a5fa; }
|
background: rgba(34, 197, 94, 0.15);
|
||||||
.tag-core { background: rgba(192, 132, 252, 0.15); color: #c084fc; }
|
color: #22c55e;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tag-vendor {
|
||||||
|
background: rgba(96, 165, 250, 0.15);
|
||||||
|
color: #60a5fa;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tag-core {
|
||||||
|
background: rgba(192, 132, 252, 0.15);
|
||||||
|
color: #c084fc;
|
||||||
|
}
|
||||||
|
|
||||||
/* Main content */
|
/* Main content */
|
||||||
.main {
|
.main {
|
||||||
@@ -284,8 +297,8 @@
|
|||||||
justify-content: center;
|
justify-content: center;
|
||||||
background:
|
background:
|
||||||
radial-gradient(circle at 20% 50%, rgba(255, 26, 53, 0.03) 0%, transparent 50%),
|
radial-gradient(circle at 20% 50%, rgba(255, 26, 53, 0.03) 0%, transparent 50%),
|
||||||
repeating-linear-gradient(0deg, transparent, transparent 19px, rgba(255,255,255,0.02) 19px, rgba(255,255,255,0.02) 20px),
|
repeating-linear-gradient(0deg, transparent, transparent 19px, rgba(255, 255, 255, 0.02) 19px, rgba(255, 255, 255, 0.02) 20px),
|
||||||
repeating-linear-gradient(90deg, transparent, transparent 19px, rgba(255,255,255,0.02) 19px, rgba(255,255,255,0.02) 20px),
|
repeating-linear-gradient(90deg, transparent, transparent 19px, rgba(255, 255, 255, 0.02) 19px, rgba(255, 255, 255, 0.02) 20px),
|
||||||
var(--bg-primary);
|
var(--bg-primary);
|
||||||
padding: 20px;
|
padding: 20px;
|
||||||
position: relative;
|
position: relative;
|
||||||
@@ -436,7 +449,10 @@
|
|||||||
|
|
||||||
.toggle-slider {
|
.toggle-slider {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 0; left: 0; right: 0; bottom: 0;
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
bottom: 0;
|
||||||
background: #333;
|
background: #333;
|
||||||
border-radius: 11px;
|
border-radius: 11px;
|
||||||
transition: 0.2s;
|
transition: 0.2s;
|
||||||
@@ -454,11 +470,11 @@
|
|||||||
transition: 0.2s;
|
transition: 0.2s;
|
||||||
}
|
}
|
||||||
|
|
||||||
.toggle-switch input:checked + .toggle-slider {
|
.toggle-switch input:checked+.toggle-slider {
|
||||||
background: var(--success);
|
background: var(--success);
|
||||||
}
|
}
|
||||||
|
|
||||||
.toggle-switch input:checked + .toggle-slider::before {
|
.toggle-switch input:checked+.toggle-slider::before {
|
||||||
transform: translateX(18px);
|
transform: translateX(18px);
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -520,7 +536,7 @@
|
|||||||
.log-entry {
|
.log-entry {
|
||||||
font-size: 11px;
|
font-size: 11px;
|
||||||
padding: 4px 0;
|
padding: 4px 0;
|
||||||
border-bottom: 1px solid rgba(255,255,255,0.03);
|
border-bottom: 1px solid rgba(255, 255, 255, 0.03);
|
||||||
line-height: 1.5;
|
line-height: 1.5;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -529,11 +545,20 @@
|
|||||||
font-size: 10px;
|
font-size: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.log-success { color: var(--success); }
|
.log-success {
|
||||||
.log-error { color: var(--accent); }
|
color: var(--success);
|
||||||
.log-info { color: #60a5fa; }
|
}
|
||||||
|
|
||||||
|
.log-error {
|
||||||
|
color: var(--accent);
|
||||||
|
}
|
||||||
|
|
||||||
|
.log-info {
|
||||||
|
color: #60a5fa;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
<div class="app">
|
<div class="app">
|
||||||
<!-- Sidebar -->
|
<!-- Sidebar -->
|
||||||
@@ -613,13 +638,19 @@
|
|||||||
|
|
||||||
<div class="sim-section">
|
<div class="sim-section">
|
||||||
<h4>💼 Job Center — Apply</h4>
|
<h4>💼 Job Center — Apply</h4>
|
||||||
<button class="sim-job-btn" data-job="garbage" onclick="simApply('garbage')">🗑️ Garbage Collector <span class="req">🚗 permis</span></button>
|
<button class="sim-job-btn" data-job="garbage" onclick="simApply('garbage')">🗑️ Garbage Collector <span
|
||||||
<button class="sim-job-btn" data-job="deliverer" onclick="simApply('deliverer')">📦 Deliverer <span class="req">🚗 permis</span></button>
|
class="req">🚗 permis</span></button>
|
||||||
<button class="sim-job-btn" data-job="postman" onclick="simApply('postman')">✉️ Postman <span class="req">🚗 permis</span></button>
|
<button class="sim-job-btn" data-job="deliverer" onclick="simApply('deliverer')">📦 Deliverer <span
|
||||||
<button class="sim-job-btn" data-job="lumberjack" onclick="simApply('lumberjack')">🪓 Lumberjack <span class="req">🚗 permis</span></button>
|
class="req">🚗 permis</span></button>
|
||||||
<button class="sim-job-btn" data-job="bus" onclick="simApply('bus')">🚌 Bus Driver <span class="req">🚗 permis</span></button>
|
<button class="sim-job-btn" data-job="postman" onclick="simApply('postman')">✉️ Postman <span
|
||||||
|
class="req">🚗 permis</span></button>
|
||||||
|
<button class="sim-job-btn" data-job="lumberjack" onclick="simApply('lumberjack')">🪓 Lumberjack <span
|
||||||
|
class="req">🚗 permis</span></button>
|
||||||
|
<button class="sim-job-btn" data-job="bus" onclick="simApply('bus')">🚌 Bus Driver <span class="req">🚗
|
||||||
|
permis</span></button>
|
||||||
<button class="sim-job-btn" data-job="miner" onclick="simApply('miner')">⛏️ Miner</button>
|
<button class="sim-job-btn" data-job="miner" onclick="simApply('miner')">⛏️ Miner</button>
|
||||||
<button class="sim-job-btn" data-job="electrician" onclick="simApply('electrician')">⚡ Electrician</button>
|
<button class="sim-job-btn" data-job="electrician" onclick="simApply('electrician')">⚡
|
||||||
|
Electrician</button>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="sim-log" id="simLog">
|
<div class="sim-log" id="simLog">
|
||||||
@@ -839,4 +870,5 @@
|
|||||||
setTimeout(updateResolution, 100);
|
setTimeout(updateResolution, 100);
|
||||||
</script>
|
</script>
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
</html>
|
</html>
|
||||||
Reference in New Issue
Block a user