Macintosh-Tools/jurassic-park-interface
1
0
Fork 0
mirror of https://github.com/Max-Stevenson/jurassic-park-interface.git synced 2024-07-09 16:29:09 +00:00
Code Issues Projects Releases Wiki Activity

More button detailing.

Browse Source
This commit is contained in:
Max Stevenson 2020-06-01 01:25:53 +01:00
parent f153766c0e
commit 3ebe2b15c4
2 changed files with 27 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
app.css
View File

@ -277,6 +277,11 @@ body {
flex-direction: column;
}
.control-pannel__button-display {
display: flex;
align-items: center;
}
h1 {
max-width: fit-content;
background: #438149;
@ -285,14 +290,26 @@ h1 {
}
.button-display__button {
-moz-box-shadow: inset 0 0 5px #515151;
-moz-box-shadow: inset 0 0 5px #515151;
-webkit-box-shadow: inset 0 0 5px #515151;
box-shadow: inset 0 0 5px #515151;
box-shadow: inset 0 0 5px #515151;
width: fit-content;
}
.button-display__button__depressed {
color: #BFBFBF;
.button-text__embossed {
color: #bfbfbf;
text-shadow: 1px 1px 1px #565656;
padding: 5px;
margin: 0;
}
.button-text__engraved {
text-shadow: 1px 1px 0px #616161, 2px 1px 0px #aeb5b5;
color: transparent;
margin: 0;
}
.buttons {
width: fit-content;
box-shadow: inset 0 0 2px #515151;
}

7
index.html
View File

@ -87,7 +87,12 @@
<div class="outer-container__two">
<div class="control-pannel__button-display">
<div class="button-display__button">
<p class="button-display__button__depressed">VEHICLE</p>
<p class="button-text__embossed">VEHICLE</p>
</div>
<div class="outer-container__one buttons">
<div class="outer-container__two">
<p class="button-text__engraved">TOUR</p>
</div>
</div>
</div>
<div class="control-pannel__video-screen"></div>