_PanelOptionsGroup.scss 1.1 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667
  1. .panel-options-group {
  2. margin-bottom: 10px;
  3. border: $panel-options-group-border;
  4. border-radius: $border-radius;
  5. background: $page-bg;
  6. }
  7. .panel-options-group__header {
  8. padding: 4px 8px;
  9. background: $panel-options-group-header-bg;
  10. position: relative;
  11. border-radius: $border-radius $border-radius 0 0;
  12. display: flex;
  13. align-items: center;
  14. .btn {
  15. position: absolute;
  16. right: 0;
  17. top: 0;
  18. }
  19. }
  20. .panel-options-group__add-btn {
  21. background: none;
  22. border: none;
  23. display: flex;
  24. align-items: center;
  25. padding: 0;
  26. &:hover {
  27. .panel-options-group__add-circle {
  28. background-color: $btn-success-bg;
  29. color: $white;
  30. }
  31. }
  32. }
  33. .panel-options-group__add-circle {
  34. @include gradientBar($btn-success-bg, $btn-success-bg-hl);
  35. border-radius: 50px;
  36. width: 20px;
  37. height: 20px;
  38. display: flex;
  39. align-items: center;
  40. justify-content: center;
  41. margin-right: 6px;
  42. i {
  43. position: relative;
  44. top: 1px;
  45. }
  46. }
  47. .panel-options-group__title {
  48. font-size: 1.1rem;
  49. position: relative;
  50. top: 1px;
  51. }
  52. .panel-options-group__body {
  53. padding: 20px;
  54. &--queries {
  55. min-height: 200px;
  56. }
  57. }