logo.vue 766 B

12345678910111213141516171819202122232425262728293031323334353637383940414243
  1. <template>
  2. <div class="logo" :style="{ width: width }">
  3. <router-link to="/">
  4. <img src="@/assets/logo1.svg" alt="logo" style="height:32px;width:32px;" />
  5. </router-link>
  6. <h1>{{ shortName }}</h1>
  7. </div>
  8. </template>
  9. <script>
  10. export default {
  11. props: {
  12. shortName: String,
  13. width: {
  14. type: String,
  15. default: '256px',
  16. },
  17. },
  18. };
  19. </script>
  20. <style lang="less" scoped>
  21. .logo {
  22. display: table;
  23. box-sizing: border-box;
  24. border-right: solid 1px #e6e6e6;
  25. padding: 0 16px;
  26. overflow: hidden;
  27. img,
  28. h1 {
  29. vertical-align: middle;
  30. }
  31. h1 {
  32. display: inline-block;
  33. margin: 0 0 0 12px;
  34. font-size: 1.3em;
  35. }
  36. .el-switch {
  37. vertical-align: middle;
  38. text-align: right;
  39. display: table-cell;
  40. }
  41. }
  42. </style>