Credits page done

This commit is contained in:
2021-12-28 10:41:08 -03:00
parent 457397c550
commit 6d2f011c9b
6 changed files with 113 additions and 5 deletions

23
credits/index.html Normal file
View File

@@ -0,0 +1,23 @@
<!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">
<title>Tic Tac Toe Game</title>
<link rel="stylesheet" href="./sytles/styles.css">
</head>
<body>
<header><h1>Credits</h1></header>
<ul>
<li>Animations: <a href="https://animate.style">Animate.css</a></li>
<li>Emoji Picker: <a href="https://www.npmjs.com/package/emoji-picker-element">emoji-picker-element</a></li>
<li>Idea: <a href="https://www.theodinproject.com/paths/full-stack-javascript/courses/javascript/lessons/tic-tac-toe">The Odin Project</a></li>
</ul>
<footer>
<p>Made with 💓 by <a href="http://franp.xyz" target="_blank">Francisco Pessano</a></p>
<a href="../">Back to the Game</a>
</footer>
</body>
</html>

75
credits/sytles/styles.css Normal file
View File

@@ -0,0 +1,75 @@
html, body {
height: 100%;
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
}
body {
margin: 0;
padding: 0;
background-color: rgb(221, 121, 121);
}
header {
display: flex;
justify-content: center;
}
header h1 {
border-bottom: 2px solid #fff;
width: 75vw;
display: flex;
justify-content: center;
margin: 0;
padding: 3vh 0px;
color: #fff;
font-size: 35pt;
}
ul {
padding: 2vh 13.8vw;
}
li {
color: #fff;
font-size: 17pt;
}
li a, footer a {
color: rgb(31, 94, 189)
}
footer {
position: absolute;
height: 7vh;
width: 100%;
padding-left: 2vw;
padding-right: 2vw;
top: calc(100% - 7vh);
box-sizing: border-box;
display: flex;
align-items: center;
justify-content: space-between;
color: #fff;
font-size: 13pt;
}

View File

@@ -4,7 +4,7 @@
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Tic tac toe</title>
<title>Tic Tac Toe Game</title>
<link rel="stylesheet" href="./styles/styles.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css"/>
<script type="module" src="https://cdn.jsdelivr.net/npm/emoji-picker-element@^1/index.js"></script>
@@ -69,6 +69,7 @@
<footer>
<p>Made with 💓 by <a href="http://franp.xyz" target="_blank">Francisco Pessano</a></p>
<a href="./credits/">Credits</a>
</footer>
</body>
</html>

View File

@@ -8,16 +8,21 @@ footer {
width: 100%;
padding-left: 2vw;
padding-right: 2vw;
top: calc(100% - $height);
box-sizing: border-box;
display: flex;
align-items: center;
justify-content: space-between;
color: #fff;
font-size: 13pt;
a {
color: rgb(31, 94, 189)
}
}

View File

@@ -265,8 +265,12 @@ footer {
height: 7vh;
width: 100%;
padding-left: 2vw;
padding-right: 2vw;
top: calc(100% - 7vh);
box-sizing: border-box;
display: flex;
align-items: center;
justify-content: space-between;
color: #fff;
font-size: 13pt;
}

View File

@@ -1 +1 @@
{"version":3,"sourceRoot":"","sources":["playerSelection.scss","game.scss","footer.scss","styles.scss"],"names":[],"mappings":"AAAA;EAEI;EAEA;EACA;EAEA;EAEA;EACA;EACA;EAEA;;AAEA;EAEG;;AAGH;EAEI;EAEA;;AAEA;EAKI;;AAEA;EAEI;EACA;EACA;EAEA;;AAGJ;EAEI;;AAGJ;EAEI;EACA;EAEA;EACA;;AAGJ;EAEI;EAEA;EACA;EACA;EAEA;;AAGJ;EAEI;EACA;;AAIR;EAEI;EACA;;AAEA;EAEI;EAEA;EACA;EACA;EAEA;;AAEA;EAEI;EACA;;AAKZ;EAEI;EACA;;AAII;EAEI;EACA;;AAMhB;EAEI;EACA;EAEA;EAEA;EACA;EACA;EAEA;EAEA;EAEA;;AAGJ;EAEI;EAEA;;;AAIR;EAEI;EAEA;;;AAGJ;EAEI;EACA;EAEA;EACA;EAEA;EAEA;EACA;EACA;;AAEA;EAEI;EAEA;EAEA;EAEA;EACA;;;AAIR;EAEI;EACA;EAEA;EAEA;;;AAGJ;EAEI;;;ACzLJ;EAEI;EAEA;EACA;EAEA;EACA;;AAEA;EAEI;EACA;EAEA;EACA;EACA;EAEA;EAEA;EAEA;EAEA;EACA;EACA;EAEA;EACA;EACA;;AAEA;EAEI;;AAEA;EAEI;;;AAMhB;EAEI;EAEA;EAEA;EACA;EAEA;EAEA;EAEA;;AAEA;EAEI;EACA;;;AAQA;EAEI;EACA;;AAGJ;EAEI;;AAGJ;EAEI;EACA;;AAGJ;EAEI;;AAGJ;EAEI;;AAGJ;EAEI;EACA;;AAGJ;EAEI;;AAGJ;EAEI;EACA;;;AAKZ;EAEI;EAEA;EAEA;;;AAGJ;EAOI;EACA;;AAEA;EAEI;EACA;EAEA;;;AAIR;EAEI;EACA;EACA;EAEA;EACA;EACA;EAEA;EAEA;EAEA;;AAEA;EAEI;EACA;EACA;EACA;EAEA;EACA;EACA;EAEA;EAEA;EAEA;EACA;EAEA;EAEA;;AAEA;EAEI;EAEA;;AAIR;EAEI;;;AAKR;EAEI;IAEI;IACA;;EAEA;IAEI;IACA;;;EAIR;IAEI;IACA;;;EAGJ;IAEI;IACA;;;AC7NR;EAII;EAEA,QAJS;EAKT;EAEA;EAEA;EAEA;EAEA;EACA;;AAEA;EAEI;;;AChBR;EAEI;EAEA;EAEA;;;AAGJ;EAEI;EACA;EAEA;EAEA;EACA;EACA;;;AAGJ;EAEI;;;AAGJ;EACI","file":"styles.css"}
{"version":3,"sourceRoot":"","sources":["playerSelection.scss","game.scss","footer.scss","styles.scss"],"names":[],"mappings":"AAAA;EAEI;EAEA;EACA;EAEA;EAEA;EACA;EACA;EAEA;;AAEA;EAEG;;AAGH;EAEI;EAEA;;AAEA;EAKI;;AAEA;EAEI;EACA;EACA;EAEA;;AAGJ;EAEI;;AAGJ;EAEI;EACA;EAEA;EACA;;AAGJ;EAEI;EAEA;EACA;EACA;EAEA;;AAGJ;EAEI;EACA;;AAIR;EAEI;EACA;;AAEA;EAEI;EAEA;EACA;EACA;EAEA;;AAEA;EAEI;EACA;;AAKZ;EAEI;EACA;;AAII;EAEI;EACA;;AAMhB;EAEI;EACA;EAEA;EAEA;EACA;EACA;EAEA;EAEA;EAEA;;AAGJ;EAEI;EAEA;;;AAIR;EAEI;EAEA;;;AAGJ;EAEI;EACA;EAEA;EACA;EAEA;EAEA;EACA;EACA;;AAEA;EAEI;EAEA;EAEA;EAEA;EACA;;;AAIR;EAEI;EACA;EAEA;EAEA;;;AAGJ;EAEI;;;ACzLJ;EAEI;EAEA;EACA;EAEA;EACA;;AAEA;EAEI;EACA;EAEA;EACA;EACA;EAEA;EAEA;EAEA;EAEA;EACA;EACA;EAEA;EACA;EACA;;AAEA;EAEI;;AAEA;EAEI;;;AAMhB;EAEI;EAEA;EAEA;EACA;EAEA;EAEA;EAEA;;AAEA;EAEI;EACA;;;AAQA;EAEI;EACA;;AAGJ;EAEI;;AAGJ;EAEI;EACA;;AAGJ;EAEI;;AAGJ;EAEI;;AAGJ;EAEI;EACA;;AAGJ;EAEI;;AAGJ;EAEI;EACA;;;AAKZ;EAEI;EAEA;EAEA;;;AAGJ;EAOI;EACA;;AAEA;EAEI;EACA;EAEA;;;AAIR;EAEI;EACA;EACA;EAEA;EACA;EACA;EAEA;EAEA;EAEA;;AAEA;EAEI;EACA;EACA;EACA;EAEA;EACA;EACA;EAEA;EAEA;EAEA;EACA;EAEA;EAEA;;AAEA;EAEI;EAEA;;AAIR;EAEI;;;AAKR;EAEI;IAEI;IACA;;EAEA;IAEI;IACA;;;EAIR;IAEI;IACA;;;EAGJ;IAEI;IACA;;;AC7NR;EAII;EAEA,QAJS;EAKT;EAEA;EACA;EAEA;EAEA;EAEA;EACA;EACA;EAEA;EACA;;AAEA;EAEI;;;ACrBR;EAEI;EAEA;EAEA;;;AAGJ;EAEI;EACA;EAEA;EAEA;EACA;EACA;;;AAGJ;EAEI;;;AAGJ;EACI","file":"styles.css"}