specific.sass 3.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164
  1. #images
  2. tr
  3. td:nth-child(2)
  4. width: 320px
  5. .bd-color
  6. border-radius: 2px
  7. box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.1), inset 0 0 0 1px rgba(0, 0, 0, 0.1)
  8. display: inline-block
  9. float: left
  10. height: 24px
  11. margin-right: 8px
  12. width: 24px
  13. .button.bd-is-rss
  14. background-color: #f26522
  15. border-color: transparent
  16. color: #fff
  17. &:hover
  18. background-color: darken(#f26522, 5%)
  19. &:active
  20. background-color: darken(#f26522, 10%)
  21. .bd-view-all-versions
  22. color: $text-light
  23. &:hover
  24. text-decoration: underline
  25. .bd-feature-title
  26. color: $text-light
  27. a
  28. border-bottom: 1px solid transparent
  29. color: $text-strong
  30. &:hover
  31. border-bottom-color: $primary
  32. .bd-anchor-title
  33. padding-top: 1.5rem
  34. position: relative
  35. +until($widescreen)
  36. padding-left: 2rem
  37. .bd-anchor-link
  38. position: absolute
  39. right: calc(100% + 1rem)
  40. +until($widescreen)
  41. left: 0
  42. right: auto
  43. .bd-article-image
  44. background-color: $primary
  45. display: block
  46. height: 240px
  47. margin-left: auto
  48. margin-right: auto
  49. overflow: hidden
  50. position: relative
  51. text-align: center
  52. @each $name, $pair in $colors
  53. $color: nth($pair, 1)
  54. &.is-#{$name}
  55. background-color: $color
  56. &.is-bootstrap
  57. background-color: $bootstrap
  58. &.is-orange
  59. background-color: $orange
  60. &:hover
  61. .bd-article-overlay
  62. opacity: 0.25
  63. .bd-article-icon
  64. transform: scale(1.4)
  65. .bd-article-date
  66. transform: scale(0.9)
  67. .bd-article-title
  68. transform: scale(1.1)
  69. &.is-single
  70. margin-bottom: 2rem
  71. width: 100%
  72. .bd-article-overlay
  73. +overlay
  74. background-color: $black
  75. opacity: 0
  76. transition-duration: $speed
  77. transition-property: opacity
  78. transition-timing-function: $easing
  79. .bd-article-icon,
  80. .bd-article-info
  81. +overlay
  82. align-items: center
  83. display: flex
  84. justify-content: center
  85. .bd-article-icon,
  86. .bd-article-date,
  87. .bd-article-title
  88. transition-duration: $speed
  89. transition-property: transform
  90. transition-timing-function: $easing
  91. .bd-article-icon
  92. color: $black
  93. opacity: 0.25
  94. & > span
  95. display: block
  96. .fa
  97. font-size: 56px
  98. .bd-article-info
  99. padding: 20px
  100. .bd-article-date
  101. color: rgba(#000, 0.5)
  102. display: block
  103. .bd-article-title
  104. color: $white
  105. display: block
  106. font-size: 2.5rem
  107. font-weight: $weight-bold
  108. line-height: 1.25
  109. padding: 0 20px
  110. .bd-emoji
  111. margin-right: 0.5em
  112. margin-top: 2px
  113. $notification-background-color: $background !default
  114. $notification-radius: $radius !default
  115. $notification-padding: 1.25rem 2.5rem 1.25rem 1.5rem !default
  116. .bd-notification
  117. background-color: $background
  118. border-radius: $radius
  119. padding: 1.25rem 0
  120. position: relative
  121. text-align: center
  122. .title,
  123. .subtitle,
  124. .content,
  125. strong
  126. color: currentColor
  127. code,
  128. pre
  129. background: $white
  130. pre code
  131. background: transparent
  132. // Colors
  133. @each $name, $pair in $colors
  134. $color: nth($pair, 1)
  135. $color-invert: nth($pair, 2)
  136. &.is-#{$name}
  137. background-color: $color
  138. color: $color-invert
  139. .bd-icon-size .icon
  140. background-color: $yellow
  141. .bd-mwb-table
  142. td
  143. vertical-align: middle
  144. img
  145. vertical-align: middle