mmk2410/rangitaki
Archived
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

CSS rewritten in SASS

Browse source 
Ref T30
This commit is contained in:
Marcel Kapfer (mmk2410) 2016-04-26 19:09:39 +02:00
parent e10db31a00
commit 8330a1ce98
2 changed files with 295 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

46
src/sass/no-nav.sass Normal file
View file

@ -0,0 +1,46 @@
/*
* Rangitaki Project
*
* 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.
*
* A stylesheet for overriding the default styles if the navigation drawer is disabled
*/
.nav
display: none
.nav-img
display: none
@media screen and (min-width: 1440px)
.header
left: 0
.main
margin-left: 0
width: 100%
@media screen and (max-width: 720px)
.title
left: 25px

249
src/sass/rangitaki.sass Normal file
View file

@ -0,0 +1,249 @@
/*
* Rangitaki Project
*
* 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.
*
* A stylesheet for overriding the default styles if the navigation drawer is disabled
*/
/* BODY */
body
margin-top: 94px
.main
height: 100%
margin-left: 0
.overlay
opacity: 0
position: fixed
top: 0
left: 0
background-color: black
width: 100%
z-index: 30
height: 100%
display: none
/* HEADER */
.header
top: 0
right: 0
left: 0
width: 100%
height: 64px
position: absolute
.title
color: #fff
font-size: 23px
text-decoration: none
line-height: 64px
vertical-align: middle
left: 75px
.title > a
text-decoration: none
color: #fff
.fadeout
position: absolute
height: 64px
top: 0
right: 0
width: 40px
.nav-img
height: 26px
padding: 19px
cursor: pointer
/* NAV DRAWER */
.nav
width: 300px
position: fixed
height: 100%
top: 0
left: -301px
z-index: 40
.nav-item, .nav-item-static
text-decoration: none
text-indent: 0
display: inline-block
height: 48px
vertical-align: middle
width: 284px
line-height: 48px
padding-left: 16px
transition: background-color 125ms ease-in-out 0ms
.nav-close
cursor: pointer
.nav-close-img
height: 35px
padding: 12px
.nav-item
cursor: pointer
.divider
width: 100%
/* MAIN */
.card
margin-right: auto
margin-left: auto
width: 75%
padding: 24px
margin-bottom: 40px
max-width: 1160px
.card a
-moz-hyphens: auto
-epub-hyphens: auto
-ms-hyphens: auto
-webkit-hyphens: auto
hyphens: auto
word-wrap: break-word
.card a:hover
.headline
display: block
padding-bottom: 8px
.card img
max-width: 100%
max-height: 400px
display: block
margin-left: auto
margin-right: auto
.date
.articletext
.author
display: block
.tag
/* FAB */
.fabmenu
position: fixed
bottom: 20px
right: 20px
.fab
height: 60px
width: 60px
border-radius: 30px
cursor: pointer
.fab-img
width: 28px
padding: 15px
.subfab
height: 45px
width: 45px
border-radius: 30px
margin-right: auto
margin-left: auto
margin-bottom: 25px
display: none
.subfab-img
width: 22px
padding: 12px
/* BUTTON */
.pag_buttons
margin-right: auto
margin-left: auto
width: calc(75% + 48px)
margin-bottom: 80px
max-width: 1160px
text-align: right
.button
text-decoration: none
color: #fff
line-height: 36px
min-width: 64px
text-align: center
height: 36px
padding: 8px
margin-top: 4px
margin-bottom: 5px
cursor: pointer
.pag_next
margin-left: 8px
/* FOOTER */
.footer
.footer a
transition: border-bottom-color 150ms ease-in-out 100ms
.footer a:hover
border-bottom-color: #383838
@media screen and (min-width: 1440px)
.nav
left: 0
padding-top: 64px
.nav-close-img
display: none
.nav-close
display: none
.nav-img
display: none
.header
left: 300px
.main
margin-left: 300px
width: calc(100% - 300px)
@media screen and (max-width: 720px)
.card
width: 82%
.pag_buttons
width: calc(82% + 48px)