MAPG-69 unifying some style and text
This commit is contained in:
parent
66b21ec710
commit
a69ba3a99b
@ -69,10 +69,6 @@ sub {
|
|||||||
bottom: -0.4em;
|
bottom: -0.4em;
|
||||||
}
|
}
|
||||||
|
|
||||||
.mono {
|
|
||||||
font-family: 'Roboto Mono', monospace;
|
|
||||||
}
|
|
||||||
|
|
||||||
.bold {
|
.bold {
|
||||||
font-weight: 500;
|
font-weight: 500;
|
||||||
}
|
}
|
||||||
@ -261,13 +257,18 @@ div.modal {
|
|||||||
visibility: hidden;
|
visibility: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
p.formError {
|
p.error, p.formError {
|
||||||
color: #7f2929;
|
color: #7f2929;
|
||||||
font-weight: 500;
|
font-weight: 500;
|
||||||
|
}
|
||||||
|
|
||||||
|
p.formError {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
div.header {
|
div.header {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: auto auto;
|
||||||
background-color: #333333;
|
background-color: #333333;
|
||||||
height: 50px;
|
height: 50px;
|
||||||
line-height: 50px;
|
line-height: 50px;
|
||||||
@ -275,30 +276,25 @@ div.header {
|
|||||||
color: white;
|
color: white;
|
||||||
}
|
}
|
||||||
|
|
||||||
div.header>div.grid {
|
|
||||||
display: grid;
|
|
||||||
grid-template-columns: auto auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.header.small {
|
div.header.small {
|
||||||
height: 40px;
|
height: 40px;
|
||||||
line-height: 40px;
|
line-height: 40px;
|
||||||
}
|
}
|
||||||
|
|
||||||
div.header>div.grid>:nth-child(2) {
|
div.header>p.header {
|
||||||
line-height: inherit;
|
line-height: inherit;
|
||||||
text-align: right;
|
text-align: right;
|
||||||
}
|
}
|
||||||
|
|
||||||
div.header>div.grid>:nth-child(2)>span {
|
div.header>p.header>span {
|
||||||
padding-left: 6px;
|
padding-left: 6px;
|
||||||
}
|
}
|
||||||
|
|
||||||
div.header>div.grid>:nth-child(2)>span>a:link, div.header>div.grid>:nth-child(2)>span>a:visited {
|
div.header>p.header>span>a:link, div.header>p.header>span>a:visited {
|
||||||
color: inherit;
|
color: inherit;
|
||||||
}
|
}
|
||||||
|
|
||||||
div.header>div.grid>:nth-child(2)>span:not(:last-child) {
|
div.header>p.header>span:not(:last-child) {
|
||||||
border-right: solid white 1px;
|
border-right: solid white 1px;
|
||||||
padding-right: 6px;
|
padding-right: 6px;
|
||||||
}
|
}
|
||||||
@ -337,7 +333,7 @@ div.box {
|
|||||||
}
|
}
|
||||||
|
|
||||||
@media screen and (max-width: 599px) {
|
@media screen and (max-width: 599px) {
|
||||||
div.header.small h1 span {
|
div.header h1 span {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
button, a.button {
|
button, a.button {
|
||||||
|
@ -72,7 +72,7 @@ var MapGuesser = {
|
|||||||
|
|
||||||
closeButton.classList.add('gray');
|
closeButton.classList.add('gray');
|
||||||
closeButton.classList.add('marginTop');
|
closeButton.classList.add('marginTop');
|
||||||
closeButton.textContent = 'Cancel';
|
closeButton.textContent = 'Close';
|
||||||
closeButton.onclick = function () {
|
closeButton.onclick = function () {
|
||||||
MapGuesser.hideModal();
|
MapGuesser.hideModal();
|
||||||
};
|
};
|
||||||
|
@ -14,41 +14,39 @@ $jsFiles = [
|
|||||||
?>
|
?>
|
||||||
<?php require ROOT . '/views/templates/main_header.php'; ?>
|
<?php require ROOT . '/views/templates/main_header.php'; ?>
|
||||||
<div class="header small">
|
<div class="header small">
|
||||||
<div class="grid">
|
<h1>
|
||||||
<h1>
|
<a href="/maps" title="Back to playable maps">
|
||||||
<a href="/maps" title="Back to playable maps">
|
<img class="inline" width="1em" height="1em" src="<?= $_ENV['STATIC_ROOT'] ?>/img/icon.svg?rev=<?= REVISION ?>">
|
||||||
<img class="inline" width="1em" height="1em" src="<?= $_ENV['STATIC_ROOT'] ?>/img/icon.svg?rev=<?= REVISION ?>">
|
<span>MapGuesser</span>
|
||||||
<span>MapGuesser</span>
|
</a>
|
||||||
</a>
|
</h1>
|
||||||
</h1>
|
<p class="header">
|
||||||
<p>
|
<span><a href="javascript:;" id="mapName" title="Edit map data"><?= $mapName ?></a></span><!--
|
||||||
<span class="bold"><a href="javascript:;" id="mapName" title="Edit map data"><?= $mapName ?></a></span><!--
|
--><span><!--
|
||||||
--><span><!--
|
<?php /* Copyright (c) 2019 The Bootstrap Authors. License can be found in 'USED_SOFTWARE' in section 'Bootstrap Icons'. */ ?>
|
||||||
<?php /* Copyright (c) 2019 The Bootstrap Authors. License can be found in 'USED_SOFTWARE' in section 'Bootstrap Icons'. */ ?>
|
--><svg class="inline" width="1em" height="1em" viewBox="0 0 16 16" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
|
||||||
--><svg class="inline" width="1em" height="1em" viewBox="0 0 16 16" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
|
<path fill-rule="evenodd" d="M8 3.5a.5.5 0 0 1 .5.5v4a.5.5 0 0 1-.5.5H4a.5.5 0 0 1 0-1h3.5V4a.5.5 0 0 1 .5-.5z"/>
|
||||||
<path fill-rule="evenodd" d="M8 3.5a.5.5 0 0 1 .5.5v4a.5.5 0 0 1-.5.5H4a.5.5 0 0 1 0-1h3.5V4a.5.5 0 0 1 .5-.5z"/>
|
<path fill-rule="evenodd" d="M7.5 8a.5.5 0 0 1 .5-.5h4a.5.5 0 0 1 0 1H8.5V12a.5.5 0 0 1-1 0V8z"/>
|
||||||
<path fill-rule="evenodd" d="M7.5 8a.5.5 0 0 1 .5-.5h4a.5.5 0 0 1 0 1H8.5V12a.5.5 0 0 1-1 0V8z"/>
|
<path fill-rule="evenodd" d="M14 1H2a1 1 0 0 0-1 1v12a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V2a1 1 0 0 0-1-1zM2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2z"/>
|
||||||
<path fill-rule="evenodd" d="M14 1H2a1 1 0 0 0-1 1v12a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V2a1 1 0 0 0-1-1zM2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2z"/>
|
</svg>
|
||||||
</svg>
|
<span id="added" class="bold">0</span><!--
|
||||||
<span id="added" class="bold">0</span><!--
|
--></span><!--
|
||||||
--></span><!--
|
--><span><!--
|
||||||
--><span><!--
|
<?php /* Copyright (c) 2019 The Bootstrap Authors. License can be found in 'USED_SOFTWARE' in section 'Bootstrap Icons'. */ ?>
|
||||||
<?php /* Copyright (c) 2019 The Bootstrap Authors. License can be found in 'USED_SOFTWARE' in section 'Bootstrap Icons'. */ ?>
|
--><svg class="inline" width="1em" height="1em" viewBox="0 0 16 16" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
|
||||||
--><svg class="inline" width="1em" height="1em" viewBox="0 0 16 16" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
|
<path d="M15.502 1.94a.5.5 0 0 1 0 .706a.5.5 0 0 1 .707 0l1.293 1.293zm-1.75 2.456l-2-2L4.939 9.21a.5.5 0 0 0-.121.196l-.805 2.414a.25.25 0 0 0 .316.316l2.414-.805a.5.5 0 0 0 .196-.12l6.813-6.814z"/> <path fill-rule="evenodd" d="M14 1H2a1 1 0 0 0-1 1v12a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V2a1 1 0 0 0-1-1zM2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2z"/>
|
||||||
<path d="M15.502 1.94a.5.5 0 0 1 0 .706a.5.5 0 0 1 .707 0l1.293 1.293zm-1.75 2.456l-2-2L4.939 9.21a.5.5 0 0 0-.121.196l-.805 2.414a.25.25 0 0 0 .316.316l2.414-.805a.5.5 0 0 0 .196-.12l6.813-6.814z"/> <path fill-rule="evenodd" d="M14 1H2a1 1 0 0 0-1 1v12a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V2a1 1 0 0 0-1-1zM2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2z"/>
|
</svg>
|
||||||
</svg>
|
<span id="edited" class="bold">0</span><!--
|
||||||
<span id="edited" class="bold">0</span><!--
|
--></span><!--
|
||||||
--></span><!--
|
--><span><!--
|
||||||
--><span><!--
|
<?php /* Copyright (c) 2019 The Bootstrap Authors. License can be found in 'USED_SOFTWARE' in section 'Bootstrap Icons'. */ ?>
|
||||||
<?php /* Copyright (c) 2019 The Bootstrap Authors. License can be found in 'USED_SOFTWARE' in section 'Bootstrap Icons'. */ ?>
|
--><svg class="inline" width="1em" height="1em" viewBox="0 0 16 16" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
|
||||||
--><svg class="inline" width="1em" height="1em" viewBox="0 0 16 16" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
|
<path fill-rule="evenodd" d="M3.5 8a.5.5 0 0 1 .5-.5h8a.5.5 0 0 1 0 1H4a.5.5 0 0 1-.5-.5z"/>
|
||||||
<path fill-rule="evenodd" d="M3.5 8a.5.5 0 0 1 .5-.5h8a.5.5 0 0 1 0 1H4a.5.5 0 0 1-.5-.5z"/>
|
<path fill-rule="evenodd" d="M14 1H2a1 1 0 0 0-1 1v12a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V2a1 1 0 0 0-1-1zM2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2z"/>
|
||||||
<path fill-rule="evenodd" d="M14 1H2a1 1 0 0 0-1 1v12a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V2a1 1 0 0 0-1-1zM2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2z"/>
|
</svg>
|
||||||
</svg>
|
<span id="deleted" class="bold">0</span><!--
|
||||||
<span id="deleted" class="bold">0</span><!--
|
--></span>
|
||||||
--></span>
|
</p>
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
<div id="metadata" class="modal">
|
<div id="metadata" class="modal">
|
||||||
<h2>Edit map data</h2>
|
<h2>Edit map data</h2>
|
||||||
|
@ -9,19 +9,17 @@ $jsFiles = [
|
|||||||
?>
|
?>
|
||||||
<?php require ROOT . '/views/templates/main_header.php'; ?>
|
<?php require ROOT . '/views/templates/main_header.php'; ?>
|
||||||
<div class="header small">
|
<div class="header small">
|
||||||
<div class="grid">
|
<h1>
|
||||||
<h1>
|
<a href="/maps" title="Back to playable maps">
|
||||||
<a href="/maps" title="Back to playable maps">
|
<img class="inline" width="1em" height="1em" src="<?= $_ENV['STATIC_ROOT'] ?>/img/icon.svg?rev=<?= REVISION ?>">
|
||||||
<img class="inline" width="1em" height="1em" src="<?= $_ENV['STATIC_ROOT'] ?>/img/icon.svg?rev=<?= REVISION ?>">
|
<span>MapGuesser</span>
|
||||||
<span>MapGuesser</span>
|
</a>
|
||||||
</a>
|
</h1>
|
||||||
</h1>
|
<p class="header">
|
||||||
<p>
|
<span id="mapName" class="bold"><?= $mapName ?></span><!--
|
||||||
<span id="mapName" class="bold"><?= $mapName ?></span><!--
|
--><span>Round <span id="currentRound" class="bold"></span></span><!--
|
||||||
--><span>Round <span id="currentRound" class="bold"></span></span><!--
|
--><span>Score <span id="currentScoreSum" class="bold"></span></span>
|
||||||
--><span>Score <span id="currentScoreSum" class="bold"></span></span>
|
</p>
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
<div id="guessCover"></div>
|
<div id="guessCover"></div>
|
||||||
<div id="panorama"></div>
|
<div id="panorama"></div>
|
||||||
|
@ -1,25 +1,23 @@
|
|||||||
<div class="header">
|
<div class="header">
|
||||||
<div class="grid">
|
<h1>
|
||||||
<h1>
|
<a href="/" title="MapGuesser">
|
||||||
<a href="/" title="MapGuesser">
|
<img class="inline" width="1em" height="1em" src="<?= $_ENV['STATIC_ROOT'] ?>/img/icon.svg?rev=<?= REVISION ?>">
|
||||||
<img class="inline" width="1em" height="1em" src="<?= $_ENV['STATIC_ROOT'] ?>/img/icon.svg?rev=<?= REVISION ?>">
|
<span>MapGuesser</span>
|
||||||
MapGuesser
|
</a>
|
||||||
</a>
|
</h1>
|
||||||
</h1>
|
<p class="header">
|
||||||
<p>
|
<?php if (Container::$request->user()) : ?>
|
||||||
<?php if (Container::$request->user()) : ?>
|
<span><a href="/profile" title="Profile">
|
||||||
<span><a href="/profile" title="Profile">
|
<?php /* Copyright (c) 2019 The Bootstrap Authors. License can be found in 'USED_SOFTWARE' in section 'Bootstrap Icons'. */ ?>
|
||||||
<?php /* Copyright (c) 2019 The Bootstrap Authors. License can be found in 'USED_SOFTWARE' in section 'Bootstrap Icons'. */ ?>
|
<svg class="inline" width="1em" height="1em" viewBox="0 0 16 16" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
|
||||||
<svg class="inline" width="1em" height="1em" viewBox="0 0 16 16" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
|
<path fill-rule="evenodd" d="M3 14s-1 0-1-1 1-4 6-4 6 3 6 4-1 1-1 1H3zm5-6a3 3 0 1 0 0-6 3 3 0 0 0 0 6z"/>
|
||||||
<path fill-rule="evenodd" d="M3 14s-1 0-1-1 1-4 6-4 6 3 6 4-1 1-1 1H3zm5-6a3 3 0 1 0 0-6 3 3 0 0 0 0 6z"/>
|
</svg>
|
||||||
</svg>
|
<?= Container::$request->user()->getDisplayName() ?><!--
|
||||||
<?= Container::$request->user()->getDisplayName() ?><!--
|
--></a></span><!--
|
||||||
--></a></span><!--
|
--><span><a href="/logout" title="Logout">Logout</a></span>
|
||||||
--><span><a href="/logout" title="Logout">Logout</a></span>
|
<?php else : ?>
|
||||||
<?php else : ?>
|
<span><a href="/signup" title="Login">Sign up</a></span><!--
|
||||||
<span><a href="/signup" title="Login">Sign up</a></span><!--
|
--><span><a href="/login" title="Login">Login</a></span>
|
||||||
--><span><a href="/login" title="Login">Login</a></span>
|
<?php endif; ?>
|
||||||
<?php endif; ?>
|
</p>
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
@ -28,6 +28,6 @@
|
|||||||
<div id="cover"></div>
|
<div id="cover"></div>
|
||||||
<div id="modal" class="modal">
|
<div id="modal" class="modal">
|
||||||
<h2 id="modalTitle"></h2>
|
<h2 id="modalTitle"></h2>
|
||||||
<p id="modalText" class="marginTop"></p>
|
<p id="modalText" class="justify marginTop"></p>
|
||||||
<div id="modalButtons" class="right"></div>
|
<div id="modalButtons" class="right"></div>
|
||||||
</div>
|
</div>
|
Loading…
Reference in New Issue
Block a user