|
|
- // 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)
|