<template functional>
  <div :aria-hidden="props.decorative"
        :aria-label="props.title"
        :class="[data.class, data.staticClass]"
        :style="{height: props.size + 'px', display: 'inline-block'}"
        class="material-design-icon nfc-variant-off-icon"
        role="img"
        v-bind="data.attrs"
        v-on="listeners">
    <svg :fill="props.fillColor"
         class="material-design-icon__svg"
         :width="props.size"
         :height="props.size"
         viewBox="0 0 24 24">
      <path d="M1.25,2.05L21.95,22.75L20.7,24L18.7,22H4A2,2 0 0,1 2,20V5.3L0,3.3L1.25,2.05M3.81,2C3.87,2 3.94,2 4,2H20C21.11,2 22,2.89 22,4V20C22,20.06 22,20.13 22,20.19L20,18.2V4H5.8L3.81,2M6,9.3L4,7.3V20H16.7L14.7,18H6V9.3M18,16.2L16,14.2V8H13V10.28C13.6,10.62 14,11.26 14,12C14,12.06 14,12.13 14,12.19L11,9.2V8A2,2 0 0,1 13,6H18V16.2M8,16H12.7L8,11.3V16M10,8H9.8L7.8,6H10V8Z">
        <title>{{ props.title }}</title>
      </path>
    </svg>
  </div>
</template>

<script>
export default {
  name: "NfcVariantOffIcon",
  props: {
    title: {
      type: String,
      default: "Nfc Variant Off icon"
    },
    decorative: {
      type: Boolean,
      default: false
    },
    fillColor: {
      type: String,
      default: "currentColor"
    },
    size: {
      type: Number,
      default: 24
    }
  }
}
</script>
