group-project-website/index.html at main · ThomasSFSU/group-project-website · 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
<!DOCTYPE html>
<html>
    <head>
        <title>Queen Factsheet</title>
        <link rel="stylesheet" type="text/css" href="style.css"></head>

        <!-- Google Fonts Import-->
        <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=Roboto&display=swap" rel="stylesheet">
        <link rel="icon" href="assets/queen_favicon.svg" type="image/svg+xml">
        <link rel="icon" type="image/png" href="assets/queen_favicon.png" />
    </head>
    <body>
        <header>
            <a href="" class="logo" >
                <img id="queenlogo" src="assets/Queen_Logo.svg" alt="Queen Logo"/>
            </a>
            <!-- <a href="" class="logo">Factsheet</a> -->
            <ul>
                <li><a href="#">Home</a></li>
                <li><a href="#">About</a></li>
                <li><a href="#">Services</a></li>
                <li><a href="#">Portfolio</a></li>
                <li><a href="#">Team</a></li>
                <li><a href="#contact-form">Contact</a></li>
            </ul>
        </header>
        <main>
            <img class="introduction-image" src="https://wallpapercave.com/wp/wp9171975.jpg"
                alt="All 4 original members of Queen" width="100%", height="800px">
                <article class="introduction-card">
                    <h2>Information About Queen</h2>
                  <p class="intro-paragraph">Hi everyone, welcome to our website where we give 8 facts about Queen. The image above
                    shows the four members of the Legendary band. John Deacon is on the very left, to his right is
                    Freddie Mercury (second), Brian May (third), and Roger Taylor (fourth). A little bonus fact, the band has stayed on
                    the UK's Top 100 Chart with their <i>Greatest Hits</i> album for over 1000 weeks now, showcasing their legacy.
                  </p>
                </article>
            <article class="content-card">
                <h2>College Graduates</h2>
                <p>All of the members hold a degree. Brian May earned a PhD in astrophysics from Imperial College, London, in 2007.
                    Freddie Mercury took graphic arts and design, John Deacon has a degree in Electronics, and
                    Roger Taylor has a bachelor's degree in Biology.</p>
            </article>
            <article class="content-card">
                <h2>Crafty</h2>
                <p>Brian May's guitar was homemade. Originally, he was going to buy a guitar, but could not
                    afford a guitar at the time. For example, the guitar's wooden body was made using
                    wood from an old oak table, and the neck had wood from a fireplace mantel.
                </p>
            </article>
            <article class="content-card">
                <h2>Queen Crest's Creation</h2>
                <p>The popular emblem of Queen, or the "Queen's Crest", was designed by Freddie Mercury.
                    It represents the bands zodiac signs. The Leo lions were made for John Deacon and Roger Taylor,
                    a Cancer crab for Brian May, and the fairies of the Queen's Crest represents Freddie Mercury being
                    a Virgo.
                </p>
            </article>
            <article class="content-card">
                <h2>Mastermind Behind the Scenes</h2>
                <p>John Deacon, the bass guitarist, was very quiet and preferred to not be on the spotlight.
                    However, he had a big impact on Queen's success for laying the foundation for some
                    of the band's big hits. Two examples are "Another One Bites the Dust" and "I Want to Break Free".
                </p>
            </article>
            <article class="content-card">
                <h2>From Guitar to Drums</h2>
                <p>Roger Taylor, the drummer for queen, had originally played guitar and ukulele
                    before moving onto the drums. He learned the two first, before switching
                    mastering the drums at 15 since he had a more natural feel for them.
                </p>
            </article>
            <article class="content-card">
                <h2>Michael Jackson Influence</h2>
                <p>Originally, <i>Another One Bites the Dust</i> was not meant to be released as a single.
                    Michael Jackson played a factor into pushing the band to release the song as a single
                    after hearing it backstage by telling Freddie "You need a song that makes the cats dance."
                </p>
            </article>
            <article class="content-card">
                <h2>Genesis or Queen</h2>
                <p>Before joining Queen, Roger Taylor had the opportunity to join Genesis. It was indirect, but according
                    to Roger, that was the impression he got since he was invited to the studio.He declined with a reason stating
                    that the music they created wasn't really aligned to what he wanted to create.
                </p>
            </article>
            <article class="content-card">
                <h2>Under Pressure Even in the Studio</h2>
                <p>The production of the song <i>Under Pressure</i> had the band collaborate with David Bowie,
                who just happened to be in Switzerland while Queen was there as well. As great as the song was,
                David and Freddie would happen to be in heated arguments or conflicts during the process.</p>
            </article>
        </main>
        <footer>
            <h2>Contact Us</h2>
            <form id="contact-form" action="submit" method="post">
                <label for="name">Name:</label>
                <input type="text" id="name" name="name" required><br>

                <label for="email">Email:</label>
                <input type="email" id="email" name="email" required><br>

                <label for="message">Message:</label>
                <textarea id="message" name="message" rows="2" required></textarea><br>

                <button type="submit">Connect Now!</button>
            </form>
            <h3 id="copyright">© 2024  Thomas Brock & Cedric Blanco</h3>
        </footer>

    </body>
</html>