sidebar.styl 2.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130
  1. #sidebar
  2. @media mq-normal
  3. column(sidebar-column)
  4. .widget
  5. @extend $base-style
  6. line-height: line-height
  7. word-wrap: break-word
  8. font-size: 0.9em
  9. ul, ol
  10. list-style: none
  11. margin: 0
  12. ul, ol
  13. margin: 0 20px
  14. ul
  15. list-style: disc
  16. ol
  17. list-style: decimal
  18. .category-list-count
  19. .tag-list-count
  20. .archive-list-count
  21. padding-left: 5px
  22. color: color-grey
  23. font-size: 0.85em
  24. &:before
  25. content: "("
  26. &:after
  27. content: ")"
  28. .tagcloud
  29. a
  30. margin-right: 5px
  31. .widget-wrap
  32. margin: block-margin 10px
  33. .widget-title
  34. @extend $block-caption
  35. margin-bottom: 0
  36. .widget
  37. padding: 15px 5px
  38. a
  39. color: color-sidebar-text
  40. text-decoration: none
  41. &:hover
  42. color: color-sidebar-text-dark
  43. ul, ol, dl
  44. ul, ol, dl
  45. margin-left: 15px
  46. list-style: disc
  47. ul, ol
  48. list-style: none
  49. li
  50. padding: 10px 0
  51. font-size: font-size
  52. border-bottom: 1px solid border-color
  53. a
  54. color: color-sidebar-text
  55. ul, ol
  56. list-style: none
  57. li
  58. border: none
  59. &:last-child
  60. padding-bottom: 0px
  61. ul:not(#recent-post), ol:not(#recent-post)
  62. li
  63. a
  64. &:before
  65. color: #ccc
  66. content: "\f0da"
  67. font-size: 12px
  68. margin-right: 6px
  69. font-family: FontAwesome
  70. transition: 0.2s ease
  71. &:hover:before
  72. color: color-sidebar-text-dark
  73. #recent-post
  74. li
  75. clearfix()
  76. padding: 10px 0 10px 94px
  77. .item-thumbnail
  78. opacity: 1
  79. float: left
  80. margin-left: -94px
  81. transition: all 0.2s ease
  82. .thumbnail
  83. width: 80px
  84. height: 80px
  85. display: block
  86. position: relative
  87. overflow: hidden
  88. span
  89. width: 100%
  90. height: 100%
  91. display: block
  92. .thumbnail-image
  93. position: absolute
  94. background-size: cover
  95. background-position: center
  96. .thumbnail-none
  97. background-image: url(thumbnail-default-small)
  98. background-size: 100% 100%
  99. .item-inner
  100. a
  101. .item-category
  102. font-size: 13px
  103. text-transform: uppercase
  104. a
  105. color: color-link
  106. &:hover
  107. color: color-sidebar-text-dark
  108. a, .icon
  109. margin-right: 5px
  110. .item-title
  111. font-size: 15px
  112. a
  113. color: color-sidebar-text-dark
  114. transition: all 0.2s ease
  115. .item-date
  116. color: #aaa
  117. font-size: 13px
  118. text-transform: uppercase
  119. &:hover
  120. .item-thumbnail
  121. opacity: 0.8
  122. .item-title a
  123. color: color-link