|
@@ -118,6 +118,28 @@
|
|
|
.demo {
|
|
|
margin: 20px 0;
|
|
|
}
|
|
|
+
|
|
|
+ .carbon-teaser {
|
|
|
+ border-radius: 0;
|
|
|
+ .el-dialog__header {
|
|
|
+ display: none;
|
|
|
+ }
|
|
|
+ .el-dialog__body {
|
|
|
+ padding: 0;
|
|
|
+ position: relative;
|
|
|
+ }
|
|
|
+ .carbon-teaser__main {
|
|
|
+ width: 100%;
|
|
|
+ }
|
|
|
+ .carbon-teaser__close {
|
|
|
+ position: absolute;
|
|
|
+ width: 50px;
|
|
|
+ top: -25px;
|
|
|
+ right: -25px;
|
|
|
+ cursor: pointer;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
@media (max-width: 1140px) {
|
|
|
.container,
|
|
|
.page-container {
|
|
@@ -140,6 +162,20 @@
|
|
|
<router-view></router-view>
|
|
|
</div>
|
|
|
<main-footer v-if="lang !== 'play'"></main-footer>
|
|
|
+ <el-dialog
|
|
|
+ :visible.sync="dialogVisible"
|
|
|
+ custom-class="carbon-teaser"
|
|
|
+ @close="handleDialogClose"
|
|
|
+ :close-on-press-escape="false"
|
|
|
+ :close-on-click-modal="false">
|
|
|
+ <img
|
|
|
+ src="~examples/assets/images/carbon-teaser.png"
|
|
|
+ class="carbon-teaser__main">
|
|
|
+ <img
|
|
|
+ @click="dialogVisible = false"
|
|
|
+ src="~examples/assets/images/dialog-close.png"
|
|
|
+ class="carbon-teaser__close">
|
|
|
+ </el-dialog>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
@@ -152,6 +188,12 @@
|
|
|
export default {
|
|
|
name: 'app',
|
|
|
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ dialogVisible: false
|
|
|
+ };
|
|
|
+ },
|
|
|
+
|
|
|
computed: {
|
|
|
lang() {
|
|
|
return this.$route.path.split('/')[1] || 'zh-CN';
|
|
@@ -191,6 +233,10 @@
|
|
|
document.documentElement.scrollTop = document.body.scrollTop = elm.offsetTop + 120;
|
|
|
}, 50);
|
|
|
}
|
|
|
+ },
|
|
|
+
|
|
|
+ handleDialogClose() {
|
|
|
+ localStorage.setItem('CARBON_TEASER', 1);
|
|
|
}
|
|
|
},
|
|
|
|
|
@@ -198,6 +244,13 @@
|
|
|
this.localize();
|
|
|
this.renderAnchorHref();
|
|
|
this.goAnchor();
|
|
|
+
|
|
|
+ const intrigued = localStorage.getItem('CARBON_TEASER');
|
|
|
+ if (!intrigued) {
|
|
|
+ setTimeout(() => {
|
|
|
+ this.dialogVisible = true;
|
|
|
+ }, 2000);
|
|
|
+ }
|
|
|
},
|
|
|
|
|
|
created() {
|