Skip to content

Commit 7ce32f6

Browse files
authored
Refactor index.html for improved layout and styles
1 parent 4b1407d commit 7ce32f6

1 file changed

Lines changed: 112 additions & 69 deletions

File tree

index.html

Lines changed: 112 additions & 69 deletions
Original file line numberDiff line numberDiff line change
@@ -5,119 +5,162 @@
55
<meta name="viewport" content="width=device-width, initial-scale=1.0">
66
<title>pobfus // repository</title>
77
<style>
8-
:root { --bg: #0a0a0a; --panel: #0d0d0d; --brd: #1a1a1a; --txt: #888; --main: #eee; --acc: #00ff88; --dev: #ffaa00; }
9-
10-
* { box-sizing: border-box; }
8+
:root { --bg: #0a0a0a; --panel: #0d0d0d; --brd: #1a1a1a; --txt: #888; --main: #eee; --acc: #00ff88; }
9+
* { box-sizing: border-box; transition: 0.1s; }
1110
body {
1211
background: var(--bg); color: var(--main);
1312
font-family: "fira code", monospace; margin: 0;
14-
display: flex; height: 100vh; text-transform: lowercase;
15-
overflow: hidden;
13+
display: flex; height: 100vh; overflow: hidden; text-transform: lowercase;
1614
}
1715

1816
.sidebar {
1917
width: 320px; min-width: 320px; background: var(--panel); border-right: 1px solid var(--brd);
20-
padding: 25px; display: flex; flex-direction: column; gap: 15px;
21-
height: 100vh;
18+
padding: 30px; display: flex; flex-direction: column; gap: 15px; z-index: 10;
2219
}
2320

24-
.brand-row { display: flex; align-items: center; gap: 12px; opacity: 0.9; margin-bottom: 10px;}
25-
.logo { width: 22px; height: 22px; fill: var(--main); }
26-
27-
.title-block { margin-bottom: 10px; }
28-
.title { font-size: 20px; font-weight: 800; color: #fff; letter-spacing: -1px; }
29-
.subtitle { font-size: 9px; color: var(--txt); letter-spacing: 1px; }
21+
.brand-row { display: flex; align-items: center; gap: 15px; margin-bottom: 10px; }
22+
.lua-logo { width: 32px; height: 32px; fill: #000080; background: #fff; border-radius: 50%; padding: 2px; }
23+
.gh-logo { width: 24px; height: 24px; fill: var(--main); opacity: 0.8; }
3024

31-
.changelog-container {
32-
margin-top: 10px; flex-grow: 1; overflow-y: auto; padding-right: 5px;
33-
}
34-
.log-section { margin-bottom: 15px; }
35-
.log-ver { font-size: 10px; color: var(--acc); font-weight: 700; margin-bottom: 4px; display: block;}
36-
.log-ver.dev { color: var(--dev); }
37-
.log-item { font-size: 10px; color: #555; display: block; line-height: 1.4; border-left: 1px solid #222; padding-left: 8px; }
25+
.title { font-size: 22px; font-weight: 800; color: #fff; letter-spacing: -1px; }
26+
.subtitle { font-size: 9px; color: var(--acc); letter-spacing: 1px; }
3827

39-
.nav-group { display: flex; flex-direction: column; gap: 8px; }
28+
.nav-group { display: flex; flex-direction: column; gap: 8px; margin-top: 10px; }
4029
.btn {
4130
background: transparent; border: 1px solid var(--brd); color: var(--txt);
42-
padding: 10px; cursor: pointer; font-family: inherit; font-size: 11px; text-align: left;
43-
transition: 0.2s; border-radius: 4px;
31+
padding: 12px; cursor: pointer; font-family: inherit; font-size: 11px; text-align: left;
32+
border-radius: 4px; font-weight: 500;
4433
}
4534
.btn:hover { border-color: var(--main); color: var(--main); background: #151515; }
46-
.btn-run { background: #fff; color: #000; border: none; font-weight: 700; }
35+
.btn-run { background: #fff; color: #000; border: none; font-weight: 800; font-size: 12px; }
36+
.btn-run:hover { background: var(--acc); transform: scale(1.02); }
4737

48-
.creator-link {
49-
margin-top: auto; padding-top: 15px; border-top: 1px solid var(--brd);
50-
text-decoration: none; display: flex; align-items: center; gap: 10px;
51-
}
52-
.creator-at { color: var(--txt); font-size: 10px; }
53-
.creator-name { color: #fff; font-size: 11px; font-weight: 700; }
54-
55-
.main { flex: 1; display: flex; flex-direction: column; height: 100vh; }
56-
.workspace {
57-
display: grid; grid-template-columns: 1fr 1fr; flex: 1;
58-
gap: 1px; background: var(--brd);
59-
}
38+
.changelog { margin-top: 20px; flex-grow: 1; overflow-y: auto; border-top: 1px solid var(--brd); padding-top: 20px; }
39+
.log-v { font-size: 10px; color: var(--acc); font-weight: 700; margin-bottom: 5px; display: block; }
40+
.log-i { font-size: 10px; color: #444; display: block; margin-bottom: 3px; border-left: 1px solid #222; padding-left: 10px; }
6041

61-
.editor-container { position: relative; height: 100%; background: var(--bg); }
42+
.main { flex: 1; display: flex; height: 100vh; background: var(--brd); }
43+
.editor-container { flex: 1; display: flex; flex-direction: column; background: var(--bg); position: relative; }
44+
.editor-container:first-child { border-right: 1px solid var(--brd); }
45+
6246
textarea {
63-
width: 100%; height: 100%; background: transparent; border: none;
47+
flex: 1; width: 100%; height: 100%; background: transparent; border: none;
6448
color: var(--main); padding: 30px; resize: none; outline: none;
6549
font-size: 13px; line-height: 1.6; font-family: "fira code", monospace;
6650
white-space: pre; overflow: auto;
6751
}
68-
69-
#log { position: fixed; bottom: 20px; right: 20px; font-size: 10px; color: #333; pointer-events: none; }
52+
53+
.creator-link {
54+
padding-top: 15px; text-decoration: none; border-top: 1px solid var(--brd);
55+
display: flex; align-items: center; color: var(--txt); font-size: 11px;
56+
}
57+
.creator-link b { color: #fff; margin-left: 5px; }
58+
59+
#status { position: fixed; bottom: 20px; right: 20px; font-size: 10px; color: #444; pointer-events: none; }
7060
</style>
7161
</head>
7262
<body>
7363

7464
<div class="sidebar">
7565
<div class="brand-row">
76-
<svg class="logo" viewBox="0 0 24 24"><path d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"/></svg>
77-
<svg class="logo" viewBox="0 0 24 24"><path d="M12 0C5.373 0 0 5.373 0 12s5.373 12 12 12 12-5.373 12-12S18.627 0 12 0zm0 2c5.523 0 10 4.477 10 10s-4.477 10-10 10S2 17.523 2 12 6.477 2 12 2zm0 3c-3.866 0-7 3.134-7 7s3.134 7 7 7 7-3.134 7-7-3.134-7-7-3.134-7-7-3.134-7-7-7zm0 2c2.761 0 5 2.239 5 5s-2.239 5-5 5-5-2.239-5-5 2.239-5 5-5z"/></svg>
66+
<svg class="gh-logo" viewBox="0 0 24 24"><path d="M12 0c-6.626 0-12 5.373-12 12 0 5.302 3.438 9.8 8.207 11.387.599.111.793-.261.793-.577v-2.234c-3.338.726-4.033-1.416-4.033-1.416-.546-1.387-1.333-1.756-1.333-1.756-1.089-.745.083-.729.083-.729 1.205.084 1.839 1.237 1.839 1.237 1.07 1.834 2.807 1.304 3.492.997.107-.775.418-1.305.762-1.604-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381 1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23.957-.266 1.983-.399 3.003-.404 1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.23.653 1.653.242 2.874.118 3.176.77.84 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.43.372.823 1.102.823 2.222v3.293c0 .319.192.694.801.576 4.765-1.589 8.199-6.086 8.199-11.386 0-6.627-5.373-12-12-12z"/></svg>
67+
<svg class="lua-logo" viewBox="0 0 128 128">
68+
<circle cx="64" cy="64" r="60" fill="#000080"/>
69+
<circle cx="84" cy="44" r="18" fill="#fff"/>
70+
</svg>
7871
</div>
7972

8073
<div class="title-block">
8174
<div class="title">pobfus</div>
82-
<div class="subtitle">v1.11.05 repository</div>
75+
<div class="subtitle">v1.11.05-40 stable</div>
8376
</div>
8477

8578
<div class="nav-group">
86-
<button class="btn btn-run" id="go">execute process</button>
87-
<button class="btn" id="cp">copy output</button>
88-
<button class="btn" id="cl">purge buffer</button>
79+
<button class="btn btn-run" id="obfuscateBtn">execute process</button>
80+
<button class="btn" id="dlBtn">download .lua build</button>
81+
<button class="btn" id="clearBtn">purge buffer</button>
8982
</div>
9083

91-
<div class="history-title" style="font-size: 10px; color: #444; margin-top: 15px; border-bottom: 1px solid var(--brd); padding-bottom: 5px; text-transform: uppercase;">project logs</div>
92-
93-
<div class="changelog-container">
94-
<div class="log-section">
95-
<span class="log-ver dev">v1.11.06 (scheduled)</span>
96-
<span class="log-item">deployment date: march 11 2026</span>
97-
<span class="log-item">stable core integration</span>
98-
</div>
99-
<div class="log-section">
100-
<span class="log-ver">v1.11.05 (active)</span>
101-
<span class="log-item">full sidebar scroll fix</span>
102-
<span class="log-item">branding reconstruction</span>
103-
<span class="log-item">automated minification</span>
104-
</div>
84+
<div class="changelog">
85+
<span class="log-v">v1.11.06 (march 11)</span>
86+
<span class="log-i" style="color:var(--acc)">> schedule confirmed</span>
87+
88+
<span class="log-v" style="margin-top:10px">v1.11.05-40</span>
89+
<span class="log-i">> replaced copy with download</span>
90+
<span class="log-i">> file_blob dispatcher active</span>
10591
</div>
10692

10793
<a href="https://github.com/tenringsofdoom1x" class="creator-link" target="_blank">
108-
<div class="creator-at">@</div>
109-
<div class="creator-name">tenringsofdoom1x</div>
94+
@ <b>tenringsofdoom1x</b>
11095
</a>
11196
</div>
11297

11398
<div class="main">
114-
<div class="workspace">
115-
<div class="editor-container"><textarea id="in" spellcheck="false" placeholder="-- source_input"></textarea></div>
116-
<div class="editor-container"><textarea id="out" spellcheck="false" readonly placeholder="-- void_output"></textarea></div>
117-
</div>
99+
<div class="editor-container"><textarea id="input" spellcheck="false" placeholder="-- source_input"></textarea></div>
100+
<div class="editor-container"><textarea id="output" spellcheck="false" readonly placeholder="-- output_stream"></textarea></div>
118101
</div>
119102

120-
<div id="log"></div>
121-
<script src="script.js"></script>
103+
<div id="status"></div>
104+
105+
<script>
106+
const input = document.getElementById('input');
107+
const output = document.getElementById('output');
108+
const status = document.getElementById('status');
109+
110+
const setStatus = (msg) => {
111+
status.innerText = `> ${msg}`;
112+
setTimeout(() => status.innerText = '', 3000);
113+
};
114+
115+
const obfuscate = () => {
116+
const src = input.value.trim();
117+
if(!src) return setStatus('err: empty_buffer');
118+
119+
setStatus('virtualizing...');
120+
121+
setTimeout(() => {
122+
try {
123+
const minified = src.replace(/--.*$/gm, '').replace(/\s+/g, ' ').trim();
124+
const key = Math.floor(Math.random() * 50) + 20;
125+
const bytes = Array.from(minified).map(char => char.charCodeAt(0) ^ key).join(',');
126+
127+
const build = `--[[ pobfus // v1.11.05-40 ]]\n` +
128+
`local _mem = {${bytes}};\n` +
129+
`local _k = ${key};\n` +
130+
`task.spawn(function()\n` +
131+
` local _s = ""; for _,v in pairs(_mem) do _s=_s..string.char(bit32.bxor(v,_k)) end;\n` +
132+
` local _vm, _e = loadstring(_s); if _vm then setfenv(_vm, getfenv()); _vm(); else warn("pobfus_err: ".._e) end\n` +
133+
`end);`;
134+
135+
output.value = build;
136+
setStatus('build_complete');
137+
} catch(e) {
138+
setStatus('err: build_fault');
139+
}
140+
}, 600);
141+
};
142+
143+
document.getElementById('obfuscateBtn').onclick = obfuscate;
144+
145+
document.getElementById('dlBtn').onclick = () => {
146+
if(!output.value) return setStatus('err: nothing_to_download');
147+
const blob = new Blob([output.value], {type: "text/plain"});
148+
const url = URL.createObjectURL(blob);
149+
const a = document.createElement('a');
150+
a.href = url;
151+
a.download = "pobfus_build.lua";
152+
a.click();
153+
URL.revokeObjectURL(url);
154+
setStatus('file_dispatched');
155+
};
156+
157+
document.getElementById('clearBtn').onclick = () => {
158+
input.value = '';
159+
output.value = '';
160+
setStatus('buffer_purged');
161+
};
162+
163+
input.oninput = () => { if(output.value) output.value = ''; };
164+
</script>
122165
</body>
123-
</html>
166+
</html>

0 commit comments

Comments
 (0)