Now it's epic.
This commit is contained in:
parent
6daacef316
commit
faaa991098
6 changed files with 325 additions and 1 deletions
BIN
public/assets/img/srv-coin.png
Normal file
BIN
public/assets/img/srv-coin.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 973 KiB |
BIN
public/assets/img/srvusd-irc.png
Normal file
BIN
public/assets/img/srvusd-irc.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 1,000 KiB |
81
public/dracula.css
Normal file
81
public/dracula.css
Normal 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;
|
||||
}
|
|
@ -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;
|
||||
}
|
||||
|
|
|
@ -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
64
public/index.js
Normal 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)
|
Loading…
Reference in a new issue