<template>
  <!-- eslint-disable -->
  <svg :height="height" data-name="contrast" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 912.5 703.5"><defs><linearGradient x1="424.5" y1="675" x2="424.5" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="gray" stop-opacity="0.25"/><stop offset="0.54" stop-color="gray" stop-opacity="0.12"/><stop offset="1" stop-color="gray" stop-opacity="0.1"/></linearGradient><linearGradient x1="191.5" y1="281" x2="191.5" y2="256" xlink:href="#a1217de1-da1b-4bbe-8b6b-df359b856d80"/><linearGradient x1="627.5" y1="281" x2="627.5" y2="256" gradientUnits="userSpaceOnUse"><stop offset="0" stop-opacity="0.12"/><stop offset="0.55" stop-opacity="0.09"/><stop offset="1" stop-opacity="0.02"/></linearGradient><linearGradient x1="198" y1="328" x2="198" y2="312" xlink:href="#a1217de1-da1b-4bbe-8b6b-df359b856d80"/><linearGradient x1="634" y1="328" x2="634" y2="312" xlink:href="#dfaf505b-dd53-4c52-bb27-3f20233ae8bb"/><linearGradient x1="634" y1="353" x2="634" y2="337" xlink:href="#dfaf505b-dd53-4c52-bb27-3f20233ae8bb"/><linearGradient x1="634" y1="378" x2="634" y2="362" xlink:href="#dfaf505b-dd53-4c52-bb27-3f20233ae8bb"/><linearGradient x1="634" y1="403" x2="634" y2="387" xlink:href="#dfaf505b-dd53-4c52-bb27-3f20233ae8bb"/><linearGradient x1="634" y1="428" x2="634" y2="412" xlink:href="#dfaf505b-dd53-4c52-bb27-3f20233ae8bb"/><linearGradient x1="198" y1="353" x2="198" y2="337" xlink:href="#a1217de1-da1b-4bbe-8b6b-df359b856d80"/><linearGradient x1="198" y1="378" x2="198" y2="362" xlink:href="#a1217de1-da1b-4bbe-8b6b-df359b856d80"/><linearGradient x1="198" y1="403" x2="198" y2="387" xlink:href="#a1217de1-da1b-4bbe-8b6b-df359b856d80"/><linearGradient x1="198" y1="428" x2="198" y2="412" xlink:href="#a1217de1-da1b-4bbe-8b6b-df359b856d80"/></defs><title>contrast</title><rect x="66.5" y="79.5" width="846" height="624" :fill="primaryColor" opacity="0.2"/><polygon points="0 0 0 34.06 0 675 849 675 849 34.06 849 0 0 0" fill="url(#a1217de1-da1b-4bbe-8b6b-df359b856d80)"/><rect x="12" y="42" width="828" height="621" fill="#fff"/><rect x="12" y="9" width="828" height="33" fill="#f5f5f5"/><circle cx="36" cy="25" r="8" fill="#ff5252"/><circle cx="58" cy="25" r="8" fill="#ff0"/><circle cx="80" cy="25" r="8" fill="#69f0ae"/><rect x="426" y="42" width="414" height="621" :fill="primaryColor"/><rect x="78" y="256" width="227" height="25" fill="url(#50b3c8bc-dd0e-4375-8727-34e41ad39fa8)"/><rect x="514" y="256" width="227" height="25" fill="url(#dfaf505b-dd53-4c52-bb27-3f20233ae8bb)"/><rect x="82" y="259" width="220" height="18" :fill="primaryColor"/><rect x="47" y="312" width="302" height="16" fill="url(#99ed4748-145a-4422-a012-b3270fb87fdc)"/><rect x="483" y="312" width="302" height="16" fill="url(#69284a17-3a7e-4461-bc9d-ec72dd0f9019)"/><rect x="483" y="337" width="302" height="16" fill="url(#d24cd686-1bb3-48c3-bb03-45084e2445d7)"/><rect x="483" y="362" width="302" height="16" fill="url(#0a34c182-11cb-46d2-9bee-306516ed3b5b)"/><rect x="483" y="387" width="302" height="16" fill="url(#34f95aaf-f4ca-4e12-941d-7adca9e033d3)"/><rect x="483" y="412" width="302" height="16" fill="url(#17dbb2a6-67e8-413e-95fb-50e0c7aab595)"/><rect x="47" y="337" width="302" height="16" fill="url(#50b6b42e-ba1d-4234-9b3e-ec3a0df448c2)"/><rect x="47" y="362" width="302" height="16" fill="url(#a1fc3972-393a-4ce3-8d80-f122a3c0b7bb)"/><rect x="47" y="387" width="302" height="16" fill="url(#194d01da-8667-4b3e-85ff-e74ede087b08)"/><rect x="47" y="412" width="302" height="16" fill="url(#4ae13924-7169-46dd-a41b-c9ba3b889a05)"/><rect x="50" y="314" width="297" height="11" :fill="primaryColor"/><rect x="50" y="339" width="297" height="11" :fill="primaryColor"/><rect x="50" y="364" width="297" height="11" :fill="primaryColor"/><rect x="50" y="389" width="297" height="11" :fill="primaryColor"/><rect x="50" y="414" width="297" height="11" :fill="primaryColor"/><rect x="517" y="259" width="220" height="18" fill="#fff"/><rect x="485" y="314" width="297" height="11" fill="#fff"/><rect x="485" y="339" width="297" height="11" fill="#fff"/><rect x="485" y="364" width="297" height="11" fill="#fff"/><rect x="485" y="389" width="297" height="11" fill="#fff"/><rect x="485" y="414" width="297" height="11" fill="#fff"/></svg>
  <!-- eslint-enable -->
</template>

<script>
export default {
  name: 'UndrawContrast',
  props: {
    /** Sets primaryColor of the illustration */
    primaryColor: {
      type: String,
      default: '#6c63ff'  
    },
    /** Sets height of the illustration */
    height: {
      type: String,
      default: '100'  
    }
  }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>

</style>
