Mirrors/overte-AleziaKurdis
3
0
Fork 0
mirror of https://github.com/AleziaKurdis/overte.git synced 2025-08-16 12:10:44 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

additional styling of console tray

Browse source
This commit is contained in:
Stephen Birarda 2015-12-18 14:48:55 -08:00
parent 735cd04020
commit 3fccd1a80b
2 changed files with 56 additions and 27 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

73
console/src/css/style.less
View file

@ -1,16 +1,11 @@
@light-gray: #949494;
// the following two blocks avoid the bounce effect on OS X when scrolling
// the following block avoids (only with two things in body) the bounce effect on OS X when scrolling
html {
overflow: hidden;
height: 100%;
}
body {
height: 100%;
overflow: auto;
}
@font-face {
font-family: 'Raleway';
font-style: normal;
@ -19,9 +14,12 @@ body {
}
body {
height: 100%;
overflow: auto;
font-family: 'Raleway', sans-serif;
padding: 50px 75px 10px 75px;
background-image: url('../images/background.jpg');
letter-spacing: 2px;
}
.light-gray {
@ -40,37 +38,64 @@ header {
height: 200px;
color: white;
#navigation, #servers {
h4 {
font-size: 14px;
}
p {
font-size: 12px;
}
#navigation, #servers, .tray-line {
display: inline-block;
width: 50%;
float: left;
margin-right: 20px;
}
.tray-line {
background-color: @light-gray;
width: 1px;
height: 165px;
margin-top: 45px;
}
#servers {
float: right;
h4 {
margin-left: 14px;
}
margin-left: 20px;
img {
position: relative;
top: -5px;
width: 125px;
height: 125px;
}
}
.tray-square {
width: 130px;
height: 130px;
display: flex;
justify-content: center;
align-items: center;
}
p {
text-align: center;
}
.nav-item {
margin-right: 15px;
float: left;
width: 100px;
height: 120px;
.nav-square {
width: 100px;
height: 100px;
display: flex;
justify-content: center;
align-items: center;
}
p {
text-align: center;
}
width: 130px;
height: 150px;
&#nav-search {
.nav-square {
background-color: @light-gray;
box-shadow: 0px 3px 3px #000000;
}
}

10
console/src/index.html
View file

@ -22,21 +22,25 @@
<div id="navigation">
<h4 class="light-gray">NAVIGATE</h4>
<div id="nav-search" class="nav-item">
<div class="nav-square">
<div class="tray-square nav-square">
<img src="images/search.svg" />
</div>
<p>Search</p>
</div>
<div id="nav-last-visited" class="nav-item">
<div class="nav-square">
<div class="tray-square nav-square">
<img src="images/last-visited.svg" />
</div>
<p>Last visited</p>
</div>
</div>
<div class="tray-line"></div>
<div id="servers">
<h4 class="light-gray">MY SERVER</h4>
<img src="images/server.png" width="100" height="100" />
<div class="tray-square">
<img src="images/server.png" />
</div>
<p>Home</p>
</div>
</div>