You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
151 lines
2.9 KiB
151 lines
2.9 KiB
// Copyright (C) 2015 Sam Parkinson
|
|
//
|
|
// This program is free software: you can redistribute it and/or modify
|
|
// it under the terms of the GNU General Public License as published by
|
|
// the Free Software Foundation, either version 3 of the License, or
|
|
// (at your option) any later version.
|
|
//
|
|
// This program is distributed in the hope that it will be useful,
|
|
// but WITHOUT ANY WARRANTY without even the implied warranty of
|
|
// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
|
// GNU General Public License for more details.
|
|
//
|
|
// You should have received a copy of the GNU General Public License
|
|
// along with this program. If not, see <http://www.gnu.org/licenses/>.
|
|
|
|
.canvasHolder
|
|
transition: 0.75s ease all
|
|
transform-origin: 0 0
|
|
|
|
position: absolute
|
|
top: 0
|
|
left: 0
|
|
|
|
.canvasHolder.hide
|
|
transform: scale(0.24)
|
|
|
|
top: 117px
|
|
left: 1%
|
|
|
|
width: 100vw
|
|
height: 75vw
|
|
overflow: hidden
|
|
z-index: 10
|
|
|
|
background: #99CCFF
|
|
|
|
.canvasHolder.hide canvas
|
|
width: 100%
|
|
height: 100%
|
|
|
|
nav
|
|
position: fixed
|
|
top: 0px
|
|
left: 0px
|
|
z-index: 100
|
|
|
|
background-color: #8bc34a
|
|
height: 64px
|
|
width: 100%
|
|
box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.16), 0px 2px 10px 0px rgba(0, 0, 0, 0.12)
|
|
|
|
font: 32px sans
|
|
vertical-align: middle
|
|
line-height: 64px
|
|
color: white
|
|
|
|
.nav-container
|
|
padding: 0 12px
|
|
|
|
.logo
|
|
padding-left: 12px
|
|
|
|
h1
|
|
font-size: 32px
|
|
position: relative
|
|
top: -12px
|
|
display: inline
|
|
|
|
img
|
|
height: 48px
|
|
width: 48px
|
|
margin-top: 6px
|
|
|
|
border-radius: 100%
|
|
|
|
&hover
|
|
background-color: rgba(255, 255, 255, 0.3)
|
|
|
|
&active
|
|
background-color: rgba(255, 255, 255, 0.8)
|
|
|
|
ul
|
|
list-style: none
|
|
text-align: right
|
|
display: inline
|
|
|
|
li
|
|
dispalay: inline
|
|
padding-right: 12px
|
|
float: right
|
|
|
|
.nav-spacer
|
|
height: 48px
|
|
|
|
.content
|
|
padding: 0px
|
|
margin: 0px
|
|
|
|
li
|
|
display: block
|
|
list-style: none
|
|
width: 24%
|
|
float: left
|
|
padding-left: 1%
|
|
|
|
li[current=true] img.thumbnail
|
|
opacity: 0
|
|
|
|
@media (max-width: 500px)
|
|
.content li
|
|
width: 49%
|
|
padding-left: 1%
|
|
|
|
.canvasHolder.hide
|
|
transform: scale(0.49)
|
|
|
|
nav h1
|
|
display: none
|
|
|
|
@media (max-width: 800px) and (min-width: 501px)
|
|
.content li
|
|
width: 32%
|
|
padding-left: 1%
|
|
|
|
.canvasHolder.hide
|
|
transform: scale(0.32)
|
|
|
|
.content li img.thumbnail
|
|
background: #96D3F3
|
|
width: 100%
|
|
padding: 0
|
|
|
|
.content li .options, .content li .options input
|
|
text-align: center
|
|
|
|
.planet-content
|
|
color: #727272
|
|
|
|
.planet-content h2
|
|
color: #212121
|
|
clear: both
|
|
|
|
img.icon
|
|
border-radius: 100%
|
|
width: 30px
|
|
|
|
img.icon:hover
|
|
background-color: rgba(139, 195, 74, 0.3)
|
|
|
|
img.icon:hover
|
|
background-color: rgba(139, 195, 74, 0.8)
|