{"remainingRequest":"D:\\源码\\vue-element-admin-master\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!D:\\源码\\vue-element-admin-master\\src\\components\\TextHoverEffect\\Mallki.vue?vue&type=script&lang=js&","dependencies":[{"path":"D:\\源码\\vue-element-admin-master\\src\\components\\TextHoverEffect\\Mallki.vue","mtime":1649647926000},{"path":"D:\\源码\\vue-element-admin-master\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\源码\\vue-element-admin-master\\node_modules\\babel-loader\\lib\\index.js","mtime":315532800000},{"path":"D:\\源码\\vue-element-admin-master\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\源码\\vue-element-admin-master\\node_modules\\vue-loader\\lib\\index.js","mtime":499162500000}],"contextDependencies":[],"result":[{"type":"Buffer","data":"base64:Ly8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KCmV4cG9ydCBkZWZhdWx0IHsKICBwcm9wczogewogICAgY2xhc3NOYW1lOiB7CiAgICAgIHR5cGU6IFN0cmluZywKICAgICAgZGVmYXVsdDogJycKICAgIH0sCiAgICB0ZXh0OiB7CiAgICAgIHR5cGU6IFN0cmluZywKICAgICAgZGVmYXVsdDogJ3Z1ZS1lbGVtZW50LWFkbWluJwogICAgfQogIH0KfQo="},{"version":3,"sources":["Mallki.vue"],"names":[],"mappings":";;;;;;;;;AASA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA","file":"Mallki.vue","sourceRoot":"src/components/TextHoverEffect","sourcesContent":["<template>\n <a :class=\"className\" class=\"link--mallki\" href=\"#\">\n {{ text }}\n <span :data-letters=\"text\" />\n <span :data-letters=\"text\" />\n </a>\n</template>\n\n<script>\nexport default {\n props: {\n className: {\n type: String,\n default: ''\n },\n text: {\n type: String,\n default: 'vue-element-admin'\n }\n }\n}\n</script>\n\n<style>\n/* Mallki */\n\n.link--mallki {\n font-weight: 800;\n color: #4dd9d5;\n font-family: 'Dosis', sans-serif;\n -webkit-transition: color 0.5s 0.25s;\n transition: color 0.5s 0.25s;\n overflow: hidden;\n position: relative;\n display: inline-block;\n line-height: 1;\n outline: none;\n text-decoration: none;\n}\n\n.link--mallki:hover {\n -webkit-transition: none;\n transition: none;\n color: transparent;\n}\n\n.link--mallki::before {\n content: '';\n width: 100%;\n height: 6px;\n margin: -3px 0 0 0;\n background: #3888fa;\n position: absolute;\n left: 0;\n top: 50%;\n -webkit-transform: translate3d(-100%, 0, 0);\n transform: translate3d(-100%, 0, 0);\n -webkit-transition: -webkit-transform 0.4s;\n transition: transform 0.4s;\n -webkit-transition-timing-function: cubic-bezier(0.7, 0, 0.3, 1);\n transition-timing-function: cubic-bezier(0.7, 0, 0.3, 1);\n}\n\n.link--mallki:hover::before {\n -webkit-transform: translate3d(100%, 0, 0);\n transform: translate3d(100%, 0, 0);\n}\n\n.link--mallki span {\n position: absolute;\n height: 50%;\n width: 100%;\n left: 0;\n top: 0;\n overflow: hidden;\n}\n\n.link--mallki span::before {\n content: attr(data-letters);\n color: red;\n position: absolute;\n left: 0;\n width: 100%;\n color: #3888fa;\n -webkit-transition: -webkit-transform 0.5s;\n transition: transform 0.5s;\n}\n\n.link--mallki span:nth-child(2) {\n top: 50%;\n}\n\n.link--mallki span:first-child::before {\n top: 0;\n -webkit-transform: translate3d(0, 100%, 0);\n transform: translate3d(0, 100%, 0);\n}\n\n.link--mallki span:nth-child(2)::before {\n bottom: 0;\n -webkit-transform: translate3d(0, -100%, 0);\n transform: translate3d(0, -100%, 0);\n}\n\n.link--mallki:hover span::before {\n -webkit-transition-delay: 0.3s;\n transition-delay: 0.3s;\n -webkit-transform: translate3d(0, 0, 0);\n transform: translate3d(0, 0, 0);\n -webkit-transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);\n transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);\n}\n</style>\n"]}]}
|
