@@ -1,38 +1,36 @@ | |||||
<template> | <template> | ||||
<div id="app"> | <div id="app"> | ||||
<top/> | |||||
<transition name="app" mode="out-in"> | <transition name="app" mode="out-in"> | ||||
<router-view></router-view> | <router-view></router-view> | ||||
</transition> | </transition> | ||||
<tail/> | |||||
<tail /> | |||||
</div> | </div> | ||||
</template> | </template> | ||||
<script> | <script> | ||||
import top from "./components/common/top" | |||||
import tail from "./components/common/tail" | |||||
import top from "./components/common/top"; | |||||
import tail from "./components/common/tail"; | |||||
export default { | export default { | ||||
components:{ | |||||
components: { | |||||
top, | top, | ||||
tail | |||||
tail, | |||||
}, | }, | ||||
data(){ | |||||
return{} | |||||
data() { | |||||
return {}; | |||||
}, | }, | ||||
} | |||||
}; | |||||
</script> | </script> | ||||
<style lang="scss"> | <style lang="scss"> | ||||
body,p{ | |||||
body, | |||||
p { | |||||
margin: 0 0; | margin: 0 0; | ||||
padding: 0 0; | padding: 0 0; | ||||
} | } | ||||
input{ | |||||
background:none; | |||||
outline:none; | |||||
border:none; | |||||
padding: 0; | |||||
margin: 0; | |||||
input { | |||||
background: none; | |||||
outline: none; | |||||
border: none; | |||||
padding: 0; | |||||
margin: 0; | |||||
} | } | ||||
</style> | </style> |
@@ -0,0 +1,2 @@ | |||||
const baseUrl = ' https://smapitest.malls.iformall.com/C' | |||||
export default baseUrl |
@@ -0,0 +1,71 @@ | |||||
<template> | |||||
<div class="page"> | |||||
<div class="logoBox" @click="go('/')"> | |||||
<img src="../../assets/img/LOGO1.png" class="logo" /> | |||||
<div class="userInfo"> | |||||
<div>用户名</div> | |||||
<img class="userImg" src="../../assets/img/user center.png" /> | |||||
</div> | |||||
</div> | |||||
</div> | |||||
</template> | |||||
<script> | |||||
import Vue from "vue"; | |||||
import { mapState, mapActions } from "vuex"; | |||||
import { Toast } from "vant"; | |||||
import baseUrl from "../../api/baseUrl"; | |||||
Vue.use(Toast); | |||||
export default { | |||||
data() { | |||||
return {}; | |||||
}, | |||||
computed: { | |||||
...mapState({ | |||||
characters: (state) => state.publicObj.characters, | |||||
}), | |||||
}, | |||||
methods: { | |||||
...mapActions(["setCharacters"]), | |||||
go(url) { | |||||
this.$router.push(url); | |||||
}, | |||||
}, | |||||
created() {}, | |||||
}; | |||||
</script> | |||||
<style lang="scss" scoped> | |||||
.page { | |||||
.logoBox { | |||||
display: flex; | |||||
justify-content: space-between; | |||||
align-items: center; | |||||
overflow: hidden; | |||||
cursor: pointer; | |||||
background-color: #606060; | |||||
.logo { | |||||
float: left; | |||||
width: 140px; | |||||
height: 40px; | |||||
} | |||||
.userInfo { | |||||
display: flex; | |||||
justify-content: space-between; | |||||
align-items: center; | |||||
color: #fff; | |||||
.userImg { | |||||
float: right; | |||||
width: 30px; | |||||
height: 30px; | |||||
margin-top: 3px; | |||||
margin-right: 10px; | |||||
margin-left: 15px; | |||||
} | |||||
} | |||||
} | |||||
} | |||||
</style> |
@@ -1,5 +1,6 @@ | |||||
<template> | <template> | ||||
<div class="Box"> | <div class="Box"> | ||||
<top /> | |||||
<div class="topBox"> | <div class="topBox"> | ||||
<div class="more" @click="showPopup"> | <div class="more" @click="showPopup"> | ||||
<div class="wire"></div> | <div class="wire"></div> | ||||
@@ -396,12 +397,17 @@ import "swiper/dist/js/swiper"; | |||||
import "swiper/dist/css/swiper.css"; | import "swiper/dist/css/swiper.css"; | ||||
import Swiper from "swiper"; | import Swiper from "swiper"; | ||||
import { mapState, mapActions } from "vuex"; | import { mapState, mapActions } from "vuex"; | ||||
import top from "../common/top.vue"; | |||||
import baseUrl from "../../api/baseUrl"; | |||||
import { Toast } from "vant"; | import { Toast } from "vant"; | ||||
import Vue from "vue"; | import Vue from "vue"; | ||||
Vue.use(Toast); | Vue.use(Toast); | ||||
export default { | export default { | ||||
components: { | |||||
top, | |||||
}, | |||||
data() { | data() { | ||||
return { | return { | ||||
userName: "", | userName: "", | ||||
@@ -601,8 +607,30 @@ export default { | |||||
...mapActions(["setCharacters"]), | ...mapActions(["setCharacters"]), | ||||
goLogin() { | goLogin() { | ||||
console.log(111); | |||||
this.$router.push("/login"); | |||||
const AccessToken = localStorage.getItem("AccessToken"); | |||||
if (AccessToken) { | |||||
this.$axios({ | |||||
method: "get", | |||||
url: `${baseUrl}/api/userVideo/list?pageNum=1&pageSize=3`, | |||||
headers: { | |||||
"Content-Type": "application/json;charset=UTF-8", | |||||
token: AccessToken, | |||||
}, | |||||
}) | |||||
.then((res) => { | |||||
if (res.data.code == 1052) { | |||||
this.$router.push("/login"); | |||||
Toast.fail("登录过期,请重新登录!"); | |||||
} else { | |||||
this.$router.push("/myPage"); | |||||
} | |||||
}) | |||||
.catch((err) => { | |||||
Toast.fail(err.message); | |||||
}); | |||||
} else { | |||||
this.$router.push("/login"); | |||||
} | |||||
}, | }, | ||||
showPopup() { | showPopup() { | ||||
@@ -0,0 +1,33 @@ | |||||
<template> | |||||
<div></div> | |||||
</template> | |||||
<script> | |||||
import Vue from "vue"; | |||||
import { mapState, mapActions } from "vuex"; | |||||
import { Toast } from "vant"; | |||||
import baseUrl from "../../api/baseUrl"; | |||||
Vue.use(Toast); | |||||
export default { | |||||
data() { | |||||
return {}; | |||||
}, | |||||
computed: { | |||||
...mapState({ | |||||
characters: (state) => state.publicObj.characters, | |||||
}), | |||||
}, | |||||
methods: { | |||||
...mapActions(["setCharacters"]), | |||||
go(url) { | |||||
this.$router.push(url); | |||||
}, | |||||
}, | |||||
created() {}, | |||||
}; | |||||
</script> | |||||
<style lang="scss" scoped></style> |
@@ -28,12 +28,28 @@ const routes = [ | |||||
// component: Home | // component: Home | ||||
component: () => import("../components/styleAdd/styleAdd"), | component: () => import("../components/styleAdd/styleAdd"), | ||||
}, | }, | ||||
// 登录 | |||||
{ | { | ||||
path: '/login', | path: '/login', | ||||
name: 'login', | name: 'login', | ||||
// component: Home | // component: Home | ||||
component: () => import("../views/login/login"), | component: () => import("../views/login/login"), | ||||
}, | }, | ||||
// 创作中心首页 | |||||
{ | |||||
path: '/myPage', | |||||
name: 'myPage', | |||||
// component: Home | |||||
component: () => import("../views/myPage/myPage"), | |||||
}, | |||||
// 创作中心首页 | |||||
{ | |||||
path: '/chooseModel', | |||||
name: 'chooseModel', | |||||
// component: Home | |||||
component: () => import("../views/model/chooseModel"), | |||||
}, | |||||
] | ] | ||||
const router = new VueRouter({ | const router = new VueRouter({ | ||||
@@ -1,7 +1,11 @@ | |||||
<template> | <template> | ||||
<div class="page"> | <div class="page"> | ||||
<div class="logoBox" @click="go('/')"> | |||||
<img src="../../assets/img/LOGO1.png" alt class="logo" /> | |||||
<!-- <div class="logoTitle">metavatar</div> --> | |||||
</div> | |||||
<div class="loginBox"> | <div class="loginBox"> | ||||
<div class="welcome">欢迎加入MetAvatar</div> | |||||
<div class="welcome">欢迎加入metAvatar</div> | |||||
<el-form ref="form" :rules="rules" :model="form"> | <el-form ref="form" :rules="rules" :model="form"> | ||||
<el-form-item class="phone" prop="phone"> | <el-form-item class="phone" prop="phone"> | ||||
<el-input | <el-input | ||||
@@ -35,7 +39,7 @@ | |||||
import Vue from "vue"; | import Vue from "vue"; | ||||
import { mapState, mapActions } from "vuex"; | import { mapState, mapActions } from "vuex"; | ||||
import { Toast } from "vant"; | import { Toast } from "vant"; | ||||
import baseUrl from "../../api/baseUrl"; | |||||
Vue.use(Toast); | Vue.use(Toast); | ||||
export default { | export default { | ||||
data() { | data() { | ||||
@@ -79,6 +83,7 @@ export default { | |||||
getCode() { | getCode() { | ||||
const phoneValue = this.form.phone; | const phoneValue = this.form.phone; | ||||
localStorage.setItem("phoneValue", phoneValue); | |||||
let phoneReg = /^1[35789]\d{9}$/; | let phoneReg = /^1[35789]\d{9}$/; | ||||
let phoneValide = phoneReg.test(phoneValue); | let phoneValide = phoneReg.test(phoneValue); | ||||
@@ -87,28 +92,36 @@ export default { | |||||
} else { | } else { | ||||
this.$axios({ | this.$axios({ | ||||
method: "get", | method: "get", | ||||
url: `https://smapitest.malls.iformall.com/C/api/user/sendLoginPhoneCode?phone=${phoneValue}`, | |||||
url: `${baseUrl}/api/user/sendLoginPhoneCode?phone=${phoneValue}`, | |||||
headers: { | headers: { | ||||
"Content-Type": "application/json;charset=UTF-8", | "Content-Type": "application/json;charset=UTF-8", | ||||
}, | }, | ||||
}) | }) | ||||
.then((res) => { | .then((res) => { | ||||
Toast.success("短信验证码发送成功!"); | |||||
this.codeInfo = 60; | |||||
const timer = setInterval(() => { | |||||
if (this.codeInfo != 1) { | |||||
this.codeInfo--; | |||||
} else { | |||||
clearInterval(timer); | |||||
this.codeInfo = "获取验证码"; | |||||
} | |||||
}, 1000); | |||||
console.log(res.data); | |||||
if (res.data.code != 200) { | |||||
Toast.fail(res.data.message); | |||||
} else { | |||||
Toast.success("短信验证码发送成功!"); | |||||
this.codeInfo = 60; | |||||
const timer = setInterval(() => { | |||||
if (this.codeInfo != 1) { | |||||
this.codeInfo--; | |||||
} else { | |||||
clearInterval(timer); | |||||
this.codeInfo = "获取验证码"; | |||||
} | |||||
}, 1000); | |||||
} | |||||
}) | }) | ||||
.catch((err) => { | .catch((err) => { | ||||
Toast.fail(err.message); | Toast.fail(err.message); | ||||
}); | }); | ||||
} | } | ||||
}, | }, | ||||
go(url) { | |||||
this.$router.push(url); | |||||
}, | |||||
login() { | login() { | ||||
const data = { | const data = { | ||||
phone: this.form.phone, | phone: this.form.phone, | ||||
@@ -116,21 +129,21 @@ export default { | |||||
}; | }; | ||||
this.$axios({ | this.$axios({ | ||||
method: "post", | method: "post", | ||||
url: `https://smapitest.malls.iformall.com/C/api/user/doLoginByPhone`, | |||||
url: `${baseUrl}/api/user/doLoginByPhone`, | |||||
headers: { | headers: { | ||||
"Content-Type": "application/json;charset=UTF-8", | "Content-Type": "application/json;charset=UTF-8", | ||||
}, | }, | ||||
data, | data, | ||||
}) | }) | ||||
.then((res) => { | .then((res) => { | ||||
console.log(res, "res"); | |||||
if (res.data.code == 200) { | |||||
// console.log(res, "res"); | |||||
if (res.data.code != 200) { | |||||
Toast.fail(res.data.message); | |||||
} else { | |||||
Toast.success("登录成功!"); | Toast.success("登录成功!"); | ||||
const token = res.data.data.token; | const token = res.data.data.token; | ||||
localStorage.setItem("AccessToken", token); | localStorage.setItem("AccessToken", token); | ||||
this.$router.push("/"); | |||||
} else { | |||||
Toast.fail(res.data.message); | |||||
this.$router.push("/myPage"); | |||||
} | } | ||||
}) | }) | ||||
.catch((err) => { | .catch((err) => { | ||||
@@ -138,13 +151,31 @@ export default { | |||||
}); | }); | ||||
}, | }, | ||||
}, | }, | ||||
created() { | |||||
const phoneValue = localStorage.getItem("phoneValue"); | |||||
if (phoneValue) { | |||||
this.form.phone = phoneValue; | |||||
} | |||||
}, | |||||
}; | }; | ||||
</script> | </script> | ||||
<style lang="scss" scoped> | <style lang="scss" scoped> | ||||
.page { | .page { | ||||
background-color: #000000cd; | |||||
padding-top: 36px; | |||||
.logoBox { | |||||
// margin-top: 10px; | |||||
margin-left: 5px; | |||||
margin-top: 10px; | |||||
float: left; | |||||
overflow: hidden; | |||||
cursor: pointer; | |||||
.logo { | |||||
float: left; | |||||
width: 140px; | |||||
height: 40px; | |||||
} | |||||
} | |||||
.loginBox { | .loginBox { | ||||
height: 500px; | height: 500px; | ||||
background: linear-gradient(140deg, #6e60e9, #2867d4, #1ec2ae); | background: linear-gradient(140deg, #6e60e9, #2867d4, #1ec2ae); | ||||
@@ -0,0 +1,183 @@ | |||||
<template> | |||||
<div> | |||||
<HeadTop /> | |||||
<div class="chooseModel"> | |||||
<div :class="phase == 1 ? 'active' : ''">选择模板</div> | |||||
<div :class="phase == 2 ? 'active' : ''">录入文案</div> | |||||
<div :class="phase == 3 ? 'active' : ''">合成视频</div> | |||||
</div> | |||||
<div v-show="phase == 1" class="choose"> | |||||
<div class="type"> | |||||
<div :class="type == 0 ? 'active' : ''" @click="chooseType(0)"> | |||||
全部模板 | |||||
</div> | |||||
<div :class="type == 1 ? 'active' : ''" @click="chooseType(1)"> | |||||
女性模板 | |||||
</div> | |||||
<div :class="type == 2 ? 'active' : ''" @click="chooseType(2)"> | |||||
男性模板 | |||||
</div> | |||||
<div style="background-color: #46464661">自建模板</div> | |||||
</div> | |||||
<div class="modeList"> | |||||
<div | |||||
class="model" | |||||
v-if="modeList.length >= 1" | |||||
v-for="(item, index) in modeList" | |||||
:key="index" | |||||
@click="goDetail(item.id)" | |||||
> | |||||
<img :src="item.coverImg" alt="" /> | |||||
<div class="modelName">{{ item.title }}</div> | |||||
</div> | |||||
<div class="alt" v-if="modeList.length == 0">暂无可用模板</div> | |||||
</div> | |||||
</div> | |||||
</div> | |||||
</template> | |||||
<script> | |||||
import Vue from "vue"; | |||||
import { mapState, mapActions } from "vuex"; | |||||
import HeadTop from "./../../components/common/head.vue"; | |||||
import { Toast } from "vant"; | |||||
import baseUrl from "../../api/baseUrl"; | |||||
Vue.use(Toast); | |||||
export default { | |||||
components: { | |||||
HeadTop, | |||||
}, | |||||
data() { | |||||
return { | |||||
phase: 1, | |||||
type: 0, | |||||
modeList: [], | |||||
}; | |||||
}, | |||||
computed: { | |||||
...mapState({ | |||||
characters: (state) => state.publicObj.characters, | |||||
}), | |||||
}, | |||||
methods: { | |||||
...mapActions(["setCharacters"]), | |||||
go(url) { | |||||
this.$router.push(url); | |||||
}, | |||||
chooseModel(num) { | |||||
this.phase = num; | |||||
}, | |||||
chooseType(num) { | |||||
this.type = num; | |||||
this.getModeList(num); | |||||
}, | |||||
getModeList(sex) { | |||||
const AccessToken = localStorage.getItem("AccessToken"); | |||||
if (sex == 0) { | |||||
sex = ""; | |||||
} | |||||
this.$axios({ | |||||
method: "get", | |||||
url: `${baseUrl}/api/mouldPatch/list?sex=${sex}&type=1&pageNum=1&pageSize=10`, | |||||
headers: { | |||||
"Content-Type": "application/json;charset=UTF-8", | |||||
token: AccessToken, | |||||
}, | |||||
}) | |||||
.then((res) => { | |||||
if (res.data.code == 1052) { | |||||
this.$router.push("/login"); | |||||
Toast.fail("登录过期,请重新登录!"); | |||||
} | |||||
this.modeList = res.data.data.list; | |||||
}) | |||||
.catch((err) => { | |||||
Toast.fail(err.message); | |||||
}); | |||||
}, | |||||
goDetail(id) { | |||||
console.log(id); | |||||
}, | |||||
}, | |||||
created() { | |||||
this.getModeList(0); | |||||
}, | |||||
}; | |||||
</script> | |||||
<style lang="scss" scoped> | |||||
.chooseModel { | |||||
display: flex; | |||||
justify-content: space-between; | |||||
align-items: center; | |||||
width: 350px; | |||||
height: 32px; | |||||
margin: auto; | |||||
margin-top: 15px; | |||||
margin-bottom: 15px; | |||||
div { | |||||
width: 33.33%; | |||||
height: 100%; | |||||
line-height: 32px; | |||||
text-align: center; | |||||
border: 1px solid #46464661; | |||||
&.active { | |||||
background-color: #00ccff; | |||||
color: #fff; | |||||
} | |||||
} | |||||
} | |||||
.choose { | |||||
margin-bottom: 40px; | |||||
.type { | |||||
display: flex; | |||||
justify-content: space-between; | |||||
align-items: center; | |||||
padding: 0 30px; | |||||
margin-bottom: 20px; | |||||
div { | |||||
width: 65px; | |||||
height: 25px; | |||||
line-height: 25px; | |||||
border: 1px solid #797979; | |||||
border-radius: 5px; | |||||
text-align: center; | |||||
&.active { | |||||
color: #fff; | |||||
border: 1px solid #9d00ff5d; | |||||
background: linear-gradient(140deg, #6e60e9, #2867d4, #1ec2ae); | |||||
} | |||||
} | |||||
} | |||||
.modeList { | |||||
display: flex; | |||||
justify-content: space-between; | |||||
align-items: center; | |||||
flex-wrap: wrap; | |||||
margin: auto; | |||||
padding: 0 25px; | |||||
.model { | |||||
text-align: center; | |||||
margin-bottom: 25px; | |||||
img { | |||||
width: 150px; | |||||
height: 220px; | |||||
} | |||||
.modelName { | |||||
font-size: 15px; | |||||
margin-top: 10px; | |||||
} | |||||
} | |||||
.alt { | |||||
font-size: 18px; | |||||
margin: 80px auto; | |||||
} | |||||
} | |||||
} | |||||
</style> |
@@ -0,0 +1,182 @@ | |||||
<template> | |||||
<div class="page"> | |||||
<HeadTop /> | |||||
<img class="showIMG" src="../../assets/img/testIMG.png" alt="" /> | |||||
<div class="item"> | |||||
<div class="title">我的视频作品</div> | |||||
<div class="itemList"> | |||||
<div class="videoModel"> | |||||
<div class="videoPrv"> | |||||
<img src="../../assets/img/imgPrv.png" /> | |||||
</div> | |||||
<div class="videoInfo"> | |||||
<div class="videoName"> | |||||
视频名称视频名称视频名称视频名称视频名称视频名称 | |||||
</div> | |||||
<div class="createTime">创建时间:2022-10-18 12:13:14</div> | |||||
</div> | |||||
</div> | |||||
<div class="videoModel"> | |||||
<div class="videoPrv"> | |||||
<img src="../../assets/img/imgPrv.png" /> | |||||
</div> | |||||
<div class="videoInfo"> | |||||
<div class="videoName"> | |||||
视频名称视频名称视频名称视频名称视频名称视频名称 | |||||
</div> | |||||
<div class="createTime">创建时间:2022-10-18 12:13:14</div> | |||||
</div> | |||||
</div> | |||||
<div class="videoModel"> | |||||
<div class="videoPrv"> | |||||
<img src="../../assets/img/imgPrv.png" /> | |||||
</div> | |||||
<div class="videoInfo"> | |||||
<div class="videoName"> | |||||
视频名称视频名称视频名称视频名称视频名称视频名称 | |||||
</div> | |||||
<div class="createTime">创建时间:2022-10-18 12:13:14</div> | |||||
</div> | |||||
</div> | |||||
</div> | |||||
</div> | |||||
<div class="goAdd" @click="goCreateNew">+ 创作新作品</div> | |||||
</div> | |||||
</template> | |||||
<script> | |||||
import Vue from "vue"; | |||||
import HeadTop from "./../../components/common/head.vue"; | |||||
import { mapState, mapActions } from "vuex"; | |||||
import { Toast } from "vant"; | |||||
import baseUrl from "../../api/baseUrl"; | |||||
Vue.use(Toast); | |||||
export default { | |||||
components: { | |||||
HeadTop, | |||||
}, | |||||
data() { | |||||
return {}; | |||||
}, | |||||
computed: { | |||||
...mapState({ | |||||
characters: (state) => state.publicObj.characters, | |||||
}), | |||||
}, | |||||
methods: { | |||||
...mapActions(["setCharacters"]), | |||||
go(url) { | |||||
this.$router.push(url); | |||||
}, | |||||
getVideoList() { | |||||
const AccessToken = localStorage.getItem("AccessToken"); | |||||
this.$axios({ | |||||
method: "get", | |||||
url: `${baseUrl}/api/userVideo/list?pageNum=1&pageSize=3`, | |||||
headers: { | |||||
"Content-Type": "application/json;charset=UTF-8", | |||||
token: AccessToken, | |||||
}, | |||||
}) | |||||
.then((res) => { | |||||
console.log(res, "res"); | |||||
if (res.data.code == 1052) { | |||||
this.$router.push("/login"); | |||||
Toast.fail("登录过期,请重新登录!"); | |||||
} | |||||
}) | |||||
.catch((err) => { | |||||
Toast.fail(err.message); | |||||
}); | |||||
}, | |||||
goCreateNew() { | |||||
this.$router.push("/chooseModel"); | |||||
}, | |||||
}, | |||||
created() { | |||||
this.getVideoList(); | |||||
}, | |||||
}; | |||||
</script> | |||||
<style lang="scss" scoped> | |||||
.page { | |||||
.logoBox { | |||||
display: flex; | |||||
justify-content: space-between; | |||||
align-items: center; | |||||
overflow: hidden; | |||||
cursor: pointer; | |||||
background-color: #606060; | |||||
.logo { | |||||
float: left; | |||||
width: 140px; | |||||
height: 40px; | |||||
} | |||||
.userInfo { | |||||
display: flex; | |||||
justify-content: space-between; | |||||
align-items: center; | |||||
color: #fff; | |||||
.userImg { | |||||
float: right; | |||||
width: 30px; | |||||
height: 30px; | |||||
margin-top: 3px; | |||||
margin-right: 10px; | |||||
margin-left: 15px; | |||||
} | |||||
} | |||||
} | |||||
.item { | |||||
padding: 15px; | |||||
.title { | |||||
font-size: 20px; | |||||
margin-bottom: 20px; | |||||
} | |||||
.itemList { | |||||
.videoModel { | |||||
display: flex; | |||||
justify-content: space-between; | |||||
margin-bottom: 20px; | |||||
.videoPrv { | |||||
width: 320px; | |||||
} | |||||
.videoInfo { | |||||
display: flex; | |||||
flex-direction: column; | |||||
justify-content: space-between; | |||||
margin-left: 10px; | |||||
.videoName { | |||||
font-size: 15px; | |||||
} | |||||
.createTime { | |||||
font-size: 11px; | |||||
} | |||||
} | |||||
} | |||||
} | |||||
} | |||||
.goAdd { | |||||
position: fixed; | |||||
bottom: 50px; | |||||
left: 50%; | |||||
width: 300px; | |||||
height: 30px; | |||||
line-height: 30px; | |||||
font-size: 15px; | |||||
color: #fff; | |||||
text-align: center; | |||||
transform: translateX(-50%); | |||||
background: linear-gradient(140deg, #6e60e9, #2867d4, #1ec2ae); | |||||
border-radius: 8px; | |||||
box-shadow: #60606082 1px 1px 1px 1px; | |||||
} | |||||
} | |||||
</style> |