_tab.scss 1.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657
  1. .tab {
  2. position: relative;
  3. padding: 0.5rem 0;
  4. margin: 2rem 0;
  5. &__links {
  6. height: 30px;
  7. border-top-left-radius: 0.25rem;
  8. @include flexbox();
  9. @include align-items(center);
  10. @include justify-content(flex-start);
  11. @include flex-wrap(wrap);
  12. }
  13. &__link {
  14. outline: none;
  15. border: none;
  16. cursor: pointer;
  17. font-size: 13.8px;
  18. font-family: $title-font;
  19. text-transform: capitalize;
  20. padding: 0.5rem 0.75rem;
  21. border-top-left-radius: 0.25rem;
  22. border-top-right-radius: 0.25rem;
  23. @include themify($themes) {
  24. color: themed('navbar-title-color');
  25. background-color: themed('body-background-color');
  26. border: none;
  27. border-bottom: 1px solid themed('hr-color');
  28. &.active {
  29. background-color: themed('body-background-color');
  30. border: 1px solid themed('hr-color');
  31. border-bottom: none;
  32. }
  33. @include on-event {
  34. color: themed('navbar-title-hover-color');
  35. background-color: themed('content-pre-header-background-color');
  36. }
  37. }
  38. }
  39. &__content {
  40. display: none;
  41. padding: 0 0.5rem;
  42. border-radius: 0.25rem;
  43. border-top-left-radius: 0;
  44. @include themify($themes) {
  45. border: 1px solid themed('hr-color');
  46. background-color: themed('body-background-color');
  47. }
  48. }
  49. }