Ви не можете вибрати більше 25 тем Теми мають розпочинатися з літери або цифри, можуть містити дефіси (-) і не повинні перевищувати 35 символів.

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869
  1. /**
  2. * Layout helpers.
  3. */
  4. // Stretch an element vertically based on available space
  5. .reveal .stretch,
  6. .reveal .r-stretch {
  7. max-width: none;
  8. max-height: none;
  9. }
  10. .reveal pre.stretch code,
  11. .reveal pre.r-stretch code {
  12. height: 100%;
  13. max-height: 100%;
  14. box-sizing: border-box;
  15. }
  16. // Text that auto-fits its container
  17. .reveal .r-fit-text {
  18. display: inline-block; // https://github.com/rikschennink/fitty#performance
  19. white-space: nowrap;
  20. }
  21. // Stack multiple elements on top of each other
  22. .reveal .r-stack {
  23. display: grid;
  24. }
  25. .reveal .r-stack > * {
  26. grid-area: 1/1;
  27. margin: auto;
  28. }
  29. // Horizontal and vertical stacks
  30. .reveal .r-vstack,
  31. .reveal .r-hstack {
  32. display: flex;
  33. img, video {
  34. min-width: 0;
  35. min-height: 0;
  36. object-fit: contain;
  37. }
  38. }
  39. .reveal .r-vstack {
  40. flex-direction: column;
  41. align-items: center;
  42. justify-content: center;
  43. }
  44. .reveal .r-hstack {
  45. flex-direction: row;
  46. align-items: center;
  47. justify-content: center;
  48. }
  49. // Naming based on tailwindcss
  50. .reveal .items-stretch { align-items: stretch; }
  51. .reveal .items-start { align-items: flex-start; }
  52. .reveal .items-center { align-items: center; }
  53. .reveal .items-end { align-items: flex-end; }
  54. .reveal .justify-between { justify-content: space-between; }
  55. .reveal .justify-around { justify-content: space-around; }
  56. .reveal .justify-start { justify-content: flex-start; }
  57. .reveal .justify-center { justify-content: center; }
  58. .reveal .justify-end { justify-content: flex-end; }