GithubRibbon.vue 1.0 KB

12345678910111213141516171819202122232425262728293031323334353637
  1. <template>
  2. <div
  3. class="github-ribbon"
  4. style="
  5. position: absolute;
  6. right: 0px;
  7. top: 0px;
  8. width: 150px;
  9. height: 150px;
  10. overflow: hidden;
  11. z-index: 99999;
  12. "
  13. >
  14. <a
  15. style="
  16. display: inline-block;
  17. width: 200px;
  18. overflow: hidden;
  19. padding: 6px 0px;
  20. text-align: center;
  21. transform: rotate(45deg);
  22. text-decoration: none;
  23. color: rgb(255, 255, 255);
  24. position: inherit;
  25. top: 45px;
  26. right: -40px;
  27. border-width: 1px 0px;
  28. border-style: dotted;
  29. border-color: rgba(255, 255, 255, 0.7);
  30. font: 700 13px 'Helvetica Neue', Helvetica, Arial, sans-serif;
  31. box-shadow: rgba(0, 0, 0, 0.5) 0px 2px 3px 0px;
  32. background-color: rgb(170, 0, 0);
  33. "
  34. href="https://github.com/feitian124/vue3-tailwind3-website-starter"
  35. >Fork me on GitHub</a>
  36. </div>
  37. </template>