You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

_navigate_section_list.scss 1.6KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980
  1. %navigate-section-list-text {
  2. width: 100%;
  3. font-size: 14px;
  4. line-height: 20px;
  5. color: $welcomePageTitleColor;
  6. text-align: left;
  7. font-family: 'open_sanslight', Helvetica, sans-serif;
  8. }
  9. %navigate-section-list-tile-text {
  10. @extend %navigate-section-list-text;
  11. overflow: hidden;
  12. text-overflow: ellipsis;
  13. float: left;
  14. }
  15. .navigate-section-list-tile {
  16. background-color: #1754A9;
  17. border-radius: 4px;
  18. box-sizing: border-box;
  19. display: inline-flex;
  20. margin-bottom: 8px;
  21. margin-right: 8px;
  22. min-height: 100px;
  23. padding: 16px;
  24. width: 100%;
  25. &.with-click-handler {
  26. cursor: pointer;
  27. }
  28. &.with-click-handler:hover {
  29. background-color: #1a5dbb;
  30. }
  31. i {
  32. cursor: inherit;
  33. }
  34. .element-after {
  35. display: flex;
  36. align-items: center;
  37. justify-content: center;
  38. }
  39. .join-button {
  40. display: none;
  41. }
  42. &:hover .join-button {
  43. display: block
  44. }
  45. }
  46. .navigate-section-tile-body {
  47. @extend %navigate-section-list-tile-text;
  48. font-weight: normal;
  49. line-height: 24px;
  50. }
  51. .navigate-section-list-tile-info {
  52. flex: 1;
  53. word-break: break-word;
  54. }
  55. .navigate-section-tile-title {
  56. @extend %navigate-section-list-tile-text;
  57. font-weight: bold;
  58. line-height: 24px;
  59. }
  60. .navigate-section-section-header {
  61. @extend %navigate-section-list-text;
  62. font-weight: bold;
  63. margin-bottom: 16px;
  64. display: block;
  65. }
  66. .navigate-section-list {
  67. position: relative;
  68. margin-top: 36px;
  69. margin-bottom: 36px;
  70. width: 100%;
  71. }
  72. .navigate-section-list-empty {
  73. text-align: center;
  74. }