Webbserver - Love Blomberg

Show sourcecode

The following files exists in this folder. Click to view.

public_html/gamla-kurser/

baskod.html
bingus_icon.ico
bingus_icon.webp
css/
fonts/
index.html
index.sync-conflict-20250925-184042-H7ZHIM2.html
js/
webbutv1/
webbutv2/

index.sync-conflict-20250925-184042-H7ZHIM2.html

191 lines UTF-8 Windows (CRLF)
<!DOCTYPE html>
<html lang="sv">

<head>
    <meta charset="UTF-8">
    <meta content="width=device-width, initial-scale=1" name="viewport">
    <meta content="Love Blombergs Hemsida, 23TE - 2024" name="description">
    <title>Loves Hemsida</title>
    <link href="./bingus_icon.ico" rel="icon">
    <link href="./css/css_index.css" rel="stylesheet">
</head>

<body>
<h1 onclick="openDefault();">Loves Index</h1>
<div class="tab">
    <button class="tabLinks" id="aboutBtn" onclick="openTab(event, 'about')">Om Mig</button>
    <button class="tabLinks" id="webbutv1Btn" onclick="openTab(event, 'webbutv1')">Webbutv1</button>
    <button class="tabLinks" id="webbutv2Btn" onclick="openTab(event, 'webbutv2')">Webbutv2</button>
    <button class="tabLinks" id="musicBtn" onclick="openTab(event, 'music')">Musik</button>
    <button class="tabLinks" id="linksBtn" onclick="openTab(event, 'links')">Länkar</button>
    <button class="tabLinks" id="quotesBtn" onclick="openTab(event, 'quotes')">Quotes</button>
</div>
<br>

<div class="tabContent" id="about">
    <h3>OM MIG</h3>
    <p class="aboutme">
        Jag heter Love och går på VGY i Gullmarsplan. Jag pluggar webbutveckling och programmering i årskurs 2.
    </p>
    <h3>MINA INTRESSEN</h3>
    <p class="aboutme">
        Mina intressen är att styrketräna, mecka med fordon och att utveckla
        mjukvara. Jag bor i Älvsjö och är född i Täby. Mina tidigare kunskaper
        inom utveckling och data är främst python
        script och appar. Jag gillar rock musik som Tool, Nirvana och liknande band.
    </p>
    <br>
</div>

<div class="tabContent" id="webbutv1">
    <h3>ÖVNINGAR</h3>
    <div class="container">
        <div class="image">
            <img alt="coding-cat" class="kattgif" loading="lazy"
                 src="https://media.giphy.com/media/3oKIPnAiaMCws8nOsE/giphy.gif"/>
        </div>
        <div class="links">
            <p class="ovningar">
                <a href="./webbutv1/ovningar/ovning0.html"> Övning 0 - Första hemsidan </a>
                <br/><br/>
                <a href="./webbutv1/ovningar/ovning00.html"> Övning 00 - Hemsida v2 </a>
                <br/><br/>
                <a href="./webbutv1/ovningar/ovning1.html"> Övning 1 - Internets historia & fakta </a>
                <br/><br/>
                <a href="./webbutv1/ovningar/ovning2.html"> Övning 2 - CSS </a>
                <br/><br/>
                <a href="./webbutv1/ovningar/ovning3.html"> Övning 3 - Extern stilmall CSS</a>
                <br><br>
                <a href="./webbutv1/ovningar/ovning4.html"> Övning 4 - Tabeller </a>
                <br><br>
                <a href="./webbutv1/ovningar/ovning5.html"> Övning 5 - Repetition html css tabell </a>
                <br><br>
                <a href="./webbutv1/ovningar/ovning6.html"> Övning 6 - Lager-Position </a>
                <br/><br/>
                <a href="./webbutv1/ovningar/gimp_logga.html"> GIMP Logga </a>
                <br/><br/>
                <a href="./webbutv1/ovningar/ovning7.html"> Övning 7 - Flexbox </a>
                <br/><br/>
                <a href="./webbutv1/ovningar/ovning8a.html"> Övning 8a - Grid </a>
                <br/><br/>
                <a href="./webbutv1/ovningar/ovning8b.html"> Övning 8b - Grid </a>
                <br/><br/>
                <a href="./webbutv1/ovningar/ovning9a.html"> Övning 9 - Grid2 </a>
                <br/><br/>
                <a href="./webbutv1/ovningar/ovning10.html"> Övning 10 - Formulär </a>
                <br/><br/>
                <a href="./webbutv1/ovningar/ovning11.html"> Övning 11 - Javascript </a>
                <br/><br/>
                <a href="./webbutv1/ovningar/ovning12.html"> Övning 12 - Trafikljus </a>
            </p>
        </div>
    </div>
</div>

<div class="tabContent" id="webbutv2">
    <h3>↓ PROJEKT ↓</h3>
    <div id="projectContainer">
        <div class="projectCard">
            <h3>PODCAST</h3>
            <iframe src="./webbutv2/projekt/prao_podcast/index.html" width="100%" height="200px"></iframe>
        </div>
        <div class="projectCard">
            <h3>SNAKE</h3>
            <iframe src="./webbutv2/projekt/snake/snake.html" width="100%" height="200px"></iframe>
        </div>
    </div>
  <hr>
    <h3>↓ ÖVNINGAR ↓</h3>
    <iframe src="./webbutv2/övningar/index.html" width="100%" height="600px" style="border:none;"></iframe>
</div>

<div class="tabContent" id="music">
    <h3>VECKANS ALBUM:</h3>
    <iframe style="border-radius:12px" src="https://open.spotify.com/embed/album/58NXIEYqmq5dQHg9nV9duM?utm_source=generator" width="50%" height="352" frameBorder="0" allowfullscreen="" allow="autoplay; clipboard-write; encrypted-media; fullscreen; picture-in-picture" loading="lazy"></iframe>
</div>

<div class="tabContent" id="links">
    <h3>LÄNKAR</h3>
    <a href="https://vgy.se" target=”_blank”> VGYs hemsida</a> <br><br>
    <a href="https://www.instagram.com/lovblo.h/" target=”_blank”> Instagram</a><br><br>
</div>

<div class="tabContent" id="quotes">
    <h3>QUOTES</h3>
    <hr>
    <br>
    <img alt="The best programmer to ever live." class="terry" loading="lazy" src="https://upload.wikimedia.org/wikipedia/commons/thumb/0/04/Terry_A._Davis_in_front_of_Richland_WA_library.jpg/220px-Terry_A._Davis_in_front_of_Richland_WA_library.jpg"/>
    <img alt="Terry Davis" class="terry" loading="lazy" src="https://upload.wikimedia.org/wikipedia/commons/3/34/Terry_A._Davis_2017.jpg"/>
    <p class="aboutme">
        “An idiot admires complexity, a genius admires simplicity, a physicist tries to make it simple, for an idiot anything the more complicated it is the more he will admire it, if you make something so clusterfucked he can't understand it he's gonna think you're a god cause you made it so complicated nobody can understand it. That's how they write journals in Academics, they try to make it so complicated people think you're a genius”
        <br> ― Terry Davis, Creator of Temple OS
    </p>
    <hr>
    <br>
    <img alt="Sun Tzu" class="terry" src="https://cdn.britannica.com/36/259536-050-C6DC3D1F/Sunzi-Sun-Tzu-Chinese-strategist-Art-of-War.jpg">
    <img alt="Sun Tzu" class="terry" src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcTCWEhRk6Nk4UYHNmOsUqvr0o9QZfNzC4NZow&s">
    <p class="aboutme">
        "The greatest victory is that which requires no battle.”
        <br> - Sun Tzu, Art of War
    </p>
    <hr>
    <br>
    <img class="terry" src="https://ordalaget.se/wp-content/uploads/Edward-Blom_webb-400x397.jpg" alt="Edward Blom">
    <img class="terry" src="https://upload.wikimedia.org/wikipedia/commons/thumb/9/92/Edward_blom.melodifestivalen2018.18d873.1460307.jpg/1200px-Edward_blom.melodifestivalen2018.18d873.1460307.jpg" alt="Edward Blom">
    <p class="aboutme">
        ”Som ung ska man dricka punsch, röka cigarrer, läsa poesi och lösa världens alla problem över på tok för mycket rödvin.”
        <br> - Edward Blom, Livsnjutare
    </p>
    <hr>
    <br>
</div>

<script>
    let defaultTab = "about"

    window.onload = function () {
        const lastTab = localStorage.getItem("lastOpenTab");
        console.log("lastOpenTab: " + lastTab);
        // Check if local storage has the last tab
        if (lastTab) {
            // Click the last tab's button
            document.getElementById(lastTab + "Btn").click();
        } else {
            // Open default tab
            openDefault();
        }
        // Show footer after loading last/default tab
        // (Prevents it from appearing before tab content
        document.querySelector('footer').style.display = 'block';
    }

    function openDefault() {
        document.getElementById(defaultTab + "Btn").click();
    }

    function openTab(evt, tabName) {
        let i, tabContent, tabLinks;
        console.log("Opening tab: " + tabName)
        tabContent = document.getElementsByClassName("tabContent");
        for (i = 0; i < tabContent.length; i++) {
            tabContent[i].style.display = "none";
        }
        tabLinks = document.getElementsByClassName("tabLinks");
        for (i = 0; i < tabLinks.length; i++) {
            tabLinks[i].className = tabLinks[i].className.replace(" active", "");
        }
        document.getElementById(tabName).style.display = "block";
        if (evt) {
            evt.currentTarget.className += " active";
            // Set last tab to localStorage
            localStorage.setItem("lastOpenTab", tabName);
            console.log("Set lastOpenTab to: " + tabName);
        }
    }
</script>
</body>
<footer>
    <p>&#169 Love Blomberg, 23TE - 2024</p>
    <p id="gfg"></p>
</footer>
</html>