ide-redesign.scss 1.7 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283
  1. :root {
  2. --ide-redesign-background: var(--bg-dark-primary);
  3. --ide-redesign-color: var(--content-primary-dark);
  4. --ide-redesign-resizing-background: var(--bg-dark-primary);
  5. --ide-redesign-color-scheme: dark;
  6. }
  7. @include theme('light') {
  8. --ide-redesign-background: var(--bg-light-primary);
  9. --ide-redesign-color: var(--content-primary);
  10. --ide-redesign-resizing-background: var(--white);
  11. --ide-redesign-color-scheme: light;
  12. }
  13. .ide-redesign-body {
  14. color-scheme: var(--ide-redesign-color-scheme);
  15. display: flex;
  16. flex-grow: 1;
  17. background-color: var(--ide-redesign-background);
  18. color: var(--ide-redesign-color);
  19. overflow-y: hidden;
  20. z-index: 0;
  21. }
  22. .ide-redesign-main {
  23. height: 100%;
  24. display: flex;
  25. flex-direction: column;
  26. .ide-panel-group-resizing {
  27. background-color: var(--ide-redesign-resizing-background);
  28. }
  29. }
  30. .ide-skeleton-block {
  31. border: 1px solid grey;
  32. background-color: white;
  33. }
  34. .ide-redesign-full-height {
  35. height: 100%;
  36. }
  37. .ide-redesign-pdf-container {
  38. position: relative;
  39. }
  40. .ide-redesign-editor-container {
  41. position: relative;
  42. height: 100%;
  43. display: flex;
  44. flex-direction: column;
  45. }
  46. .ide-redesign-editor-content {
  47. flex: 1 1 auto;
  48. position: relative;
  49. }
  50. .ide-redesign-labs-user-beta-promo {
  51. position: absolute;
  52. top: 60px;
  53. right: 28px;
  54. z-index: 100000;
  55. max-width: 560px;
  56. font-size: var(--font-size-03);
  57. line-height: var(--line-height-03);
  58. .notification-content {
  59. display: flex;
  60. flex-direction: column;
  61. gap: var(--spacing-02);
  62. align-items: flex-start;
  63. }
  64. }
  65. .ide-redesign-labs-user-beta-promo-title {
  66. font-weight: bold;
  67. }
  68. .ide-redesign-labs-user-beta-promo-button {
  69. margin-top: var(--spacing-05);
  70. }