style.css 2.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126
  1. #ar-walkthrough .ar-walkthrough-step {
  2. min-height: 20px;
  3. }
  4. #ar-walkthrough .ar-walkthrough-step {
  5. display: none;
  6. grid-template-columns: 48px 1fr;
  7. grid-template-rows: auto auto;
  8. grid-template-areas:
  9. "number text"
  10. ". warning";
  11. grid-column-gap: 10px;
  12. }
  13. #ar-walkthrough .ar-walkthrough-step.ar-walkthrough-selected {
  14. display: grid;
  15. }
  16. #ar-walkthrough .ar-walkthrough-step .ar-walkthrough-number {
  17. grid-area: number;
  18. width: 48px;
  19. height: 48px;
  20. background: #E7C9F6;
  21. border-radius: 100%;
  22. text-align: center;
  23. line-height: 48px;
  24. font-size: 1.5em;
  25. }
  26. #ar-walkthrough .ar-walkthrough-step .ar-walkthrough-text {
  27. grid-area: text;
  28. margin: 0;
  29. }
  30. #ar-walkthrough .ar-walkthrough-pages {
  31. display: grid;
  32. grid-column-gap: 10px;
  33. grid-auto-flow: column;
  34. justify-content: center;
  35. margin: 1em 0 0.5em 0;
  36. }
  37. #ar-walkthrough .ar-walkthrough-pages .ar-walkthrough-page {
  38. height: 25px;
  39. width: 25px;
  40. background: #E7C9F6;
  41. border-radius: 100%;
  42. text-align: center;
  43. line-height: 25px;
  44. font-size: 0.7em;
  45. cursor: pointer;
  46. }
  47. /* */
  48. #ar-line-graph svg .tick text {
  49. font-size: 14px;
  50. fill: #505050;
  51. }
  52. #ar-line-graph svg .tick line {
  53. stroke-width: 2;
  54. stroke: #505050;
  55. }
  56. #ar-line-graph svg .background {
  57. fill: #EBEBEB;
  58. }
  59. #ar-line-graph svg .axis-title text {
  60. transform: rotate(90deg);
  61. text-anchor: middle;
  62. fill: #505050;
  63. }
  64. #ar-line-graph svg .grid line {
  65. stroke: #fff;
  66. stroke-width: 2;
  67. }
  68. #ar-line-graph svg .grid .minor line {
  69. stroke-opacity: .5;
  70. }
  71. #ar-line-graph svg .grid text {
  72. display: none;
  73. }
  74. #ar-line-graph svg .axis path,
  75. #ar-line-graph svg .grid path {
  76. display: none;
  77. }
  78. #ar-line-graph svg .lines .mathline {
  79. fill: none;
  80. stroke-width: 1px;
  81. }
  82. #ar-line-graph .legend {
  83. display: grid;
  84. margin-bottom: 10px;
  85. grid-gap: 5px;
  86. }
  87. #ar-line-graph .legend svg.legend-item {
  88. display: block;
  89. }
  90. #ar-line-graph .legend svg.legend-item .legend-background {
  91. fill: #EBEBEB;
  92. }
  93. #ar-line-graph .legend svg.legend-item .legend-color {
  94. text-anchor: middle;
  95. alignment-baseline: middle;
  96. dominant-baseline: middle;
  97. font: 12px sans-serif;
  98. }
  99. #ar-line-graph .legend svg.legend-item .legend-text {
  100. text-anchor: start;
  101. alignment-baseline: middle;
  102. dominant-baseline: middle;
  103. font: 12px sans-serif;
  104. }