fix for background colors and svgs

Author: jprester

public/img/halfCircle.svg

@@ -5,10 +5,14 @@ body {
   color: $black;
 }
 
+#root {
+  height: 100%;
+}
+
 .App {
   background-color: $white;
   color: $black;
-  height: 100vh;
+  height: 100%;
 }
 
 .App.dark {

public/img/lightning.svg

@@ -5,8 +5,8 @@ export default function IconEaiBrain(props) {
 
   return (
     <svg width="22px" height="22px" viewBox="0 0 22 22" version="1.1" xmlns="http://www.w3.org/2000/svg" {...props}>
-      <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-        <g id="Desktop" transform="translate(-422.000000, -185.000000)" fill={fill || "#000000"} fill-rule="nonzero">
+      <g id="Page-1" stroke="none" strokeWidth="1" fill="none" fillRule="evenodd">
+        <g id="Desktop" transform="translate(-422.000000, -185.000000)" fill={fill || "#000000"} fillRule="nonzero">
           <path
             d="M427.67875,186.090984 C428.616467,185.380817 429.761216,184.997784 430.9375,185.000609 C431.76312,184.982095 432.540997,185.386591 433,186.073109 C433.459003,185.386591 434.23688,184.982095 435.0625,185.000609 C436.238784,184.997784 437.383533,185.380817 438.32125,186.090984 C439.043125,186.651984 439.6,187.428859 439.796625,188.367984 C440.247625,188.402359 440.660125,188.589359 441.006625,188.871234 C441.531875,189.297484 441.914125,189.936859 442.15475,190.613359 C442.5315,191.665234 442.63325,193.005859 442.24275,194.147109 C442.34175,194.193859 442.439375,194.248859 442.53425,194.312109 C442.912375,194.563734 443.19975,194.923984 443.4115,195.348859 C443.828125,196.180734 444,197.341234 444,198.750609 C444,200.319484 443.401875,201.372734 442.642875,202.023109 C442.223156,202.382982 441.727839,202.643799 441.193625,202.786234 C441.056125,203.553484 440.671125,204.441734 440.0675,205.195234 C439.28375,206.178359 438.06825,207.000609 436.4375,207.000609 C435.145,207.000609 434.1165,206.285609 433.44825,205.584359 C433.288488,205.416928 433.138808,205.240159 433,205.054984 C432.86121,205.240173 432.711529,205.416943 432.55175,205.584359 C431.8835,206.285609 430.856375,207.000609 429.5625,207.000609 C427.93175,207.000609 426.717625,206.178359 425.9325,205.195234 C425.368419,204.494754 424.982068,203.668272 424.806375,202.786234 C424.272161,202.643799 423.776844,202.382982 423.357125,202.023109 C422.598125,201.372734 422,200.318109 422,198.750609 C422,197.341234 422.17325,196.179359 422.5885,195.348859 C422.80025,194.923984 423.087625,194.565109 423.46575,194.310734 C423.558614,194.249259 423.656068,194.195016 423.75725,194.148484 C423.36675,193.004484 423.4685,191.665234 423.84525,190.613359 C424.085875,189.936859 424.468125,189.297484 424.993375,188.871234 C425.339875,188.589359 425.752375,188.403734 426.203375,188.367984 C426.401375,187.428859 426.95825,186.651984 427.680125,186.090984 L427.67875,186.090984 Z M432.3125,188.438109 L432.3125,188.424359 L432.30975,188.355609 C432.289508,187.997151 432.218205,187.643418 432.098,187.305109 C432.012424,187.049718 431.866705,186.818642 431.673125,186.631359 C431.470031,186.454506 431.206502,186.362887 430.9375,186.375609 C430.067046,186.372625 429.219362,186.653577 428.523,187.175859 C427.885,187.672234 427.5,188.344609 427.5,189.125609 C427.499832,189.34648 427.393557,189.553822 427.214344,189.682921 C427.03513,189.81202 426.804804,189.847155 426.59525,189.777359 C426.33675,189.692109 426.10575,189.740234 425.859625,189.938234 C425.590125,190.158234 425.3275,190.548734 425.139125,191.075359 C424.7555,192.150609 424.795375,193.452734 425.322,194.244734 C425.397211,194.357528 425.437395,194.49004 425.4375,194.625609 L426.46875,194.625609 C428.177381,194.625609 429.5625,196.010728 429.5625,197.719359 L429.5625,198.179984 C430.509563,198.514822 431.077662,199.483255 430.907797,200.473301 C430.737932,201.463347 429.879512,202.187028 428.875,202.187028 C427.870488,202.187028 427.012068,201.463347 426.842203,200.473301 C426.672338,199.483255 427.240437,198.514822 428.1875,198.179984 L428.1875,197.719359 C428.1875,196.770609 427.4175,196.000609 426.46875,196.000609 L424.0625,196.000609 C423.980304,196.000474 423.8988,195.985571 423.821875,195.956609 L423.81775,195.964859 C423.5455,196.507984 423.375,197.409984 423.375,198.750609 C423.375,199.931734 423.808125,200.597234 424.25225,200.978109 C424.729375,201.387859 425.25875,201.500609 425.4375,201.500609 C425.817196,201.500609 426.125,201.808413 426.125,202.188109 C426.125,202.694109 426.4,203.578234 427.005,204.337234 C427.594875,205.072859 428.44325,205.625609 429.5625,205.625609 C430.3325,205.625609 431.02275,205.195234 431.55625,204.635609 C431.818875,204.360609 432.02375,204.075984 432.157125,203.842234 C432.217839,203.73857 432.26981,203.630028 432.3125,203.517734 L432.3125,192.563109 L430.820625,192.563109 C430.485788,193.510173 429.517354,194.078271 428.527309,193.908406 C427.537263,193.738541 426.813581,192.880122 426.813581,191.875609 C426.813581,190.871097 427.537263,190.012677 428.527309,189.842812 C429.517354,189.672947 430.485788,190.241046 430.820625,191.188109 L432.3125,191.188109 L432.3125,188.438109 Z M433.6875,202.186734 L433.6875,203.516359 C433.730201,203.628648 433.782172,203.737189 433.842875,203.840859 C433.977625,204.074609 434.181125,204.359234 434.442375,204.634234 C434.97725,205.193859 435.668875,205.624234 436.4375,205.624234 C437.55675,205.624234 438.405125,205.071484 438.995,204.335859 C439.6,203.576859 439.875,202.692734 439.875,202.186734 C439.875,201.807038 440.182804,201.499234 440.5625,201.499234 C440.74125,201.499234 441.270625,201.386484 441.74775,200.976734 C442.191875,200.595859 442.625,199.930359 442.625,198.749234 C442.625,197.408609 442.453125,196.507984 442.18225,195.963484 C442.091631,195.76073 441.949395,195.585305 441.76975,195.454734 C441.614935,195.355766 441.433621,195.306361 441.25,195.313109 C440.996621,195.312978 440.763852,195.173489 440.644257,194.95011 C440.524661,194.726731 440.537628,194.455677 440.678,194.244734 C441.206,193.452734 441.2445,192.150609 440.860875,191.075359 C440.6725,190.548734 440.409875,190.156859 440.140375,189.938234 C439.89425,189.740234 439.66325,189.690734 439.40475,189.777359 C439.195196,189.847155 438.96487,189.81202 438.785656,189.682921 C438.606443,189.553822 438.500168,189.34648 438.5,189.125609 C438.5,188.344609 438.115,187.672234 437.475625,187.175859 C436.779639,186.653861 435.932484,186.372924 435.0625,186.375609 C434.793498,186.362887 434.529969,186.454506 434.326875,186.631359 C434.132712,186.818425 433.9865,187.049535 433.900625,187.305109 C433.769721,187.664266 433.69775,188.042227 433.6875,188.424359 L433.6875,200.813109 L434.71875,200.813109 C435.6675,200.813109 436.4375,200.043109 436.4375,199.094359 L436.4375,196.571234 C435.490437,196.236397 434.922338,195.267964 435.092203,194.277918 C435.262068,193.287872 436.120488,192.564191 437.125,192.564191 C438.129512,192.564191 438.987932,193.287872 439.157797,194.277918 C439.327662,195.267964 438.759563,196.236397 437.8125,196.571234 L437.8125,199.094359 C437.8125,200.80299 436.427381,202.188109 434.71875,202.188109 L433.6875,202.188109 L433.6875,202.186734 Z M428.1875,191.875609 C428.1875,192.255305 428.495304,192.563109 428.875,192.563109 C429.254696,192.563109 429.5625,192.255305 429.5625,191.875609 C429.5625,191.495913 429.254696,191.188109 428.875,191.188109 C428.495304,191.188109 428.1875,191.495913 428.1875,191.875609 Z M437.125,195.313109 C437.504696,195.313109 437.8125,195.005305 437.8125,194.625609 C437.8125,194.245913 437.504696,193.938109 437.125,193.938109 C436.745304,193.938109 436.4375,194.245913 436.4375,194.625609 C436.4375,195.005305 436.745304,195.313109 437.125,195.313109 Z M428.875,199.438109 C428.495304,199.438109 428.1875,199.745913 428.1875,200.125609 C428.1875,200.505305 428.495304,200.813109 428.875,200.813109 C429.254696,200.813109 429.5625,200.505305 429.5625,200.125609 C429.5625,199.745913 429.254696,199.438109 428.875,199.438109 Z"
             id="Shape"></path>

src/App.scss

@@ -9,12 +9,10 @@ export default function IconXClose(props) {
       aria-hidden="true"
       focusable="false"
       role="img"
-      class="iconify iconify--clarity"
       preserveAspectRatio="xMidYMid meet"
       viewBox="0 0 36 36"
       {...props}>
       <path
-        class="clr-i-outline clr-i-outline-path-1"
         d="M19.41 18l8.29-8.29a1 1 0 0 0-1.41-1.41L18 16.59l-8.29-8.3a1 1 0 0 0-1.42 1.42l8.3 8.29l-8.3 8.29A1 1 0 1 0 9.7 27.7l8.3-8.29l8.29 8.29a1 1 0 0 0 1.41-1.41z"
         fill={fill || "#34566f"}></path>
     </svg>

src/icons/IconEaiBrain.jsx

@@ -52,3 +52,8 @@ a {
 .centralize-text {
   text-align: center;
 }
+
+html,
+body {
+  height: 100%;
+}