CINXE.COM
Notice of Termination of KKBOX Malaysia Service
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/> <title>Notice of Termination of KKBOX Malaysia Service</title> <style type="text/css"> body { margin: 0; padding: 0; background: #00aed8; font-family: "Open Sans", Arial, Helvetica, "Microsoft JhengHei", "Apple LiGothic Medium", sans-serif; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; } #header { height: 52px; margin-top: 20px; position: relative; } .logo { margin: -36px 18px 0 0; width: 240px; } .wrapper { width: 100%; max-width: 1024px !important; margin: 0 auto; position: relative; } .keyimg { width: 50%; position: absolute; right: 0; bottom: -16px; z-index: -1; } .lang-select { position: absolute; right: 6%; bottom: 0; font-size: 24px; cursor: pointer; } .lang-select a:hover { color: blue; text-decoration: underline; } #maincol, #faq { padding: 3% 6%; line-height: 180%; } #maincol h1 { color: #FFF; font-size: 40px; line-height: 120%; padding: 0 0 0 0; max-width: 700px; margin-bottom: 10px; } #maincol p { color: #93eaff; font-size: 22px; width: 500px; margin-bottom: 40px; } #faq { background: #FFF; } #faq h1 { color: #6f6f6f; margin-bottom: 50px; } #faq a { color: #25C; text-decoration: underline; } #faq strong { font-weight: bold; color: #646464; } .qa { margin: 1% 0 3%; border-bottom: 1px dashed #CCC; } .qa h2 { color: #6f6f6f; font-size: 18px; } .qa p { color: #9e9e9e; font-size: 16px; padding: 0 2%; } footer { color: #93eaff; font-size: 11px; line-height: 1.4; margin: 10px 0; text-align: center; } @media screen and (max-width: 979px) { .keyimg { width: 45%; } #maincol h1 { padding: 0 0 3%; line-height: 130%; } } @media screen and (max-width: 767px) { .keyimg { display: none; width: 95%; float: inherit; } #maincol h1 { padding: 3% 0 0; line-height: 130%; } } </style> <script src="https://cdn.jsdelivr.net/npm/vue@2"></script> <script src="https://unpkg.com/vue-i18n@8"></script> </head> <body> <div id="app"> <div id="header"> <img class="logo" src="images/logo.png"/> <div class="lang-select"> <a @click="$i18n.locale = 'en'">En</a> | <a @click="$i18n.locale = 'cn'">中</a> </div> </div> <div id="maincol"> <div class="wrapper"> <img class="keyimg" src="images/keyimg.png"/> <h1 v-text="$t('title')"></h1> <p v-text="$t('subtitle-1')"></p> <p v-text="$t('subtitle-2')"></p> <p v-html="$t('subtitle-3')"></p> </div> </div> <div id="faq"> <div class="wrapper"> <h1 v-text="$t('faq-title')"></h1> <div class="qa"> <h2 v-text="$t('faq-1-question')"></h2> <p v-html="$t('faq-1-answer')"></p> </div> <div class="qa"> <h2 v-text="$t('faq-2-question')"></h2> <p v-html="$t('faq-2-answer-1')"></p> <p v-html="$t('faq-2-answer-2')"></p> <p v-html="$t('faq-2-answer-3')"></p> </div> <div class="qa"> <h2 v-text="$t('faq-3-question')"></h2> <p v-html="$t('faq-3-answer-1')"></p> <p v-html="$t('faq-3-answer-2')"></p> <p v-html="$t('faq-3-answer-3')"></p> </div> <div class="qa"> <h2 v-text="$t('faq-4-question')"></h2> <p v-html="$t('faq-4-answer')"></p> </div> <div class="qa"> <h2 v-text="$t('faq-5-question')"></h2> <p v-html="$t('faq-5-answer-1')"></p> <p v-html="$t('faq-5-answer-2')"></p> <p v-html="$t('faq-5-answer-3')"></p> <p v-html="$t('faq-5-answer-4')"></p> <p v-html="$t('faq-5-answer-5')"></p> </div> <div class="qa"> <h2 v-text="$t('faq-6-question')"></h2> <p v-html="$t('faq-6-answer-1')"></p> <p v-html="$t('faq-6-answer-2')"></p> <p v-html="$t('faq-6-answer-3')"></p> <p v-html="$t('faq-6-answer-4')"></p> <p v-html="$t('faq-6-answer-5')"></p> </div> <div class="qa"> <h2 v-text="$t('faq-7-question')"></h2> <p v-html="$t('faq-7-answer')"></p> </div> <div class="qa"> <h2 v-text="$t('faq-8-question')"></h2> <p v-html="$t('faq-8-answer')"></p> </div> <h2 v-text="$t('thank-you-title')"></h2> <p v-html="$t('thank-you-message')"></p> </div> </div> </div> <footer>Copyright © <script>document.write(new Date().getFullYear());</script> KKBOX All Rights Reserved. </footer> </body> <script type="module"> const en_msg = await import('./locales/en.js?v2'); const cn_msg = await import('./locales/cn.js?v2'); const i18n = new VueI18n({ locale: 'en', messages: { en: en_msg.default, cn: cn_msg.default, }, }) new Vue({i18n}).$mount('#app') </script> </html>