Now it's epic.

This commit is contained in:
q9i 2023-09-02 20:50:42 -07:00
parent 6daacef316
commit faaa991098
6 changed files with 325 additions and 1 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 973 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1,000 KiB

81
public/dracula.css Normal file
View file

@ -0,0 +1,81 @@
/* Dracula Theme v1.2.5
*
* https://github.com/dracula/highlightjs
*
* Copyright 2016-present, All rights reserved
*
* Code licensed under the MIT license
*
* @author Denis Ciccale <dciccale@gmail.com>
* @author Zeno Rocha <hi@zenorocha.com>
*/
.hljs {
display: block;
overflow-x: auto;
padding: 0.5em;
background: #282a36;
}
.hljs-built_in,
.hljs-selector-tag,
.hljs-section,
.hljs-link {
color: #8be9fd;
}
.hljs-keyword {
color: #ff79c6;
}
.hljs,
.hljs-subst {
color: #f8f8f2;
}
.hljs-title,
.hljs-attr,
.hljs-meta-keyword {
font-style: italic;
color: #50fa7b;
}
.hljs-string,
.hljs-meta,
.hljs-name,
.hljs-type,
.hljs-symbol,
.hljs-bullet,
.hljs-addition,
.hljs-variable,
.hljs-template-tag,
.hljs-template-variable {
color: #f1fa8c;
}
.hljs-comment,
.hljs-quote,
.hljs-deletion {
color: #6272a4;
}
.hljs-keyword,
.hljs-selector-tag,
.hljs-literal,
.hljs-title,
.hljs-section,
.hljs-doctag,
.hljs-type,
.hljs-name,
.hljs-strong {
font-weight: bold;
}
.hljs-literal,
.hljs-number {
color: #bd93f9;
}
.hljs-emphasis {
font-style: italic;
}

View file

@ -1,5 +1,9 @@
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:opsz,wght@9..40,700&family=Phudu:wght@300&display=swap');
* {
box-sizing: border-box;
}
body {
padding-top: 50px;
width: 100%;
@ -36,3 +40,94 @@ a:hover {
padding: 5px;
text-decoration: none;
}
#code {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
pointer-events: none;
}
h2 {
color: white;
font-family: 'DM Sans', sans-serif;
font-size: 42px;
margin-top: 50px;
}
h3 {
color: white;
font-family: 'Phudu', cursive;
font-size: 32px;
}
img {
width: 75px;
float: left;
margin-right: 15px;
}
.project {
padding: 15px;
background-color: rgba(255,255,255,0.2);
backdrop-filter: blur(5px);
margin-bottom: 20px;
border-radius: 10px;
}
.project:hover {
background-color: rgba(255,255,255,0.4);
cursor: pointer;
}
.project p {
margin-top: 10px;
}
footer {
padding: 20px;
padding-top: 30px;
}
#footer-header {
color: white;
font-family: 'DM Sans', sans-serif;
font-size: 24px;
margin-top: 10px;
margin-bottom: 0px;
}
footer p {
margin-top: 0px;
}
.member {
display: inline-block;
width: calc(50% - 50px);
padding: 15px;
}
.member:hover {
backdrop-filter: blur(5px);
background-color: rgba(255,255,255,0.42);
border-radius: 5px;
cursor: pointer;
border: 4px solid #00ccff;
}
.member img {
width: 85px;
height: 85px;
border-radius: 42.5px;
object-fit: cover;
}
.member h3 {
margin-top: 0px;
color: white;
font-size: 24px;
height: 85px;
line-height: 85px;
}

View file

@ -37,14 +37,98 @@
content="assets/icons/browserconfig.xml"
/>
<meta name="theme-color" content="#ffffff" />
<!-- syntax highlighting -->
<link rel="stylesheet" href="./dracula.css" />
<script src="//cdn.jsdelivr.net/gh/highlightjs/cdn-release@11.7.0/build/highlight.min.js"></script>
<script async defer src="./index.js"></script>
</head>
<body>
<div id="code"></div>
<img id="logo" src="assets/img/gallium-workshop.png" />
<h1>Gallium Workshop</h1>
<p>
We are a cybersecurity research collective that intends to continue the
We are a cybersecurity research collective intending to continue the
great work of <a href="https://mercurywork.shop">Mercury Workshop</a> and
others.
</p>
<h2>Proprietary Projects</h2>
<div class="projects-list">
<div class="project">
<img src="assets/img/srvusd-irc.png" />
<h3>SRVUSD IRC</h3>
<p>District-wide IRC chat application</p>
</div>
<div class="project">
<img src="assets/img/srv-coin.png" />
<h3>SRV Coin</h3>
<p>
The world's most valuable cryptocurrency, set to exceed the value of
Bitcoin
</p>
</div>
</div>
<h2>Honorary Members</h2>
<div class="members-list">
<div class="member">
<a href="https://www.youtube.com/watch?v=efs3QRr8LWw">
<img src="https://assets.pewresearch.org/wp-content/uploads/sites/12/2014/01/FT_timeline-snowden.jpg">
<h3>Edward Snowden</h3>
</a>
</div>
<div class="member">
<a href="https://www.youtube.com/shorts/sKs-kqa9jnM">
<img src="https://media.npr.org/assets/img/2023/08/28/gettyimages-1619655090-b09f5b94e56a564b281cc819f24bd0d6a6d8a68e-s1100-c50.jpg">
<h3>Vivek Ramaswamy</h3>
</a>
</div>
<div class="member">
<a href="https://en.wikipedia.org/wiki/Shawn_Fanning">
<img src="https://m.media-amazon.com/images/M/MV5BNGQ1OTdjMzgtNWViNi00NTY1LWJkM2UtNDczZDcxNjg0MWZlXkEyXkFqcGdeQXVyNjUxMjc1OTM@._V1_.jpg">
<h3>Shawn Fanning</h3>
</a>
</div>
<div class="member">
<a href="https://en.wikipedia.org/wiki/Kevin_Mitnick">
<img src="https://media.npr.org/assets/img/2011/08/17/mitnick-author-photo-credit-jari-tomminen_custom-f2a1788f7b04b7717b25c950cca11777365e5158-s1100-c50.jpg">
<h3>Kevin Mitnick</h3>
</a>
</div>
<div class="member">
<a href="https://www.youtube.com/shorts/HY12H38KMVA">
<img src="https://i.insider.com/5318eb14eab8eaf90252981b?width=1136&format=jpeg">
<h3>Satoshi Nakamoto</h3>
</a>
</div>
<div class="member">
<a href="https://en.wikipedia.org/wiki/Robert_Tappan_Morris">
<img src="https://upload.wikimedia.org/wikipedia/commons/thumb/8/86/Robert_Tappan_Morris.jpg/220px-Robert_Tappan_Morris.jpg">
<h3>Robert Morris</h3>
</a>
</div>
<div class="member">
<a href="https://www.youtube.com/shorts/-ueT7_Eclzg">
<img src="https://m.media-amazon.com/images/M/MV5BNWY4NzQ1MTctMzA0ZS00OGJjLTkwMzctYjc4MWQwZThiNjNlXkEyXkFqcGdeQXVyMTM1NTI3Mjcy._V1_.jpg">
<h3>Joe Exotic</h3>
</a>
</div>
<div class="member">
<a href="https://www.youtube.com/shorts/12De-C6gMCo">
<img src="https://mediacloud.theweek.co.uk/image/private/s--ehFsT2Df--/f_auto,t_primary-image-mobile@1/v1692115757/theweek/2023/August/javier-milei-1597585519.jpg">
<h3>Javier Milei</h3>
</a>
</div>
</div>
<!-- footer -->
<footer>
<img src="assets/img/gallium-workshop.png" />
<div id="footer-header">Gallium Workshop</div>
<p>
Are you a SYSADMIN? Check
<a href="https://img-9gag-fun.9cache.com/photo/aOQZoMN_460s.jpg"
>this</a
>
out!
</p>
</footer>
</body>
</html>

64
public/index.js Normal file
View file

@ -0,0 +1,64 @@
let code = document.getElementById('code')
let raw = []
let els = []
const SOURCES = [
'https://cdn.jsdelivr.net/gh/quantum9innovation/the-jankiest/index.min.js',
'https://cdn.jsdelivr.net/gh/quantum9innovation/hulet/dist/hulet.min.js',
'https://cdn.jsdelivr.net/gh/quantum9innovation/sost/dist/sost.min.js',
'https://code.jquery.com/jquery-3.6.3.min.js',
'https://cdn.jsdelivr.net/npm/bootstrap@4.0.0/dist/js/bootstrap.min.js',
]
hljs.configure({
languages: ['javascript'],
ignoreUnescapedHTML: true
})
let highlight = () => {
document.querySelectorAll('pre').forEach(el => {
hljs.highlightElement(el)
})
}
let spawn = () => {
els.forEach(el => {
if (Math.random() < 0.3) el.remove()
})
let spawned = document.createElement('pre')
let source = raw[Math.floor(Math.random() * raw.length)]
let start = Math.floor(Math.random() * source.length)
let length = 250
let end = start + length
let text = source.substring(start, end)
spawned.innerText = text
code.appendChild(spawned)
let x = Math.random() * (window.innerWidth - 500)
let y = Math.random() * (window.innerHeight - 400)
spawned.style.left = x + 'px'
spawned.style.top = (y + 300) + 'px'
spawned.style.width = '500px'
spawned.style.height = '100px'
spawned.style.textWrap = 'wrap'
spawned.style.opacity = 0.5
spawned.style.background = 'black'
spawned.style.position = 'absolute'
spawned.style.overflow = 'hidden'
highlight()
els.push(spawned)
setTimeout(spawn, 100)
}
let init = async () => {
for (let source of SOURCES) {
let res1 = await fetch(source);
let text1 = await res1.text();
let formatted = text1.replace(/\n/g, "");
raw.push(formatted);
}
}
init().then(spawn)