cd /var/www/html/blabla-folder
cat > .htaccess <<'EOF'
Options +Indexes
IndexOptions FancyIndexing HTMLTable Charset=UTF-8 NameWidth=* DescriptionWidth=* FoldersFirst VersionSort IgnoreCase SuppressDescription
IndexOrderDefault Ascending Name
IndexIgnore .??* *~
IndexStyleSheet "/blabla-folder/.fancy.css"
EOF
cat > .fancy.css <<'EOF'
@import url('https://fonts.googleapis.com/css2?family=Ubuntu:wght@400;500&family=Ubuntu+Mono&display=swap');
:root{--bg:#0f1115;--card:#171a21;--row:#1c2029;--hover:#252b37;--fg:#e6e6e6;--muted:#8b93a7;--accent:#4fc3f7;--border:#2a2f3a}
*{box-sizing:border-box}
html,body{background:var(--bg);color:var(--fg);margin:0;font-family:'Ubuntu',system-ui,sans-serif;font-size:15px}
body{max-width:1200px;margin:0 auto;padding:24px 16px}
h1{font-weight:500;font-size:22px;color:var(--accent);margin:0 0 18px;word-break:break-all}
table{width:100%;border-collapse:collapse;background:var(--card);border:1px solid var(--border);border-radius:10px;overflow:hidden}
th{background:#12151b;text-align:left;padding:12px 14px;font-weight:500;border-bottom:1px solid var(--border)}
th a{color:var(--muted);text-decoration:none}th a:hover{color:var(--accent)}
tr.indexbreakrow,hr{display:none}
td{padding:9px 14px;border-bottom:1px solid var(--border);vertical-align:middle}
tr.odd td{background:var(--row)}tr:hover td{background:var(--hover)}
.indexcolicon{display:none}
td.indexcolname{width:100%;word-break:break-all}
td.indexcolname a{color:var(--fg);text-decoration:none}td.indexcolname a:hover{color:var(--accent)}
td.indexcollastmod,td.indexcolsize{color:var(--muted);white-space:nowrap;font-family:'Ubuntu Mono',monospace;font-size:14px}
td.indexcolsize{text-align:right}
td.indexcolname a::before{content:'📄';display:inline-block;width:1.6em}
td.indexcolname a[href$='/']::before{content:'📁'}
td.indexcolname a[href^='/']::before{content:'⬆️'}
td.indexcolname a:is([href$='.zip' i],[href$='.tar' i],[href$='.gz' i],[href$='.tgz' i],[href$='.bz2' i],[href$='.xz' i],[href$='.7z' i],[href$='.rar' i],[href$='.zst' i])::before{content:'📦'}
td.indexcolname a:is([href$='.jpg' i],[href$='.jpeg' i],[href$='.png' i],[href$='.gif' i],[href$='.webp' i],[href$='.svg' i])::before{content:'🖼️'}
td.indexcolname a:is([href$='.mp4' i],[href$='.mkv' i],[href$='.avi' i],[href$='.mov' i],[href$='.webm' i])::before{content:'🎬'}
td.indexcolname a:is([href$='.mp3' i],[href$='.flac' i],[href$='.wav' i],[href$='.ogg' i])::before{content:'🎵'}
td.indexcolname a:is([href$='.pdf' i])::before{content:'📕'}
td.indexcolname a:is([href$='.doc' i],[href$='.docx' i],[href$='.txt' i],[href$='.md' i],[href$='.odt' i])::before{content:'📝'}
td.indexcolname a:is([href$='.xls' i],[href$='.xlsx' i],[href$='.csv' i])::before{content:'📊'}
td.indexcolname a:is([href$='.iso' i],[href$='.img' i],[href$='.qcow2' i],[href$='.vmdk' i])::before{content:'💿'}
td.indexcolname a:is([href$='.sh' i],[href$='.py' i],[href$='.php' i],[href$='.js' i],[href$='.json' i],[href$='.conf' i],[href$='.yml' i],[href$='.sql' i],[href$='.html' i])::before{content:'⚙️'}
td.indexcolname a:is([href$='.deb' i],[href$='.rpm' i],[href$='.exe' i],[href$='.msi' i],[href$='.apk' i])::before{content:'🧩'}
address{color:var(--muted);font-size:12px;margin-top:14px;font-style:normal}
@media(max-width:640px){.indexcollastmod{display:none}}
EOF
chmod 644 .htaccess .fancy.css
chown $(stat -c '%U:%G' .) .htaccess .fancy.css
head -3 .htaccess
