_AddPanelWidget.scss 1.5 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586
  1. .add-panel-widget-container {
  2. height: 100%;
  3. }
  4. .add-panel-widget {
  5. height: 100%;
  6. }
  7. .add-panel-widget__header {
  8. top: 0;
  9. position: absolute;
  10. padding: 0 15px;
  11. display: flex;
  12. align-items: center;
  13. width: 100%;
  14. cursor: move;
  15. background: $page-header-bg;
  16. box-shadow: $page-header-shadow;
  17. border-bottom: 1px solid $page-header-border-color;
  18. .gicon {
  19. font-size: 30px;
  20. margin-right: $space-md;
  21. }
  22. &:hover {
  23. transition: background-color 0.1s ease-in-out;
  24. background-color: $panel-header-hover-bg;
  25. }
  26. }
  27. .add-panel-widget__title {
  28. font-size: $font-size-md;
  29. font-weight: $font-weight-semi-bold;
  30. margin-right: $space-xl;
  31. }
  32. .add-panel-widget__link {
  33. margin: 0 $space-sm;
  34. width: 160px;
  35. height: 88px !important;
  36. flex-direction: column !important;
  37. }
  38. .add-panel-widget__icon {
  39. margin-bottom: $space-sm;
  40. .gicon {
  41. color: white;
  42. height: 44px;
  43. width: 53px;
  44. position: relative;
  45. left: 5px;
  46. }
  47. }
  48. .add-panel-widget__close {
  49. margin-left: auto;
  50. background-color: transparent;
  51. border: 0;
  52. font-size: 16px;
  53. margin-right: -10px;
  54. }
  55. .add-panel-widget__create {
  56. display: inherit;
  57. margin-bottom: $space-lg;
  58. // this is to have the big button appear centered
  59. margin-top: 55px;
  60. }
  61. .add-panel-widget__actions {
  62. display: inherit;
  63. }
  64. .add-panel-widget__action {
  65. margin: 0 $space-xs;
  66. }
  67. .add-panel-widget__btn-container {
  68. height: 100%;
  69. display: flex;
  70. justify-content: center;
  71. align-items: center;
  72. flex-direction: column;
  73. }