PublicPortfolio/project3.html at main · Goodgui/PublicPortfolio · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Project Description</title>
    <link rel="stylesheet" href="styles.css">
</head>

<body class="project-page">
    <a href="./index.html" class="back">
        ↪
    </a>

    <div class="project-page-container">

        <header>
            <h1>Dark&Darker QuestBook</h1>
        </header>

        <div class="project-about-container">
            <section class="project-about-section">
                <h2>About the Project</h2>
                <p>A webtool for tracking quests inside of the game Dark and Darker.</p>

                <a href="https://github.com/Goodgui/Dark-and-Darker-QuestLog" target="_blank" class="github-link">
                    View on GitHub
                </a>
            </section>
            <section class="project-about-section project-image-section">
                <img src="projectimage_dndquestbook_main.png" alt="Project Screenshot">
            </section>
        </div>
        <section class="project-section">
            <h3>Features</h3>
            <ul>
                <li>Quest tracking</li>
                <li>Progress management</li>
                <li>Game data integration</li>
            </ul>
        </section>
        <section class="project-section">
            <h3>Technologies Used</h3>
            <div class="tech-chips">
                <span class="tech-chip">HTML, CSS and JavaScript</span>
                <span class="tech-chip">React</span>
                <span class="tech-chip">GPT4o</span>
                <span class="tech-chip">Git</span>
                <span class="tech-chip">Github Copilot</span>
            </div>
        </section>
        <!-- <section class="project-section">
            <h3>Code Snippets</h3>
            <div class="codeblock-container">
                <pre class="codeblock">
                    <code class="codeblock-code">
                    // Example code snippet
                    const Quest = ({ title, status }) => {
                        return <div>{title}: {status}</div>;
                    }
                    </code>
                </pre>
                <a> - code snippet description </a>
            </div>
        </section> -->

        <!-- <section class="project-section">
            <h3> Additional Information</h3>
        </section> -->
    </div>
</body>

<script src="BackgroundPattern.js"></script>

</html>