This repository has been archived on 2022-02-10. You can view files and clone it, but cannot push or open issues or pull requests.
rangitaki/src/sass-themes/nextDESIGN.sass

194 lines
4.6 KiB
Sass

/*
*The MIT License
*
*Copyright 2015 mmk2410.
*
*Permission is hereby granted, free of charge, to any person obtaining a copy
*of this software and associated documentation files (the "Software"), to deal
*in the Software without restriction, including without limitation the rights
*to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
*copies of the Software, and to permit persons to whom the Software is
*furnished to do so, subject to the following conditions:
*
*The above copyright notice and this permission notice shall be included in
*all copies or substantial portions of the Software.
*
*THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
*IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
*FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
*AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
*LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
*OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
*THE SOFTWARE.
/*
* Created on : Jun 18, 2015, 6:39:37 PM
* Author : mmk2410
$font: "Fira Sans", sans-serif
$background: #f0f0f0
$text-color: #383838
$primary-color: #4CAF50
$header-shadow: rgba(62, 62, 62, 0.45)
$white: #FFFFFF
$fadeout-color: rgba(30, 87, 153, 0)
$border: #e0e0e0
$active-color: #e2e2e2
$fab-shadow: rgba(62, 62, 62, 0.3)
$footer-background: #2D2D2D
body
font-family: $font
background: $background
color: $text-color
margin: 130px 0 0
::selection, ::-moz-selection
color: $background
background-color: $primary-color
.header
height: 55px
background-color: $primary-color
position: fixed
box-shadow: 2px 0 2px 2px $header-shadow
.title
line-height: 55px
color: $white
position: absolute
left: 0
margin-left: calc(20% + 24px)
> a
color: $white
text-decoration: none
.fadeout
height: 55px
background: -moz-linear-gradient(left, $fadeout-color 0%, $primary-color 100%)
background: -webkit-linear-gradient(left, $fadeout-color 0%, $primary-color 100%)
background: -o-linear-gradient(left, $fadeout-color 0%, $primary-color 100%)
background: -ms-linear-gradient(left, $fadeout-color 0%, $primary-color 100%)
background: linear-gradient(to right, $fadeout-color 0%, $primary-color 100%)
.nav-img
padding: 14px 19px
.nav
background-color: $white
border-right: 1px solid $border
.nav-item, .nav-item-static
color: $text-color
.nav-item
font-weight: 600
&:hover
color: $primary-color
&:active
background-color: $active-color
.divider
border-bottom: 1px solid $border
.card
background: none
border-radius: 0
box-shadow: none
margin: 0 20% 100px
width: auto
a
color: $primary-color
text-decoration: none
border-bottom: 1px solid transparent
transition: border-bottom-color 150ms ease-in-out 100ms
&:hover
border-bottom-color: #4CAF50
.headline
font-size: 30px
line-height: 50px
color: #383838 !important
text-decoration: none
border-bottom: none !important
&:hover
color: #4CAF50 !important
.date
font-size: 13px
.articletext
margin-top: 30px
font-size: 16px
line-height: 30px
.author, .tag
font-size: 13px
.fab
background-color: $primary-color
box-shadow: 0 1px 1.5px 1.5px $fab-shadow
.subfab
background-color: $white
box-shadow: 0 1px 1.5px 1.5px $fab-shadow
.button
color: $primary-color
border-bottom: 1px solid transparent
margin: 0
min-width: 0
padding: 0
line-height: 16px
height: 16px
transition-property: border-bottom-color
transition-delay: 50ms
transition-duration: 125ms
transition-timing-function: ease
-moz-transition-property: border-bottom-color
-moz-transition-delay: 50ms
-moz-transition-duration: 125ms
-moz-transition-timing-function: ease
-webkit-transition-property: border-bottom-color
-webkit-transition-delay: 50ms
-webkit-transition-duration: 125ms
-webkit-transition-timing-function: ease
&:hover
border-bottom-color: $primary-color
.pag_prev
float: left
.button:last-child
float: none
.footer
text-align: center
height: 60px
background-color: $footer-background
line-height: 60px
width: 100%
color: $white
a
color: $white
text-decoration: none
border-bottom: 1px solid transparent
&:hover
border-bottom-color: $white
.hljs
background: none
@media screen and (min-width: 1440px)
.title
margin-left: calc(20% - 40px)
.nav
padding-top: 55px
@media screen and (max-width: 800px)
body
margin-top: 80px
.title
margin-left: 20%
.card
margin: 0 5% 100px