mirror of
https://github.com/senju1337/senju.git
synced 2025-12-23 23:39:27 +00:00
Merge pull request #57 from senju1337/fix/OPS-97
fix: email for amrasil was wrong
This commit is contained in:
Amrasil
GitHub
commit
c9f94fda31
1 changed files with 158 additions and 127 deletions
|
|
@ -1,142 +1,173 @@
|
||||||
{% extends "base.html" %}
|
{% extends "base.html" %} {% block content %}
|
||||||
|
<style>
|
||||||
|
.grid-container {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(2, 1fr); /* Two columns per row */
|
||||||
|
gap: 30px;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: start;
|
||||||
|
padding: 50px;
|
||||||
|
}
|
||||||
|
|
||||||
{% block content %}
|
.grid-item {
|
||||||
<style>
|
display: flex;
|
||||||
.grid-container {
|
align-items: center;
|
||||||
display: grid;
|
gap: 20px;
|
||||||
grid-template-columns: repeat(2, 1fr); /* Two columns per row */
|
position: relative;
|
||||||
gap: 30px;
|
}
|
||||||
justify-content: center;
|
|
||||||
align-items: start;
|
|
||||||
padding: 50px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.grid-item {
|
/* Parallax Image Effect */
|
||||||
display: flex;
|
.grid-item img {
|
||||||
align-items: center;
|
--f: 0.1; /* Parallax factor */
|
||||||
gap: 20px;
|
--r: 10px; /* Radius */
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Parallax Image Effect */
|
--_f: calc(100% * var(--f) / (1 + var(--f)));
|
||||||
.grid-item img {
|
--_a: calc(90deg * var(--f));
|
||||||
--f: .1; /* Parallax factor */
|
width: 150px;
|
||||||
--r: 10px; /* Radius */
|
aspect-ratio: calc(1 + var(--f));
|
||||||
|
object-fit: cover;
|
||||||
--_f: calc(100% * var(--f) / (1 + var(--f)));
|
clip-path: inset(0 var(--_f) 0 0 round var(--r));
|
||||||
--_a: calc(90deg * var(--f));
|
transform: perspective(400px) var(--_t, rotateY(var(--_a)));
|
||||||
width: 150px;
|
transition: 0.5s;
|
||||||
aspect-ratio: calc(1 + var(--f));
|
cursor: pointer;
|
||||||
object-fit: cover;
|
}
|
||||||
clip-path: inset(0 var(--_f) 0 0 round var(--r));
|
|
||||||
transform: perspective(400px) var(--_t, rotateY(var(--_a)));
|
|
||||||
transition: 0.5s;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
.grid-item img:hover {
|
.grid-item img:hover {
|
||||||
clip-path: inset(0 0 0 var(--_f) round var(--r));
|
clip-path: inset(0 0 0 var(--_f) round var(--r));
|
||||||
--_t: translateX(calc(-1 * var(--_f))) rotateY(calc(-1 * var(--_a)));
|
--_t: translateX(calc(-1 * var(--_f))) rotateY(calc(-1 * var(--_a)));
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Info Box (No effect, solid background) */
|
/* Info Box (No effect, solid background) */
|
||||||
.info-box {
|
.info-box {
|
||||||
width: 250px;
|
width: 250px;
|
||||||
padding: 12px;
|
padding: 12px;
|
||||||
background: #fff; /* Solid white */
|
background: #fff; /* Solid white */
|
||||||
border-radius: 10px;
|
border-radius: 10px;
|
||||||
color: black;
|
color: black;
|
||||||
text-align: left;
|
text-align: left;
|
||||||
font-family: Arial, sans-serif;
|
font-family: Arial, sans-serif;
|
||||||
}
|
}
|
||||||
|
|
||||||
.info-box h2 {
|
.info-box h2 {
|
||||||
margin: 5px 0;
|
margin: 5px 0;
|
||||||
font-size: 18px;
|
font-size: 18px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.info-box p {
|
.info-box p {
|
||||||
margin: 5px 0;
|
margin: 5px 0;
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.info-box .title {
|
.info-box .title {
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
}
|
}
|
||||||
|
|
||||||
.button {
|
.button {
|
||||||
background-color: #7c3aed;
|
background-color: #7c3aed;
|
||||||
border: none;
|
border: none;
|
||||||
color: white;
|
color: white;
|
||||||
padding: 8px 12px;
|
padding: 8px 12px;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
border-radius: 5px;
|
border-radius: 5px;
|
||||||
transition: background 0.3s;
|
transition: background 0.3s;
|
||||||
}
|
}
|
||||||
|
|
||||||
.button:hover {
|
.button:hover {
|
||||||
background-color: #8b5cf6;
|
background-color: #8b5cf6;
|
||||||
}
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
</style>
|
<div class="grid-container">
|
||||||
|
<div class="grid-item">
|
||||||
<div class="grid-container">
|
<img
|
||||||
<div class="grid-item">
|
src="https://avatars.githubusercontent.com/u/58274330?v=4"
|
||||||
<img src="https://avatars.githubusercontent.com/u/58274330?v=4" alt="PlexSheep">
|
alt="PlexSheep"
|
||||||
<div class="info-box">
|
/>
|
||||||
<h2>PlexSheep</h2>
|
<div class="info-box">
|
||||||
<p class="title text-violet-900">Backend Developer</p>
|
<h2>PlexSheep</h2>
|
||||||
<p>Cyber Security Student, passionate Hobbyist, Networkadmin and Sotware Engineer</p>
|
<p class="title text-violet-900">Backend Developer</p>
|
||||||
|
<p>
|
||||||
|
Cyber Security Student, passionate Hobbyist, Networkadmin and Sotware
|
||||||
|
Engineer
|
||||||
|
</p>
|
||||||
|
|
||||||
<a href="https://github.com/PlexSheep">Github</a>
|
<a href="https://github.com/PlexSheep">Github</a>
|
||||||
<p>software@cscherr.de</p>
|
<p>software@cscherr.de</p>
|
||||||
<p><a href="mailto:software@cscherr.de"><button class="button">Contact</button></a></p>
|
<p>
|
||||||
</div>
|
<a href="mailto:software@cscherr.de"
|
||||||
</div>
|
><button class="button">Contact</button></a
|
||||||
|
>
|
||||||
<div class="grid-item">
|
</p>
|
||||||
<img src="https://avatars.githubusercontent.com/u/119286812?v=4" alt="0xjrx" style="--f:.12;--r:5px">
|
|
||||||
<div class="info-box">
|
|
||||||
<h2>0xjrx</h2>
|
|
||||||
<p class="title text-violet-900">Frontend Developer</p>
|
|
||||||
<p>Cyber Security Student working on malware research and development.</p>
|
|
||||||
<a href="https://github.com/0xjrx">Github</a>
|
|
||||||
|
|
||||||
|
|
||||||
<p>mrmarquard@protonmail.com</p>
|
|
||||||
<p><a href="mailto:mrmarquard@protonmail.com"><button class="button">Contact</button></a></p>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="grid-item">
|
|
||||||
<img src="https://avatars.githubusercontent.com/u/45919207?v=4" alt="0xalivecow" style="--f:.08;--r:20px">
|
|
||||||
<div class="info-box">
|
|
||||||
<h2>0xalivecow</h2>
|
|
||||||
<p class="title text-violet-900" >Backend Developer</p>
|
|
||||||
<p>Cyber Security Student with a focus on Linux Security</p>
|
|
||||||
<a href="https://github.com/0xalivecow">Github</a>
|
|
||||||
|
|
||||||
<p>0xalivecow@ta-lotz.de</p>
|
|
||||||
<p><a href="mailto:0xalivecow@ta-lotz.de" ><button class="button">Contact</button></a></p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="grid-item">
|
|
||||||
<img src="https://avatars.githubusercontent.com/u/134395490?v=4" alt="Amrasil" style="--f:.08;--r:20px">
|
|
||||||
<div class="info-box">
|
|
||||||
<h2>Amrasil</h2>
|
|
||||||
<p class="title text-violet-900">Documentation and Code coverage</p>
|
|
||||||
<p>Cyber Security student passionate about Mathematics and Machine Learning.</p>
|
|
||||||
|
|
||||||
<a href="https://github.com/Amrasil">Github</a>
|
|
||||||
|
|
||||||
<p>amrasil@protonmail.ma</p>
|
|
||||||
<p><a href="mailto:amrasil@example.ma"><button class="button">Contact</button></a></p>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
{% endblock %}
|
|
||||||
|
|
||||||
|
<div class="grid-item">
|
||||||
|
<img
|
||||||
|
src="https://avatars.githubusercontent.com/u/119286812?v=4"
|
||||||
|
alt="0xjrx"
|
||||||
|
style="--f: 0.12; --r: 5px"
|
||||||
|
/>
|
||||||
|
<div class="info-box">
|
||||||
|
<h2>0xjrx</h2>
|
||||||
|
<p class="title text-violet-900">Frontend Developer</p>
|
||||||
|
<p>Cyber Security Student working on malware research and development.</p>
|
||||||
|
<a href="https://github.com/0xjrx">Github</a>
|
||||||
|
|
||||||
|
<p>mrmarquard@protonmail.com</p>
|
||||||
|
<p>
|
||||||
|
<a href="mailto:mrmarquard@protonmail.com"
|
||||||
|
><button class="button">Contact</button></a
|
||||||
|
>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="grid-item">
|
||||||
|
<img
|
||||||
|
src="https://avatars.githubusercontent.com/u/45919207?v=4"
|
||||||
|
alt="0xalivecow"
|
||||||
|
style="--f: 0.08; --r: 20px"
|
||||||
|
/>
|
||||||
|
<div class="info-box">
|
||||||
|
<h2>0xalivecow</h2>
|
||||||
|
<p class="title text-violet-900">Backend Developer</p>
|
||||||
|
<p>Cyber Security Student with a focus on Linux Security</p>
|
||||||
|
<a href="https://github.com/0xalivecow">Github</a>
|
||||||
|
|
||||||
|
<p>0xalivecow@ta-lotz.de</p>
|
||||||
|
<p>
|
||||||
|
<a href="mailto:0xalivecow@ta-lotz.de"
|
||||||
|
><button class="button">Contact</button></a
|
||||||
|
>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="grid-item">
|
||||||
|
<img
|
||||||
|
src="https://avatars.githubusercontent.com/u/134395490?v=4"
|
||||||
|
alt="Amrasil"
|
||||||
|
style="--f: 0.08; --r: 20px"
|
||||||
|
/>
|
||||||
|
<div class="info-box">
|
||||||
|
<h2>Amrasil</h2>
|
||||||
|
<p class="title text-violet-900">Documentation and Code coverage</p>
|
||||||
|
<p>
|
||||||
|
Cyber Security student passionate about Mathematics and Machine
|
||||||
|
Learning.
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<a href="https://github.com/Amrasil">Github</a>
|
||||||
|
|
||||||
|
<p>amrasil@proton.me</p>
|
||||||
|
<p>
|
||||||
|
<a href="mailto:amrasil@proton.me"
|
||||||
|
><button class="button">Contact</button></a
|
||||||
|
>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{% endblock %}
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue