<template>
  <v-container>
    <div class="h3 my-5 py-5 body-font1">Boxed Products & Ordering</div>

    <div class="padding-space">
      <v-hover v-slot:default="{ hover }">
        <router-link
          class="text-decoration-none whyteTmin10-font"
          to
          @click.native="
            goToLink(
              'http://emarketing.crane.com/retailer-portal/Crane-Stationery-2021-Catalog.pdf'
            )
          "
        >
          <div
            :class="hover ? 'primary--text' : 'black--text'"
            class="subheading"
          >
            2021 Boxed Catalog
          </div>
        </router-link>
      </v-hover>
    </div>

    <div>
      <v-hover v-slot:default="{ hover }">
        <router-link
          class="text-decoration-none whyteTmin10-font"
          to
          @click.native="
            goToLink(
              'http://emarketing.crane.com/retailer-portal/Crane-Stationery-2021-Boxed-Holiday-Catalog.pdf'
            )
          "
        >
          <div
            :class="hover ? 'primary--text' : 'black--text'"
            class="subheading"
          >
            2021 Boxed Holiday Catalog
          </div>
        </router-link>
      </v-hover>
    </div>

    <div>
      <v-hover v-slot:default="{ hover }">
        <router-link class="text-decoration-none whyteTmin10-font" to="">
          <!-- to
            @click.native="gotoLink('http://emarketing.crane.com/retailer-portal/Crane-Stationery-2021-Boxed-Holiday-Price-List.xlsx')" -->
          <div
            :class="hover ? 'primary--text' : 'black--text'"
            class="subheading"
          >
            2021 Boxed Holiday Price List (Excel)
          </div>
        </router-link>
      </v-hover>
    </div>

    <div>
      <v-hover v-slot:default="{ hover }">
        <router-link
          class="text-decoration-none whyteTmin10-font"
          to
          @click.native="
            goToLink(
              'http://emarketing.crane.com/retailer-portal/Crane-Stationery-2021-Boxed-Holiday-Price-List.pdf'
            )
          "
          :class="hover ? 'primary--text' : 'black--text'"
        >
          <div
            :class="hover ? 'primary--text' : 'black--text'"
            class="subheading"
          >
            2021 Boxed Holiday Price List (PDF)
          </div>
        </router-link>
      </v-hover>
    </div>

    <div class="padding-space">
      <v-hover v-slot:default="{ hover }">
        <router-link
          class="text-decoration-none whyteTmin10-font"
          to
          @click.native="
            goToLink(
              'http://emarketing.crane.com/retailer-portal/Downton-Abbey-Catalog.pdf'
            )
          "
        >
          <div
            :class="hover ? 'primary--text' : 'black--text'"
            class="subheading"
          >
            Downton Abbey Catalog
          </div>
        </router-link>
      </v-hover>
    </div>

    <div class="padding-space">
      <v-hover v-slot:default="{ hover }">
        <router-link
          class="text-decoration-none whyteTmin10-font"
          :to="{ name: 'ResourcesPage' }"
        >
          <div
            :class="hover ? 'primary--text' : 'black--text'"
            class="subheading"
          >
            Back to Resources
          </div>
        </router-link>
      </v-hover>
    </div>
  </v-container>
</template>
<script>
export default {
  name: "BoxedProductsOrdering",
  methods: {
    goToLink(pageLink) {
      // window.location.replace(pageLink);
      //} else {
      window.open(pageLink, "_blank");
      //}
    },
  },
};
</script>

<style src="./boxed-products-ordering.scss" lang="scss" scoped/>