notificationsDrawer.styl 1010 B

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657
  1. belize = #2980b9
  2. section#notifications-drawer
  3. position: fixed
  4. top: 28px
  5. right: 0
  6. width: 400px
  7. background-color: #fafafa
  8. box-shadow: 0 1px 2px rgba(0,0,0,0.15)
  9. border-radius: 2px
  10. max-height: calc(100vh - 28px - 36px)
  11. color: black
  12. padding-top 36px;
  13. overflow: scroll
  14. a:hover
  15. color: belize !important
  16. .header
  17. position: fixed
  18. top 28px
  19. right 0
  20. width calc(400px - 32px)
  21. padding: 8px 16px
  22. background: #ededed
  23. border-bottom: 1px solid #dbdbdb
  24. z-index 2
  25. .toggle-read
  26. position absolute
  27. left 16px
  28. top calc(50% - 8px)
  29. color belize
  30. h5
  31. text-align: center
  32. margin: 0
  33. .close
  34. position: absolute
  35. top: calc(50% - 12px)
  36. right: 12px
  37. font-size: 24px
  38. height: 24px
  39. line-height: 24px
  40. opacity 1
  41. .all-read
  42. color belize
  43. background-color: #fafafa
  44. margin 8px 16px 12px
  45. display inline-block
  46. ul.notifications
  47. display: block
  48. padding: 0px 16px
  49. margin: 0