Files
personal-site/static/about.html
T

405 lines
14 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<title>Samantha Vero Friis</title>
<link rel="preconnect" href="https://fonts.googleapis.com"/>
<link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@300;400;500&family=IBM+Plex+Sans:ital,wght@0,300;0,400;0,500;1,300&display=swap" rel="stylesheet"/>
<link rel="stylesheet" href="/static/styles2.css" />
</head>
<body>
<nav>
<a class="nav-logo" href="#">samantha_vero_friis</a>
<div class="nav-links">
<a href="/engine">engine</a>
<a href="/portfolio">portfolio</a>
<a href="/cinema">cinema</a>
<a href="/finance">finance</a>
<a href="/infra">infrastructure</a>
<a href="/git">git</a>
<a class="cta" href="mailto:me@samantha42.xyz">contact</a>
</div>
</nav>
<div class="shell">
<aside>
<div>
<p class="sidebar-label">navigate</p>
<div class="sidebar-links">
<a href="#about">about</a>
<a href="#experience">experience</a>
<a href="#education">education</a>
<a href="#opinion">opinion</a>
<a href="#automation">automation</a>
<a href="#interest">interest</a>
<a class="hidden" href="/42">42</a>
</div>
</div>
<div>
<p class="sidebar-label">skills</p>
<div class="skill-list">
<div class="skill-item">Excel</div>
<div class="skill-item">Python</div>
<div class="skill-item">SQL</div>
<div class="skill-item">Go</div>
<div class="skill-item">Git</div>
</div>
</div>
<div>
<p class="sidebar-label">location</p>
<div style="font-family:var(--ff-mono);font-size:0.75rem;color:var(--muted);">Denmark<br>Aalborg Øst, 9220</div>
</div>
</aside>
<main id="about">
<div class="hero">
<p class="hero-eyebrow">About Me · 2026</p>
<h1>Samantha<br><span>Vero Friis</span></h1>
<p class="hero-bio">Bachelor's student in Business Administration seeking an entry-level analyst or finance-related role while studying. Strong numerical skills, advanced Excel, and experience in company, risk, and financial analysis. Analytical, detail-oriented, and efficiency-focused.</p>
<div class="hero-meta">
<span><span class="dot"></span>available for work</span>
<span>samantha42.xyz</span>
<span>me@samantha42.xyz</span>
</div>
</div>
<section id="experience">
<div class="section-head"><h2>experience</h2></div>
<div class="exp-grid">
<div class="exp-card">
<div class="exp-header">
<span class="exp-title">Independent Equity Research</span>
<span class="exp-tag">finance</span>
</div>
<p class="exp-body">Fundamental analysis using SEC filings (10-K, 10-Q) and earnings reports. Assess profitability, liquidity, risk factors, and long-term business sustainability. Handle incomplete or low-transparency information through structured cross-validation.</p>
</div>
<div class="exp-card">
<div class="exp-header">
<span class="exp-title">Technical Tools &amp; Automation</span>
<span class="exp-tag">engineering</span>
</div>
<p class="exp-body">Build lightweight backend tools to automate repetitive analytical and operational tasks. Python for data processing, validation, and workflow automation. Lightweight online services in Go, focusing on speed and reliability.</p>
<a class="navigate" href="#automation">// Go to Tools</a>
</div>
</div>
</section>
<section id="education">
<div class="section-head"><h2>education</h2></div>
<div class="edu-grid">
<div class="edu-card">
<div class="edu-year">2025 —<br>present</div>
<div>
<div class="edu-degree">Bachelor of Economics &amp; Business Administration (HA)</div>
<div class="edu-inst">Aalborg University · Expected 2028</div>
</div>
</div>
<div class="edu-card">
<div class="edu-year">2024 — 2025</div>
<div class="edu-body">
<div class="edu-degree">Mathematics-Technology (BSc)</div>
<div class="edu-inst">Aalborg University · 1 semester</div>
<span class="edu-tag tag-dropped">discontinued</span>
</div>
</div>
<div class="edu-card">
<div class="edu-year">2020 —<br>2023</div>
<div>
<div class="edu-degree">HTX Technical Upper Secondary Education</div>
<div class="edu-inst">Viden Gymnasier</div>
<div class="edu-detail">Mathematics A, Biology B · Study project: Mathematics &amp; Technology</div>
</div>
</div>
</div>
</section>
<section id="opinion">
<div class="section-head"><h2>opinion</h2></div>
<div class="opinion-grid">
<a class="opinion-link" href="/cinema">cinema</a>
<a class="opinion-link" href="/finance">finance</a>
<a class="opinion-link" href="/infra">infra</a>
</div>
</section>
<section>
<div class="section-head"><h2>languages</h2></div>
<div class="lang-row">
<span class="lang-badge">Danish</span>
<span class="lang-badge">English</span>
</div>
</section>
<section>
<div class="section-head"><h2>interests</h2></div>
<div class="interests-row">
<span class="interest-chip">cinema</span>
<span class="interest-chip">tv shows</span>
<span class="interest-chip">Economics</span>
<span class="interest-chip">gaming</span>
<span class="interest-chip">Design</span>
<span class="interest-chip">board-games</span>
<span class="interest-chip">programming</span>
<span class="interest-chip">financial-markets</span>
<span class="interest-chip">Tech</span>
</div>
</section>
<section>
<section id="automation">
<div class="page-header">
<h2 class="page-title">Technical Tools & Automation</h2>
<span class="page-sub">engineering/programing</span>
</div>
<div class="exp-grid">
<div class="exp-card">
<div class="exp-header">
<span class="exp-title">Portfolio Engine</span>
</div>
<p class="exp-body">A lightweight portfolio and financial data backend written in Go. Tracks companies, currencies, revenue reports, and trades across configurable time periods — replacing spreadsheets with a proper database, REST API, and interactive shell.</p>
<span class="exp-title">Roadmap</span>
<ul style="padding: 20px;">
<li class="exp-body">Price update endpoint</li>
<li class="exp-body">Multi-currency conversion</li>
<li class="exp-body">Frontend dashboard</li>
<li class="exp-body">Shares outstanding history database table</li>
<li class="exp-body">Earnings per share (EPS) based on shares owned</li>
<li class="exp-body">First-In, First-Out (FIFO) realized gains</li>
<li class="exp-body">Dividends earned and related taxes</li>
<li class="exp-body">Total tax obligations</li>
</ul>
<a class="outlink" href="https://git.samantha42.xyz/samantha/Portfolio-Engine" >Git repo</a>
</div>
<div class="exp-card">
<div class="exp-header">
<span class="exp-title">Accounting Management</span>
</div>
<p class="exp-body"> A lightweight, SQL-backed, web-based CLI system designed to track assets and liabilities. The goal is to provide a simple, fast, and scalable financial tracking tool that can grow from personal use to more advanced scenarios.</p>
</div>
</div>
</section>
<br>
<div class="page-header">
<h2 class="page-title" id="interest">interests</h2>
<span class="page-sub">Fav lists</span>
</div>
<div class="section-head"><h2>Movie/Show Top list</h2></div>
<div class="toplist-group">
<h3>Top 5 Movies</h3>
<div class="toplist-body" >
<div class="poster-grid">
<div class="poster-item posterhover" onclick="bladerunnerClick()">
<img src="/static/posters/bladerunner2049.jpg" alt="Blade Runner 2049">
<p>Blade Runner 2049</p>
</div>
<div class="poster-item">
<img src="/static/posters/AcureForWellness.jpg" alt="A Cure of Wellness">
<p>A Cure of Wellness</p>
</div>
<div class="poster-item">
<img src="/static/posters/Fightclub.jpg" alt="Fight Club">
<p>Fight Club</p>
</div>
<div class="poster-item posterhover" onclick="draculaClick()">
<img src="/static/posters/Dracula.webp" alt="Dracula: A Love Tale">
<p>Dracula: A Love Tale</p>
</div>
<div class="poster-item posterhover" onclick="dragonClick()">
<img src="/static/posters/TheGirlwiththeDragonTattoo.webp" alt="Girl with a Dragon Tattoos">
<p>Girl with a Dragon Tattoo</p>
</div>
</div>
</div>
<div class="toplist-group">
<h3>Top 5 Shows</h3>
<div class="toplist-body">
<div class="poster-grid">
<div class="poster-item">
<img src="/static/posters/Succession.webp" alt="Succession">
<p>Succession</p>
</div>
<div class="poster-item">
<img src="/static/posters/Chernobyl.webp" alt="Chernobyl">
<p>Chernobyl</p>
</div>
<div class="poster-item">
<img src="/static/posters/Breaking Bad.webp" alt="Breaking Bad">
<p>Breaking Bad</p>
</div>
<div class="poster-item">
<img src="/static/posters/Avatar.webp" alt="Avatar: The Last Airbender">
<p>Avatar: The Last Airbender</p>
</div>
<div class="poster-item">
<img src="/static/posters/Adolescence.webp" alt="Adolescence">
<p>Adolescence</p>
</div>
</div>
</div>
</div>
<div class="section-head"><h2>Lunix rice</h2></div>
<div class="rice-wrap">
<img src="/static/images/rice.png" width="500px">
<p class="exp-body">I love my custom Linux setup. I use Hyprland, which automatically arranges app windows on my screen so everything stays organized without dragging things around. I also use Quickshell, which lets me customize menus, shortcuts, and system controls to work exactly how I want.
My system is based on Arch Linux or Manjaro Linux, which are versions of Linux that give you more control and customization than a typical computer setup. The result is a clean, fast, and super efficient desktop thats hard to go back from.</p>
</div>
<!--
<div class="section-head"><h2>Games</h2></div>
<div class="toplist-group">
<div class="toplist-body">
<div class="game-grid">
<div class="poster-item">
<img src="/static/posters/Chernobyl.webp" alt="Chernobyl">
<p>Chernobyl</p>
</div>
<div class="poster-item">
<p>Balders Gate</p>
</div>
<div class="poster-item">
<p>Factorio</p>
</div>
<div class="poster-item">
<p>Slay the spire 2</p>
</div>
<div class="game-item">
<img src="/static/posters/risetr-banner.png" alt="Rise of the Tomb Raider">
<p>Rise of the Tomb Raider</p>
</div>
</div>
</div>-->
</div>
</section>
</main>
</div>
<footer>
<div class="footer-contact"><a href="mailto:me@samantha42.xyz">me@samantha42.xyz</a></div>
<div class="footer-copy">© 2026 — all rights reserved</div>
</footer>
<script>
// just some fun.
console.log("%c👀 hi there!", "font-size:20px")
function draculaClick() {
const el = document.getElementById('interest');
if (!el) return; // el is a DOM node, never a string
el.textContent = '🦇 interest 🦇';
setTimeout(() => {
el.textContent = "interest";
}, 5000);
}
function bladerunnerClick() {
if (document.getElementById('rain-canvas')) return; // already running, do nothing
const el = document.getElementById('interest');
el.textContent = 'tears in rain';
startRain();
setTimeout(() => {
el.textContent = "interest";
stopRain();
}, 10000);
}
let rainCanvas, rainCtx, rainInterval;
function startRain() {
rainCanvas = document.createElement('canvas');
rainCanvas.id = 'rain-canvas';
rainCanvas.width = window.innerWidth;
rainCanvas.height = window.innerHeight;
document.body.appendChild(rainCanvas);
rainCtx = rainCanvas.getContext('2d');
requestAnimationFrame(() => { rainCanvas.style.opacity = '1'; });
const drops = Array.from({ length: 120 }, () => ({
x: Math.random() * rainCanvas.width,
y: Math.random() * rainCanvas.height,
speed: 8 + Math.random() * 7,
length: 12 + Math.random() * 20,
opacity: 0.2 + Math.random() * 0.4
}));
rainInterval = setInterval(() => {
rainCtx.clearRect(0, 0, rainCanvas.width, rainCanvas.height);
drops.forEach(drop => {
rainCtx.beginPath();
rainCtx.moveTo(drop.x, drop.y);
rainCtx.lineTo(drop.x - 2, drop.y + drop.length);
rainCtx.strokeStyle = `rgba(174, 214, 241, ${drop.opacity})`;
rainCtx.lineWidth = 3;
rainCtx.stroke();
drop.y += drop.speed;
if (drop.y > rainCanvas.height) {
drop.y = -drop.length;
drop.x = Math.random() * rainCanvas.width;
}
});
}, 30);
}
function stopRain() {
if (!rainCanvas) return;
rainCanvas.style.opacity = '0';
setTimeout(() => {
clearInterval(rainInterval);
rainCanvas.remove();
rainCanvas = null;
}, 800);
}
function dragonClick() {
const existing = document.getElementById('dragon-grid');
if (existing) { existing.remove(); return; }
const grid = document.createElement('canvas');
grid.id = 'dragon-grid';
grid.width = window.innerWidth;
grid.height = window.innerHeight;
grid.style.transition = 'opacity 1s ease';
document.body.appendChild(grid);
const ctx = grid.getContext('2d');
const img = new Image();
img.src = '/static/images/dragon.png';
img.onload = () => {
const size = 250;
const cols = Math.ceil(grid.width / size);
const rows = Math.ceil(grid.height / size);
for (let r = 0; r < rows; r++) {
for (let c = 0; c < cols; c++) {
ctx.drawImage(img, c * size, r * size, size, size);
}
}
setTimeout(() => {
grid.style.opacity = '0';
setTimeout(() => grid.remove(), 1000);
}, 300);
};
}
</script>
</body>
</html>