WebDevPractice/index.html at main · LimJY03/WebDevPractice · 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
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
<!DOCTYPE html>
<head>
    <title>Website Development Practice</title>
    <link rel="stylesheet" href="./hub/style.css">
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800&display=swap" rel="stylesheet">
    <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
    <link rel="icon" href="https://github.githubassets.com/favicons/favicon-dark.svg" type="image/svg+xml"/>
    <meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
    <section class="header">
        <div class="textbox">
            <h1>Website Development Practice</h1>
            <p>This site act as the hub to different websites created in this repository.</p>
            <a href="#university-web-design" class="hero-button">View Websites</a>
        </div>
    </section>
    <section class="university-web-design" id="university-web-design">
        <div class="content">
            <div class="row">
                <div class="column-left" id="thumbnail">
                    <a href="./university-web-design/index.html" target="_blank">
                        <img src="https://media.discordapp.net/attachments/1010370083689865328/1010370263906525314/unknown.png?width=1240&height=701">
                    </a>
                </div>
                <div class="column-right" id="content">
                    <h2>University Web Design</h2>
                    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Eget est lorem ipsum dolor sit amet consectetur adipiscing. Scelerisque eleifend donec pretium vulputate sapien...</p>
                    <div class="section-button">
                        <a href="./university-web-design/index.html" target="_blank">
                            <span class="button-text">Explore Website</span>
                            <span><i class="material-icons">arrow_right_alt</i></span>
                        </a>
                    </div>
                    <div class="github-button">
                        <a href="https://github.com/LimJY03/WebDevPractice/tree/main/university-web-design" target="_blank">
                            <span class="button-text">GitHub Source Code</span>
                            <span><i class="material-icons">arrow_right_alt</i></span>
                        </a>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <section class="ecommerce-web-design" id="ecommerce-web-design">
        <div class="content">
            <div class="row">
                <div class="column-left" id="thumbnail">
                    <a href="./ecommerce-web-design/index.html" target="_blank">
                        <img src="https://media.discordapp.net/attachments/1010370083689865328/1011560555145855028/unknown.png?width=1316&height=701">
                    </a>
                </div>
                <div class="column-right" id="content">
                    <h2>Ecommerce Web Design</h2>
                    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Eget est lorem ipsum dolor sit amet consectetur adipiscing. Scelerisque eleifend donec pretium vulputate sapien...</p>
                    <div class="section-button">
                        <a href="./ecommerce-web-design/index.html" target="_blank">
                            <span class="button-text">Explore Website</span>
                            <span><i class="material-icons">arrow_right_alt</i></span>
                        </a>
                    </div>
                    <div class="github-button">
                        <a href="https://github.com/LimJY03/WebDevPractice/tree/main/ecommerce-web-design" target="_blank">
                            <span class="button-text">GitHub Source Code</span>
                            <span><i class="material-icons">arrow_right_alt</i></span>
                        </a>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <section class="restaurant-web-design" id="restaurant-web-design">
        <div class="content">
            <div class="row">
                <div class="column-left" id="thumbnail">
                    <a href="./restaurant-web-design/dist/index.html" target="_blank">
                        <img src="https://media.discordapp.net/attachments/1010370083689865328/1016873510150357003/unknown.png?width=1333&height=701">
                    </a>
                </div>
                <div class="column-right" id="content">
                    <h2>Restaurant Web Design</h2>
                    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Eget est lorem ipsum dolor sit amet consectetur adipiscing. Scelerisque eleifend donec pretium vulputate sapien...</p>
                    <div class="section-button">
                        <a href="./restaurant-web-design/dist/index.html" target="_blank">
                            <span class="button-text">Explore Website</span>
                            <span><i class="material-icons">arrow_right_alt</i></span>
                        </a>
                    </div>
                    <div class="github-button">
                        <a href="https://github.com/LimJY03/WebDevPractice/tree/main/restaurant-web-design" target="_blank">
                            <span class="button-text">GitHub Source Code</span>
                            <span><i class="material-icons">arrow_right_alt</i></span>
                        </a>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <section class="footer">
        <a href="https://github.com/LimJY03/WebDevPractice" target="_blank">Hosted with <i class="material-icons">favorite_border</i> on GitHub Pages</a>
    </section>
</body>