Remove inline styles
This commit is contained in:
parent
4429b627bb
commit
df985be394
Binary file not shown.
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "minesweeper",
|
||||
"version": "0.82.9",
|
||||
"version": "0.82.10",
|
||||
"description": "Just Minesweeper!",
|
||||
"author": "Felix W. Dekker",
|
||||
"browser": "dist/bundle.js",
|
||||
|
@ -20,7 +20,7 @@
|
|||
"canvas-confetti": "^1.4.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"grunt": "^1.3.0",
|
||||
"grunt": "^1.4.0",
|
||||
"grunt-cli": "^1.4.2",
|
||||
"grunt-contrib-clean": "^2.0.0",
|
||||
"grunt-contrib-copy": "^1.0.0",
|
||||
|
@ -28,10 +28,10 @@
|
|||
"grunt-focus": "^1.0.0",
|
||||
"grunt-text-replace": "^0.4.0",
|
||||
"grunt-webpack": "^4.0.3",
|
||||
"ts-loader": "^8.1.0",
|
||||
"ts-loader": "^9.1.1",
|
||||
"ts-node": "^9.1.1",
|
||||
"typescript": "^4.2.4",
|
||||
"webpack": "^5.33.2",
|
||||
"webpack": "^5.36.0",
|
||||
"webpack-cli": "^4.6.0"
|
||||
}
|
||||
}
|
||||
|
|
|
@ -33,17 +33,18 @@ form button.cancel {
|
|||
}
|
||||
|
||||
#canvas {
|
||||
visibility: hidden;
|
||||
display: inline;
|
||||
box-sizing: border-box;
|
||||
border: 4mm ridge #bdbdbd;
|
||||
}
|
||||
|
||||
#canvas.invisible {
|
||||
visibility: hidden !important;
|
||||
}
|
||||
|
||||
|
||||
/* Overlay */
|
||||
.overlayWrapper {
|
||||
visibility: hidden;
|
||||
|
||||
z-index: 20;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
|
|
|
@ -21,13 +21,13 @@
|
|||
<noscript>
|
||||
<img src="https://stats.fwdekker.com/count?p=/tools/minesweeper/" alt="Counting pixel" />
|
||||
|
||||
<p style="color: red; font-weight: bold;">
|
||||
<p>
|
||||
This website does not function if JavaScript is disabled.
|
||||
Please check the <a href="https://www.enable-javascript.com/">
|
||||
instructions on how to enable JavaScript in your web browser</a>.
|
||||
</p>
|
||||
</noscript>
|
||||
<main style="display: none;">
|
||||
<main class="hidden">
|
||||
<div id="nav"></div>
|
||||
<div id="contents">
|
||||
<div id="header"></div>
|
||||
|
@ -106,7 +106,7 @@
|
|||
<div class="column">
|
||||
<!-- Canvas -->
|
||||
<div id="canvasContainer">
|
||||
<canvas id="canvas" width="1" height="1">
|
||||
<canvas id="canvas" class="invisible" width="1" height="1">
|
||||
Your browser must support the <canvas> element to run this game.
|
||||
</canvas>
|
||||
</div>
|
||||
|
@ -117,7 +117,7 @@
|
|||
<div id="footer"></div>
|
||||
|
||||
<!-- Custom difficulty overlay -->
|
||||
<div class="overlayWrapper" id="customDifficultyOverlay">
|
||||
<div class="overlayWrapper hidden" id="customDifficultyOverlay">
|
||||
<div class="overlay">
|
||||
<h2>Custom difficulty</h2>
|
||||
<form id="customDifficultyForm">
|
||||
|
@ -142,7 +142,7 @@
|
|||
</div>
|
||||
</div>
|
||||
<!-- Seed input overlay -->
|
||||
<div class="overlayWrapper" id="seedOverlay">
|
||||
<div class="overlayWrapper hidden" id="seedOverlay">
|
||||
<div class="overlay">
|
||||
<h2>Seed</h2>
|
||||
<form id="seedForm">
|
||||
|
@ -157,7 +157,7 @@
|
|||
</div>
|
||||
</div>
|
||||
<!-- Preferences overlay -->
|
||||
<div class="overlayWrapper" id="preferencesOverlay">
|
||||
<div class="overlayWrapper hidden" id="preferencesOverlay">
|
||||
<div class="overlay">
|
||||
<h2>Preferences</h2>
|
||||
<form id="preferencesForm">
|
||||
|
@ -176,7 +176,7 @@
|
|||
</div>
|
||||
</div>
|
||||
<!-- Statistics overlay -->
|
||||
<div class="overlayWrapper" id="statisticsOverlay">
|
||||
<div class="overlayWrapper hidden" id="statisticsOverlay">
|
||||
<div class="overlay">
|
||||
<h2>Statistics</h2>
|
||||
<div id="statisticsDiv"></div>
|
||||
|
@ -189,7 +189,7 @@
|
|||
</div>
|
||||
</div>
|
||||
<!-- High scores overlay -->
|
||||
<div class="overlayWrapper" id="highScoresOverlay">
|
||||
<div class="overlayWrapper hidden" id="highScoresOverlay">
|
||||
<div class="overlay">
|
||||
<h2>High scores</h2>
|
||||
<div id="highScoresDiv"></div>
|
||||
|
|
|
@ -71,7 +71,7 @@ export class Game {
|
|||
this.field = null; // Placeholder until `initNewField`
|
||||
this.display = new Display(this.canvas, this.field, preferences);
|
||||
this.display.startDrawLoop();
|
||||
this.canvas.style.visibility = "unset";
|
||||
this.canvas.classList.remove("invisible");
|
||||
|
||||
this.rng = alea("" + Date.now());
|
||||
this.seed = "" + this.rng.uint32();
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
// @ts-ignore
|
||||
const {$, doAfterLoad, footer, header, nav, showPage} = window.fwdekker;
|
||||
const {$, doAfterLoad, footer, header, nav} = window.fwdekker;
|
||||
import {waitForForkAwesome} from "./Common";
|
||||
import {BasicIconFont, ForkAwesomeFont} from "./Display";
|
||||
import {Game} from "./Game";
|
||||
|
@ -14,7 +14,7 @@ doAfterLoad(() => {
|
|||
vcsURL: "https://git.fwdekker.com/FWDekker/minesweeper/",
|
||||
version: "v%%VERSION_NUMBER%%"
|
||||
}));
|
||||
showPage();
|
||||
$("main").classList.remove("hidden");
|
||||
|
||||
|
||||
// Start game
|
||||
|
|
|
@ -67,14 +67,14 @@ export class Overlay {
|
|||
* Shows the overlay.
|
||||
*/
|
||||
show(): void {
|
||||
this.overlay.style.visibility = "unset";
|
||||
this.overlay.classList.remove("hidden");
|
||||
}
|
||||
|
||||
/**
|
||||
* Hides the overlay.
|
||||
*/
|
||||
hide(): void {
|
||||
this.overlay.style.visibility = "hidden";
|
||||
this.overlay.classList.add("hidden");
|
||||
blurActiveElement();
|
||||
}
|
||||
|
||||
|
@ -82,6 +82,6 @@ export class Overlay {
|
|||
* Returns `true` if and only if this overlay is currently visible.
|
||||
*/
|
||||
isVisible(): boolean {
|
||||
return this.overlay.style.visibility !== "hidden";
|
||||
return this.overlay.classList.contains("hidden");
|
||||
}
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue