_global-view.scss 1.4 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485
  1. @use "variables";
  2. /*=== GLOBAL VIEW */
  3. /*================*/
  4. #stream {
  5. .box.category {
  6. &:not([data-unread="0"]) .box-title {
  7. // background: #3498db;
  8. }
  9. &:not([data-unread="0"]) .box-title:active {
  10. // background: #2980b9;
  11. }
  12. &:not([data-unread="0"]) .box-title .title {
  13. font-weight: bold;
  14. // color: #fff;
  15. }
  16. .box-title {
  17. padding: 1.5rem;
  18. background: none;
  19. a.title {
  20. color: variables.$grey-dark;
  21. font-size: 1rem;
  22. font-weight: normal;
  23. text-decoration: none;
  24. text-align: left;
  25. text-transform: uppercase;
  26. letter-spacing: 1px;
  27. &:not([data-unread="0"])::after {
  28. margin: -0.5rem 1rem 0 0;
  29. padding: 0 0.75rem;
  30. background: variables.$grey-light;
  31. border-radius: 12px;
  32. position: absolute;
  33. top: 1.75rem;
  34. right: 0;
  35. line-height: 1.5rem;
  36. text-align: center;
  37. }
  38. &:hover {
  39. color: variables.$main-first;
  40. }
  41. }
  42. }
  43. .box-content {
  44. padding-bottom: 0.5rem;
  45. .item.feed {
  46. padding: 0.5rem 1.5rem;
  47. // padding: 2px 10px;
  48. font-size: 1rem;
  49. a {
  50. color: variables.$main-font-color;
  51. font-weight: 400;
  52. &:hover {
  53. color: variables.$main-first;
  54. text-decoration: none;
  55. }
  56. }
  57. }
  58. }
  59. }
  60. }
  61. // le panel qui apparait en overlay pour afficher les flux
  62. #overlay {
  63. background: rgba(0, 0, 0, 0.65);
  64. }
  65. #panel {
  66. top: 3rem;
  67. right: 3rem;
  68. bottom: 3rem;
  69. left: 3rem;
  70. border-radius: 3px;
  71. }