|
|
@@ -1,15 +1,65 @@
|
|
|
<template>
|
|
|
<div class="container">
|
|
|
- <div class="top">
|
|
|
- <div class="center-content">
|
|
|
- <div class="title">游戏数字资产的链上开创者们</div>
|
|
|
- <div class="title2">全球领先的游戏数字藏品NFT集结地</div>
|
|
|
- <div class="btn" @click="$router.push('/collection')"><span>立即探索</span></div>
|
|
|
+ <div class="topBox1">
|
|
|
+ <img class="topBox" src="../assets/矩形@3x (1).png" alt="" />
|
|
|
+ <div class="header center-content">
|
|
|
+ <router-link class="logo-link" :to="{ path: '/' }">
|
|
|
+ <img class="logo" src="../assets/nav_logo@3x (1).png" alt=""
|
|
|
+ /></router-link>
|
|
|
+ <div class="content">
|
|
|
+ <el-tabs v-model="activeName" class="menus" @tab-click="change">
|
|
|
+ <el-tab-pane
|
|
|
+ v-for="(item, index) in menus"
|
|
|
+ :key="index"
|
|
|
+ :label="item.label"
|
|
|
+ :name="item.value"
|
|
|
+ ></el-tab-pane>
|
|
|
+ </el-tabs>
|
|
|
+ <div class="btn-list" v-if="isLogin">
|
|
|
+ <el-dropdown @command="onCommand" style="margin-left: 20px">
|
|
|
+ <span class="el-dropdown-link">
|
|
|
+ <img class="img" :src="avatarBox" />
|
|
|
+ </span>
|
|
|
+ <el-dropdown-menu slot="dropdown">
|
|
|
+ <el-dropdown-item command="nickname" style="word-break: keep-all"
|
|
|
+ >{{ userInfo.nickname }}
|
|
|
+ </el-dropdown-item>
|
|
|
+ <div class="border"></div>
|
|
|
+ <el-dropdown-item
|
|
|
+ v-if="userInfo.authStatus != 'SUCCESS'"
|
|
|
+ command="supply"
|
|
|
+ style="word-break: keep-all"
|
|
|
+ >去认证
|
|
|
+ </el-dropdown-item>
|
|
|
+ <el-dropdown-item command="edit" style="word-break: keep-all"
|
|
|
+ >编辑资料
|
|
|
+ </el-dropdown-item>
|
|
|
+ <div class="border"></div>
|
|
|
+ <el-dropdown-item command="logout">退出登录 </el-dropdown-item>
|
|
|
+ </el-dropdown-menu>
|
|
|
+ </el-dropdown>
|
|
|
+ </div>
|
|
|
+ <el-button v-else class="login" plain @click="Login">[登录]</el-button>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
- </div>
|
|
|
|
|
|
- <!-- <div class="card">33222</div> -->
|
|
|
+ <div class="top center-content">
|
|
|
+ <div>
|
|
|
+ <div class="title1">嗨! 我们是第九空间</div>
|
|
|
+ <div class="title2">全球领先的游戏数字藏品NFT集结地</div>
|
|
|
+ <div class="btnCon" @click="$router.push('/collection')"><span>立即探索</span></div>
|
|
|
+ </div>
|
|
|
+ <div class="back">
|
|
|
+ <swiper class="mySwiper imgBox" ref="mySwiper" :options="swiperOptions">
|
|
|
+ <swiper-slide>
|
|
|
+ <el-image :src="getImg(banners[0].pic, '', 800)" style="width: 500px; height: 500px" />
|
|
|
+ </swiper-slide>
|
|
|
+ </swiper>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
|
|
|
+ <div class="hot1">铸造者</div>
|
|
|
<div class="introduce center-content">
|
|
|
<router-link
|
|
|
class="introduce2"
|
|
|
@@ -39,6 +89,7 @@
|
|
|
</div>
|
|
|
</router-link>
|
|
|
</div>
|
|
|
+ <more-title path="/Casting"></more-title>
|
|
|
<div class="content">
|
|
|
<div class="center-content">
|
|
|
<div class="hot">最HOT收藏品</div>
|
|
|
@@ -55,7 +106,7 @@
|
|
|
<div class="content1 center-content">
|
|
|
<div class="hot">官方活动</div>
|
|
|
<swiper class="mySwiper" ref="mySwiper" :options="swiperOptions">
|
|
|
- <swiper-slide v-for="(item, index) in banners" :key="index">
|
|
|
+ <swiper-slide v-for="(item, index) in bannersList" :key="index">
|
|
|
<el-image @click="goNext(item)" :src="item.pic" fit="cover" :lazy="true"></el-image>
|
|
|
</swiper-slide>
|
|
|
</swiper>
|
|
|
@@ -116,15 +167,19 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
+ <login-info ref="ref" @close="show = false"></login-info>
|
|
|
</div>
|
|
|
</template>
|
|
|
<script>
|
|
|
import CollectionInfo from '../components/CollectionInfo.vue';
|
|
|
import MoreTitle from '../components/MoreTitle.vue';
|
|
|
+import LoginInfo from '../components/LoginInfo.vue';
|
|
|
+// import pageableTable from '@/mixins/pageableTable';
|
|
|
+import { mapState, mapMutations } from 'vuex';
|
|
|
import { Swiper, SwiperSlide } from 'vue-awesome-swiper';
|
|
|
import 'swiper/css/swiper.css';
|
|
|
export default {
|
|
|
- components: { CollectionInfo, MoreTitle, Swiper, SwiperSlide },
|
|
|
+ components: { CollectionInfo, MoreTitle, Swiper, SwiperSlide, LoginInfo },
|
|
|
data() {
|
|
|
return {
|
|
|
creators: [],
|
|
|
@@ -133,19 +188,64 @@ export default {
|
|
|
timer: null,
|
|
|
products: [],
|
|
|
banners: [],
|
|
|
+ bannersList: [],
|
|
|
swiperOptions: {
|
|
|
slidesPerView: 2,
|
|
|
spaceBetween: 20,
|
|
|
autoplay: true
|
|
|
- }
|
|
|
+ },
|
|
|
+ active: '',
|
|
|
+ show: false,
|
|
|
+ activeName: '',
|
|
|
+ lists: '',
|
|
|
+ url: '/identityAuth/all',
|
|
|
+ menus: [
|
|
|
+ {
|
|
|
+ label: '铸造者',
|
|
|
+ value: '/casting'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '收藏探索',
|
|
|
+ value: '/collection'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '数字盲盒',
|
|
|
+ value: '/collection?type=BLIND_BOX'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '我的藏品',
|
|
|
+ value: '/my'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '了解更多',
|
|
|
+ value: 'wait'
|
|
|
+ }
|
|
|
+ ]
|
|
|
};
|
|
|
},
|
|
|
+ computed: {
|
|
|
+ ...mapState(['userInfo']),
|
|
|
+ avatarBox() {
|
|
|
+ return this.userInfo.avatar;
|
|
|
+ }
|
|
|
+ },
|
|
|
mounted() {
|
|
|
+ this.$EventBus.$on('login', () => {
|
|
|
+ this.Login();
|
|
|
+ });
|
|
|
+ this.getActive();
|
|
|
+ // if (this.userInfo.authStatus) {
|
|
|
+ // if (this.userInfo.authStatus !== 'NOT_AUTH') {
|
|
|
+ // setTimeout(() => {
|
|
|
+ // this.add();
|
|
|
+ // }, 1000);
|
|
|
+ // }
|
|
|
+ // }
|
|
|
+
|
|
|
this.getCreators();
|
|
|
this.getProduct().then(res => {
|
|
|
this.products = res;
|
|
|
});
|
|
|
-
|
|
|
this.$http
|
|
|
.post(
|
|
|
'/banner/all',
|
|
|
@@ -158,10 +258,172 @@ export default {
|
|
|
{ body: 'json' }
|
|
|
)
|
|
|
.then(res => {
|
|
|
- this.banners = res.content;
|
|
|
+ this.bannersList = res.content;
|
|
|
+ });
|
|
|
+ this.$http
|
|
|
+ .post(
|
|
|
+ '/banner/all',
|
|
|
+ {
|
|
|
+ query: {
|
|
|
+ del: false,
|
|
|
+ type: null
|
|
|
+ }
|
|
|
+ },
|
|
|
+ { body: 'json' }
|
|
|
+ )
|
|
|
+ .then(res => {
|
|
|
+ console.log(res);
|
|
|
+
|
|
|
+ this.banners = res.content.filter(item => {
|
|
|
+ return item.name === '首页大图';
|
|
|
+ });
|
|
|
+ console.log(this.banners);
|
|
|
});
|
|
|
},
|
|
|
methods: {
|
|
|
+ add() {
|
|
|
+ this.$http
|
|
|
+ .post(
|
|
|
+ '/identityAuth/all',
|
|
|
+ {
|
|
|
+ query: {
|
|
|
+ userId: this.userInfo.id
|
|
|
+ },
|
|
|
+ sort: 'createdAt,desc',
|
|
|
+ size: 1,
|
|
|
+ page: 0
|
|
|
+ },
|
|
|
+ {
|
|
|
+ body: 'json'
|
|
|
+ }
|
|
|
+ )
|
|
|
+ .then(res => {
|
|
|
+ this.lists = res.content[0].org;
|
|
|
+ console.log(this.lists);
|
|
|
+ });
|
|
|
+ },
|
|
|
+ Login() {
|
|
|
+ this.$refs.ref.flag();
|
|
|
+ },
|
|
|
+ ...mapMutations(['updateUserInfo']),
|
|
|
+ batchRead() {},
|
|
|
+ onCommand(command) {
|
|
|
+ if (command === 'edit') {
|
|
|
+ this.$router.push('/accountdata');
|
|
|
+ } else if (command === 'nickname') {
|
|
|
+ this.$router.push('/accountdata');
|
|
|
+ } else if (command === 'logout') {
|
|
|
+ localStorage.removeItem('webToken');
|
|
|
+ this.updateUserInfo(null);
|
|
|
+ this.$router.push('/');
|
|
|
+ } else if (command === 'supply') {
|
|
|
+ this.add();
|
|
|
+ if (this.userInfo.authStatus === 'NOT_AUTH') {
|
|
|
+ this.$router.push('/authentication');
|
|
|
+ } else {
|
|
|
+ this.$nextTick(() => {
|
|
|
+ console.log(this.lists);
|
|
|
+ setTimeout(() => {
|
|
|
+ if (this.userInfo.authStatus !== 'NOT_AUTH' && this.lists == false) {
|
|
|
+ this.add();
|
|
|
+ this.$router.push('/userauthentication');
|
|
|
+ }
|
|
|
+ }, 1000);
|
|
|
+ setTimeout(() => {
|
|
|
+ if (this.userInfo.authStatus !== 'NOT_AUTH' && this.lists == true) {
|
|
|
+ this.add();
|
|
|
+ this.$router.push('/enterpriseauthentication');
|
|
|
+ }
|
|
|
+ }, 1000);
|
|
|
+ });
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ getActive() {
|
|
|
+ this.activeName = '';
|
|
|
+ let menus = [...this.menus];
|
|
|
+ menus.forEach(item => {
|
|
|
+ let _route = this.parsePath(item.value);
|
|
|
+ if (this.$route.path == _route.path && Object.keys(_route.query).length === 0) {
|
|
|
+ this.activeName = item.value;
|
|
|
+ } else if (this.$route.path == _route.path) {
|
|
|
+ Object.keys(_route.query).forEach(key => {
|
|
|
+ if (_route.query[key] === this.$route.query[key]) {
|
|
|
+ this.activeName = item.value;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ change(info) {
|
|
|
+ if (info.paneName !== 'wait') {
|
|
|
+ window.scrollTo({
|
|
|
+ top: 0,
|
|
|
+ behavior: 'smooth'
|
|
|
+ });
|
|
|
+ this.$router.push(info.paneName);
|
|
|
+ } else {
|
|
|
+ this.wait();
|
|
|
+ }
|
|
|
+ },
|
|
|
+ parsePath(path = '') {
|
|
|
+ let hash = '';
|
|
|
+ let query = {};
|
|
|
+
|
|
|
+ let hashIndex = path.indexOf('#');
|
|
|
+ if (hashIndex >= 0) {
|
|
|
+ hash = path.slice(hashIndex);
|
|
|
+ path = path.slice(0, hashIndex);
|
|
|
+ }
|
|
|
+
|
|
|
+ let queryIndex = path.indexOf('?');
|
|
|
+ if (queryIndex >= 0) {
|
|
|
+ query = this.parseQuery(path.slice(queryIndex + 1));
|
|
|
+ path = path.slice(0, queryIndex);
|
|
|
+ }
|
|
|
+
|
|
|
+ return {
|
|
|
+ path,
|
|
|
+ query,
|
|
|
+ hash
|
|
|
+ };
|
|
|
+ },
|
|
|
+ parseQuery(query) {
|
|
|
+ const res = {};
|
|
|
+ console.log(query);
|
|
|
+ query = query.trim().replace(/^(\?|#|&)/, '');
|
|
|
+
|
|
|
+ if (!query) {
|
|
|
+ return res;
|
|
|
+ }
|
|
|
+
|
|
|
+ query.split('&').forEach(param => {
|
|
|
+ const parts = param.replace(/\+/g, ' ').split('=');
|
|
|
+ const key = decode(parts.shift());
|
|
|
+ const val = parts.length > 0 ? decode(parts.join('=')) : null;
|
|
|
+
|
|
|
+ if (res[key] === undefined) {
|
|
|
+ res[key] = val;
|
|
|
+ } else if (Array.isArray(res[key])) {
|
|
|
+ res[key].push(val);
|
|
|
+ } else {
|
|
|
+ res[key] = [res[key], val];
|
|
|
+ }
|
|
|
+ });
|
|
|
+
|
|
|
+ function decode(str = '') {
|
|
|
+ try {
|
|
|
+ return decodeURIComponent(str);
|
|
|
+ } catch (err) {
|
|
|
+ if (process.env.NODE_ENV !== 'production') {
|
|
|
+ // warn(false, `Error decoding "${str}". Leaving it intact.`)
|
|
|
+ }
|
|
|
+ }
|
|
|
+ return str;
|
|
|
+ }
|
|
|
+
|
|
|
+ return res;
|
|
|
+ },
|
|
|
getCreators() {
|
|
|
this.$http
|
|
|
.post(
|
|
|
@@ -219,6 +481,9 @@ export default {
|
|
|
}
|
|
|
},
|
|
|
watch: {
|
|
|
+ $route() {
|
|
|
+ this.getActive();
|
|
|
+ },
|
|
|
initChange() {
|
|
|
if (this.initChange) {
|
|
|
if (this.timer) {
|
|
|
@@ -231,10 +496,181 @@ export default {
|
|
|
};
|
|
|
</script>
|
|
|
<style lang="less" scoped>
|
|
|
+.topBox {
|
|
|
+ width: 100%;
|
|
|
+ height: 550px;
|
|
|
+}
|
|
|
+/deep/.btn-list {
|
|
|
+ .el-tabs__nav-scroll {
|
|
|
+ padding-left: 13px;
|
|
|
+ }
|
|
|
+ .el-tabs__item {
|
|
|
+ font-weight: bold;
|
|
|
+ font-size: 14px;
|
|
|
+ width: 300px;
|
|
|
+ }
|
|
|
+}
|
|
|
+/deep/ .el-dropdown-menu__item {
|
|
|
+ font-weight: bold;
|
|
|
+ text-align: center;
|
|
|
+}
|
|
|
+/deep/.menus {
|
|
|
+ padding: 15px 25px 19px;
|
|
|
+ .el-tabs__item {
|
|
|
+ padding: 0 25px;
|
|
|
+ color: #ffffff;
|
|
|
+ font-size: 16px;
|
|
|
+ font-weight: 400;
|
|
|
+ &.is-active {
|
|
|
+ color: #fff;
|
|
|
+ font-weight: bold;
|
|
|
+ }
|
|
|
+ &:focus {
|
|
|
+ &.is-active.is-focus {
|
|
|
+ box-shadow: none;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .el-tabs__nav-wrap {
|
|
|
+ &::after {
|
|
|
+ background-color: transparent;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .el-tabs__active-bar {
|
|
|
+ background-color: transparent;
|
|
|
+ &::after {
|
|
|
+ content: '';
|
|
|
+ position: absolute;
|
|
|
+ left: 30%;
|
|
|
+ right: 30%;
|
|
|
+ background-color: #fff;
|
|
|
+ top: 0;
|
|
|
+ bottom: 0;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
.container {
|
|
|
+ .topBox1 {
|
|
|
+ // position: relative;
|
|
|
+ // width: 1300px;
|
|
|
+ width: 100%;
|
|
|
+ // text-align: center;
|
|
|
+ margin: 0 auto;
|
|
|
+ }
|
|
|
+ .header {
|
|
|
+ background: transparent;
|
|
|
+ z-index: 88;
|
|
|
+ position: absolute;
|
|
|
+ top: 0;
|
|
|
+ left: 0;
|
|
|
+ right: 0;
|
|
|
+ margin: 0 auto;
|
|
|
+ width: 1300px;
|
|
|
+ // margin-top: -16px;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+ .logo {
|
|
|
+ width: 130px;
|
|
|
+ height: 50px;
|
|
|
+ }
|
|
|
+ .logo-link {
|
|
|
+ padding: 15px 0px 15px 0px;
|
|
|
+ }
|
|
|
+ .content {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+ z-index: 88;
|
|
|
+ background: transparent;
|
|
|
+ position: relative;
|
|
|
+ .tabs {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ padding-top: 10px;
|
|
|
+ cursor: pointer;
|
|
|
+ .tab {
|
|
|
+ width: 130px;
|
|
|
+ font-size: 18px;
|
|
|
+ font-weight: bold;
|
|
|
+ text-align: center;
|
|
|
+ color: #939599;
|
|
|
+ line-height: 28px;
|
|
|
+ &.active {
|
|
|
+ color: #ffffff;
|
|
|
+ font-weight: bold;
|
|
|
+ }
|
|
|
+ .slip {
|
|
|
+ width: 26px;
|
|
|
+ margin: 0 auto;
|
|
|
+ padding-bottom: 13px;
|
|
|
+ &.active {
|
|
|
+ border-bottom: 2px solid #fff;
|
|
|
+ border-radius: 2px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .btn-list {
|
|
|
+ .img {
|
|
|
+ width: 34px;
|
|
|
+ height: 34px;
|
|
|
+ border-radius: 50%;
|
|
|
+ display: block;
|
|
|
+ border: 2px solid #fff;
|
|
|
+ cursor: pointer;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .login {
|
|
|
+ width: 80px;
|
|
|
+ height: 26px;
|
|
|
+ line-height: 0px;
|
|
|
+ border-radius: 4px;
|
|
|
+ font-size: 14px;
|
|
|
+ font-family: PingFangSC-Regular, PingFang SC;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #ffffff;
|
|
|
+ margin-top: -22px;
|
|
|
+ background: transparent;
|
|
|
+ border: 1px solid #ffffff;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
.top {
|
|
|
- background: #0f1111;
|
|
|
- height: 460px;
|
|
|
+ display: flex;
|
|
|
+ position: absolute;
|
|
|
+ width: 1300px;
|
|
|
+ margin: auto;
|
|
|
+ top: 0;
|
|
|
+ left: 0;
|
|
|
+ right: 0;
|
|
|
+ z-index: 88;
|
|
|
+ justify-content: space-between;
|
|
|
+ .back {
|
|
|
+ border-radius: 16px;
|
|
|
+ margin-right: 110px;
|
|
|
+ .mySwiper {
|
|
|
+ width: 500px;
|
|
|
+ height: 500px;
|
|
|
+ display: inline-block;
|
|
|
+ position: absolute;
|
|
|
+ top: 120px;
|
|
|
+ right: 150px;
|
|
|
+ // .line();
|
|
|
+ /deep/.el-image {
|
|
|
+ display: block;
|
|
|
+ width: 500px !important;
|
|
|
+ height: 500px !important;
|
|
|
+ border-radius: 8px !important;
|
|
|
+ // margin-left: 1px;
|
|
|
+ img {
|
|
|
+ display: block;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
.title {
|
|
|
height: 42px;
|
|
|
font-size: 32px;
|
|
|
@@ -242,25 +678,35 @@ export default {
|
|
|
color: #ffffff;
|
|
|
line-height: 42px;
|
|
|
font-family: ZhenyanGB-Regular, ZhenyanGB;
|
|
|
- padding: 130px 0 24px 10px;
|
|
|
+ padding: 130px 0 25px 10px;
|
|
|
+ }
|
|
|
+ .title1 {
|
|
|
+ line-height: 47px;
|
|
|
+ font-size: 46px;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #ffffff;
|
|
|
+ font-family: ZhenyanGB-Regular, ZhenyanGB;
|
|
|
+ padding: 220px 0 25px 10px;
|
|
|
}
|
|
|
.title2 {
|
|
|
- font-size: 30px;
|
|
|
+ font-size: 20px;
|
|
|
+ font-family: PingFangSC-Regular, PingFang SC;
|
|
|
font-weight: 400;
|
|
|
- color: #939599;
|
|
|
- line-height: 42px;
|
|
|
+ color: #ffffff;
|
|
|
padding-left: 10px;
|
|
|
}
|
|
|
- .btn {
|
|
|
+ .btnCon {
|
|
|
+ line-height: 44px;
|
|
|
+ text-align: center;
|
|
|
+ background: transparent;
|
|
|
+ margin: 60px 0 0 10px;
|
|
|
+ font-size: 20px;
|
|
|
width: 136px;
|
|
|
height: 44px;
|
|
|
- line-height: 42px;
|
|
|
- text-align: center;
|
|
|
- margin: 50px 0 0 10px;
|
|
|
- position: relative;
|
|
|
- font-size: 24px;
|
|
|
- color: @prim;
|
|
|
- .line();
|
|
|
+ border: 1px solid;
|
|
|
+ border-radius: 8px;
|
|
|
+ color: #fdfb60;
|
|
|
+ border-image: linear-gradient(135deg, rgba(253, 251, 96, 1), rgba(255, 143, 62, 1)) 1 1;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
@@ -272,7 +718,7 @@ export default {
|
|
|
.introduce-content {
|
|
|
display: inline-flex;
|
|
|
align-items: center;
|
|
|
- height: 300px;
|
|
|
+ height: 178px;
|
|
|
width: 220px;
|
|
|
cursor: pointer;
|
|
|
overflow: hidden;
|
|
|
@@ -323,6 +769,15 @@ export default {
|
|
|
margin-left: 20px;
|
|
|
}
|
|
|
}
|
|
|
+.hot1 {
|
|
|
+ font-size: 24px;
|
|
|
+ text-align: center;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #ffffff;
|
|
|
+ line-height: 34px;
|
|
|
+ font-family: ZhenyanGB-Regular, ZhenyanGB;
|
|
|
+ padding: 121px 0 40px 0;
|
|
|
+}
|
|
|
.content {
|
|
|
background: #0f1111;
|
|
|
.hot {
|
