theme.vue 1.8 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798
  1. <template>
  2. <div class="wrapper">
  3. 主题
  4. <p id='copy'>这个用来实验按钮的好坏</p>
  5. <button class="btncp" data-clipboard-target="#copy">点击复制</button>
  6. </div>
  7. </template>
  8. <style>
  9. body{
  10. background: #fff;
  11. }
  12. </style>
  13. <script>
  14. export default {
  15. name:'index',
  16. data(){
  17. return{
  18. path:'',
  19. packages:{},
  20. sortedPackages:[],
  21. version:''
  22. }
  23. },
  24. watch:{
  25. packages(){
  26. const compare = (obj1, obj2)=>{
  27. const val1 = obj1.name;
  28. const val2 = obj2.name;
  29. if (val1 < val2) {
  30. return -1;
  31. } else if (val1 > val2) {
  32. return 1;
  33. } else {
  34. return 0;
  35. }
  36. }
  37. this.sortedPackages = [...this.packages].sort(compare);
  38. }
  39. },
  40. methods:{
  41. },
  42. created(){
  43. // copys.on('success', function(e) {
  44. // console.info('Action:', e.action);
  45. // console.info('Text:', e.text);
  46. // console.info('Trigger:', e.trigger);
  47. // e.clearSelection();
  48. // });
  49. }
  50. }
  51. </script>
  52. <style>
  53. </style>
  54. <style lang="scss" scoped>
  55. .logo{
  56. text-align:center;
  57. padding:16px 0;
  58. img{
  59. width: 240px;
  60. }
  61. div{
  62. font-family:Roboto,Lato,sans-serif;
  63. font-size: 24px;
  64. letter-spacing: 0.14px;
  65. line-height: 20px;
  66. margin-top: 12px;
  67. }
  68. }
  69. .l-s{
  70. list-style: none;
  71. margin:0;
  72. padding:10px 0;
  73. li{
  74. line-height: 40px;
  75. border-bottom:1px solid rgba(204, 204, 204, 0.4);
  76. &:first-child{
  77. border-top:none;
  78. }
  79. }
  80. a{
  81. text-decoration: none;
  82. color:#333;
  83. display: inline-block;
  84. width: 100%;
  85. height: 100%;
  86. padding-left: 20px;
  87. box-sizing: border-box;
  88. }
  89. }
  90. </style>