17pdf_front_end/components/sdk/Platform.vue

<template>
  <div class="bg-[#EEF0FD]">
    <div class="container-sdk flex justify-around items-center h-80px">
      <div class="flex items-center text-20px leading-20px font-600"><Windows class="mr-6px" /><span>Windows</span></div>
      <div class="flex items-center text-20px leading-20px font-600"><Web class="mr-6px" /><span>Web</span></div>
      <div class="flex items-center text-20px leading-20px font-600"><Android class="mr-6px" /><span>Android</span></div>
      <div class="flex items-center text-20px leading-20px font-600"><Apple class="mr-6px" /><span>iOS</span></div>
      <div class="flex items-center text-20px leading-20px font-600"><Mac class="mr-6px" /><span>Mac Catalyst</span></div>
      <div class="flex items-center text-20px leading-20px font-600"><Server class="mr-6px" /><span>Server</span></div>
      <div class="flex items-center text-20px leading-20px font-600"><Flutter class="mr-6px" /><span>Flutter</span></div>
      <div class="flex items-center text-20px leading-20px font-600"><Electron class="mr-6px" /><span>Electron</span></div>
    </div>
  </div>
</template>
<script>
import Apple from '~/assets/images/tools/apple.svg?inline'
import Android from '~/assets/images/tools/android.svg?inline'
import Windows from '~/assets/images/tools/windows.svg?inline'
import Mac from '~/assets/images/tools/mac.svg?inline'
import Web from '~/assets/images/tools/web.svg?inline'
import Server from '~/assets/images/tools/server.svg?inline'
import Flutter from '~/assets/images/tools/flutter.svg?inline'
import Electron from '~/assets/images/tools/electron.svg?inline'

export default {
  components: {
    Apple,
    Android,
    Windows,
    Mac,
    Web,
    Server,
    Flutter,
    Electron
  }
}
</script>

<style>
.container-sdk {
  width: 100%;
  margin-right: auto;
  margin-left: auto;
  padding-left: 20px;
  padding-right: 20px;
}
@media (min-width: 930px) {
  .container-sdk {
    max-width: 930px;
    min-width: 900px;
  }
}
@media (min-width: 1280px) {
  .container-sdk {
    max-width: 1200px;
  }
}
</style>