fixed MTG with bulma - button bar
This commit is contained in:
parent
7c4ec67ab5
commit
7f0485ec04
126
MTG/index.html
Executable file → Normal file
126
MTG/index.html
Executable file → Normal file
@ -2,112 +2,44 @@
|
|||||||
<html lang="en">
|
<html lang="en">
|
||||||
<head>
|
<head>
|
||||||
<meta charset="UTF-8" />
|
<meta charset="UTF-8" />
|
||||||
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
<link
|
|
||||||
rel="apple-touch-icon"
|
|
||||||
sizes="180x180"
|
|
||||||
href="icons/apple-touch-icon.png"
|
|
||||||
/>
|
|
||||||
<link
|
|
||||||
rel="icon"
|
|
||||||
type="image/png"
|
|
||||||
sizes="32x32"
|
|
||||||
href="icons/favicon-32x32.png"
|
|
||||||
/>
|
|
||||||
<link
|
|
||||||
rel="icon"
|
|
||||||
type="image/png"
|
|
||||||
sizes="16x16"
|
|
||||||
href="icons/favicon-16x16.png"
|
|
||||||
/>
|
|
||||||
<link rel="manifest" href="site.webmanifest" />
|
|
||||||
<link rel="mask-icon" href="icons/safari-pinned-tab.svg" color="#5bbad5" />
|
|
||||||
<meta name="msapplication-TileColor" content="#4C633C" />
|
|
||||||
<meta name="theme-color" content="#4C633C" />
|
|
||||||
<title>MTG Life Counter</title>
|
<title>MTG Life Counter</title>
|
||||||
|
|
||||||
<script
|
|
||||||
defer
|
|
||||||
data-domain="mtg.chrisedwards.tech"
|
|
||||||
src="https://metric1.chrisedwards.tech/js/plausible.js"
|
|
||||||
></script>
|
|
||||||
|
|
||||||
<link rel="stylesheet" href="style.css" />
|
<link rel="stylesheet" href="style.css" />
|
||||||
<link rel="stylesheet" href="/menu/menu.css" />
|
<link rel="stylesheet" href="menu/menu.css" />
|
||||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bulma@0.9.4/css/bulma.min.css">
|
|
||||||
<link
|
<link
|
||||||
rel="stylesheet"
|
rel="stylesheet"
|
||||||
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css"
|
href="https://cdn.jsdelivr.net/npm/bulma@0.9.4/css/bulma.min.css"
|
||||||
/>
|
/>
|
||||||
<link rel="manifest" href="site.webmainfest" />
|
|
||||||
</head>
|
</head>
|
||||||
<!-- <body>
|
<body>
|
||||||
<iframe
|
<script defer src="script.js"></script>
|
||||||
src="/menu/test.html"
|
|
||||||
width="100%"
|
|
||||||
height="52px"
|
|
||||||
style="display: block; z-index: 1"
|
|
||||||
frameborder="0"
|
|
||||||
></iframe> -->
|
|
||||||
<!-- <script defer src="/menu/menu.js"></script> -->
|
|
||||||
<div id="navContainer"></div>
|
<div id="navContainer"></div>
|
||||||
<script>
|
<div class="buttons1" id="buttonWrapper">
|
||||||
if ("serviceWorker" in navigator) {
|
<!-- <i class="fa-solid fa-arrow-up-from-bracket"></i> -->
|
||||||
window.addEventListener("load", () => {
|
<span>
|
||||||
navigator.serviceWorker
|
<i
|
||||||
.register("sw.js")
|
id="remove"
|
||||||
.then((registration) => {
|
class="fa-solid fa-circle-minus"
|
||||||
console.log(
|
onclick="removePlayer()"
|
||||||
`service worker registered succesfully ${registration}`
|
></i>
|
||||||
);
|
</span>
|
||||||
})
|
<span>
|
||||||
.catch((err) => {
|
<i id="reset" class="fa-solid fa-rotate-left" onclick="reset()"></i>
|
||||||
console.log(`Error registring ${err}`);
|
</span>
|
||||||
});
|
|
||||||
});
|
|
||||||
} else {
|
|
||||||
console.log(`Service worker is not supported in this browser.`);
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
|
<!-- <span class="buttonText"></span> -->
|
||||||
|
<span onclick="addPlayer()"
|
||||||
|
><i id="add" class="fas fa-plus-circle"></i
|
||||||
|
></span>
|
||||||
|
|
||||||
|
<span class="dice">
|
||||||
<!-- <div id="buttonWrapper" class="is-justify-content-space-between">
|
|
||||||
<div class="buttons1">
|
|
||||||
<i class="fa-solid fa-arrow-up-from-bracket"></i>
|
|
||||||
</div>
|
|
||||||
<div onclick="removePlayer()" id="removePlayer" class="buttons1">
|
|
||||||
<i class="fas fa-minus-circle"></i>
|
|
||||||
</div>
|
|
||||||
<div onclick="reset()" id="reset" class="buttons1">
|
|
||||||
<i class="fas fa-undo-alt"></i><span class="buttonText"></span>
|
|
||||||
</div>
|
|
||||||
<div onclick="resetName()" id="reset" class="buttons">↻<span class="buttonText">reset name</span></div>
|
|
||||||
<div onclick="addPlayer()" id="addPlayer" class="buttons1">
|
|
||||||
<i class="fas fa-plus-circle"></i>
|
|
||||||
</div>
|
|
||||||
<div class="buttons1">
|
|
||||||
<i id="full" onclick="fullscreen()" class="fas fa-expand"></i>
|
|
||||||
</div>
|
|
||||||
<div class="buttons"><i id="roll" onclick="random()" class="fa-solid fa-dice-d20"></i></div>
|
|
||||||
<div class="container" id="centerDiv" onclick="random()">
|
|
||||||
<img id="d20" src="img/dice.webp" />
|
<img id="d20" src="img/dice.webp" />
|
||||||
<div class="centered" id="center">1</div>
|
<div id="d20-face">1</div>
|
||||||
</div>
|
</span>
|
||||||
</div> -->
|
</div>
|
||||||
<div class="buttons1" id="buttonWrapper">
|
|
||||||
<i class="buttons1" class="fa-solid fa-arrow-up-from-bracket"></i>
|
|
||||||
<i class="buttons1" class="fas fa-minus-circle"></i>
|
|
||||||
<i class="buttons1" class="fas fa-undo-alt"></i><span class="buttonText"></span>
|
|
||||||
<i class="buttons1" class="fas fa-plus-circle"></i>
|
|
||||||
<img class="buttons1" id="d20" src="img/dice.webp" />
|
|
||||||
<div class="centered" id="center">1</div>
|
|
||||||
|
|
||||||
|
|
||||||
</div>
|
|
||||||
<main>
|
<main>
|
||||||
|
|
||||||
<div id="player1" class="player">
|
<div id="player1" class="player">
|
||||||
<div class="name" id="name1" contenteditable="true">Player 1</div>
|
<div class="name" id="name1" contenteditable="true">Player 1</div>
|
||||||
<div class="life">
|
<div class="life">
|
||||||
@ -287,7 +219,11 @@
|
|||||||
</div>
|
</div>
|
||||||
</main>
|
</main>
|
||||||
|
|
||||||
<script src="//cdn.jsdelivr.net/npm/sweetalert2@11"></script>
|
<script defer src="menu/menu.js"></script>
|
||||||
<script src="https://chrisedwards.tech/MTG/script.js"></script>
|
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
|
||||||
|
<script
|
||||||
|
src="https://kit.fontawesome.com/17513d4ff3.js"
|
||||||
|
crossorigin="anonymous"
|
||||||
|
></script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|||||||
293
MTG/index.html.bk
Executable file
293
MTG/index.html.bk
Executable file
@ -0,0 +1,293 @@
|
|||||||
|
<!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" />
|
||||||
|
<link
|
||||||
|
rel="apple-touch-icon"
|
||||||
|
sizes="180x180"
|
||||||
|
href="icons/apple-touch-icon.png"
|
||||||
|
/>
|
||||||
|
<link
|
||||||
|
rel="icon"
|
||||||
|
type="image/png"
|
||||||
|
sizes="32x32"
|
||||||
|
href="icons/favicon-32x32.png"
|
||||||
|
/>
|
||||||
|
<link
|
||||||
|
rel="icon"
|
||||||
|
type="image/png"
|
||||||
|
sizes="16x16"
|
||||||
|
href="icons/favicon-16x16.png"
|
||||||
|
/>
|
||||||
|
<link rel="manifest" href="site.webmanifest" />
|
||||||
|
<link rel="mask-icon" href="icons/safari-pinned-tab.svg" color="#5bbad5" />
|
||||||
|
<meta name="msapplication-TileColor" content="#4C633C" />
|
||||||
|
<meta name="theme-color" content="#4C633C" />
|
||||||
|
<title>MTG Life Counter</title>
|
||||||
|
|
||||||
|
<script
|
||||||
|
defer
|
||||||
|
data-domain="mtg.chrisedwards.tech"
|
||||||
|
src="https://metric1.chrisedwards.tech/js/plausible.js"
|
||||||
|
></script>
|
||||||
|
|
||||||
|
<link rel="stylesheet" href="style.css" />
|
||||||
|
<link rel="stylesheet" href="/menu/menu.css" />
|
||||||
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bulma@0.9.4/css/bulma.min.css">
|
||||||
|
<link
|
||||||
|
rel="stylesheet"
|
||||||
|
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css"
|
||||||
|
/>
|
||||||
|
<link rel="manifest" href="site.webmainfest" />
|
||||||
|
</head>
|
||||||
|
<!-- <body>
|
||||||
|
<iframe
|
||||||
|
src="/menu/test.html"
|
||||||
|
width="100%"
|
||||||
|
height="52px"
|
||||||
|
style="display: block; z-index: 1"
|
||||||
|
frameborder="0"
|
||||||
|
></iframe> -->
|
||||||
|
<!-- <script defer src="/menu/menu.js"></script> -->
|
||||||
|
<div id="navContainer"></div>
|
||||||
|
<script>
|
||||||
|
if ("serviceWorker" in navigator) {
|
||||||
|
window.addEventListener("load", () => {
|
||||||
|
navigator.serviceWorker
|
||||||
|
.register("sw.js")
|
||||||
|
.then((registration) => {
|
||||||
|
console.log(
|
||||||
|
`service worker registered succesfully ${registration}`
|
||||||
|
);
|
||||||
|
})
|
||||||
|
.catch((err) => {
|
||||||
|
console.log(`Error registring ${err}`);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
console.log(`Service worker is not supported in this browser.`);
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- <div id="buttonWrapper" class="is-justify-content-space-between">
|
||||||
|
<div class="buttons1">
|
||||||
|
<i class="fa-solid fa-arrow-up-from-bracket"></i>
|
||||||
|
</div>
|
||||||
|
<div onclick="removePlayer()" id="removePlayer" class="buttons1">
|
||||||
|
<i class="fas fa-minus-circle"></i>
|
||||||
|
</div>
|
||||||
|
<div onclick="reset()" id="reset" class="buttons1">
|
||||||
|
<i class="fas fa-undo-alt"></i><span class="buttonText"></span>
|
||||||
|
</div>
|
||||||
|
<div onclick="resetName()" id="reset" class="buttons">↻<span class="buttonText">reset name</span></div>
|
||||||
|
<div onclick="addPlayer()" id="addPlayer" class="buttons1">
|
||||||
|
<i class="fas fa-plus-circle"></i>
|
||||||
|
</div>
|
||||||
|
<div class="buttons1">
|
||||||
|
<i id="full" onclick="fullscreen()" class="fas fa-expand"></i>
|
||||||
|
</div>
|
||||||
|
<div class="buttons"><i id="roll" onclick="random()" class="fa-solid fa-dice-d20"></i></div>
|
||||||
|
<div class="container" id="centerDiv" onclick="random()">
|
||||||
|
<img id="d20" src="img/dice.webp" />
|
||||||
|
<div class="centered" id="center">1</div>
|
||||||
|
</div>
|
||||||
|
</div> -->
|
||||||
|
<div class="buttons1" id="buttonWrapper">
|
||||||
|
<i class="buttons1" class="fa-solid fa-arrow-up-from-bracket"></i>
|
||||||
|
<i class="buttons1" class="fas fa-minus-circle"></i>
|
||||||
|
<i class="buttons1" class="fas fa-undo-alt"></i><span class="buttonText"></span>
|
||||||
|
<i class="buttons1" class="fas fa-plus-circle"></i>
|
||||||
|
<img class="buttons1" id="d20" src="img/dice.webp" />
|
||||||
|
<div class="centered" id="center">1</div>
|
||||||
|
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<main>
|
||||||
|
|
||||||
|
<div id="player1" class="player">
|
||||||
|
<div class="name" id="name1" contenteditable="true">Player 1</div>
|
||||||
|
<div class="life">
|
||||||
|
<span class="vert">
|
||||||
|
<div onclick="lifeIncrease5(1)" class="lifeUp" class="fiveLife">
|
||||||
|
<i class="fas fa-arrow-circle-up"></i>
|
||||||
|
</div>
|
||||||
|
<div onclick="lifeIncrease(1)" class="lifeUp">
|
||||||
|
<i class="fas fa-chevron-circle-up"></i>
|
||||||
|
</div>
|
||||||
|
</span>
|
||||||
|
<div id="lifeCount1">20</div>
|
||||||
|
<span class="vert">
|
||||||
|
<div onclick="lifeDecrease5(1)" class="lifeDown" class="fiveLife">
|
||||||
|
<i class="fas fa-arrow-circle-down"></i>
|
||||||
|
</div>
|
||||||
|
<div onclick="lifeDecrease(1)" class="lifeDown">
|
||||||
|
<i class="fas fa-chevron-circle-down"></i>
|
||||||
|
</div>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="player2" class="player">
|
||||||
|
<div class="name" id="name2" contenteditable="true">Player 2</div>
|
||||||
|
<div class="life">
|
||||||
|
<span class="vert">
|
||||||
|
<div onclick="lifeIncrease5(2)" class="lifeUp" class="fiveLife">
|
||||||
|
<i class="fas fa-arrow-circle-up"></i>
|
||||||
|
</div>
|
||||||
|
<div onclick="lifeIncrease(2)" class="lifeUp">
|
||||||
|
<i class="fas fa-chevron-circle-up"></i>
|
||||||
|
</div>
|
||||||
|
</span>
|
||||||
|
<div id="lifeCount2">20</div>
|
||||||
|
<span class="vert">
|
||||||
|
<div onclick="lifeDecrease5(2)" class="lifeDown" class="fiveLife">
|
||||||
|
<i class="fas fa-arrow-circle-down"></i>
|
||||||
|
</div>
|
||||||
|
<div onclick="lifeDecrease(2)" class="lifeDown">
|
||||||
|
<i class="fas fa-chevron-circle-down"></i>
|
||||||
|
</div>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div id="player3" class="player">
|
||||||
|
<div class="name" id="name3" contenteditable="true">Player 3</div>
|
||||||
|
<div class="life">
|
||||||
|
<span class="vert">
|
||||||
|
<div onclick="lifeIncrease5(3)" class="lifeUp" class="fiveLife">
|
||||||
|
<i class="fas fa-arrow-circle-up"></i>
|
||||||
|
</div>
|
||||||
|
<div onclick="lifeIncrease(3)" class="lifeUp">
|
||||||
|
<i class="fas fa-chevron-circle-up"></i>
|
||||||
|
</div>
|
||||||
|
</span>
|
||||||
|
<div id="lifeCount3">20</div>
|
||||||
|
<span class="vert">
|
||||||
|
<div onclick="lifeDecrease5(3)" class="lifeDown" class="fiveLife">
|
||||||
|
<i class="fas fa-arrow-circle-down"></i>
|
||||||
|
</div>
|
||||||
|
<div onclick="lifeDecrease(3)" class="lifeDown">
|
||||||
|
<i class="fas fa-chevron-circle-down"></i>
|
||||||
|
</div>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div id="player4" class="player">
|
||||||
|
<div class="name" id="name4" contenteditable="true">Player 4</div>
|
||||||
|
<div class="life">
|
||||||
|
<span class="vert">
|
||||||
|
<div onclick="lifeIncrease5(4)" class="lifeUp" class="fiveLife">
|
||||||
|
<i class="fas fa-arrow-circle-up"></i>
|
||||||
|
</div>
|
||||||
|
<div onclick="lifeIncrease(4)" class="lifeUp">
|
||||||
|
<i class="fas fa-chevron-circle-up"></i>
|
||||||
|
</div>
|
||||||
|
</span>
|
||||||
|
<div id="lifeCount4">20</div>
|
||||||
|
<span class="vert">
|
||||||
|
<div onclick="lifeDecrease5(4)" class="lifeDown" class="fiveLife">
|
||||||
|
<i class="fas fa-arrow-circle-down"></i>
|
||||||
|
</div>
|
||||||
|
<div onclick="lifeDecrease(4)" class="lifeDown">
|
||||||
|
<i class="fas fa-chevron-circle-down"></i>
|
||||||
|
</div>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div id="player5" class="player">
|
||||||
|
<div class="name" id="name5" contenteditable="true">Player 5</div>
|
||||||
|
<div class="life">
|
||||||
|
<span class="vert">
|
||||||
|
<div onclick="lifeIncrease5(5)" class="lifeUp" class="fiveLife">
|
||||||
|
<i class="fas fa-arrow-circle-up"></i>
|
||||||
|
</div>
|
||||||
|
<div onclick="lifeIncrease(5)" class="lifeUp">
|
||||||
|
<i class="fas fa-chevron-circle-up"></i>
|
||||||
|
</div>
|
||||||
|
</span>
|
||||||
|
<div id="lifeCount5">20</div>
|
||||||
|
<span class="vert">
|
||||||
|
<div onclick="lifeDecrease5(5)" class="lifeDown" class="fiveLife">
|
||||||
|
<i class="fas fa-arrow-circle-down"></i>
|
||||||
|
</div>
|
||||||
|
<div onclick="lifeDecrease(5)" class="lifeDown">
|
||||||
|
<i class="fas fa-chevron-circle-down"></i>
|
||||||
|
</div>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div id="player6" class="player">
|
||||||
|
<div class="name" id="name6" contenteditable="true">Player 6</div>
|
||||||
|
<div class="life">
|
||||||
|
<span class="vert">
|
||||||
|
<div onclick="lifeIncrease5(6)" class="lifeUp" class="fiveLife">
|
||||||
|
<i class="fas fa-arrow-circle-up"></i>
|
||||||
|
</div>
|
||||||
|
<div onclick="lifeIncrease(6)" class="lifeUp">
|
||||||
|
<i class="fas fa-chevron-circle-up"></i>
|
||||||
|
</div>
|
||||||
|
</span>
|
||||||
|
<div id="lifeCount6">20</div>
|
||||||
|
<span class="vert">
|
||||||
|
<div onclick="lifeDecrease5(6)" class="lifeDown" class="fiveLife">
|
||||||
|
<i class="fas fa-arrow-circle-down"></i>
|
||||||
|
</div>
|
||||||
|
<div onclick="lifeDecrease(6)" class="lifeDown">
|
||||||
|
<i class="fas fa-chevron-circle-down"></i>
|
||||||
|
</div>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div id="player7" class="player">
|
||||||
|
<div class="name" id="name7" contenteditable="true">Player 7</div>
|
||||||
|
<div class="life">
|
||||||
|
<span class="vert">
|
||||||
|
<div onclick="lifeIncrease5(7)" class="lifeUp" class="fiveLife">
|
||||||
|
<i class="fas fa-arrow-circle-up"></i>
|
||||||
|
</div>
|
||||||
|
<div onclick="lifeIncrease(7)" class="lifeUp">
|
||||||
|
<i class="fas fa-chevron-circle-up"></i>
|
||||||
|
</div>
|
||||||
|
</span>
|
||||||
|
<div id="lifeCount7">20</div>
|
||||||
|
<span class="vert">
|
||||||
|
<div onclick="lifeDecrease5(7)" class="lifeDown" class="fiveLife">
|
||||||
|
<i class="fas fa-arrow-circle-down"></i>
|
||||||
|
</div>
|
||||||
|
<div onclick="lifeDecrease(7)" class="lifeDown">
|
||||||
|
<i class="fas fa-chevron-circle-down"></i>
|
||||||
|
</div>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div id="player8" class="player">
|
||||||
|
<div class="name" id="name8" contenteditable="true">Player 8</div>
|
||||||
|
<div class="life">
|
||||||
|
<span class="vert">
|
||||||
|
<div onclick="lifeIncrease5(8)" class="lifeUp" class="fiveLife">
|
||||||
|
<i class="fas fa-arrow-circle-up"></i>
|
||||||
|
</div>
|
||||||
|
<div onclick="lifeIncrease(8)" class="lifeUp">
|
||||||
|
<i class="fas fa-chevron-circle-up"></i>
|
||||||
|
</div>
|
||||||
|
</span>
|
||||||
|
<div id="lifeCount8">20</div>
|
||||||
|
<span class="vert">
|
||||||
|
<div onclick="lifeDecrease5(8)" class="lifeDown" class="fiveLife">
|
||||||
|
<i class="fas fa-arrow-circle-down"></i>
|
||||||
|
</div>
|
||||||
|
<div onclick="lifeDecrease(8)" class="lifeDown">
|
||||||
|
<i class="fas fa-chevron-circle-down"></i>
|
||||||
|
</div>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</main>
|
||||||
|
|
||||||
|
<script src="//cdn.jsdelivr.net/npm/sweetalert2@11"></script>
|
||||||
|
<script src="https://chrisedwards.tech/MTG/script.js"></script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
BIN
MTG/menu/3bar.png
Executable file
BIN
MTG/menu/3bar.png
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 32 KiB |
BIN
MTG/menu/cetechwhite.png
Executable file
BIN
MTG/menu/cetechwhite.png
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 19 KiB |
30
MTG/menu/menu.css
Executable file
30
MTG/menu/menu.css
Executable file
@ -0,0 +1,30 @@
|
|||||||
|
*,
|
||||||
|
*:after,
|
||||||
|
*:before {
|
||||||
|
-webkit-box-sizing: border-box;
|
||||||
|
-moz-box-sizing: border-box;
|
||||||
|
box-sizing: border-box;
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
html {
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.navbar-menu,
|
||||||
|
.navbar-dropdown {
|
||||||
|
background-color: rgb(24, 24, 24) !important;
|
||||||
|
z-index: 100 !important;
|
||||||
|
/* position: absolute !important; */
|
||||||
|
}
|
||||||
|
.navbar-item {
|
||||||
|
color: white !important;
|
||||||
|
}
|
||||||
|
.navbar-item:hover {
|
||||||
|
color: #363636 !important;
|
||||||
|
background-color: white !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
#navContainer {
|
||||||
|
padding-bottom: 5.5rem !important;
|
||||||
|
}
|
||||||
@ -1 +0,0 @@
|
|||||||
ht
|
|
||||||
61
MTG/menu/menu.js
Executable file
61
MTG/menu/menu.js
Executable file
@ -0,0 +1,61 @@
|
|||||||
|
let navString = "";
|
||||||
|
let baseLinks = [
|
||||||
|
'<a class="navbar-item is-dark" href="/index.html"> Home </a>',
|
||||||
|
'<a class="navbar-item" href="/resume/"> Resume </a>',
|
||||||
|
];
|
||||||
|
let gameLinks = [
|
||||||
|
'<a class="navbar-item" href="/yatzee/"> Yatzee </a>',
|
||||||
|
'<a class="navbar-item" href="/tictac/"> Tic Tac Toe </a>',
|
||||||
|
// '<a class="navbar-item" href="/bingo/"> Bingo </a>',
|
||||||
|
'<a class="navbar-item" href="/memory/"> Memory </a>',
|
||||||
|
'<a class="navbar-item" href="https://mtg.chrisedwards.tech"> MTG Life Counter </a>',
|
||||||
|
];
|
||||||
|
let utilLinks = [
|
||||||
|
'<a class="navbar-item" href="/speak"> Speak </a>',
|
||||||
|
'<a class="navbar-item" href="/binary/"> Binary to ASCII </a>',
|
||||||
|
'<a class="navbar-item" href="https://ytdownload.chrisedwards.tech"> YouTube Converter </a>',
|
||||||
|
'<a class="navbar-item" href="/nato/"> NATO Alpha </a> ',
|
||||||
|
'<a class="navbar-item" href="/rollDice/"> Roll Dice </a> ',
|
||||||
|
];
|
||||||
|
|
||||||
|
navString =
|
||||||
|
'<nav class="navbar is-dark is-fixed-top" role="navigation" aria-label="main navigation"> <div class="navbar-brand"> <a class="navbar-item" href="/index.html"> <img src="menu/cetechwhite.png" width="50" height="50"> </a> <a role="button" class="navbar-burger is-dark" aria-label="menu" aria-expanded="false" data-target="navbarBasicExample"> <span aria-hidden="true"></span> <span aria-hidden="true"></span> <span aria-hidden="true"></span> </a> </div> <div id="navbarBasicExample" class="navbar-menu is-dark"> <div class="navbar-start is-dark"> ';
|
||||||
|
for (i = 0; i < baseLinks.length; i++) {
|
||||||
|
navString += baseLinks[i];
|
||||||
|
}
|
||||||
|
navString +=
|
||||||
|
'<div class="navbar-item has-dropdown is-hoverable"> <a class="navbar-link"> Games </a> <div class="navbar-dropdown"> ';
|
||||||
|
for (i = 0; i < gameLinks.length; i++) {
|
||||||
|
navString += gameLinks[i];
|
||||||
|
}
|
||||||
|
navString +=
|
||||||
|
' </div> </div> <div class="navbar-item has-dropdown is-hoverable is-dark"> <a class="navbar-link"> Ultilities </a> <div class="navbar-dropdown"> ';
|
||||||
|
for (i = 0; i < utilLinks.length; i++) {
|
||||||
|
navString += utilLinks[i];
|
||||||
|
}
|
||||||
|
navString += " </div> </div> </div> </div> </nav>";
|
||||||
|
|
||||||
|
document.getElementById("navContainer").innerHTML = navString;
|
||||||
|
// document.getElementsByTagName('html').classList.add('has-navbar-fixed-top');
|
||||||
|
document.addEventListener("DOMContentLoaded", () => {
|
||||||
|
// Get all "navbar-burger" elements
|
||||||
|
const $navbarBurgers = Array.prototype.slice.call(
|
||||||
|
document.querySelectorAll(".navbar-burger"),
|
||||||
|
0
|
||||||
|
);
|
||||||
|
|
||||||
|
// Add a click event on each of them
|
||||||
|
$navbarBurgers.forEach((el) => {
|
||||||
|
el.addEventListener("click", () => {
|
||||||
|
// Get the target from the "data-target" attribute
|
||||||
|
const target = el.dataset.target;
|
||||||
|
const $target = document.getElementById(target);
|
||||||
|
|
||||||
|
// Toggle the "is-active" class on both the "navbar-burger" and the "navbar-menu"
|
||||||
|
el.classList.toggle("is-active");
|
||||||
|
$target.classList.toggle("is-active");
|
||||||
|
});
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
// addHtmlClass();
|
||||||
52
MTG/menu/menu.js.bak
Executable file
52
MTG/menu/menu.js.bak
Executable file
@ -0,0 +1,52 @@
|
|||||||
|
function slideout() {
|
||||||
|
if (document.getElementById("ham").className == "ham-menu") {
|
||||||
|
document.getElementById("ham").className = "ham-menu2";
|
||||||
|
document.getElementById("ham").focus();
|
||||||
|
document.getElementById("menu").onclick = null; // console.log("show");
|
||||||
|
} else if (document.getElementById("ham").className == "ham-menu2") {
|
||||||
|
document.getElementById("ham").className = "ham-menu";
|
||||||
|
document.getElementById("menu").onclick = function() {
|
||||||
|
slideout()
|
||||||
|
}; // console.log("hide");
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
function closemenu1() {
|
||||||
|
setTimeout(function() {
|
||||||
|
document.getElementById("ham").className = "ham-menu";
|
||||||
|
document.getElementById("menu").onclick = function() {
|
||||||
|
slideout()
|
||||||
|
}
|
||||||
|
}, 250); //console.log("off click");
|
||||||
|
}
|
||||||
|
var sites = [
|
||||||
|
["/", "Home"],
|
||||||
|
["/resume/", "Resume"],
|
||||||
|
["/tictac/", "Tic Tac Touch"],
|
||||||
|
["/bingo/", "Bingo!"],
|
||||||
|
["/memory/", "Memory"],
|
||||||
|
["/yatzee/", "Yatzee!"],
|
||||||
|
["/MTG/", "MTG"],
|
||||||
|
["/youtube_convert/", "Youtube Converter"],
|
||||||
|
["/binary/", "Binary Converter"],
|
||||||
|
["/speak/", "Speak"],
|
||||||
|
["/nato/", "NATO Phonetic Alphabet"],
|
||||||
|
["/rollDice", "Dice"],
|
||||||
|
["/be_mine/", "Be Mine!"],
|
||||||
|
["/media/Movies", "Movies"],
|
||||||
|
["/media/Tv%20Shows", "Tv Shows"]
|
||||||
|
];
|
||||||
|
var foobar = "";
|
||||||
|
for (i = 0; i < sites.length; i++) {
|
||||||
|
// console.log(i)
|
||||||
|
foobar += '<ul> <li><a href="' + sites[i][0] + '">' + sites[i][1] + '</a></li> <br />';
|
||||||
|
// console.log(foobar)
|
||||||
|
foobar += "</ul>"
|
||||||
|
}
|
||||||
|
|
||||||
|
//document.getElementById("ham").addEventListener('onmouseleave', function() {slideout(), alert('test')});
|
||||||
|
var foo = '<div id="menu" onclick="slideout()" ><img id="bars" src="/menu/3bar.png" /></div><div id="ham" class="ham-menu" ><img id="bars" src="/menu/x.png" onclick="slideout()"/><div id="site"></div> </div>'
|
||||||
|
|
||||||
|
document.getElementById("nav_menu").innerHTML = foo;
|
||||||
|
document.getElementById("site").innerHTML = foobar;
|
||||||
18
MTG/menu/test.html
Executable file
18
MTG/menu/test.html
Executable file
@ -0,0 +1,18 @@
|
|||||||
|
<!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>Document</title>
|
||||||
|
<link
|
||||||
|
rel="stylesheet"
|
||||||
|
href="https://cdn.jsdelivr.net/npm/bulma@0.9.4/css/bulma.min.css"
|
||||||
|
/>
|
||||||
|
<link rel="stylesheet" type="text/css" href="/menu/menu.css" />
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div id="navContainer"></div>
|
||||||
|
<script defer src="/menu/menu.js"></script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
BIN
MTG/menu/x.png
Executable file
BIN
MTG/menu/x.png
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 3.9 KiB |
243
MTG/script.js
243
MTG/script.js
@ -1,164 +1,173 @@
|
|||||||
window.onunload = function(){
|
window.onunload = function () {
|
||||||
localStorage.setItem('playerCount', playerCount);
|
localStorage.setItem("playerCount", playerCount);
|
||||||
for (i=1; i<9; i++){
|
for (i = 1; i < 9; i++) {
|
||||||
localStorage.setItem('playerName'+i, document.getElementById('name'+i).innerHTML);
|
localStorage.setItem(
|
||||||
localStorage.setItem('lifeCount'+i, document.getElementById('lifeCount'+i).innerHTML)
|
"playerName" + i,
|
||||||
}
|
document.getElementById("name" + i).innerHTML
|
||||||
|
);
|
||||||
|
localStorage.setItem(
|
||||||
|
"lifeCount" + i,
|
||||||
|
document.getElementById("lifeCount" + i).innerHTML
|
||||||
|
);
|
||||||
|
}
|
||||||
};
|
};
|
||||||
window.onload = function(){
|
window.onload = function () {
|
||||||
localStorage.getItem('playerCount');
|
localStorage.getItem("playerCount");
|
||||||
for (i=1; i<9; i++){
|
for (i = 1; i < 9; i++) {
|
||||||
if (localStorage.getItem('playerName'+i)){
|
if (localStorage.getItem("playerName" + i)) {
|
||||||
document.getElementById('name'+i).innerHTML = localStorage.getItem('playerName'+i);
|
document.getElementById("name" + i).innerHTML = localStorage.getItem(
|
||||||
console.log(document.getElementById('name'+i).innerHTML)
|
"playerName" + i
|
||||||
}
|
);
|
||||||
|
console.log(document.getElementById("name" + i).innerHTML);
|
||||||
if (localStorage.getItem('lifeCount'+i)){
|
|
||||||
|
|
||||||
document.getElementById('lifeCount'+i).innerHTML = localStorage.getItem('lifeCount'+i)
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
if (localStorage.getItem("lifeCount" + i)) {
|
||||||
|
document.getElementById("lifeCount" + i).innerHTML = localStorage.getItem(
|
||||||
|
"lifeCount" + i
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
function isInstalled() {
|
function isInstalled() {
|
||||||
// For iOS
|
// For iOS
|
||||||
if(window.navigator.standalone) return true
|
if (window.navigator.standalone) return true;
|
||||||
document.getElementById("nav").style.display = "none"
|
document.getElementById("nav").style.display = "none";
|
||||||
|
|
||||||
// For Android
|
// For Android
|
||||||
if(window.matchMedia('(display-mode: standalone)').matches) return true
|
if (window.matchMedia("(display-mode: standalone)").matches) return true;
|
||||||
document.getElementById("nav").style.display = "none"
|
document.getElementById("nav").style.display = "none";
|
||||||
// If neither is true, it's not installed
|
// If neither is true, it's not installed
|
||||||
return false
|
return false;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// document.getElementById("add").addEventListener("click", addPlayer);
|
||||||
|
// document.getElementById("remove").addEventListener("click", removePlayer);
|
||||||
|
// document.getElementById("reset").addEventListener("click", reset);
|
||||||
|
|
||||||
const startLife = 20;
|
const startLife = 20;
|
||||||
let playerCount;
|
let playerCount;
|
||||||
if (!localStorage.getItem('playerCount')) {playerCount = 1; localStorage.setItem('playerCount', playerCount);}
|
if (!localStorage.getItem("playerCount")) {
|
||||||
playerCount = localStorage.getItem('playerCount');
|
playerCount = 1;
|
||||||
let playerCount1 = Number(playerCount)+1;
|
localStorage.setItem("playerCount", playerCount);
|
||||||
for (i=playerCount1; i<9; i++){document.getElementById("player"+i).style.display = "none" }
|
}
|
||||||
|
playerCount = localStorage.getItem("playerCount");
|
||||||
|
let playerCount1 = Number(playerCount) + 1;
|
||||||
|
for (i = playerCount1; i < 9; i++) {
|
||||||
|
document.getElementById("player" + i).style.display = "none";
|
||||||
|
}
|
||||||
|
|
||||||
|
let lifeIncrease = (playerNum) => {
|
||||||
|
let counter = Number(
|
||||||
|
this.document.getElementById("lifeCount" + playerNum).innerHTML
|
||||||
|
);
|
||||||
|
counter++;
|
||||||
|
if (counter >= 0)
|
||||||
|
document.getElementById("lifeCount" + playerNum).style.color = "black";
|
||||||
|
document.getElementById("lifeCount" + playerNum).innerHTML = counter;
|
||||||
|
};
|
||||||
|
|
||||||
|
let lifeDecrease = (playerNum) => {
|
||||||
let lifeIncrease = (playerNum) => {
|
let counter = Number(
|
||||||
let counter = Number(this.document.getElementById("lifeCount"+playerNum).innerHTML);
|
document.getElementById("lifeCount" + playerNum).innerHTML
|
||||||
counter++;
|
);
|
||||||
if (counter >= 0) document.getElementById("lifeCount"+playerNum).style.color = "black";
|
counter--;
|
||||||
document.getElementById("lifeCount"+playerNum).innerHTML = counter;
|
if (counter <= 0)
|
||||||
};
|
document.getElementById("lifeCount" + playerNum).style.color = "red";
|
||||||
|
document.getElementById("lifeCount" + playerNum).innerHTML = counter;
|
||||||
|
};
|
||||||
|
|
||||||
let lifeDecrease = (playerNum) => {
|
let lifeIncrease5 = (playerNum) => {
|
||||||
let counter = Number(document.getElementById("lifeCount"+playerNum).innerHTML);
|
for (i = 0; i < 5; i++) lifeIncrease(playerNum);
|
||||||
counter--;
|
};
|
||||||
if (counter <= 0) document.getElementById("lifeCount"+playerNum).style.color = "red";
|
|
||||||
document.getElementById("lifeCount"+playerNum).innerHTML = counter;
|
|
||||||
};
|
|
||||||
|
|
||||||
let lifeIncrease5 = (playerNum) => {
|
let lifeDecrease5 = (playerNum) => {
|
||||||
for (i=0; i<5; i++) lifeIncrease(playerNum);
|
for (i = 0; i < 5; i++) lifeDecrease(playerNum);
|
||||||
};
|
};
|
||||||
|
|
||||||
let lifeDecrease5 = (playerNum) => {
|
|
||||||
for (i=0; i<5; i++) lifeDecrease(playerNum);
|
|
||||||
};
|
|
||||||
|
|
||||||
let reset = () => {
|
let reset = () => {
|
||||||
Swal.fire({
|
Swal.fire({
|
||||||
title: 'What would you like to reset?',
|
title: "What would you like to reset?",
|
||||||
showDenyButton: true,
|
showDenyButton: true,
|
||||||
showCancelButton: true,
|
showCancelButton: true,
|
||||||
confirmButtonText: 'Life',
|
confirmButtonText: "Life",
|
||||||
denyButtonText: `Names`,
|
denyButtonText: `Names`,
|
||||||
}).then((result) => {
|
}).then((result) => {
|
||||||
/* Read more about isConfirmed, isDenied below */
|
/* Read more about isConfirmed, isDenied below */
|
||||||
if (result.isConfirmed) {
|
if (result.isConfirmed) {
|
||||||
Swal.fire('Life reset', '', 'success');
|
Swal.fire("Life reset", "", "success");
|
||||||
resetLife();
|
resetLife();
|
||||||
} else if (result.isDenied) {
|
} else if (result.isDenied) {
|
||||||
Swal.fire('All player names reset', '', 'success');
|
Swal.fire("All player names reset", "", "success");
|
||||||
resetName();
|
resetName();
|
||||||
}
|
}
|
||||||
})
|
});
|
||||||
|
};
|
||||||
}
|
|
||||||
let resetLife = () => {
|
let resetLife = () => {
|
||||||
for (i=1; i<9; i++){
|
for (i = 1; i < 9; i++) {
|
||||||
document.getElementById("lifeCount"+i).innerHTML = 20
|
document.getElementById("lifeCount" + i).innerHTML = 20;
|
||||||
}
|
}
|
||||||
|
};
|
||||||
}
|
|
||||||
|
|
||||||
let resetName = () => {
|
let resetName = () => {
|
||||||
for (i=1; i<9; i++){
|
for (i = 1; i < 9; i++) {
|
||||||
document.getElementById("name"+i).innerHTML = "Player " +i
|
document.getElementById("name" + i).innerHTML = "Player " + i;
|
||||||
}
|
}
|
||||||
|
};
|
||||||
}
|
|
||||||
|
|
||||||
let addPlayer = () => {
|
let addPlayer = () => {
|
||||||
if (playerCount != 8){
|
if (playerCount != 8) {
|
||||||
playerCount++;
|
playerCount++;
|
||||||
document.getElementById("player"+playerCount).style.display = "";
|
document.getElementById("player" + playerCount).style.display = "";
|
||||||
localStorage.setItem('playerCount', playerCount);
|
localStorage.setItem("playerCount", playerCount);
|
||||||
}
|
}
|
||||||
|
};
|
||||||
}
|
|
||||||
|
|
||||||
let removePlayer = () => {
|
let removePlayer = () => {
|
||||||
if (playerCount != 1){
|
if (playerCount != 1) {
|
||||||
document.getElementById("player"+playerCount).style.display = "none";
|
document.getElementById("player" + playerCount).style.display = "none";
|
||||||
playerCount--;
|
playerCount--;
|
||||||
localStorage.setItem('playerCount', playerCount);
|
localStorage.setItem("playerCount", playerCount);
|
||||||
}
|
}
|
||||||
|
};
|
||||||
}
|
|
||||||
|
|
||||||
function fullscreen() {
|
function fullscreen() {
|
||||||
var elem = document.documentElement;
|
var elem = document.documentElement;
|
||||||
|
|
||||||
if (elem.requestFullscreen) {
|
if (elem.requestFullscreen) {
|
||||||
elem.requestFullscreen();
|
elem.requestFullscreen();
|
||||||
} else if (elem.mozRequestFullScreen) {
|
} else if (elem.mozRequestFullScreen) {
|
||||||
/* Firefox */
|
/* Firefox */
|
||||||
elem.mozRequestFullScreen();
|
elem.mozRequestFullScreen();
|
||||||
} else if (elem.webkitRequestFullscreen) {
|
} else if (elem.webkitRequestFullscreen) {
|
||||||
/* Chrome, Safari and Opera */
|
/* Chrome, Safari and Opera */
|
||||||
elem.webkitRequestFullscreen();
|
elem.webkitRequestFullscreen();
|
||||||
} else if (elem.msRequestFullscreen) {
|
} else if (elem.msRequestFullscreen) {
|
||||||
/* IE/Edge */
|
/* IE/Edge */
|
||||||
elem.msRequestFullscreen();
|
elem.msRequestFullscreen();
|
||||||
}
|
}
|
||||||
|
|
||||||
if (document.exitFullscreen) {
|
if (document.exitFullscreen) {
|
||||||
document.exitFullscreen();
|
document.exitFullscreen();
|
||||||
} else if (document.mozCancelFullScreen) {
|
} else if (document.mozCancelFullScreen) {
|
||||||
/* Firefox */
|
/* Firefox */
|
||||||
document.mozCancelFullScreen();
|
document.mozCancelFullScreen();
|
||||||
} else if (document.webkitExitFullscreen) {
|
} else if (document.webkitExitFullscreen) {
|
||||||
/* Chrome, Safari and Opera */
|
/* Chrome, Safari and Opera */
|
||||||
document.webkitExitFullscreen();
|
document.webkitExitFullscreen();
|
||||||
} else if (document.msExitFullscreen) {
|
} else if (document.msExitFullscreen) {
|
||||||
/* IE/Edge */
|
/* IE/Edge */
|
||||||
document.msExitFullscreen();
|
document.msExitFullscreen();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// let rand = Math.floor(Math.random() * 20 +1);
|
// let rand = Math.floor(Math.random() * 20 +1);
|
||||||
let random = () => {
|
let random = () => {
|
||||||
spin();
|
spin();
|
||||||
let rand = Math.floor(Math.random() * 20 +1);
|
let rand = Math.floor(Math.random() * 20 + 1);
|
||||||
console.log(rand);
|
console.log(rand);
|
||||||
document.getElementById("center").innerHTML = rand;
|
document.getElementById("center").innerHTML = rand;
|
||||||
}
|
};
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
// function rolar(){
|
// function rolar(){
|
||||||
// let rolagem = Math.floor(Math.random() * 20 +1);
|
// let rolagem = Math.floor(Math.random() * 20 +1);
|
||||||
@ -179,7 +188,9 @@ let random = () => {
|
|||||||
// document.getElementById("body").style.backgroundColor = "var(--black)";
|
// document.getElementById("body").style.backgroundColor = "var(--black)";
|
||||||
// }
|
// }
|
||||||
// }
|
// }
|
||||||
function spin(){
|
function spin() {
|
||||||
document.getElementById("d20").classList.add("spin");
|
document.getElementById("d20").classList.add("spin");
|
||||||
setTimeout(function(){document.getElementById("d20").classList.remove("spin");}, 500);
|
setTimeout(function () {
|
||||||
}
|
document.getElementById("d20").classList.remove("spin");
|
||||||
|
}, 500);
|
||||||
|
}
|
||||||
|
|||||||
@ -121,10 +121,10 @@ main {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.buttons1 {
|
.buttons1 {
|
||||||
font-size: 4vh;
|
font-size: 3vh;
|
||||||
|
|
||||||
font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva,
|
/* font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva,
|
||||||
Verdana, sans-serif;
|
Verdana, sans-serif; */
|
||||||
/* color: #333; */
|
/* color: #333; */
|
||||||
color: rgb(141, 140, 140);
|
color: rgb(141, 140, 140);
|
||||||
|
|
||||||
@ -157,9 +157,9 @@ main {
|
|||||||
border-radius: 30px;
|
border-radius: 30px;
|
||||||
opacity: 0.6;
|
opacity: 0.6;
|
||||||
background-color: #eee;
|
background-color: #eee;
|
||||||
/* position: absolute; */
|
position: absolute;
|
||||||
/* top: 52px; */
|
top: -40px;
|
||||||
/* right: 0; */
|
right: 0;
|
||||||
margin-top: 100px;
|
margin-top: 100px;
|
||||||
padding-right: 5px;
|
padding-right: 5px;
|
||||||
align-content: center;
|
align-content: center;
|
||||||
@ -168,11 +168,36 @@ main {
|
|||||||
font-size: 1.5vw;
|
font-size: 1.5vw;
|
||||||
}
|
}
|
||||||
#d20 {
|
#d20 {
|
||||||
width: 4vh;
|
width: 3vh;
|
||||||
|
height: auto;
|
||||||
|
vertical-align: middle;
|
||||||
}
|
}
|
||||||
#center {
|
#d20-face {
|
||||||
|
position: absolute;
|
||||||
|
|
||||||
|
top: 53%;
|
||||||
|
|
||||||
|
left: 50%;
|
||||||
|
|
||||||
|
transform: translate(-50%, -50%);
|
||||||
|
|
||||||
|
text-align: center;
|
||||||
|
font-size: 0.75vh;
|
||||||
|
/* width: 100%; */
|
||||||
color: red;
|
color: red;
|
||||||
}
|
}
|
||||||
|
.dice {
|
||||||
|
position: relative;
|
||||||
|
/* width: 100%; */
|
||||||
|
}
|
||||||
|
/* #center {
|
||||||
|
color: red;
|
||||||
|
position: absolute;
|
||||||
|
top: 50%;
|
||||||
|
left: 50%;
|
||||||
|
transform: translate(-50%, -50%);
|
||||||
|
font-size: 10pt !important;
|
||||||
|
} */
|
||||||
|
|
||||||
.fiveLife {
|
.fiveLife {
|
||||||
display: flex;
|
display: flex;
|
||||||
|
|||||||
@ -4,7 +4,7 @@
|
|||||||
<meta charset="UTF-8" />
|
<meta charset="UTF-8" />
|
||||||
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
<link rel="stylesheet" type="text/css" href="/menu/menu.css" />
|
<link rel="stylesheet" type="text/css" href="menu/menu.css" />
|
||||||
<link rel="stylesheet" href="style.css" />
|
<link rel="stylesheet" href="style.css" />
|
||||||
<link
|
<link
|
||||||
rel="stylesheet"
|
rel="stylesheet"
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user