diff --git a/examples/app.vue b/examples/app.vue
index c34ddfdff..065c61878 100644
--- a/examples/app.vue
+++ b/examples/app.vue
@@ -119,117 +119,6 @@
margin: 20px 0;
}
- .carbon-teaser {
- border-radius: 0;
- overflow: hidden;
-
- .el-dialog__header {
- display: none;
- }
-
- .el-dialog__body {
- padding: 0;
- display: flex;
- justify-content: center;
- position: relative;
- background: #000;
- }
-
- .carbon-teaser__main {
- height: 100vh;
- min-height: 600px;
- }
-
- .carbon-teaser__close {
- position: absolute;
- width: 40px;
- height: 40px;
- top: 25px;
- right: 45px;
- text-align: center;
- cursor: pointer;
- opacity: .8;
- transition: .2s ease-out;
-
- &::after,
- &::before {
- position: absolute;
- content: '';
- display: inline-block;
- width: 4px;
- border-radius: 1px;
- height: 40px;
- background: #ff3737;
- box-shadow: 1px 0 1px 0 rgba(255, 255, 255, .3) inset, -2px 0 1px 0 rgba(0, 0, 0, .1) inset;
- transition: .2s ease-out;
- }
-
- &::after {
- transform: rotate(45deg);
- }
-
- &::before {
- transform: rotate(-45deg);
- }
-
- &:hover {
- opacity: 1;
-
- &::after,
- &::before {
- box-shadow: 2px 0 1px 0 rgba(255, 255, 255, .4) inset, -2px 0 1px 0 rgba(0, 0, 0, .1) inset, 0 0 10px 3px #ff1616;
- }
- }
-
- }
-
- .carbon-teaser__button {
- position: absolute;
- bottom: 12%;
- display: block;
- width: 400px;
- height: 19.11%;
-
- [class*=carbon-teaser__more] {
- position: absolute;
- top: 0;
- display: block;
- width: 100%;
- height: 100%;
- cursor: pointer;
- background-repeat: no-repeat;
- background-position: center;
- background-size: auto 80%;
- transition: .2s ease-in;
- }
-
- [class*=dark] {
- background-image: url(~examples/assets/images/button-d-cn.png);
- &.is-en {
- background-image: url(~examples/assets/images/button-d-en.png);
- }
- }
-
- [class*=light] {
- opacity: 0;
- background-image: url(~examples/assets/images/button-l-cn.png);
- &.is-en {
- background-image: url(~examples/assets/images/button-l-en.png);
- }
- }
-
- &:hover {
- [class*=light] {
- opacity: 1;
- }
-
- [class*=dark] {
- opacity: 0;
- }
- }
- }
- }
-
@media (max-width: 1140px) {
.container,
.page-container {
@@ -252,23 +141,6 @@
-
-
-
-
-
-
-
-
-
@@ -281,19 +153,9 @@
export default {
name: 'app',
- data() {
- return {
- dialogVisible: false
- };
- },
-
computed: {
lang() {
return this.$route.path.split('/')[1] || 'zh-CN';
- },
-
- hrefOfCarbonLearnMore() {
- return this.lang === 'zh-CN' ? 'https://github.com/ElemeFE/element/issues/7236' : 'https://github.com/ElemeFE/element/issues/7237';
}
},
@@ -330,10 +192,6 @@
document.documentElement.scrollTop = document.body.scrollTop = elm.offsetTop + 120;
}, 50);
}
- },
-
- handleDialogClose() {
- localStorage.setItem('CARBON_TEASER_V2', 1);
}
},
@@ -341,15 +199,35 @@
this.localize();
this.renderAnchorHref();
this.goAnchor();
-
- const intrigued = localStorage.getItem('CARBON_TEASER_V2');
- if (!intrigued) {
- const img = new Image();
- img.onload = () => {
- this.dialogVisible = true;
- };
- img.src = 'https://i.loli.net/2017/09/27/59cb11edaa26d.jpg';
- }
+ setTimeout(() => {
+ const notified = localStorage.getItem('ALPHA_NOTIFIED');
+ if (!notified) {
+ const h = this.$createElement;
+ const title = this.lang === 'zh-CN'
+ ? '2.0.0-alpha.1 发布'
+ : '2.0.0-alpha.1 released';
+ const messages = this.lang === 'zh-CN'
+ ? ['点击', '这里', '查看详情']
+ : ['Click ', 'here', ' to learn more'];
+ this.$notify.success({
+ title,
+ duration: 0,
+ message: h('span', [
+ messages[0],
+ h('a', {
+ attrs: {
+ target: '_blank',
+ href: `https://github.com/ElemeFE/element/issues/${ this.lang === 'zh-CN' ? '7304' : '7305' }`
+ }
+ }, messages[1]),
+ messages[2]
+ ]),
+ onClose() {
+ localStorage.setItem('ALPHA_NOTIFIED', 1);
+ }
+ });
+ }
+ }, 3500);
},
created() {