GuillaumeHemmen/pokemon-js
1
0
Fork 0
mirror of https://github.com/chase-manning/pokemon-js.git synced 2025-09-22 22:57:14 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

💄 adjust styling for menu

Browse source
This commit is contained in:
Chase Manning 2023-09-08 13:31:39 +03:00
commit 5c4154d9f5
1 changed files with 41 additions and 10 deletions

51
public/styles/css-pokemon-gameboy.css
View file

@ -17,7 +17,7 @@ h6 {
border-width: 21px;
border-style: solid;
padding: 1em;
margin: 1em 0 0 0;
margin: 3px;
width: 100%;
max-width: 100%;
@ -101,25 +101,35 @@ button,
.button {
position: relative;
font-family: "PokemonGB";
line-height: 1.7;
font-size: 1em;
font-size: 3rem;
background: none;
border: none;
padding: 0 0 0 1em;
text-transform: uppercase;
text-align: left;
cursor: pointer;
color: black;
margin-top: 13px;
margin-bottom: 7px;
@media (max-width: 768px) {
font-size: 1rem;
line-height: 1;
margin-top: 7px;
margin-bottom: 4px;
}
}
button:hover::before,
.button:hover::before {
.active-button::before {
content: "";
position: absolute;
top: 0;
left: -2px;
width: 2px;
height: 2px;
font-size: 2px;
color: #181010;
left: -3px;
width: 3px;
height: 3px;
font-size: 3px;
box-shadow: 1em 0em 0 #181010, 2em 0em 0 #181010, 1em 1em 0 #181010,
2em 1em 0 #181010, 3em 1em 0 #181010, 1em 2em 0 #181010, 2em 2em 0 #181010,
3em 2em 0 #181010, 4em 2em 0 #181010, 1em 3em 0 #181010, 2em 3em 0 #181010,
@ -127,6 +137,23 @@ button:hover::before,
2em 4em 0 #181010, 3em 4em 0 #181010, 4em 4em 0 #181010, 1em 5em 0 #181010,
2em 5em 0 #181010, 3em 5em 0 #181010, 1em 6em 0 #181010, 2em 6em 0 #181010;
}
@media (max-width: 768px) {
.active-button::before {
left: -1px;
top: -2px;
width: 1.5px;
height: 1.5px;
font-size: 1.5px;
box-shadow: 1em 0em 0 #181010, 2em 0em 0 #181010, 1em 1em 0 #181010,
2em 1em 0 #181010, 3em 1em 0 #181010, 1em 2em 0 #181010, 2em 2em 0 #181010,
3em 2em 0 #181010, 4em 2em 0 #181010, 1em 3em 0 #181010, 2em 3em 0 #181010,
3em 3em 0 #181010, 4em 3em 0 #181010, 5em 3em 0 #181010, 1em 4em 0 #181010,
2em 4em 0 #181010, 3em 4em 0 #181010, 4em 4em 0 #181010, 1em 5em 0 #181010,
2em 5em 0 #181010, 3em 5em 0 #181010, 1em 6em 0 #181010, 2em 6em 0 #181010;
}
}
button.pokemon,
.button.pokemon {
text-indent: -1000em;
@ -144,6 +171,10 @@ ul.buttons {
ul.buttons li {
padding: 0;
margin: 0.5em;
@media (max-width: 768px) {
margin: 0;
}
}
ul.buttons.compact {
flex-direction: row;
@ -2235,7 +2266,7 @@ h6 {
@media only screen and (max-width: 760px) {
.framed {
padding: 0.5em;
margin: 0.5em 0 0 0;
margin: 3px;
}
.stats {
padding: 0.5em;