comclub-website-new/index.html at main · csheun/comclub-website-new · 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
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <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=Karla:wght@400;500;700&display=swap" rel="stylesheet">
        <script src="https://kit.fontawesome.com/8663eb90fc.js" crossorigin="anonymous"></script>
        <link rel="stylesheet" href="css/styles.css">
        <script src="js/app.js"></script>
        <title>Home | NUS Students' Computing Club</title>
    </head>

    <body>
        <div id="fop-banner">
            <p id="fop-para" style="text-align:center;">
<!--                <b>Ongoing Events</b><br>-->
                <u style="font-weight: bold;">Ongoing Events</u><br>
                <a style="color: black;" href="elections.html">Annual Elections</a>: Computing Club 26th MC Elections are here!
                The annual elections are ongoing now! Find out more <span><a style="font-weight: bold; color: black;" href="elections.html">here</a></span>!
                <br>
                <a style="color: black;" href="ifg.html">Inter Faculty Games</a>: <span><a style="font-weight: bold; color: black;" href="ifg.html">View</a></span> the IFG schedule now!
            </p>
            <button id="toggle-fop-banner">Got it!</button>
        </div>
        <!-- <div id="ifg-banner">
            <p style="text-align:center">
                IFG is ongoing now! Find out more about the schedule <span><a style="font-weight: bold; color: black;" href="ifg.html">here</a></span>!
            </p>
            <button id="toggle-ifg-banner">Got it!</button>
        </div>
         -->

        <div id="navbar">
            <img src="assets/logo.png" width="40" id="logo">
            <!-- <p id="logo">NUS Computing Club</p> -->
            <div id="options">
                <p><a style="color: #feca57;" href="index.html">Home</a></p>
                <p><a href="about.html">About</a></p>
                <p><a href="freshmen.html">Freshmen</a></p>
                <p><a target="_blank" href="https://feedback.nuscomputing.com">Feedback</a></p>
                <p><a target="_blank" href="https://www.flickr.com/photos/137141057@N04/albums/">Photos</a></p>

                <!-- <p><a style="color: #78e08f;" href="index.html"><i class="fa-solid fa-house"></i></a></p>
                <p><a href="about.html"><i class="fa-solid fa-circle-info"></i></a></p>
                <p><a target="_blank" href="https://feedback.nuscomputing.com"><i class="fa-solid fa-comments"></i></a></p>
                <p><a target="_blank" href="https://www.flickr.com/photos/137141057@N04/albums/"><i class="fa-solid fa-images"></i></a></p> -->
            </div>
        </div>

        <div id="hero">
            <div id="hero-text">
                <p id="hero-stmt">NUS Students' <br> Computing Club</p>
                <p id="hero-para">
                    <!-- We serve to continually support our faculty, <br> -->
                    <!-- to build a close-knit Computing community, <br> -->
                    <!-- both past and present, to ensure campus vibrancy. -->

                    We aim to be the voice of the students, <br>
                    ensure their holistic well being, <br>
                    and bridge gaps between them and the school.
                </p>
            </div>

            <img src="assets/hero_soccat.png">
        </div>

        <div id="filler"></div>

        <div id="people-container">
            <p id="header-stmt">
                Meet the Team
                <i style="color: #395B9B;" class="fa-solid fa-circle"></i>
                <i style="color: #93c6c3;" class="fa-solid fa-circle"></i>
                <i style="color: #92CEFC;" class="fa-solid fa-circle"></i>
            </p>
            <p id="header-para">Introducing the <span>25th Management Committee</span>.</p>

            <div class="wing-cont">
                <p class="wing-name">Presidency</p>

                <div class="wing-cards" id="pwing-box">
                    <!-- <div class="wing-card">
                        <img src="" class="wing-pic">
                        <div class="card-pic"></div>
                        <div class="card-details">
                            <p class="card-name">Raveen Prabhu</p>
                            <p class="card-position">President</p>
                        </div>
                    </div> -->
                </div>
            </div>

            <div class="wing-cont">
                <p class="wing-name">External Relations</p>

                <div class="wing-cards" id="external-box"></div>
            </div>

            <div class="wing-cont">
                <p class="wing-name">Internal Relations</p>

                <div class="wing-cards" id="internal-box"></div>
            </div>

            <div class="wing-cont">
                <p class="wing-name">Student Development</p>

                <div class="wing-cards" id="stddev-box"></div>
            </div>

            <div class="wing-cont">
                <p class="wing-name">Student Life</p>

                <div class="wing-cards" id="stdlife-box"></div>
            </div>
        </div>

        <div id="footer">
            <div id="footer-details">
                <!-- <p id="footer-logo">NUS Computing Club</p> -->
                <img src="assets/footer_logo.png" id="footer-logo">
                <div id="socials">
                    <a target="_blank" href="https://www.facebook.com/nuscomputing"><i class="fa-brands fa-facebook-f"></i></a>
                    <a target="_blank" href="https://www.instagram.com/NUSComputingClub"><i class="fa-brands fa-instagram"></i></a>
                    <a target="_blank" href="https://t.me/nuscomputingclub"><i class="fa-brands fa-telegram"></i></a>
                    <a target="_blank" href="https://www.youtube.com/channel/UCIXFOIE140R6x0z05hgim0Q"><i class="fa-brands fa-youtube"></i></a>
                    <!-- <a target="_blank" href="https://github.com/NUSComputingDev"><i class="fa-brands fa-github"></i></a> -->
                    <a target="_blank" href="https://www.linkedin.com/company/nus-students-computing-club/"><i class="fa-brands fa-linkedin-in"></i></a>
                    <a target="_blank" href="mailto:connect@nuscomputing.com"><i class="fa-solid fa-envelope"></i></a>
                </div>
                <p id="disclaimers">
                    Copyright © NUS Students' Computing Club • <a style="text-decoration: none; color: white;" href="https://nuscomputing.com/privacy.html">Privacy Policy</a>
                </p>
            </div>
            <!-- <p id="feedback" style="line-height: 35px;">
                Got feedback? Send it our way! <br> <a target="_blank" href="https://feedback.nuscomputing.com">feedback.nuscomputing.com</a>
            </p> -->
        </div>
    </body>
</html>