This repository has been archived on 2024-04-08. You can view files and clone it, but cannot push or open issues or pull requests.
mystic/themes/hueman/source/css/_partial/sidebar.styl
2018-09-03 17:41:16 +10:00

260 lines
6.5 KiB
Stylus

#sidebar
if sidebar is right
float: right
margin-right: - sidebar-width
else
float: left
margin-left: - sidebar-width
width: sidebar-width
.sidebar-toggle
display: none
.sidebar-top
clearfix()
background: color-theme
padding: 15px 30px
.sidebar-top-inner
clearfix()
p
float: left
color: rgba(255,255,255,0.8)
font-size: 16px
font-weight: 600
text-transform: uppercase
line-height: 24px
padding: 3px 0
.social-links
float: right
position: relative
padding-top: 2px
li
float: left
margin-left: 8px
a
&:hover
i
&:before
color: #fff
.social-tooltip
position: relative
&:hover
&:after
top: -41px
background: #fff
font-size: 14px
color: #666
content: attr(title)
display: block
right: 0
padding: 5px 15px
position: absolute
white-space: nowrap
border-radius: 3px
box-shadow: 0 0 2px rgba(0,0,0,0.2)
text-transform: uppercase
z-index: 1
&:before
top: -10px
right: 8px
border: solid
border-color: #fff transparent
border-width: 5px 5px 0 5px
content: ""
display: block
position: absolute
z-index: 2
i
color: rgba(255,255,255,0.7)
font-size: font-icon-profile-size
width: font-icon-profile-size
#article-nav
clearfix()
position: relative
.article-nav-link-wrap
position: relative
margin-top: 0
display: block
color: color-grey
padding: 16px 40px 24px
border-bottom: 1px solid color-border
transition: 0.2s ease-in
text-align: center
text-decoration: none
.icon
position: absolute
color: #ccc
font-size: 18px
top: 50%
width: 1em
margin-top: -10px
#icon-chevron-left
left: 10px
#icon-chevron-right
right: 10px
&:hover
background: rgba(0,0,0,0.02)
.icon
color: color-theme
.article-nav-caption
display: block
font-size: 12px
color: color-grey
letter-spacing: 0.5px
line-height: 24px
font-weight: normal
text-transform: uppercase
.article-nav-title
font-size: 15px
color: #666
.widget-wrap
padding: 30px 30px 20px
.widget-title
font-size: 15px
font-weight: 400
text-transform: uppercase
margin-bottom: 6px
.widget
@extend $base-style
line-height: line-height
word-wrap: break-word
font-size: 0.9em
color: color-sidebar-text
border-radius: 3px
a
text-decoration: none
color: color-sidebar-text
&:hover
color: color-sidebar-text-dark
ul, ol, dl
ul, ol, dl
margin-left: 15px
list-style: disc
ul, ol
list-style: none
margin: 0
ul, ol
margin: 0 20px
ul
list-style: disc
ol
list-style: decimal
.widget-list
ul, ol
list-style: none
li
margin: 10px 0
padding-bottom: 10px
font-size: font-size + 1
border-bottom: 1px solid #E4E4E4
&:last-child
margin-bottom: 0px
a
color: color-sidebar-text
&:before
color: #ccc
content: "\f0da"
font-size: 12px
margin-right: 6px
font-family: FontAwesome
transition: 0.2s ease
&:hover:before
color: color-sidebar-text-dark
ul, ol
list-style: none
li
border: none
padding-bottom: 0
.widget-float
a
font-size: font-size + 1
#recent-post
li
clearfix()
padding: 10px 0 10px 94px
border-bottom: 1px solid color-border
&.no-thumbnail
li
padding: 10px 0px
li
.item-thumbnail
opacity: 1
margin-left: -94px
transition: all 0.2s ease
float: left
.thumbnail
width: 80px
height: 80px
display: block
position: relative
overflow: hidden
span
width: 100%
height: 100%
display: block
.thumbnail-image
position: absolute
background-size: cover
background-position: center
.thumbnail-none
background-image: url(thumbnail-default-small)
background-size: 100% 100%
.item-inner
a
.item-category
font-size: 13px
text-transform: uppercase
a
color: color-theme
&:hover
color: color-sidebar-text-dark
a, .icon
margin-right: 5px
.item-title
font-size: 15px
a
color: color-sidebar-text-dark
transition: all 0.2s ease
.item-date
color: #aaa
font-size: 13px
text-transform: uppercase
&:hover
.item-thumbnail
opacity: 0.8
.item-title a
color: color-theme
.category-list-count
.tag-list-count
.archive-list-count
padding-left: 5px
color: color-grey
font-size: 0.85em
&:before
content: "("
&:after
content: ")"
.tagcloud
a
margin-right: 5px
.toc-article
margin: 0
padding: 0
.toc
padding: 0
margin: 10px 0 0
.toc-item
list-style: none