team.html

<!DOCTYPE html>
<html>
    <head>
        <!-- Title of the webpage -->
        <title>Google Developer Student Club VIT</title>

        <!-- Favicon linking -->
        <link
            rel="apple-touch-icon"
            sizes="180x180"
            href="icons/favicons/apple-touch-icon.png"
        />
        <link
            rel="icon"
            type="image/png"
            sizes="32x32"
            href="icons/favicons/favicon-32x32.png"
        />
        <link
            rel="icon"
            type="image/png"
            sizes="16x16"
            href="icons/favicons/favicon-16x16.png"
        />
        <link rel="manifest" href="icons/favicons/site.webmanifest" />

        <!--Links to css CDN's-->
        <link
            href="https://unpkg.com/aos@2.3.1/dist/aos.css"
            rel="stylesheet"
        />
        <link
            href="https://fonts.googleapis.com/css?family=Barlow:100,200,500"
            rel="stylesheet"
        />

        <!-- Links to css files -->
        <link rel="stylesheet" href="css/index.css" />
        <link rel="stylesheet" href="css/team.css" />
        <link rel="stylesheet" href="css/svg.css" />

        <script>
            if ('serviceWorker' in navigator) {
                navigator.serviceWorker.register('/sw.js').then(function () {
                    console.log('Service Worker Registered');
                });
            }
        </script>

        <!--Meta tags for SEO and Responsiveness-->
        <meta name="viewport" content="width=device-width, initial-scale=1" />
        <meta
            name="Description"
            content="GDSC VIT (Google Developer Student Club VIT Vellore) is a Google program for university students, with an aim to help students build their development skills."
        />
    </head>

    <body>
        <div class="navbar">
            <a href="./">
                <div class="navbar-dsc-logo">
                    <!-- <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 2428 693">
                    <defs>
                        <clipPath id="clip-custom_3">
                        <rect width="2428" height="693"/>
                        </clipPath>
                    </defs>
                    <g id="custom_3" data-name="custom – 3" clip-path="url(#clip-custom_3)">
                        <g id="Group_1" data-name="Group 1" transform="translate(0.088 173.543)">
                        <path id="Path_1" data-name="Path 1" d="M50.956.005,257.588,2.834c28.53.391,51.975,23.47,52.365,51.549S287.533,104.907,259,104.517L52.37,101.688C23.84,101.3.4,78.218,0,50.139S22.426-.386,50.956.005Z" transform="translate(320.693 90.519) rotate(150)" fill="#fe2c25" opacity="0.998"/>
                        <path id="Path_2" data-name="Path 2" d="M52.37,2.834,259,.005c28.53-.391,51.342,22.055,50.951,50.134s-23.835,51.158-52.365,51.549L50.956,104.517C22.426,104.907-.386,82.461,0,54.382S23.84,3.224,52.37,2.834Z" transform="translate(268.432 346.364) rotate(-150)" fill="#2785fc" opacity="0.998"/>
                        <path id="Path_4" data-name="Path 4" d="M52.37,101.688,259,104.517c28.53.391,51.342-22.055,50.951-50.134S286.118,3.224,257.588,2.834L50.956.005C22.426-.386-.386,22.06,0,50.139S23.84,101.3,52.37,101.688Z" transform="translate(336.222 255.846) rotate(-30)" fill="#ffba00" opacity="0.998"/>
                        <path id="Path_3" data-name="Path 3" d="M50.956,104.517l206.632-2.829c28.53-.391,51.975-23.47,52.365-51.549S287.533-.386,259,.005L52.37,2.834C23.84,3.224.4,26.3,0,54.382S22.426,104.907,50.956,104.517Z" transform="translate(388.483 0) rotate(30)" fill="#00a050" opacity="0.998"/>
                        </g>
                        <path id="Path_6" data-name="Path 6" d="M42.2,220.815V-.691h63.973q26.389,0,44.381,7.4A72.008,72.008,0,0,1,179.937,28.3q11.4,14.194,16.393,34.385t5,45.78q0,26.389-5.4,44.981t-13.794,30.987a72.169,72.169,0,0,1-18.992,19.592,93.2,93.2,0,0,1-21.391,11,89.709,89.709,0,0,1-20.391,4.8,159.313,159.313,0,0,1-15.993,1ZM4.212-32.677V252.8H102.17q35.585,0,61.574-10t42.782-28.988q16.793-18.992,24.789-46.78t8-63.773q0-68.771-35.585-102.356T102.17-32.677Zm446.61,83.564h35.985q-.8-23.59-9-40.583a79.074,79.074,0,0,0-22.39-28.188,92.357,92.357,0,0,0-32.986-16.393,152.541,152.541,0,0,0-40.783-5.2,146.442,146.442,0,0,0-38.184,5,104.987,104.987,0,0,0-33.186,15.194,76.9,76.9,0,0,0-23.39,25.989Q278.1,22.5,278.1,44.09q0,19.592,7.8,32.586a63.208,63.208,0,0,0,20.791,21.191,120.832,120.832,0,0,0,29.387,13.194q16.393,5,33.386,8.8t33.386,7.4a152.211,152.211,0,0,1,29.388,9.4q12.994,5.8,20.791,14.994t7.8,23.99q0,15.593-6.4,25.589a46.557,46.557,0,0,1-16.793,15.793,75.978,75.978,0,0,1-23.39,8.2,141.8,141.8,0,0,1-25.789,2.4,122.029,122.029,0,0,1-31.187-4,77.6,77.6,0,0,1-26.589-12.395,63.621,63.621,0,0,1-18.392-21.391q-7-12.994-7-30.987H269.3q0,25.989,9.4,44.981a86.245,86.245,0,0,0,25.589,31.187A112.072,112.072,0,0,0,341.868,253.2a167.386,167.386,0,0,0,45.381,6,173.555,173.555,0,0,0,39.383-4.6,113.97,113.97,0,0,0,35.785-14.794,83.911,83.911,0,0,0,26.189-26.389q10.2-16.193,10.2-38.983,0-21.191-7.8-35.185a69.459,69.459,0,0,0-20.791-23.19,110.123,110.123,0,0,0-29.388-14.594q-16.393-5.4-33.386-9.4t-33.386-7.4a174.823,174.823,0,0,1-29.387-8.6q-12.995-5.2-20.791-13.394t-7.8-21.391q0-13.994,5.4-23.39A41.98,41.98,0,0,1,335.871,2.908a62.637,62.637,0,0,1,20.591-8,116.126,116.126,0,0,1,23.59-2.4q29.587,0,48.579,13.794T450.822,50.887Zm294.675,2.4H783.48q-3.2-22.79-13.594-40.183A98.867,98.867,0,0,0,743.9-15.884a113.92,113.92,0,0,0-35.585-17.593,146.743,146.743,0,0,0-42.382-6q-32.786,0-58.175,11.795A120.227,120.227,0,0,0,565.373,4.507a141.151,141.151,0,0,0-25.789,47.78,190.461,190.461,0,0,0-8.8,58.575,201.3,201.3,0,0,0,8.2,58.375q8.2,27.188,24.59,47.18A113.868,113.868,0,0,0,604.756,247.8q24.789,11.4,57.975,11.4,54.777,0,86.363-29.987t37.184-83.964H748.3a108.929,108.929,0,0,1-7.2,32.786,79.129,79.129,0,0,1-16.593,26.189,75.573,75.573,0,0,1-25.189,17.193q-14.594,6.2-33.386,6.2-25.589,0-43.981-9.6a85.894,85.894,0,0,1-30.187-25.789q-11.8-16.193-17.393-37.984a184.987,184.987,0,0,1-5.6-46.18,165.375,165.375,0,0,1,5.6-43.182A111.3,111.3,0,0,1,591.762,27.9,86.407,86.407,0,0,1,621.749,2.108q18.192-9.6,43.781-9.6,29.987,0,51.778,15.194T745.5,53.286ZM911.426-32.677H963.4l71.57,225.9h.8l73.169-225.9h50.778L1062.162,252.8h-55.576Zm276.682,0h49.979V252.8h-49.979Zm83.964,0h231.1V10.5h-90.761V252.8h-49.979V10.5h-90.361Z" transform="translate(863.089 249.909)" fill="#707070"/>
                    </g>
                    </svg> -->
                    <img
                        data-aos="fade-up"
                        src="images/DSClogo.svg"
                        class="logo-nav"
                        alt="GDSC VIT"
                    />
                    <img
                        data-aos="fade-up"
                        src="images/DSClogo.svg"
                        class="logo-nav-light"
                        alt="GDSC VIT"
                    />
                </div>
            </a>
        </div>

        <div class="main" id="home-scroll">
            <div class="main-text-holder">
                <h1 data-aos="fade-up" class="barlow-extralight">The Team</h1>

                <h2 data-aos="fade-up" class="barlow-medium">
                    Presenting board of 2021-2022
                </h2>
            </div>

            <div class="main-down-arrow" id="down-arrow">
                <svg
                    xmlns="http://www.w3.org/2000/svg"
                    viewBox="0 0 28.55 44.393"
                >
                    <g
                        id="Group_2"
                        data-name="Group 2"
                        transform="translate(-966 -967.48)"
                    >
                        <path
                            id="Path_1"
                            data-name="Path 1"
                            d="M982,967.98V1011.1"
                            transform="translate(-1.5)"
                            fill="none"
                            stroke="#141414"
                            stroke-linecap="round"
                            stroke-width="1"
                        />
                        <path
                            id="Path_2"
                            data-name="Path 2"
                            d="M966.813,997.8l13.973,13.577L994.363,997.8"
                            transform="translate(-0.313)"
                            fill="none"
                            stroke="#141414"
                            stroke-linecap="round"
                            stroke-linejoin="round"
                            stroke-width="1"
                        />
                    </g>
                </svg>
            </div>

            <img src="images/team.svg" class="main-image" alt="GDSC VIT Team" />
        </div>

        <div
            class="container-main holded-container container-main-last"
            id="our-work-scroll"
        >
            <h1 class="barlow-medium text-center" style="padding-bottom: 90px">
                The Board
            </h1>

            <div class="icons" id="board"></div>

            <div id="board-expander">
                <div class="button-maker">
                    <div class="barlow-thin button-text">Show All</div>
                </div>
            </div>
        </div>

        <div
            class="container-main holded-container container-main-last"
            id="our-work-scroll"
        >
            <h1 class="barlow-medium text-center" style="padding-bottom: 90px">
                Technical Team
            </h1>

            <div class="icons" id="technical"></div>

            <div id="technical-expander">
                <div class="button-maker">
                    <div class="barlow-thin button-text">Show All</div>
                </div>
            </div>
        </div>

        <div
            class="container-main holded-container container-main-last"
            id="our-work-scroll"
        >
            <h1 class="barlow-medium text-center" style="padding-bottom: 90px">
                Management Team
            </h1>

            <div class="icons" id="management"></div>

            <div id="management-expander">
                <div class="button-maker">
                    <div class="barlow-thin button-text">Show All</div>
                </div>
            </div>
        </div>

        <div class="container-main holded-container" id="our-work-scroll">
            <h1 class="barlow-medium text-center" style="padding-bottom: 90px">
                Design Team
            </h1>

            <div class="icons" id="design"></div>

            <div id="design-expander">
                <div class="button-maker">
                    <div class="barlow-thin button-text">Show All</div>
                </div>
            </div>
        </div>

        <div class="footer container-main container-main-last">
            <div
                class="dark-light-toggle barlow-medium text-center"
                id="dark-light-toggle"
            >
                <p>I want dark mode</p>
            </div>
        </div>

        <!--Links to JS files and JS CDN's-->
        <script src="https://unpkg.com/aos@2.3.1/dist/aos.js"></script>
        <script src="./js/jq.js"></script>
        <script src="./js/team.js"></script>
        <script>
            AOS.init();
        </script>
    </body>
</html>