mosaic/about.html at main · fyrebolt/mosaic · 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
<!DOCTYPE html>
<html>
<head>
    <link href='https://fonts.googleapis.com/css?family=Nanum Pen Script' rel='stylesheet'>
    <style>
        body {
            font-family: 'Nanum Pen Script';font-size: 22px;
        }
    </style>
    <title>-MOSAIC about</title>
</head>

<style>
.button {
    border: none;
    color: white;
    padding: 15px 32px;
    text-decoration: none;
    display: inline-block;
    border-radius: 10px;
    font-family: 'Nanum Pen Script';
    font-size: 16px;
    margin: 4px 2px;
    cursor: pointer;
}

.button1 {background-color: #4CAF50; font-size: 30px; transition: all 1s ease; transform: scale(1); } /* Green */

.pos1 {
    margin: 0;
    position: absolute;
    top: 80%;
    right: 51%;
    transition: all .5s ease;
    transform: scale(1);
  }

.button1:hover {
    background-color: #3ae462;
    /*  Making button bigger on hover  */
    padding: 20px 30px;
    transform: scale(1.2)
}

h3{
    padding: 0px;
}

</style>
</head>

<body style="background-color:rgb(231, 188, 146); font-family: Nanum Pen Script;">
<button onclick = "window.location.href='index.html'" class="button button1"><b>&larr;</b></button>
<h1 style="font-size:200%;"><u>About</u></h1>
<h3 style="font-size:150%;">This project was created by Aaron, Andrew, Hastin, and Natalie. This project is a multiplayer drawing software where players create mosaics by placing squares of multiple colors. We created this project with the goal of allowing people to connect with friends and strangers by collaborating with each other to create mosaics. To join, create an account <3 </h3>
<h1 style="font-size:200%;"><u>How to</u></h1>
<h3 style="font-size:150%;">Click to place block</h3>
<h3 style="font-size:150%;">Click numbers to change colors</h3>
    <!-- <img src="https://i.natgeofe.com/k/59ccd67f-c57c-4946-99bd-f957a38dafaa/hippopotamus-closeup-water_square.jpg"
alt="handsome hippo <33" width="50%" height="50%"> -->
<img src="colors.png"
alt="colors" width="50%" height="50%">

</body>
</html>