only-laughs/contacts.html at main · AnthonyBuffill/only-laughs · 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
<!-- <DELETE THE HTML CONTENTS BEFORE ADD AND COMMIT> -->

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>About Us</title>

    <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=Bungee&family=Sarala:wght@400;700&display=swap"
        rel="stylesheet">

    <script src="https://cdn.tailwindcss.com"></script>
    <link rel="stylesheet" href="./assets/css/contacts.css">
</head>

<body class="pageBackground">
    <header class="aboutHeader">
        <nav>
            <a href="./memevault.html"
                class="hover:bg-[#22122C] text-white font-semibold py-2 px-4 border border-gray-400 rounded shadow">Meme
                Vault</a>
            <a href="index.html"
                class="hover:bg-[#22122C] text-white font-semibold py-2 px-4 border border-gray-400 rounded shadow">Home</a>
        </nav>
        <br><br>
        <h1 class="text-5xl md:text-7xl" id="aboutTitle">About the Devs</h1>
    </header>
    <br>
    <section class="thankYouBox w-full lg:max-w-full lg:flex justify-content-center">
        <div class="lg:w-1/2 md:w-3/4 bg-purple-950 bg-opacity-10 rounded overflow-hidden shadow-lg">
            <div class="m-8">

                <div class="text-gray-900 font-bold text-xl mb-2 text-center">THANK YOU:</div>
                <p class="text-lg text-gray-900 text-base">Thank you for visiting our silly website!
                    It was a very fun and exciting developing experience. If you have any feedback or comments, please
                    feel free to reach out to us!</p>
            </div>
            <div class="flex items-center"></div>
        </div>
    </section>

    <section class="cardBox flex lg:flex-row sm:flex-wrap flex-col">
        <div class="bg-purple-950 bg-opacity-10 max-w-sm rounded overflow-hidden shadow-lg profile">
            <img class="w-full imageSize" src="./assets/images/giraffedownload.jpeg" alt="cool giraffe">
            <div class="px-6 py-4">
                <h3 class="font-bold text-xl mb-2">Anthony Buffill</h3>
                <p class="text-gray-900 text-base profileDesc">
                    Meet Anthony, our charismatic New Yorker and coding virtuoso behind the Meme Vault! With a knack for
                    turning code into comedy, Anthony brings joy to Only Laughs by applying a creative, artistic touch to
                    the Meme Vault. His expertise in web development and a passion for memes culminate in the perfect
                    fusion of humor and code.
                </p>
                <a href="https://anthonybuffill.github.io/week2-challenge/"
                    class="hover:bg-[#22122C] hover:text-gray-200 px-2 rounded py-2 text-sm font-semibold text-gray-800 mr-2 mb-2">Portfolio</a>
            </div>
        </div>

        <div class="bg-purple-950 bg-opacity-10 max-w-sm rounded overflow-hidden shadow-lg profile">
            <img class="w-full imageSize" src="./assets/images/poki-cat.JPG" alt="poki grinding sick tricks">
            <div class="px-6 py-4">
                <h3 class="font-bold text-xl mb-2">Hye-Ji Shin</h3>
                <p class="text-gray-900 text-base profileDesc">
                    Meet Hye-Ji, the artist behind the stylish vibes of Only Laughs' About Us page. As our Seattle
                    native, Hye-Ji crafts pixel-perfect experiences and dances with colors in the digital realm. With
                    HTML and CSS as her brushes, she turns code into a visual masterpiece, making our website a
                    delightful place to explore.
                </p>
                <a href="https://github.com/shinhye-ji"
                    class="hover:bg-[#22122C] hover:text-gray-200 px-2 rounded py-2 text-sm font-semibold text-gray-800 mr-2 mb-2">Portfolio</a>
            </div>
        </div>

        <div class="bg-purple-950 bg-opacity-10 max-w-sm rounded overflow-hidden shadow-lg profile">
            <img class="w-full imageSize" src="./assets/images/etretat-4506073_1280.jpg" alt="picture of donkey">
            <div class="px-6 py-4">
                <h3 class="font-bold text-xl mb-2">Joshua Roth</h3>
                <p class="text-gray-900 text-base profileDesc">
                    Meet Joshua, the genius behind the scenes who sprinkles a touch of randomness into Only Laughs. As
                    our favorite family man, Josh crafted the JavaScript magic that brings you an endless gallery of
                    jokes and silly pictures. Josh's creations keep the Meme Vault full of surprises, providing users
                    with a delightful browsing experience.
                </p>
                <a href="https://joshrthedeveloper.github.io/Module-2/"
                    class="hover:bg-[#22122C] hover:text-gray-200 px-2 rounded py-2 text-sm font-semibold text-gray-800 mr-2 mb-2">Portfolio</a>
            </div>
        </div>

        <div class="bg-purple-950 bg-opacity-10 max-w-sm rounded overflow-hidden shadow-lg profile">
            <img class="w-full imageSize" src="./assets/images/margo.png" alt="brian's dog">
            <div class="px-6 py-4">
                <h3 class="font-bold text-xl mb-2">Brian Doherty</h3>
                <p class="text-gray-900 text-base profileDesc">
                    Meet Brian, the clean coder who brings structure and style to Only Laughs' main page with HTML and
                    CSS. Being our group's animal-lover, Brian creates a visual feast for your eyes, making Only Memes a
                    delightful space for your meme adventures. His dedication to clean and efficient code ensures a
                    smooth user experience.
                </p>
                <a href="https://bdoherty1.github.io/portfolio/"
                    class="hover:bg-[#22122C] hover:text-gray-200 px-2 rounded py-2 text-sm font-semibold text-gray-800 mr-2 mb-2">Portfolio</a>
            </div>
        </div>
    </section>

    <footer class="rounded-lg shadow m-4 bg-purple-950 bg-opacity-20">
        <div class="w-full mx-auto max-w-screen-xl p-4 md:flex md:items-center md:justify-between">
            <span class="text-sm text-gray-400 sm:text-center dark:text-gray-400">Made with <a
                    href="https://flowbite.com/" class="hover:underline">♡♡♡</a></span>
            <ul class="flex flex-wrap items-center mt-3 text-sm font-medium text-gray-400 dark:text-gray-400 sm:mt-0">
            </ul>
        </div>
    </footer>
</body>

</html>