🎉 init:
This commit is contained in:
commit
9c8766a1a4
|
|
@ -0,0 +1,13 @@
|
|||
# editorconfig.org
|
||||
root = true
|
||||
|
||||
[*]
|
||||
indent_style = space
|
||||
indent_size = 2
|
||||
end_of_line = lf
|
||||
charset = utf-8
|
||||
trim_trailing_whitespace = true
|
||||
insert_final_newline = true
|
||||
|
||||
[*.md]
|
||||
trim_trailing_whitespace = false
|
||||
|
|
@ -0,0 +1,92 @@
|
|||
# Created by .ignore support plugin (hsz.mobi)
|
||||
### Node template
|
||||
# Logs
|
||||
/logs
|
||||
*.log
|
||||
npm-debug.log*
|
||||
yarn-debug.log*
|
||||
yarn-error.log*
|
||||
|
||||
/server
|
||||
*.zip
|
||||
# Runtime data
|
||||
pids
|
||||
*.pid
|
||||
*.seed
|
||||
*.pid.lock
|
||||
|
||||
# Directory for instrumented libs generated by jscoverage/JSCover
|
||||
lib-cov
|
||||
|
||||
# Coverage directory used by tools like istanbul
|
||||
coverage
|
||||
|
||||
# nyc test coverage
|
||||
.nyc_output
|
||||
|
||||
# Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files)
|
||||
.grunt
|
||||
|
||||
# Bower dependency directory (https://bower.io/)
|
||||
bower_components
|
||||
|
||||
# node-waf configuration
|
||||
.lock-wscript
|
||||
|
||||
# Compiled binary addons (https://nodejs.org/api/addons.html)
|
||||
build/Release
|
||||
|
||||
# Dependency directories
|
||||
node_modules/
|
||||
jspm_packages/
|
||||
|
||||
# TypeScript v1 declaration files
|
||||
typings/
|
||||
|
||||
# Optional npm cache directory
|
||||
.npm
|
||||
|
||||
# Optional eslint cache
|
||||
.eslintcache
|
||||
|
||||
# Optional REPL history
|
||||
.node_repl_history
|
||||
|
||||
# Output of 'npm pack'
|
||||
*.tgz
|
||||
|
||||
# Yarn Integrity file
|
||||
.yarn-integrity
|
||||
|
||||
# dotenv environment variables file
|
||||
.env
|
||||
|
||||
# parcel-bundler cache (https://parceljs.org/)
|
||||
.cache
|
||||
|
||||
# next.js build output
|
||||
.next
|
||||
|
||||
# nuxt.js build output
|
||||
.nuxt
|
||||
|
||||
# Nuxt generate
|
||||
dist
|
||||
|
||||
# vuepress build output
|
||||
.vuepress/dist
|
||||
|
||||
# Serverless directories
|
||||
.serverless
|
||||
|
||||
# IDE / Editor
|
||||
.idea
|
||||
|
||||
# Service worker
|
||||
sw.*
|
||||
|
||||
# macOS
|
||||
.DS_Store
|
||||
|
||||
# Vim swap files
|
||||
*.swp
|
||||
|
|
@ -0,0 +1,69 @@
|
|||
# demo
|
||||
|
||||
## Build Setup
|
||||
|
||||
```bash
|
||||
# install dependencies
|
||||
$ yarn install
|
||||
|
||||
# serve with hot reload at localhost:3000
|
||||
$ yarn dev
|
||||
|
||||
# build for production and launch server
|
||||
$ yarn build
|
||||
$ yarn start
|
||||
|
||||
# generate static project
|
||||
$ yarn generate
|
||||
```
|
||||
|
||||
For detailed explanation on how things work, check out the [documentation](https://nuxtjs.org).
|
||||
|
||||
## Special Directories
|
||||
|
||||
You can create the following extra directories, some of which have special behaviors. Only `pages` is required; you can delete them if you don't want to use their functionality.
|
||||
|
||||
### `assets`
|
||||
|
||||
The assets directory contains your uncompiled assets such as Stylus or Sass files, images, or fonts.
|
||||
|
||||
More information about the usage of this directory in [the documentation](https://nuxtjs.org/docs/2.x/directory-structure/assets).
|
||||
|
||||
### `components`
|
||||
|
||||
The components directory contains your Vue.js components. Components make up the different parts of your page and can be reused and imported into your pages, layouts and even other components.
|
||||
|
||||
More information about the usage of this directory in [the documentation](https://nuxtjs.org/docs/2.x/directory-structure/components).
|
||||
|
||||
### `layouts`
|
||||
|
||||
Layouts are a great help when you want to change the look and feel of your Nuxt app, whether you want to include a sidebar or have distinct layouts for mobile and desktop.
|
||||
|
||||
More information about the usage of this directory in [the documentation](https://nuxtjs.org/docs/2.x/directory-structure/layouts).
|
||||
|
||||
|
||||
### `pages`
|
||||
|
||||
This directory contains your application views and routes. Nuxt will read all the `*.vue` files inside this directory and setup Vue Router automatically.
|
||||
|
||||
More information about the usage of this directory in [the documentation](https://nuxtjs.org/docs/2.x/get-started/routing).
|
||||
|
||||
### `plugins`
|
||||
|
||||
The plugins directory contains JavaScript plugins that you want to run before instantiating the root Vue.js Application. This is the place to add Vue plugins and to inject functions or constants. Every time you need to use `Vue.use()`, you should create a file in `plugins/` and add its path to plugins in `nuxt.config.js`.
|
||||
|
||||
More information about the usage of this directory in [the documentation](https://nuxtjs.org/docs/2.x/directory-structure/plugins).
|
||||
|
||||
### `static`
|
||||
|
||||
This directory contains your static files. Each file inside this directory is mapped to `/`.
|
||||
|
||||
Example: `/static/robots.txt` is mapped as `/robots.txt`.
|
||||
|
||||
More information about the usage of this directory in [the documentation](https://nuxtjs.org/docs/2.x/directory-structure/static).
|
||||
|
||||
### `store`
|
||||
|
||||
This directory contains your Vuex store files. Creating a file in this directory automatically activates Vuex.
|
||||
|
||||
More information about the usage of this directory in [the documentation](https://nuxtjs.org/docs/2.x/directory-structure/store).
|
||||
File diff suppressed because one or more lines are too long
Binary file not shown.
Binary file not shown.
|
|
@ -0,0 +1,128 @@
|
|||
export const tabs=[
|
||||
{
|
||||
name:'index',
|
||||
title:'Home',
|
||||
icon:'home'
|
||||
},
|
||||
{
|
||||
name:'startups',
|
||||
icon:'startups',
|
||||
title:'Startups'
|
||||
}, {
|
||||
name:'innovation',
|
||||
icon:'innovationInsights',
|
||||
title:'Innovation Insights'
|
||||
}, {
|
||||
name:'LPLogin',
|
||||
icon:'LPLogin',
|
||||
title:'LP Login'
|
||||
},
|
||||
{
|
||||
name:'joinUs',
|
||||
icon:'joinLightLimX',
|
||||
title:'Join LightLimX'
|
||||
},
|
||||
{
|
||||
name:'contact',
|
||||
icon:'contactUs',
|
||||
title:'Contact Us'
|
||||
},
|
||||
]
|
||||
export const footerLink=[
|
||||
{
|
||||
name:'startups',
|
||||
title:'Startups',
|
||||
type:'link'
|
||||
},
|
||||
{
|
||||
name:'LPLogin',
|
||||
title:'LP Login',
|
||||
type:'link'
|
||||
},
|
||||
{
|
||||
name:'partners',
|
||||
title:'Partners',
|
||||
type:'href',
|
||||
link:'/'
|
||||
},
|
||||
{
|
||||
name:'portfolio',
|
||||
title:'Portfolio',
|
||||
type:'href',
|
||||
link:'/'
|
||||
},
|
||||
{
|
||||
name:'focusAreas',
|
||||
title:'Focus Areas',
|
||||
type:'href',
|
||||
link:'/'
|
||||
},
|
||||
{
|
||||
name:'aboutUs',
|
||||
title:'About Us',
|
||||
type:'href',
|
||||
link:'/'
|
||||
}, {
|
||||
name:'innovation',
|
||||
title:'Innovation Insights',
|
||||
type:'link'
|
||||
},
|
||||
{
|
||||
name:'joinUs',
|
||||
title:'Join LightLimX',
|
||||
type:'link'
|
||||
},
|
||||
{
|
||||
name:'contact',
|
||||
title:'Contact Us',
|
||||
type:'link'
|
||||
},
|
||||
]
|
||||
export const portfolios=[
|
||||
{
|
||||
time:'.3s',
|
||||
img:'Accelerator',
|
||||
title:'Accelerator',
|
||||
content:'We leverage proprietary processes to build market-leading companies from scratch. Our extensive operational support team accelerates the growth of ventures we partner with.',
|
||||
link:'/startups'
|
||||
},{
|
||||
time:'.6s',
|
||||
img:'Investment',
|
||||
title:'Investment',
|
||||
content:'We bring our wealth of venture experience and leverage our global resources to help projects and maximize their potential.',
|
||||
link:'/startups'
|
||||
},{
|
||||
time:'.9s',
|
||||
img:'Growth',
|
||||
title:'Growth',
|
||||
content:'We drive strategic growth, shorten the time to reach global scale, facilitate introductions, but we don’t stop there. ',
|
||||
link:'/startups'
|
||||
},
|
||||
]
|
||||
export const partners=[
|
||||
{
|
||||
img:'images/1.png',
|
||||
link:''
|
||||
}, {
|
||||
img:'images/2.png',
|
||||
link:''
|
||||
}, {
|
||||
img:'images/3.png',
|
||||
link:''
|
||||
}, {
|
||||
img:'images/4.png',
|
||||
link:''
|
||||
}, {
|
||||
img:'images/5.png',
|
||||
link:''
|
||||
}
|
||||
]
|
||||
export const banners=[
|
||||
{
|
||||
img:'images/b.png',
|
||||
},{
|
||||
img:'images/1.png',
|
||||
},{
|
||||
img:'images/2.png',
|
||||
},
|
||||
]
|
||||
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
|
|
@ -0,0 +1,63 @@
|
|||
@font-face {
|
||||
font-family: 'Manrope'; /*给自定义字体命名*/
|
||||
src: url('~/assets/fonts/Manrope-Regular.ttf') format('truetype');
|
||||
font-weight:normal;
|
||||
font-style: normal;
|
||||
}
|
||||
@font-face {
|
||||
font-family: 'Manrope'; /*给自定义字体命名*/
|
||||
src: url('~/assets/fonts/Manrope-Bold.ttf') format('truetype');
|
||||
font-weight:Bold;
|
||||
font-style: normal;
|
||||
}
|
||||
body,dl,dt,dd,ul,ol,li,pre,form,fieldset,input,p,blockquote,th,td{;font-weight:400;margin:0;padding:0}h1,h2,h3,h4,h4,h5{margin:0;padding:0}body{background-color:#f7f7f7;color:#666;font-family:Helvetica,Arial,sans-serif;font-size:14px;text-align:left}select{font-size:14px}table{border-collapse:collapse}fieldset,img{border:0 none}fieldset{margin:0;padding:0}fieldset p{margin:0;padding:0 0 0 8px}legend{display:none}address,caption,em,strong,th,i{font-style:normal;font-weight:400}table caption{margin-left:-1px}hr{border-bottom:1px solid #fff;border-top:1px solid #eee;border-width:1px 0;clear:both;height:2px;margin:5px 0;overflow:hidden}ol,ul{list-style-image:none;list-style-position:outside;list-style-type:none}caption,th{text-align:left}q:before,q:after,blockquote:before,blockquote:after{content:''}.clearfix{clear: both;}.fl{float: left;}.fr{float: right;}html,body{height: 100%}
|
||||
#__layout,#__nuxt{
|
||||
height: 100%;
|
||||
display: block;
|
||||
}
|
||||
body{
|
||||
overflow-x: hidden !important;
|
||||
}
|
||||
div[class*="-h5-wrap"]{
|
||||
width: 100%;
|
||||
max-width: 13rem;
|
||||
margin: 0 auto;
|
||||
}
|
||||
@media screen and (max-width: 1300px) {
|
||||
div[class*="-h5-wrap"]{
|
||||
padding: 0 .15rem;
|
||||
box-sizing: border-box;
|
||||
white-space:pre-wrap;
|
||||
//overflow--y: visible;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 768px) {
|
||||
div[class*="-h5-wrap"]{
|
||||
padding: 0 .15rem;
|
||||
box-sizing: border-box;
|
||||
white-space:pre-wrap;
|
||||
overflow-x:hidden ;
|
||||
height: auto !important;
|
||||
}
|
||||
}
|
||||
.h5-scroll-bar{
|
||||
overflow-y: auto;
|
||||
}
|
||||
.h5-scroll-bar::-webkit-scrollbar{
|
||||
width:4px;
|
||||
height:4px;
|
||||
}
|
||||
.h5-scroll-bar::-webkit-scrollbar-track{
|
||||
background: #f6f6f6;
|
||||
border-radius:2px;
|
||||
}
|
||||
.h5-scroll-bar::-webkit-scrollbar-thumb{
|
||||
background: #aaa;
|
||||
border-radius:2px;
|
||||
}
|
||||
.h5-scroll-bar::-webkit-scrollbar-thumb:hover{
|
||||
background: #747474;
|
||||
}
|
||||
.h5-scroll-bar::-webkit-scrollbar-corner{
|
||||
background: #f6f6f6;
|
||||
}
|
||||
|
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="34.001" height="28.237" viewBox="0 0 34.001 28.237"><g transform="translate(-0.007 -86.803)"><path d="M297.4,421.875l-7.347,7.9,2.14,1.992,3.679-3.959v11.174h3.06V427.814l3.679,3.957,2.139-1.992Z" transform="translate(-280.419 -323.946)"/><path d="M29.3,86.8H4.713A4.706,4.706,0,0,0,.007,91.509v18.825a4.706,4.706,0,0,0,4.706,4.706H9.948v-2.656H4.713a2.052,2.052,0,0,1-2.05-2.05V91.509a2.052,2.052,0,0,1,2.05-2.05H29.3a2.052,2.052,0,0,1,2.05,2.05v18.825a2.052,2.052,0,0,1-2.05,2.05H24.067v2.656H29.3a4.706,4.706,0,0,0,4.706-4.706V91.509A4.706,4.706,0,0,0,29.3,86.8Z"/></g></svg>
|
||||
|
After Width: | Height: | Size: 625 B |
|
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="7.121" height="11.414" viewBox="0 0 7.121 11.414"><defs><style>.a{fill:none;stroke:#000;stroke-width:2px;}</style></defs><path class="a" d="M378.216,431.015l5,5,5-5" transform="translate(437.429 -377.509) rotate(90)"/></svg>
|
||||
|
After Width: | Height: | Size: 271 B |
|
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="34" height="34" viewBox="0 0 34 34"><defs><style>.a{fill:#929292;}</style></defs><path class="a" d="M43.977,42.025,29.335,27.383a1.38,1.38,0,1,0-1.952,1.952L42.025,43.977,27.383,58.619a1.38,1.38,0,1,0,1.952,1.952L43.977,45.929,58.619,60.571a1.38,1.38,0,1,0,1.952-1.952L45.929,43.977,60.571,29.335a1.38,1.38,0,1,0-1.952-1.952Z" transform="translate(-26.977 -26.977)"/></svg>
|
||||
|
After Width: | Height: | Size: 420 B |
|
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="34" height="30.385" viewBox="0 0 34 30.385"><g transform="translate(-95.645 -160.6)"><path d="M585.8,697.5m-1.6,0a1.6,1.6,0,1,0,1.6-1.6A1.6,1.6,0,0,0,584.2,697.5Z" transform="translate(-469.015 -513.89)"/><path d="M129.468,168.271l-.644-2.06a8.521,8.521,0,0,0-2.576-3.892,6.865,6.865,0,0,0-4.412-1.72H103.454a6.873,6.873,0,0,0-4.412,1.72,8.552,8.552,0,0,0-2.576,3.892l-.644,2.06a3.823,3.823,0,0,0,3.648,4.964h2.344l-2.544,9.015a6.5,6.5,0,0,0,6.1,8.735h14.539a6.5,6.5,0,0,0,6.1-8.735l-2.544-9.015h2.344a3.828,3.828,0,0,0,3.652-4.964Zm-6.187,14.811a.985.985,0,0,0,.04.116,3.638,3.638,0,0,1-3.4,4.924H105.378a3.638,3.638,0,0,1-3.4-4.924c.016-.04.028-.076.04-.116l2.78-9.851h1.4a3.829,3.829,0,0,0,3.78-4.412h5.36a3.829,3.829,0,0,0,3.78,4.412h1.4Zm3.48-12.979a1.152,1.152,0,0,1-.94.476H119.1a1.166,1.166,0,0,1-1.112-1.516l.364-1.168a1.323,1.323,0,0,0-1.264-1.72H108.21a1.326,1.326,0,0,0-1.268,1.72l.364,1.168a1.166,1.166,0,0,1-1.112,1.516H99.475a1.166,1.166,0,0,1-1.112-1.516l.644-2.06a5.127,5.127,0,0,1,4.452-3.752h18.386A5.127,5.127,0,0,1,126.3,167l.644,2.06A1.168,1.168,0,0,1,126.76,170.1Z" transform="translate(0)"/><path d="M373.127,482a6.327,6.327,0,1,0,0,12.655,1.216,1.216,0,1,0,0-2.432,3.9,3.9,0,1,1,3.9-3.9,1.216,1.216,0,0,0,2.432,0A6.339,6.339,0,0,0,373.127,482Z" transform="translate(-260.31 -308.545)"/></g></svg>
|
||||
|
After Width: | Height: | Size: 1.3 KiB |
|
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="24.21" height="24.319" viewBox="0 0 24.21 24.319"><defs><style>.a{fill:#7b7b7b;}</style></defs><path class="a" d="M83.819,66.311A2.188,2.188,0,0,1,86.008,68.5V82.13a2.188,2.188,0,0,1-2.188,2.188H70.188A2.188,2.188,0,0,1,68,82.13V68.5a2.188,2.188,0,0,1,2.188-2.188H83.819Zm-6.8,4a.813.813,0,0,0-.813.8v3.406H72.8a.813.813,0,0,0,.006,1.625h3.406v3.38a.813.813,0,0,0,1.625-.006V76.143h3.38a.813.813,0,0,0-.006-1.625H77.832V71.106a.813.813,0,0,0-.813-.794ZM89.206,60a3,3,0,0,1,3,2.954V73.018a3,3,0,0,1-2.954,3h-1.14A.814.814,0,0,1,88.1,74.4h1.11a1.377,1.377,0,0,0,1.377-1.354V63a1.377,1.377,0,0,0-1.354-1.377H79.192a1.377,1.377,0,0,0-1.377,1.354V64.29a.814.814,0,0,1-1.627.019V63a3,3,0,0,1,2.954-3H89.206Z" transform="translate(-68 -60)"/></svg>
|
||||
|
After Width: | Height: | Size: 788 B |
|
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="21.414" height="12.121" viewBox="0 0 21.414 12.121"><defs><style>.a{fill:none;stroke:#f49f00;stroke-miterlimit:10;stroke-width:2px;}</style></defs><path class="a" d="M871.933,321.933l10,10-10,10" transform="translate(342.64 -871.226) rotate(90)"/></svg>
|
||||
|
After Width: | Height: | Size: 300 B |
|
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="30" height="30" viewBox="0 0 30 30"><defs><style>.a,.b{fill:none;}.b{stroke:#000;stroke-width:2px;}</style></defs><g transform="translate(-373 -411)"><g transform="translate(373 411)"><rect class="a" width="30" height="30"/></g><path class="b" d="M378.216,431.015l5,5,5-5" transform="translate(5.096 -7.203)"/></g></svg>
|
||||
|
After Width: | Height: | Size: 367 B |
|
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 0 48 48"><defs><style>.a{fill:none;}.b{fill:#1c1717;}</style></defs><g transform="translate(-373 -411)"><rect class="a" width="48" height="48" transform="translate(373 411)"/><path class="b" d="M156.915,265.944v-1.657h6.629v1.657H176.8v3.315H163.544v1.657h-6.629v-1.657H153.6v-3.315Zm9.944-8.287V256h6.629v1.657H176.8v3.315h-3.315v1.657h-6.629v-1.657H153.6v-3.315Z" transform="translate(231.601 171.629)"/></g></svg>
|
||||
|
After Width: | Height: | Size: 490 B |
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 8.5 KiB |
|
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="154.197" height="26.408" viewBox="0 0 154.197 26.408"><defs><style>.a{fill:#fff;}.b{fill:#f49f00;}</style></defs><g transform="translate(3127.067 -1675.422)"><path class="a" d="M-3127.067,1680.121h2.115v17.1h11.68l-.349,1.886h-13.447Z" transform="translate(0 -3.588)"/><rect class="a" width="2.014" height="2.922" transform="translate(-3110.01 1675.422)"/><rect class="a" width="2.014" height="13.408" transform="translate(-3110.01 1682.108)"/><path class="a" d="M-3018.195,1714.083c0,5.11-1.531,8.142-7.019,8.142-5.06,0-6.148-2.95-6.41-4.555h2.067c.427,1.512,1.479,2.858,4.453,2.858,4.264,0,4.926-2.749,4.926-6.362v-.78c-.822,1.707-2.376,2.775-5.216,2.775-3.756,0-6.381-2.948-6.381-6.791,0-4.331,3.155-7.239,6.7-7.239,3.143,0,4.461,1.473,4.892,2.6,0-.7.031-1.836.08-2.223h1.93c-.027,1.292-.027,2.584-.027,3.877Zm-11.5-4.806a4.752,4.752,0,0,0,4.765,5.1c3,0,4.814-1.875,4.814-5.255,0-3.4-1.733-5.219-4.663-5.219C-3028.164,1703.9-3029.7,1706.653-3029.7,1709.277Z" transform="translate(-72.766 -20.395)"/><path class="a" d="M-2952.7,1675.422v9.31c.466-1.055,1.728-3,5.1-3,2.995,0,5.038,1.878,5.038,5.67v8.11h-2.022v-7.76c0-2.413-.915-4.249-3.586-4.249-3.079,0-4.53,2.5-4.53,5.377v6.632h-2.014v-20.094Z" transform="translate(-131.614)"/><path class="a" d="M-2893.207,1689.418h2.739V1685h2.018v4.423h3.611v1.666h-3.611v7.836c0,1.652.437,2.382,1.945,2.382a6.205,6.205,0,0,0,1.37-.125v1.547a5.37,5.37,0,0,1-1.9.231c-2.623,0-3.434-1.183-3.434-3.83v-8.04h-2.739Z" transform="translate(-178.578 -7.31)"/><path class="a" d="M-2844.413,1681.016h4.552v15.12h10.509l-.6,3.651h-14.463Z" transform="translate(-215.838 -4.272)"/><path class="a" d="M-2769.927,1676.477h4.355v3.479h-4.355Zm0,6.072h4.355v13.772h-4.355Z" transform="translate(-272.716 -0.806)"/><path class="a" d="M-2736.067,1704.517c0-1.194,0-2.363-.026-3.556h4.164c.077.536.1,1.131.124,1.629a4.914,4.914,0,0,1,4.193-2c2.434,0,3.612,1.066,4.155,2.256a5.222,5.222,0,0,1,4.637-2.256c2.884,0,5.154,1.721,5.154,5.826v8.319h-4.284v-8.215c0-1.2-.419-2.64-2.226-2.64-1.564,0-2.512.981-2.512,3.251v7.6H-2727V1706.5c0-1.36-.493-2.621-2.229-2.621-1.765,0-2.532,1.272-2.532,3.262v7.593h-4.308Z" transform="translate(-298.552 -19.217)"/><g transform="translate(-3005.732 1678.467)"><path class="b" d="M-2606.187,1691.912c.386.318.886.766,1.487,1.328l1.848,1.886,4.236-4.125-2.771-2.7s-.005,0-.009,0h-12.385a17.619,17.619,0,0,1,3.334,1.033A18.454,18.454,0,0,1-2606.187,1691.912Z" transform="translate(2613.781 -1688.303)"/><path class="b" d="M-2589.642,1699.35l-3.042-2.963.026-.026,3.058-3.122c.6-.562,1.1-1.01,1.487-1.328a18.449,18.449,0,0,1,4.26-2.575,17.63,17.63,0,0,1,3.334-1.033H-2592.9s-.009,0-.009,0l-11.345,11.047q-1.485,1.367-2.97,2.5a17.686,17.686,0,0,1-6.029,2.532s.963.974.963.974h10.46l4.86-4.763.024-.023.023.023,4.86,4.763h10.46s.967-.974.963-.974a17.69,17.69,0,0,1-6.029-2.532Q-2588.157,1700.722-2589.642,1699.35Z" transform="translate(2613.381 -1688.303)"/></g></g></svg>
|
||||
|
After Width: | Height: | Size: 2.9 KiB |
|
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="34" height="32.818" viewBox="0 0 34 32.818"><defs><style>.a{fill:#2e2c2c;}</style></defs><path class="a" d="M33.567,34.168,18.1,18.258a1.509,1.509,0,0,0-1.091-.46h-.032a1.51,1.51,0,0,0-1.119.462L.443,34.17a1.852,1.852,0,0,0-.32,1.843,1.672,1.672,0,0,0,1.415,1.119H3.852v11.6a2.082,2.082,0,0,0,1.782,1.884h6.79c.873,0,1.414-.93,1.414-1.791V43.36H19.3v5.372a1.973,1.973,0,0,0,.609,1.259,1.931,1.931,0,0,0,1.251.625h6.686a1.344,1.344,0,0,0,1.135-.725,2.323,2.323,0,0,0,.336-1.158v-11.6h3.161a1.673,1.673,0,0,0,1.415-1.12,1.854,1.854,0,0,0-.322-1.844ZM26.2,35.508V47.5H22.41v-6a1.223,1.223,0,0,0-.328-.949,1.3,1.3,0,0,0-.926-.273H12.28a1.924,1.924,0,0,0-.956.2,1.116,1.116,0,0,0-.569,1.025v6H6.935V35.253a1.13,1.13,0,0,0-1.3-1.236H5.182l11.8-12.178,11.84,12.178h-.806A1.732,1.732,0,0,0,26.2,35.508Z" transform="translate(-0.006 -17.798)"/></svg>
|
||||
|
After Width: | Height: | Size: 888 B |
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 388 KiB |
|
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="34" height="34" viewBox="0 0 34 34"><defs><style>.a{fill:#333;}</style></defs><g transform="translate(-102.4 -102.4)"><path class="a" d="M127.9,130.557V102.4H108.244a5.844,5.844,0,0,0-5.844,5.844v22.313a5.844,5.844,0,0,0,5.844,5.844h13.813A5.844,5.844,0,0,0,127.9,130.557Zm-19.656-24.969h16.469v24.969a2.657,2.657,0,0,1-2.656,2.656H108.244a2.657,2.657,0,0,1-2.656-2.656V108.244A2.657,2.657,0,0,1,108.244,105.588Z" transform="translate(0 0)"/><path class="a" d="M716.8,102.4h2.125v2.125H716.8Z" transform="translate(-588.9 0)"/><path class="a" d="M258.712,115.6a1.594,1.594,0,0,1,.021,2.253l-6.4,6.524-.03.023-.145.132-.006.006.181-.159a1.587,1.587,0,0,1-.344.266l-.051.028a1.581,1.581,0,0,1-1.577-.051l-.076-.051a1.233,1.233,0,0,1-.113-.085l-.07-.064-2.871-2.716a1.594,1.594,0,1,1,2.189-2.317l1.732,1.641,5.306-5.406a1.594,1.594,0,0,1,2.253-.021ZM268.9,102.4a5.844,5.844,0,0,0-5.844,5.844v10.094H268.9a5.844,5.844,0,0,0,5.844-5.844v-4.25A5.844,5.844,0,0,0,268.9,102.4Zm0,3.188a2.657,2.657,0,0,1,2.656,2.656v4.25l-.013.272a2.656,2.656,0,0,1-2.644,2.384h-2.656v-6.906A2.657,2.657,0,0,1,268.9,105.588Z" transform="translate(-138.343 0)"/></g></svg>
|
||||
|
After Width: | Height: | Size: 1.2 KiB |
|
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="34" height="33.301" viewBox="0 0 34 33.301"><g transform="translate(-131.586 -139.307)"><path d="M162.248,318.732H134.924a3.337,3.337,0,0,1-2.431-1.068,3.429,3.429,0,0,1-.9-2.6l1.592-19.678a3.384,3.384,0,0,1,3.327-3.118h24.139a3.384,3.384,0,0,1,3.327,3.118l1.592,19.668a3.429,3.429,0,0,1-.9,2.6,3.31,3.31,0,0,1-2.431,1.077Zm-25.731-23.605a.506.506,0,0,0-.477.486l-1.583,19.678a.593.593,0,0,0,.143.439.46.46,0,0,0,.334.153h27.314a.46.46,0,0,0,.334-.153.577.577,0,0,0,.143-.439l-1.592-19.668a.5.5,0,0,0-.477-.486H136.516Z" transform="translate(0 -146.124)"/><path d="M236.691,147.573h-2.86V144.2a2.233,2.233,0,0,0-2.383-2.031h-9.534a2.226,2.226,0,0,0-2.383,2.031v3.375h-2.86V144.2a5.083,5.083,0,0,1,5.244-4.891h9.534a5.083,5.083,0,0,1,5.244,4.891v3.375Zm-23.358,6.035h26.694v2.86H213.333Z" transform="translate(-78.094)"/><path d="M380.17,507.743a6.209,6.209,0,0,1-6.2-6.2h2.86a3.337,3.337,0,1,0,6.674,0h2.86a6.2,6.2,0,0,1-6.2,6.2Z" transform="translate(-231.555 -346.051)"/></g></svg>
|
||||
|
After Width: | Height: | Size: 1.0 KiB |
|
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 750.26 389.25"><defs><style>.cls-1{fill:#f49f00;}</style></defs><title>资源 17</title><g id="图层_2" data-name="图层 2"><g id="图层_1-2" data-name="图层 1"><path class="cls-1" d="M173.39,82.39c8.82,7.27,20.23,17.49,33.94,30.33l42.19,43.06,96.71-94.17L283,0s-.12.07-.19,0H0A403,403,0,0,1,76.12,23.6C107.08,37.62,144.32,57.53,173.39,82.39Z"/><path class="cls-1" d="M542,252.22,472.5,184.58l.6-.59,69.83-71.27c13.71-12.84,25.12-23.06,33.94-30.33,29.07-24.86,66.3-44.77,97.27-58.79A403,403,0,0,1,750.26,0H467.49c-.07.07-.19,0-.19,0l-259,252.22q-33.9,31.21-67.81,57A403.66,403.66,0,0,1,2.83,367c-.09,0,22,22.25,22,22.25H263.63l111-108.73.54-.53.53.53,111,108.73H725.44s22.08-22.25,22-22.25a403.66,403.66,0,0,1-137.65-57.82Q575.88,283.53,542,252.22Z"/></g></g></svg>
|
||||
|
After Width: | Height: | Size: 823 B |
|
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="154.197" height="26.408" viewBox="0 0 154.197 26.408"><defs><style>.a{fill:#fff;}.b{fill:#f49f00;}</style></defs><g transform="translate(3127.067 -1675.422)"><path class="a" d="M-3127.067,1680.121h2.115v17.1h11.68l-.349,1.886h-13.447Z" transform="translate(0 -3.588)"/><rect class="a" width="2.014" height="2.922" transform="translate(-3110.01 1675.422)"/><rect class="a" width="2.014" height="13.408" transform="translate(-3110.01 1682.108)"/><path class="a" d="M-3018.195,1714.083c0,5.11-1.531,8.142-7.019,8.142-5.06,0-6.148-2.95-6.41-4.555h2.067c.427,1.512,1.479,2.858,4.453,2.858,4.264,0,4.926-2.749,4.926-6.362v-.78c-.822,1.707-2.376,2.775-5.216,2.775-3.756,0-6.381-2.948-6.381-6.791,0-4.331,3.155-7.239,6.7-7.239,3.143,0,4.461,1.473,4.892,2.6,0-.7.031-1.836.08-2.223h1.93c-.027,1.292-.027,2.584-.027,3.877Zm-11.5-4.806a4.752,4.752,0,0,0,4.765,5.1c3,0,4.814-1.875,4.814-5.255,0-3.4-1.733-5.219-4.663-5.219C-3028.164,1703.9-3029.7,1706.653-3029.7,1709.277Z" transform="translate(-72.766 -20.395)"/><path class="a" d="M-2952.7,1675.422v9.31c.466-1.055,1.728-3,5.1-3,2.995,0,5.038,1.878,5.038,5.67v8.11h-2.022v-7.76c0-2.413-.915-4.249-3.586-4.249-3.079,0-4.53,2.5-4.53,5.377v6.632h-2.014v-20.094Z" transform="translate(-131.614)"/><path class="a" d="M-2893.207,1689.418h2.739V1685h2.018v4.423h3.611v1.666h-3.611v7.836c0,1.652.437,2.382,1.945,2.382a6.205,6.205,0,0,0,1.37-.125v1.547a5.37,5.37,0,0,1-1.9.231c-2.623,0-3.434-1.183-3.434-3.83v-8.04h-2.739Z" transform="translate(-178.578 -7.31)"/><path class="a" d="M-2844.413,1681.016h4.552v15.12h10.509l-.6,3.651h-14.463Z" transform="translate(-215.838 -4.272)"/><path class="a" d="M-2769.927,1676.477h4.355v3.479h-4.355Zm0,6.072h4.355v13.772h-4.355Z" transform="translate(-272.716 -0.806)"/><path class="a" d="M-2736.067,1704.517c0-1.194,0-2.363-.026-3.556h4.164c.077.536.1,1.131.124,1.629a4.914,4.914,0,0,1,4.193-2c2.434,0,3.612,1.066,4.155,2.256a5.222,5.222,0,0,1,4.637-2.256c2.884,0,5.154,1.721,5.154,5.826v8.319h-4.284v-8.215c0-1.2-.419-2.64-2.226-2.64-1.564,0-2.512.981-2.512,3.251v7.6H-2727V1706.5c0-1.36-.493-2.621-2.229-2.621-1.765,0-2.532,1.272-2.532,3.262v7.593h-4.308Z" transform="translate(-298.552 -19.217)"/><g transform="translate(-3005.732 1678.467)"><path class="b" d="M-2606.187,1691.912c.386.318.886.766,1.487,1.328l1.848,1.886,4.236-4.125-2.771-2.7s-.005,0-.009,0h-12.385a17.619,17.619,0,0,1,3.334,1.033A18.454,18.454,0,0,1-2606.187,1691.912Z" transform="translate(2613.781 -1688.303)"/><path class="b" d="M-2589.642,1699.35l-3.042-2.963.026-.026,3.058-3.122c.6-.562,1.1-1.01,1.487-1.328a18.449,18.449,0,0,1,4.26-2.575,17.63,17.63,0,0,1,3.334-1.033H-2592.9s-.009,0-.009,0l-11.345,11.047q-1.485,1.367-2.97,2.5a17.686,17.686,0,0,1-6.029,2.532s.963.974.963.974h10.46l4.86-4.763.024-.023.023.023,4.86,4.763h10.46s.967-.974.963-.974a17.69,17.69,0,0,1-6.029-2.532Q-2588.157,1700.722-2589.642,1699.35Z" transform="translate(2613.381 -1688.303)"/></g></g></svg>
|
||||
|
After Width: | Height: | Size: 2.9 KiB |
|
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="34" height="29.055" viewBox="0 0 34 29.055"><defs><style>.a{fill:#929292;}</style></defs><path class="a" d="M186.756,235.667h30.7a1.648,1.648,0,0,0,0-3.3h-30.7a1.517,1.517,0,0,0-1.649,1.648A1.625,1.625,0,0,0,186.756,235.667Zm30.7,9.685h-30.7A1.517,1.517,0,0,0,185.107,247a1.625,1.625,0,0,0,1.649,1.648h30.7a1.648,1.648,0,0,0,0-3.3Zm0,12.776h-30.7a1.517,1.517,0,0,0-1.649,1.648,1.625,1.625,0,0,0,1.649,1.648h30.7a1.648,1.648,0,1,0,0-3.3Z" transform="translate(-185.107 -232.37)"/></svg>
|
||||
|
After Width: | Height: | Size: 532 B |
|
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="331.023" height="243.18" viewBox="0 0 331.023 243.18"><defs><style>.a,.b,.c,.d,.e,.f{fill:none;stroke:#f49f00;stroke-miterlimit:10;}.a,.b,.c,.d,.e{stroke-width:0.75px;}.a{opacity:0.1;}.b{opacity:0.2;}.c{opacity:0.3;}.d{opacity:0.4;}.e{opacity:0.5;}.g{fill:#f49f00;}</style></defs><g transform="translate(0.91 0.375)"><path class="a" d="M-2110.917-3433.463l-122.114-121.215,122.114-121.215h-84.974l-79.627,79.04-79.627-79.04h-84.974l122.114,121.215-122.114,121.215h84.974l79.627-79.041,79.627,79.041Z" transform="translate(2440.12 3675.894)"/><path class="b" d="M-2123.787-3442.941l-103.644-102.881,103.644-102.882h-72.122l-67.583,67.086-67.583-67.086H-2403.2l103.644,102.882L-2403.2-3442.941h72.122l67.583-67.085,67.583,67.085Z" transform="translate(2428.094 3667.038)"/><path class="c" d="M-2136.658-3452.419l-85.174-84.546,85.174-84.548h-59.269l-55.539,55.131-55.539-55.131h-59.27l85.174,84.548-85.174,84.546h59.27l55.539-55.13,55.539,55.13Z" transform="translate(2416.068 3658.181)"/><path class="d" d="M-2149.528-3461.9l-66.7-66.213,66.7-66.213h-46.417l-43.5,43.175-43.5-43.175h-46.417l66.7,66.213-66.7,66.213h46.417l43.5-43.175,43.5,43.175Z" transform="translate(2404.042 3649.325)"/><path class="e" d="M-2162.4-3471.375l-48.234-47.878,48.234-47.879h-33.564l-31.452,31.22-31.452-31.22h-33.564l48.233,47.879-48.233,47.878h33.564l31.452-31.22,31.452,31.22Z" transform="translate(2392.016 3640.469)"/><path class="f" d="M-2175.27-3539.942h-20.711l-19.407,19.265-19.408-19.265h-20.711l29.764,29.544-29.764,29.544h20.711l19.408-19.264,19.407,19.264h20.711l-29.764-29.544Z" transform="translate(2379.99 3631.612)"/><g transform="translate(118.095 86.968)"><path class="g" d="M-2171.967-3478.422h-24.009l-69-68.5h24.009Z" transform="translate(2264.98 3546.917)"/><path class="g" d="M-2264.98-3478.422h24.009l69-68.5h-24.009Z" transform="translate(2264.98 3546.917)"/></g></g></svg>
|
||||
|
After Width: | Height: | Size: 1.9 KiB |
|
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="34" height="35.976" viewBox="0 0 34 35.976"><defs><style>.a{fill:#2e2c2c;}</style></defs><g transform="translate(-85.334 -64.643)"><path class="a" d="M559.115,312.532l14.254,2.818a.857.857,0,0,1,.677.691l.014.149v21.5a.858.858,0,0,1-.7.844l-.154.014H559.1l.01-26.011Zm3.427,4.173-.007,18.408h8.1V318.3l-8.088-1.6Z" transform="translate(-454.726 -237.924)"/><path class="a" d="M107.793,65.288a.858.858,0,0,1,.026.213V99.8a.818.818,0,0,1-.818.816H86.191a.858.858,0,0,1-.858-.858V70.823a.858.858,0,0,1,.645-.83l20.77-5.322a.858.858,0,0,1,1.045.617Zm-3.4,3.528-15.625,4v24.37h15.625Z" transform="translate(0)"/><path class="a" d="M400.983,288.384h3.087v8.576h-3.43v-8.576Z" transform="translate(-302.631 -214.747)"/></g></svg>
|
||||
|
After Width: | Height: | Size: 769 B |
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 460 KiB |
|
|
@ -0,0 +1,202 @@
|
|||
<template>
|
||||
<section class="section-view" :style="isCssStyle" >
|
||||
<div class="section-view-h5-wrap">
|
||||
<h1 class="section-view-title wow fadeInUpBig">About Us</h1>
|
||||
<div class="section-view-content">
|
||||
<div class="section-view-circle wow fadeInUpBig" data-wow-delay=".5s">
|
||||
<slot></slot>
|
||||
</div>
|
||||
<div class="section-view-article">
|
||||
<h1 class="section-view-title wow fadeInUpBig" style="text-align: center">About Us</h1>
|
||||
<p class="section-view-article-p wow fadeInUpBig" data-wow-delay=".3s" >LightLimX is an early-stage investment platform. We focus on markets where technology, innovation, and LightLimX can unlock long-term value and drive economic growth.</p>
|
||||
<p class="section-view-article-w wow fadeInUpBig" data-wow-delay=".4s">"To create miracles and give insight into the future together with entrepreneurs" is the original aspiration of LightLimX. As an investment institution with strong curiosity and corporate responsibility, we catalyze technological advancement by connecting blue chip corporations with the brightest startups across the globe.</p>
|
||||
<p class="section-view-article-w wow fadeInUpBig" data-wow-delay=".5s">In addition to making direct venture investments,LightLimX provides financing& insigths& operating expertise to promising the most compelling companies to flourish.To-date, LightLimX has provided advice and support for more than 20 companies, raised more than $15 million in seed and later-stage funding,valued at over $1 billion dollars.</p>
|
||||
<div class="section-view-flower-wrap wow fadeInUpBig" data-wow-delay=".5s">
|
||||
<svg-icon icon-class="flower"></svg-icon>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "AboutUs",
|
||||
props:{
|
||||
cssStyle:{
|
||||
type:Object,
|
||||
default:()=>{
|
||||
return {}
|
||||
}
|
||||
}
|
||||
},
|
||||
computed:{
|
||||
isCssStyle(){
|
||||
return this.cssStyle
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.section-view{
|
||||
width: 100%;
|
||||
min-height: 100vh;
|
||||
box-sizing: border-box;
|
||||
background-color: #fff;
|
||||
&-content{
|
||||
display: flex;
|
||||
}
|
||||
&-flower-wrap{
|
||||
margin-top: 0;
|
||||
.svg-icon{
|
||||
width: 1.76rem;
|
||||
height: .21rem;
|
||||
}
|
||||
}
|
||||
&-title{
|
||||
padding-top: 1.21rem;
|
||||
margin-bottom: .74rem;
|
||||
font-size: .6rem;
|
||||
font-family: Manrope;
|
||||
font-weight: bold;
|
||||
line-height: .84rem;
|
||||
color: #302D2C;
|
||||
text-align: center;
|
||||
}
|
||||
&-flower-wrap{
|
||||
margin-top: 1.28rem;
|
||||
.svg-icon{
|
||||
width: 1.76rem;
|
||||
height: .21rem;
|
||||
}
|
||||
}
|
||||
&-article{
|
||||
padding-top: .39rem;
|
||||
padding-bottom: 1.55rem;
|
||||
.section-view-title{
|
||||
display: none;
|
||||
}
|
||||
&-w{
|
||||
margin-top: .27rem;
|
||||
width: 6.12rem;
|
||||
font-size: .16rem;
|
||||
font-family: Manrope;
|
||||
font-weight: 400;
|
||||
line-height: .32rem;
|
||||
color: #302D2C;
|
||||
}
|
||||
&-p{
|
||||
width: 5.79rem;
|
||||
position: relative;
|
||||
padding-left: .33rem;
|
||||
font-size: .16rem;
|
||||
font-family: Manrope;
|
||||
font-weight: 400;
|
||||
line-height: .32rem;
|
||||
color: #302D2C;
|
||||
&:before{
|
||||
position: absolute;
|
||||
content: '';
|
||||
display: block;
|
||||
width: .08rem;
|
||||
height: .77rem;
|
||||
background-color: #F49F00;
|
||||
left: 0;
|
||||
top: .1rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
&-circle{
|
||||
margin-right: 1.96rem;
|
||||
>div{
|
||||
transition: all 1s ease-in;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
max-width: 5.92rem;
|
||||
max-height: 5.92rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 1250px) {
|
||||
.section-view{
|
||||
&-circle{
|
||||
margin-right: 0;
|
||||
}
|
||||
&-content{
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 830px) {
|
||||
.section-view{
|
||||
&-content{
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 768px){
|
||||
.section-view{
|
||||
margin-top: 0;
|
||||
&-content{
|
||||
flex-direction: column;
|
||||
padding-top: 1rem;
|
||||
padding-bottom: 1rem;
|
||||
}
|
||||
&-flower-wrap{
|
||||
margin-top: .9rem;
|
||||
.svg-icon{
|
||||
width: 3.43rem;
|
||||
height: .41rem;
|
||||
}
|
||||
}
|
||||
&-title{
|
||||
display: none;
|
||||
}
|
||||
&-article{
|
||||
padding: 0 .3rem ;
|
||||
box-sizing: border-box;
|
||||
.section-view-title{
|
||||
display: block;
|
||||
padding-top: 0;
|
||||
margin-top: 0;
|
||||
margin-bottom: .47rem;
|
||||
font-size: .6rem;
|
||||
font-weight: bold;
|
||||
line-height:.84rem;
|
||||
}
|
||||
&-w{
|
||||
margin-top: .39rem;
|
||||
width: 100%;
|
||||
font-size: .24rem;
|
||||
line-height: .34rem;
|
||||
}
|
||||
&-p{
|
||||
box-sizing: border-box;
|
||||
width: 100%;
|
||||
padding-left: .25rem;
|
||||
font-size: .24rem;
|
||||
font-weight: 400;
|
||||
line-height: .34rem;
|
||||
&:before{
|
||||
width: .08rem;
|
||||
height: .9rem;
|
||||
left: 0;
|
||||
top: .05rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
&-circle{
|
||||
margin: 0 .3rem;
|
||||
>div{
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,160 @@
|
|||
<template>
|
||||
<div class="axchange-banner">
|
||||
<div class="banner-prev" @click="handleChange('prev')">
|
||||
<van-icon name="arrow-left" class="banner-prev-icon" />
|
||||
</div>
|
||||
<div class="axchange-banner-container">
|
||||
<van-swipe class="axchange-banner" ref="myVanSwipe" :autoplay="6000" :loop="true" >
|
||||
<van-swipe-item v-for="(item, index) in images" :key="index+'_'" @click="handleLink(item.id)">
|
||||
<img v-lazy="assetsUri(item.logo)" style="width: 100%;height: 100%" />
|
||||
</van-swipe-item>
|
||||
<template #indicator>
|
||||
<div ></div>
|
||||
</template>
|
||||
</van-swipe>
|
||||
</div>
|
||||
<div class="banner-next" @click="handleChange('next')">
|
||||
<van-icon name="arrow" class="banner-next-icon" />
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {assetsUri} from "../../utils";
|
||||
|
||||
export default {
|
||||
name: 'Banner',
|
||||
data(){
|
||||
return {
|
||||
assetsUri
|
||||
}
|
||||
},
|
||||
props: {
|
||||
images: {
|
||||
default: () => {
|
||||
return []
|
||||
},
|
||||
type: Array
|
||||
}
|
||||
},
|
||||
beforeDestroy(){
|
||||
window.removeEventListener('resize',this.handleResize)
|
||||
},
|
||||
mounted(){
|
||||
window.addEventListener('resize',this.handleResize)
|
||||
},
|
||||
methods: {
|
||||
handleResize(){
|
||||
this.$refs.myVanSwipe.resize();
|
||||
},
|
||||
handleChange(method){
|
||||
this.$nextTick(()=>{
|
||||
if(method==='next'){
|
||||
this.$refs.myVanSwipe.next()
|
||||
}else{
|
||||
this.$refs.myVanSwipe.prev()
|
||||
}
|
||||
})
|
||||
},
|
||||
handleLink (id) {
|
||||
return
|
||||
// this.$router.push({ path: 'detail', query: { type: 'banner', id } })
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.axchange-banner{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.banner-prev,.banner-next{
|
||||
cursor: pointer;
|
||||
flex-shrink: 0;
|
||||
width: .9rem;
|
||||
height: .9rem;
|
||||
background-color: #342927;
|
||||
border-radius: 50%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
&:hover{
|
||||
background-color: #F49F00;
|
||||
.banner-next-icon{
|
||||
color: #FFFFFF;
|
||||
}
|
||||
.banner-prev-icon{
|
||||
color: #FFFFFF;
|
||||
}
|
||||
}
|
||||
&-icon{
|
||||
font-size: .4rem;
|
||||
color: #9B9B9B ;
|
||||
}
|
||||
}
|
||||
.banner-prev{
|
||||
margin-right: .74rem;
|
||||
} .banner-next{
|
||||
margin-left: .74rem;
|
||||
}
|
||||
.axchange-banner{
|
||||
justify-content: center;
|
||||
width: 100%;
|
||||
position: relative;
|
||||
height: 100%;
|
||||
.van-swipe-item{
|
||||
width: 100% !important;
|
||||
}
|
||||
.van-icon-volume-o:before{
|
||||
color: #0f4493;
|
||||
}
|
||||
.axchange-banner-container{
|
||||
max-width: 9.72rem;
|
||||
max-height: 6.28rem;
|
||||
flex: 1;
|
||||
height: 100%;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 1280px) {
|
||||
.axchange-banner{
|
||||
.axchange-banner-container{
|
||||
max-width: 8rem;
|
||||
}
|
||||
.banner-prev,.banner-next{
|
||||
width: .7rem;
|
||||
height: .7rem;
|
||||
&-icon{
|
||||
font-size: .3rem;
|
||||
}
|
||||
}
|
||||
.banner-prev{
|
||||
margin-right: .35rem;
|
||||
}
|
||||
.banner-next{
|
||||
margin-left: .35rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 768px) {
|
||||
.axchange-banner{
|
||||
.axchange-banner-container{
|
||||
max-width: 5.20rem;
|
||||
max-height: 3.35rem;
|
||||
}
|
||||
.banner-prev,.banner-next{
|
||||
width: .5rem;
|
||||
height: .5rem;
|
||||
&-icon{
|
||||
font-size: .4rem;
|
||||
}
|
||||
}
|
||||
.banner-prev{
|
||||
margin-right: .35rem;
|
||||
}
|
||||
.banner-next{
|
||||
margin-left: .35rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,173 @@
|
|||
<template>
|
||||
<div class="email-footer">
|
||||
<h1 class="situation-h1">info@lightlimx.com</h1>
|
||||
<span class="situation-tips">Email us to connect</span>
|
||||
<ul class="situation-ul">
|
||||
<li class="situation-li wow fadeInUp" data-wow-delay=".5s" @click="handleLink('https://t.me/lightlimx')">
|
||||
<div class="situation-li-d">
|
||||
<img class="situation-li-img" v-lazy="assetsUri('images/tw.png')" alt="">
|
||||
<span class="situation-li-s">Twitter</span>
|
||||
</div>
|
||||
<p class="situation-li-p">Follow our latest news on Twitter</p>
|
||||
</li> <li class="situation-li wow fadeInUp" data-wow-delay=".5s" @click="handleLink('https://twitter.com/LimXCapital')">
|
||||
<div class="situation-li-d">
|
||||
<img class="situation-li-img" v-lazy="assetsUri('images/te.png')" alt="">
|
||||
<span class="situation-li-s">Telegram</span>
|
||||
</div>
|
||||
<p class="situation-li-p">Subscribe to our Telegram Channel</p>
|
||||
</li> <li class="situation-li wow fadeInUp" data-wow-delay=".5s" @click="handleLink('https://medium.com/@lightlimx')">
|
||||
<div class="situation-li-d">
|
||||
<img class="situation-li-img" v-lazy="assetsUri('images/me.png')" alt="">
|
||||
<span class="situation-li-s">Medium</span>
|
||||
</div>
|
||||
<p class="situation-li-p">Browse our content on Medium</p>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
assetsUri
|
||||
} from "../../utils";
|
||||
|
||||
export default {
|
||||
name: "EmailFooter",
|
||||
data(){
|
||||
return {
|
||||
assetsUri
|
||||
}
|
||||
},
|
||||
methods:{
|
||||
handleLink(link){
|
||||
if(!link){
|
||||
return
|
||||
}
|
||||
window.location.href=link
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.situation{
|
||||
&-h1,&-tips{
|
||||
text-align: center;
|
||||
}
|
||||
&-h1{
|
||||
margin-top: 1.28rem;
|
||||
font-size: .68rem;
|
||||
font-family: Manrope;
|
||||
font-weight: bold;
|
||||
color: #302D2C;
|
||||
cursor: pointer;
|
||||
&:hover{
|
||||
/*text-shadow: 0 0 .05rem #FF0000, 0 0 .05rem #6bf403;*/
|
||||
text-stroke:1px #F49F00;
|
||||
-webkit-text-stroke:1px #F49F00;
|
||||
color: #Fff;
|
||||
}
|
||||
}
|
||||
&-ul{
|
||||
margin-top: 1rem;
|
||||
padding-bottom: 1.48rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-around;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
&-li{
|
||||
margin-bottom: .3rem;
|
||||
cursor: pointer;
|
||||
width: 3.46rem;
|
||||
height: 1.86rem;
|
||||
background: #FFFFFF;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
padding-left: .56rem;
|
||||
box-sizing: border-box;
|
||||
transition: all .3s ease-in;
|
||||
&-d{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
&-img{
|
||||
display: block;
|
||||
width: .36rem;
|
||||
height: .36rem;
|
||||
margin-right: .12rem;
|
||||
}
|
||||
&-s{
|
||||
font-size: .18rem;
|
||||
font-family: Manrope;
|
||||
font-weight: bold;
|
||||
color: #302D2C;
|
||||
}
|
||||
&-p{
|
||||
margin-top: .1rem;
|
||||
font-size: .16rem;
|
||||
font-family: Manrope;
|
||||
font-weight: 400;
|
||||
color: #302D2C;
|
||||
}
|
||||
&:hover{
|
||||
box-shadow: 0 .03rem .2rem rgba(0, 0, 0, 0.06);
|
||||
border-radius:.1rem;
|
||||
transform: scale(1.01);
|
||||
}
|
||||
}
|
||||
&-tips{
|
||||
display: block;
|
||||
margin-top: .35rem;
|
||||
font-size: .24rem;
|
||||
font-family: Manrope;
|
||||
font-weight: 400;
|
||||
line-height: .48rem;
|
||||
color: #302D2C;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 768px) {
|
||||
.situation{
|
||||
&-h1{
|
||||
margin-top: 1.49rem;
|
||||
font-size: .6rem;
|
||||
line-height: .62rem;
|
||||
}
|
||||
&-ul{
|
||||
margin-top: .49rem;
|
||||
padding-bottom: 1.01rem;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
&-li{
|
||||
margin-bottom: .3rem;
|
||||
width: 6.90rem;
|
||||
height: 2.60rem;
|
||||
padding-left: .6rem;
|
||||
&-img{
|
||||
width: .86rem;
|
||||
height: .86rem;
|
||||
margin-right: .29rem;
|
||||
}
|
||||
&-s{
|
||||
font-size: .43rem;
|
||||
}
|
||||
&-p{
|
||||
margin-top: .21rem;
|
||||
font-size: .3rem;
|
||||
}
|
||||
&:hover{
|
||||
box-shadow: 0 .03rem .2rem rgba(0, 0, 0, 0.06);
|
||||
border-radius:.1rem;
|
||||
}
|
||||
}
|
||||
&-tips{
|
||||
margin-top: .2rem;
|
||||
font-size: .3rem;
|
||||
line-height: .48rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,231 @@
|
|||
<template>
|
||||
<div class="filter-input-wrap">
|
||||
<van-field class="filter-input" readonly label-width="auto" placeholder="Filter" v-model="text" >
|
||||
<template #label>
|
||||
<div class="filter-input-label">
|
||||
<svg-icon icon-class="filter"></svg-icon>
|
||||
</div>
|
||||
</template>
|
||||
<template #extra>
|
||||
<div class="filter-input-extra" >
|
||||
<div class="filter-input-icon-wrap" @click="handleOptionsShow">
|
||||
<svg-icon icon-class="filter-ar" :class="{active:blockShow}"></svg-icon>
|
||||
</div>
|
||||
<span @click="handleOptionsShow">{{activeText}}</span>
|
||||
<ul class="filter-options" :style="{'display':!blockShow?'none':'block'}" >
|
||||
<li class="filter-options-item" @click="handleItemClick(item)" :class="{'active':active===item.id}" v-for="(item,index) in locations" :key="'local_'+index">{{item.name}}</li>
|
||||
</ul>
|
||||
</div>
|
||||
</template>
|
||||
</van-field>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "FilterInput",
|
||||
props:{
|
||||
locations:{
|
||||
default:()=>[],
|
||||
type:Array
|
||||
},
|
||||
active:{
|
||||
default:'',
|
||||
type:String
|
||||
},
|
||||
},
|
||||
methods:{
|
||||
handleOptionsShow(){
|
||||
this.blockShow=!this.blockShow
|
||||
},
|
||||
handleItemClick(item){
|
||||
this.blockShow=false
|
||||
this.$emit('select',item)
|
||||
}
|
||||
},
|
||||
computed:{
|
||||
activeText(){
|
||||
if(!this.locations){
|
||||
return 'Locations'
|
||||
}
|
||||
const location= this.locations.find((item)=>{
|
||||
return item.id===this.active
|
||||
})
|
||||
return location?location.name:'Locations'
|
||||
}
|
||||
},
|
||||
data(){
|
||||
return {
|
||||
blockShow:false,
|
||||
text:''
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.filter-options{
|
||||
min-width: 100%;
|
||||
position: absolute;
|
||||
min-height: 1.6rem;
|
||||
background: #FFFFFF;
|
||||
padding-left: .24rem;
|
||||
box-shadow: 0 .03rem .06rem rgba(0, 0, 0, 0.16);
|
||||
bottom: 0;
|
||||
transform: translateY(100%);
|
||||
box-sizing: content-box;
|
||||
left: -.2rem;
|
||||
transition: all .3s ease-in;
|
||||
z-index: 1;
|
||||
&-item{
|
||||
width: 100%;
|
||||
font-family: Manrope;
|
||||
font-weight: 400;
|
||||
line-height: .4rem;
|
||||
color: #302D2C;
|
||||
box-sizing: content-box;
|
||||
padding-left: .24rem;
|
||||
min-height: .4rem;
|
||||
font-size: .16rem;
|
||||
margin-left: -.24rem;
|
||||
background-color: #fff;
|
||||
cursor: pointer;
|
||||
&.active{
|
||||
background-color: #F49F00;
|
||||
color: #Fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
.filter-input{
|
||||
height: .6rem;
|
||||
box-sizing: border-box;
|
||||
padding: .06rem 0 .06rem .14rem;
|
||||
overflow: initial;
|
||||
|
||||
&-wrap{
|
||||
margin-top: -.3rem;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
width: 100%;
|
||||
height: .6rem;
|
||||
background: #FFFFFF;
|
||||
box-shadow: 0 .03rem .06rem rgba(0, 0, 0, 0.16);
|
||||
}
|
||||
&-extra{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
padding-right: .14rem;
|
||||
box-sizing: border-box;
|
||||
min-width: 1.53rem;
|
||||
>span{
|
||||
cursor: pointer;
|
||||
user-select: unset;
|
||||
}
|
||||
}
|
||||
&-label{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
.svg-icon{
|
||||
width: .48rem;
|
||||
height: .48rem;
|
||||
}
|
||||
}
|
||||
&-icon-wrap{
|
||||
cursor: pointer;
|
||||
margin-right: .17rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.svg-icon{
|
||||
transition: all .3s ease-in;
|
||||
width: .3rem;
|
||||
height: .3rem;
|
||||
&.active{
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
@media screen and (max-width: 768px) {
|
||||
.filter-options{
|
||||
min-height: 3.2rem;
|
||||
padding-left: 0;
|
||||
left: 50%;
|
||||
min-width: 2rem;
|
||||
transform: translateX(-50%) translateY(100%);
|
||||
box-sizing: border-box;
|
||||
&-item{
|
||||
line-height: .8rem;
|
||||
box-sizing: border-box;
|
||||
padding-left: .5rem;
|
||||
margin-left: 0;
|
||||
min-height: .8rem;
|
||||
font-size: .26rem;
|
||||
}
|
||||
}
|
||||
.filter-input{
|
||||
height: 100%;
|
||||
min-height: .8rem;
|
||||
padding: 0;
|
||||
box-sizing: border-box;
|
||||
&-extra{
|
||||
min-width: 2.46rem;
|
||||
padding-right: .32rem;
|
||||
}
|
||||
&-wrap{
|
||||
margin-top: -.4rem;
|
||||
margin-left: .15rem;
|
||||
margin-right: .15rem;
|
||||
box-sizing: border-box;
|
||||
height: .8rem;
|
||||
width: auto;
|
||||
display: block;
|
||||
}
|
||||
&-label{
|
||||
.svg-icon{
|
||||
width: .8rem;
|
||||
height: .8rem;
|
||||
}
|
||||
}
|
||||
&-icon-wrap{
|
||||
margin-right: 0;
|
||||
.svg-icon{
|
||||
width: .8rem;
|
||||
height: .8rem;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<style lang="less">
|
||||
.filter-input{
|
||||
.van-field__body{
|
||||
height: 100%;
|
||||
}
|
||||
.van-field__control{
|
||||
font-size: .18rem;
|
||||
font-family: Manrope;
|
||||
font-weight: 400;
|
||||
color: #302D2C;
|
||||
&::placeholder{
|
||||
font-size: .16rem;
|
||||
font-family: Manrope;
|
||||
font-weight: 400;
|
||||
color: #302D2C;
|
||||
}
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 768px) {
|
||||
.filter-input{
|
||||
.van-field__control{
|
||||
font-size: .26rem;
|
||||
&::placeholder{
|
||||
font-size: .26rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
File diff suppressed because it is too large
Load Diff
|
|
@ -0,0 +1,264 @@
|
|||
#home-circles,.spin-circle-container{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
margin: 0 auto;
|
||||
}
|
||||
#home-hero {
|
||||
overflow-x: hidden;
|
||||
overflow-y: hidden;
|
||||
min-height: 100%;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: relative;
|
||||
padding-top: 0;
|
||||
// background-color: #010101;
|
||||
color: #fff;
|
||||
// background-image: url("../images/home-hero-mobile.jpg");
|
||||
background-size: cover;
|
||||
background-position: center bottom;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
// min-height: 1000px;
|
||||
}
|
||||
#home-hero .primary {
|
||||
font-size: 1.125rem;
|
||||
line-height: 1.8125rem;
|
||||
font-weight: 700;
|
||||
letter-spacing: 0.06em;
|
||||
}
|
||||
#home-hero .hero-circle-text {
|
||||
text-align: center;
|
||||
z-index: 1;
|
||||
// padding: 4rem 2rem;
|
||||
}
|
||||
|
||||
#home-hero .hero-circle-text p {
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
margin-bottom: 0;
|
||||
font-size: 0.2rem;
|
||||
font-family: Manrope;
|
||||
font-weight: bold;
|
||||
color: #FFFFFF;
|
||||
opacity: 1;
|
||||
line-height: 0.4rem;
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
#home-content {
|
||||
// padding-top: 8rem;
|
||||
}
|
||||
|
||||
.hero-circle-text-container {
|
||||
// padding-top: 18rem;
|
||||
}
|
||||
|
||||
#home-hero .hero-circle-text{
|
||||
bottom: 0.5rem !important;
|
||||
}
|
||||
|
||||
.home-hero-mobile {
|
||||
padding: 0 1rem;
|
||||
}
|
||||
.home-hero-mobile img {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
.heading {
|
||||
max-width: 490px;
|
||||
}
|
||||
|
||||
.primary,
|
||||
.secondary {
|
||||
max-width: 500px;
|
||||
}
|
||||
}
|
||||
@media (max-width: 1024px) {
|
||||
#home-hero .container {
|
||||
max-width: 80%;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
@media (min-width: 992px) {
|
||||
#home-hero {
|
||||
//overflow: hidden;
|
||||
// background-image: url("../images/home-hero.jpg");
|
||||
background-size: cover;
|
||||
background-position: center bottom;
|
||||
}
|
||||
#home-hero .heading {
|
||||
max-width: 560px;
|
||||
}
|
||||
#home-hero .primary {
|
||||
max-width: 540px;
|
||||
}
|
||||
#home-hero .secondary {
|
||||
max-width: 500px;
|
||||
}
|
||||
#home-hero .hero-circle-text {
|
||||
background: none;
|
||||
position: absolute;
|
||||
// max-width: 520px;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0.7rem ;
|
||||
margin: 0 auto;
|
||||
text-align: center;
|
||||
}
|
||||
#home-hero .hero-circle-text p {
|
||||
max-width: none;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
/* Spin Circle Containers */
|
||||
.spin-circle-container {
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-grow: 1;
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.spin-outer-container,
|
||||
.spin-inner-container {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
#spinOuterCircle,
|
||||
#spinInnerCircle {
|
||||
margin: 10px auto;
|
||||
border: 2px solid #F49F00;
|
||||
position: relative;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.inner-item,
|
||||
.outer-item {
|
||||
text-align: center;
|
||||
border-radius: 50%;
|
||||
position: absolute;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.inner-item img,
|
||||
.outer-item img {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
border-radius: 100%;
|
||||
}
|
||||
|
||||
#spinOuterCircle {
|
||||
width: 600px;
|
||||
height: 600px;
|
||||
}
|
||||
#spinInnerCircle {
|
||||
width: 600px;
|
||||
height: 600px;
|
||||
}
|
||||
|
||||
.outer-item,
|
||||
.inner-item {
|
||||
width: 42px;
|
||||
height: 42px;
|
||||
line-height: 42px;
|
||||
}
|
||||
@media screen and (max-width: 768px){
|
||||
#home-hero .hero-circle-text{
|
||||
bottom: 0.65rem !important
|
||||
}
|
||||
#home-hero{
|
||||
min-height: 530px;
|
||||
}
|
||||
}
|
||||
@media (min-width: 768px) {
|
||||
.outer-item {
|
||||
width: 68px;
|
||||
height: 68px;
|
||||
line-height: 68px;
|
||||
}
|
||||
|
||||
.inner-item {
|
||||
width: 48px;
|
||||
height: 48px;
|
||||
line-height: 48px;
|
||||
}
|
||||
}
|
||||
@media (min-width: 992px) {
|
||||
.outer-item {
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
line-height: 60px;
|
||||
}
|
||||
|
||||
.inner-item {
|
||||
width: 51px;
|
||||
height: 51px;
|
||||
line-height: 51px;
|
||||
}
|
||||
}
|
||||
@media (min-width: 1024px) {
|
||||
.outer-item {
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
line-height: 80px;
|
||||
}
|
||||
|
||||
.inner-item {
|
||||
width: 68px;
|
||||
height: 68px;
|
||||
line-height: 68px;
|
||||
}
|
||||
#home-hero .hero-circle-text{
|
||||
// bottom: 5rem;
|
||||
}
|
||||
}
|
||||
@media (min-width: 1399px) {
|
||||
.outer-item {
|
||||
width: 109px;
|
||||
height: 109px;
|
||||
line-height: 109px;
|
||||
}
|
||||
|
||||
.inner-item {
|
||||
width: 93px;
|
||||
height: 93px;
|
||||
line-height: 93px;
|
||||
}
|
||||
}
|
||||
|
||||
#home-hero .hero-circle-text {
|
||||
background: none;
|
||||
position: absolute;
|
||||
// max-width: 520px;
|
||||
left: 0;
|
||||
right: 0;
|
||||
margin: 0 auto;
|
||||
z-index: 1;
|
||||
text-align: center;
|
||||
// bottom: 2.8rem;
|
||||
}
|
||||
#home-hero .hero-circle-text p {
|
||||
max-width: none;
|
||||
}
|
||||
|
||||
@media (min-width: 1500px) {
|
||||
#home-hero {
|
||||
// min-height: 790px;
|
||||
}
|
||||
#home-hero .container {
|
||||
width: 90%;
|
||||
max-width: 1500px;
|
||||
}
|
||||
#home-hero .hero-circle-text{
|
||||
bottom: 1rem;
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,331 @@
|
|||
<template>
|
||||
<section class="focus-areas-view" :style="isCssStyle">
|
||||
<div class="focus-areas-view-wrap">
|
||||
<h1 class="focus-areas-view-h1 wow fadeInUpBig">Focus Areas</h1>
|
||||
<h6 class="focus-areas-view-h6 wow fadeInUp" data-wow-delay=".3s">The future is crafted by people who understand where things are heading.</h6>
|
||||
<p class="focus-areas-view-p wow fadeIn" data-wow-delay=".5s">The next innovation is already here.We believe that decentralization has the power to transform the global economy and create the largest one time shift in wealth.</p>
|
||||
<div class="focus-areas-view-wheel">
|
||||
<div id="home-hero" class="hero">
|
||||
<div id="home-circles" class="container flex-grow-1 d-flex">
|
||||
<div class="spin-circle-container">
|
||||
<div class="spin-outer-container">
|
||||
<div id="spinOuterCircle">
|
||||
<div class="outer-item">
|
||||
<img v-lazy="assetsUri('images/FocusAreas/5.png')">
|
||||
</div>
|
||||
<div class="outer-item">
|
||||
<img v-lazy="assetsUri('images/FocusAreas/2.png')">
|
||||
</div>
|
||||
<div class="outer-item">
|
||||
<img v-lazy="assetsUri('images/FocusAreas/3.png')">
|
||||
</div>
|
||||
<div class="outer-item">
|
||||
<img v-lazy="assetsUri('images/FocusAreas/4.png')">
|
||||
</div>
|
||||
<div class="outer-item">
|
||||
<img v-lazy="assetsUri('images/FocusAreas/5.png')">
|
||||
</div>
|
||||
<div class="outer-item">
|
||||
<img v-lazy="assetsUri('images/FocusAreas/6.png')">
|
||||
</div>
|
||||
<div class="outer-item">
|
||||
<img v-lazy="assetsUri('images/FocusAreas/1.png')">
|
||||
</div>
|
||||
<div class="outer-item">
|
||||
<img v-lazy="assetsUri('images/FocusAreas/2.png')">
|
||||
</div>
|
||||
<div class="outer-item">
|
||||
<img v-lazy="assetsUri('images/FocusAreas/4.png')">
|
||||
</div>
|
||||
<div class="outer-item">
|
||||
<img v-lazy="assetsUri('images/FocusAreas/6.png')">
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="spin-inner-container">
|
||||
<div id="spinInnerCircle">
|
||||
<div class="inner-item">
|
||||
<img v-lazy="assetsUri('images/FocusAreas/7.png')">
|
||||
</div>
|
||||
<div class="inner-item">
|
||||
<img v-lazy="assetsUri('images/FocusAreas/8.png')">
|
||||
</div>
|
||||
<div class="inner-item">
|
||||
<img v-lazy="assetsUri('images/FocusAreas/9.png')">
|
||||
</div>
|
||||
<div class="inner-item">
|
||||
<img v-lazy="assetsUri('images/FocusAreas/10.png')">
|
||||
</div>
|
||||
<div class="inner-item">
|
||||
<img v-lazy="assetsUri('images/FocusAreas/8.png')">
|
||||
</div>
|
||||
<div class="inner-item">
|
||||
<img v-lazy="assetsUri('images/FocusAreas/9.png')">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="hero-circle-text-container">
|
||||
<div class="hero-circle-text">
|
||||
<div id="hero-text-1">
|
||||
<p class="wow fadeInUp" data-wow-delay=".3s">We focused exclusively on disruptive innovations related</p>
|
||||
<p class="wow fadeInUp" data-wow-delay=".3s">to the Public chain ecosystem, Web3, NFT, GameFi, Layer2,</p>
|
||||
<p class="wow fadeInUp" data-wow-delay=".3s">DeFi , Metaverse and other fields.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</template>
|
||||
<script>
|
||||
import { assetsUri } from "../../utils";
|
||||
import gsap from 'gsap'
|
||||
import ScrollTrigger from './ScrollTrigger.js'
|
||||
import Jquery from 'jquery'
|
||||
gsap.registerPlugin(ScrollTrigger)
|
||||
export default {
|
||||
name: "FocusAreas",
|
||||
props:{
|
||||
cssStyle:{
|
||||
type:Object,
|
||||
default:()=>{
|
||||
return {}
|
||||
}
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
assetsUri,
|
||||
};
|
||||
},
|
||||
mounted () {
|
||||
const _this = this// 赋值vue的this
|
||||
Jquery(window).on('resize', function () {
|
||||
_this.setCircleSizes()
|
||||
ScrollTrigger.refresh()
|
||||
|
||||
if (window.innerWidth < 992) {
|
||||
Jquery('.remove-for-mobile').remove()
|
||||
}
|
||||
}).resize()
|
||||
|
||||
/* Register ScrollTrigger */
|
||||
|
||||
/* Circle Timeline - Always & First for Speed Controls on Desktop */
|
||||
const circleTimeline = gsap.timeline({
|
||||
repeat: -1
|
||||
})
|
||||
|
||||
circleTimeline
|
||||
.to('#spinInnerCircle', {
|
||||
duration: 120,
|
||||
rotation: 360,
|
||||
ease: 'none'
|
||||
})
|
||||
.to('#spinOuterCircle', {
|
||||
duration: 120,
|
||||
rotation: -360,
|
||||
ease: 'none'
|
||||
}, 0)
|
||||
.to('.inner-item', {
|
||||
duration: 120,
|
||||
rotation: -360,
|
||||
ease: 'none'
|
||||
}, 0)
|
||||
.to('.outer-item', {
|
||||
duration: 120,
|
||||
rotation: 360,
|
||||
ease: 'none'
|
||||
}, 0)
|
||||
|
||||
ScrollTrigger.matchMedia({
|
||||
// DESKTOP
|
||||
'(min-width: 992px)': function () {
|
||||
/* Testimonials */
|
||||
|
||||
ScrollTrigger.create({
|
||||
trigger: '#home-testimonials',
|
||||
markers: false,
|
||||
toggleClass: 'active',
|
||||
pin: '#home-testimonials .content',
|
||||
scrub: true,
|
||||
invalidateOnRefresh: true
|
||||
})
|
||||
|
||||
/* Posts */
|
||||
gsap.defaults({ ease: 'power3' })
|
||||
gsap.set('.post-item', { y: 100 })
|
||||
|
||||
ScrollTrigger.batch('.post-item', {
|
||||
onEnter: batch => gsap.to(batch, { opacity: 1, y: 0, stagger: { each: 0.15, grid: [1, 3] }, overwrite: true }),
|
||||
onLeave: batch => gsap.set(batch, { opacity: 0, y: -100, overwrite: true }),
|
||||
onEnterBack: batch => gsap.to(batch, { opacity: 1, y: 0, stagger: 0.15, overwrite: true }),
|
||||
onLeaveBack: batch => gsap.set(batch, { opacity: 0, y: 100, overwrite: true }),
|
||||
markers: false,
|
||||
end: 'bottom+=100px',
|
||||
invalidateOnRefresh: true
|
||||
})
|
||||
|
||||
},
|
||||
// TABLET OR PHONE
|
||||
'(min-width: 400px) and (max-width: 991px)': function () {
|
||||
/* Testimonials */
|
||||
gsap.set('.testimonials-container', { y: 0 })
|
||||
|
||||
ScrollTrigger.create({
|
||||
trigger: '#home-testimonials .content',
|
||||
markers: false,
|
||||
pin: true,
|
||||
anticipatePin: true,
|
||||
start: 'top-=120',
|
||||
invalidateOnRefresh: true
|
||||
})
|
||||
|
||||
gsap.set('.testimonial-item', { y: 200 })
|
||||
|
||||
ScrollTrigger.batch('.testimonial-item', {
|
||||
onEnter: batch => gsap.to(batch, { y: 0, overwrite: true }),
|
||||
onLeave: batch => gsap.set(batch, { y: 200, overwrite: true }),
|
||||
onEnterBack: batch => gsap.to(batch, { y: 0, overwrite: true }),
|
||||
onLeaveBack: batch => gsap.set(batch, { y: 200, overwrite: true }),
|
||||
invalidateOnRefresh: true
|
||||
})
|
||||
|
||||
/* Posts */
|
||||
gsap.defaults({ ease: 'power3' })
|
||||
gsap.set('.post-item', { y: 50, opacity: 0 })
|
||||
|
||||
ScrollTrigger.batch('.post-item', {
|
||||
onEnter: batch => gsap.to(batch, { opacity: 1, y: 0, stagger: { each: 0.15, grid: [1, 3] }, overwrite: true }),
|
||||
invalidateOnRefresh: true
|
||||
})
|
||||
}
|
||||
})
|
||||
|
||||
},
|
||||
methods: {
|
||||
setCircleSizes () {
|
||||
const containerWidth = Jquery('.spin-circle-container').width()
|
||||
const innerCircleSize = containerWidth * 0.75
|
||||
const outerCircleOverflow = containerWidth * 0.1
|
||||
const innerCircleOverflow = Math.round((containerWidth - innerCircleSize) * 0.9)
|
||||
const circleSize = containerWidth * 0.05
|
||||
|
||||
Jquery('#spinOuterCircle').css({ width: containerWidth, height: containerWidth })
|
||||
Jquery('.spin-outer-container').css({ top: outerCircleOverflow })
|
||||
|
||||
Jquery('#spinInnerCircle').css({ width: innerCircleSize, height: innerCircleSize })
|
||||
Jquery('.spin-inner-container').css({ top: innerCircleOverflow })
|
||||
|
||||
this.setupSpinContainer('#spinOuterCircle', '.outer-item', containerWidth / 2)
|
||||
this.setupSpinContainer('#spinInnerCircle', '.inner-item', innerCircleSize / 2)
|
||||
},
|
||||
setupSpinContainer (spinContainer, spinContainerItem, spinRadius) {
|
||||
const radius = spinRadius
|
||||
const fields = Jquery(spinContainerItem)
|
||||
const container = Jquery(spinContainer)
|
||||
const width = container.width()
|
||||
const height = container.height()
|
||||
let angle = 0
|
||||
const step = (2 * Math.PI) / fields.length
|
||||
|
||||
fields.each(function () {
|
||||
const x = Math.round(width / 2 + radius * Math.cos(angle) - Jquery(this).width() / 2)
|
||||
const y = Math.round(height / 2 + radius * Math.sin(angle) - Jquery(this).height() / 2)
|
||||
|
||||
Jquery(this).css({
|
||||
left: x + 'px',
|
||||
top: y + 'px'
|
||||
})
|
||||
angle += step
|
||||
})
|
||||
}
|
||||
},
|
||||
computed:{
|
||||
isCssStyle(){
|
||||
return this.cssStyle
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped lang="less">
|
||||
@import './index.less';
|
||||
.focus-areas-view{
|
||||
background: url("~/static/images/FocusAreas/FocusAreas_bj.png") no-repeat;
|
||||
width: 100%;
|
||||
background-size: 100% 100%;
|
||||
min-height: 100vh;
|
||||
box-sizing: border-box;
|
||||
padding-top: .77rem;
|
||||
&-wrap{
|
||||
width: 100%;
|
||||
max-width: 13rem;
|
||||
margin: 0 auto;
|
||||
}
|
||||
&-wheel{
|
||||
margin-top: 0;
|
||||
width: 100%;
|
||||
height: 7.32rem;
|
||||
}
|
||||
&-h1{
|
||||
font-size: .6rem;
|
||||
font-family: Manrope;
|
||||
font-weight: bold;
|
||||
line-height: .82rem;
|
||||
color: #FFFFFF;
|
||||
text-align: center;
|
||||
}
|
||||
&-h6{
|
||||
margin-top: .1rem;
|
||||
margin-bottom: 0;
|
||||
font-size: .16rem;
|
||||
font-family: Manrope;
|
||||
font-weight: 400;
|
||||
line-height: .22rem;
|
||||
color: #FFFFFF;
|
||||
text-align: center;
|
||||
}
|
||||
&-p{
|
||||
font-size: .22rem;
|
||||
font-family: Manrope;
|
||||
font-weight: bold;
|
||||
line-height: .44rem;
|
||||
color: #FFFFFF;
|
||||
text-align: center;
|
||||
max-width: 11.22rem;
|
||||
margin: .74rem auto 0;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 768px){
|
||||
.focus-areas-view{
|
||||
padding-top: .88rem;
|
||||
&-wheel{
|
||||
margin-top: 1.5rem;
|
||||
height: auto;
|
||||
min-height: 5.30rem;
|
||||
}
|
||||
&-h1{
|
||||
font-size: .6rem;
|
||||
line-height: .82rem;
|
||||
}
|
||||
&-h6{
|
||||
max-width: 5.5rem;
|
||||
margin: 0 auto;
|
||||
margin-top: .27rem;
|
||||
font-size: .24rem;
|
||||
line-height: .32rem;
|
||||
}
|
||||
&-p{
|
||||
max-width: 6.9rem;
|
||||
font-size: .3rem;
|
||||
line-height: .4rem;
|
||||
text-align: center;
|
||||
margin: .29rem auto 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,162 @@
|
|||
<template>
|
||||
<div class="innovation-block">
|
||||
<h3 class="innovation-block-h3">Articles</h3>
|
||||
<div class="innovation-block-lists">
|
||||
<div class="innovation-block-item wow fadeInUp" v-for="(item,index) in staticData" :key="'in_'+index" @click="handleLink(item.url)">
|
||||
<img v-lazy="item.logo" class="innovation-block-item-img" alt="">
|
||||
<h4 class="innovation-block-item-t">{{item.title}}</h4>
|
||||
<p class="innovation-block-item-p">{{item.introduce}}</p>
|
||||
<span>{{item.auth}}</span>
|
||||
<small>{{item.created_at}}</small>
|
||||
</div>
|
||||
<div class="innovation-block-item" v-if="staticData.length%3>0">
|
||||
<img src="" style="opacity: 0" class="innovation-block-item-img" alt="">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "InnovationBlock",
|
||||
props:{
|
||||
staticData:{
|
||||
default:()=>[],
|
||||
type:Array
|
||||
}
|
||||
},
|
||||
data(){
|
||||
return {
|
||||
|
||||
}
|
||||
},
|
||||
methods:{
|
||||
handleLink(link){
|
||||
if(!link){
|
||||
return
|
||||
}
|
||||
window.location.href=link
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.innovation-block{
|
||||
padding-top: 1.17rem;
|
||||
&-h3{
|
||||
font-size: .2rem;
|
||||
font-family: Manrope;
|
||||
font-weight: bold;
|
||||
color: #302D2C;
|
||||
}
|
||||
&-lists{
|
||||
margin-top: .58rem;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-between;
|
||||
}
|
||||
&-item{
|
||||
margin-bottom: .72rem;
|
||||
&-img{
|
||||
display: block;
|
||||
width: 3.9rem;
|
||||
height: 2.92rem;
|
||||
}
|
||||
&-t{
|
||||
margin-top: .33rem;
|
||||
font-size: .2rem;
|
||||
font-family: Manrope;
|
||||
font-weight: bold;
|
||||
line-height: .36rem;
|
||||
color: #302D2C;
|
||||
max-width: 3.45rem;
|
||||
}
|
||||
&-p{
|
||||
max-width: 3.74rem;
|
||||
margin-top: .16rem;
|
||||
font-size: .16rem;
|
||||
font-family: Manrope;
|
||||
font-weight: 400;
|
||||
line-height: .26rem;
|
||||
color: #9B9B9B;
|
||||
}
|
||||
>span{
|
||||
margin-top: .24rem;
|
||||
display: block;
|
||||
font-size: .14rem;
|
||||
font-family: Manrope;
|
||||
font-weight: 400;
|
||||
line-height: .3rem;
|
||||
color: #9B9B9B;
|
||||
}
|
||||
>small{
|
||||
font-size: .14rem;
|
||||
font-family: Manrope;
|
||||
font-weight: 400;
|
||||
line-height: .3rem;
|
||||
color: #9B9B9B;
|
||||
}
|
||||
}
|
||||
}
|
||||
@media screen and (max-width:1200px ) {
|
||||
.innovation-block{
|
||||
&-h3{
|
||||
padding-left: .3rem;
|
||||
}
|
||||
&-lists{
|
||||
justify-content: space-around;
|
||||
}
|
||||
}
|
||||
}
|
||||
@media screen and (max-width:802px ) {
|
||||
.innovation-block{
|
||||
&-lists{
|
||||
justify-content: space-around;
|
||||
}
|
||||
}
|
||||
}
|
||||
@media screen and (max-width:768px ) {
|
||||
.innovation-block{
|
||||
padding-top: .5rem;
|
||||
&-h3{
|
||||
margin-top: 0;
|
||||
font-size: .4rem;
|
||||
padding-left: .3rem;
|
||||
}
|
||||
&-lists{
|
||||
margin-top: .42rem;
|
||||
justify-content: space-around;
|
||||
}
|
||||
&-item{
|
||||
width: 100%;
|
||||
margin-bottom: 1rem;
|
||||
padding: 0 .3rem;
|
||||
&-img{
|
||||
width: 100%;
|
||||
}
|
||||
&-t{
|
||||
margin-top: .2rem;
|
||||
font-size: .2rem;
|
||||
line-height: .36rem;
|
||||
max-width: 6.21rem;
|
||||
}
|
||||
&-p{
|
||||
max-width: 6.62rem;
|
||||
margin-top: .18rem;
|
||||
font-size: .28rem;
|
||||
line-height: .34rem;
|
||||
}
|
||||
>span{
|
||||
margin-top: .5rem;
|
||||
font-size: .24rem;
|
||||
line-height: .3rem;
|
||||
}
|
||||
>small{
|
||||
font-size: .24rem;
|
||||
line-height: .3rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,188 @@
|
|||
<template>
|
||||
<div class="join-us-tabs " :class="{'mask':isMobile,'expand':isExpand}" >
|
||||
<div class="join-us-tabs-options">
|
||||
<h3 class="join-us-tabs-title">Position</h3>
|
||||
<ul>
|
||||
<li class="join-us-tabs-item" @click="handleSelect(item)" v-for="(item,index) in options" :key="'option_'+index" :class="{'active':active===item.id}">
|
||||
{{item.name}}
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- <div class='join-mask' :class="{'isExpand':isExpand}" v-if="isMobile" @click="isExpand=!isExpand">-->
|
||||
<!-- <van-icon name="arrow-down" class="join-mask-arrow" />-->
|
||||
<!-- </div>-->
|
||||
<div class="join-us-tabs-content" v-html="content"></div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "JoinUsTabs",
|
||||
data(){
|
||||
return {
|
||||
isMobile:false,
|
||||
isExpand:true,
|
||||
}
|
||||
},
|
||||
mounted(){
|
||||
this.handleIsMobile()
|
||||
window.addEventListener('resize',this.handleIsMobile)
|
||||
},
|
||||
props:{
|
||||
options:{
|
||||
default:()=>[],
|
||||
type:Array
|
||||
},
|
||||
active:{
|
||||
default:'',
|
||||
type:String
|
||||
},
|
||||
content:{
|
||||
default:'',
|
||||
type:String
|
||||
}
|
||||
},
|
||||
methods:{
|
||||
handleSelect(item){
|
||||
this.$emit('handleSelect',item)
|
||||
},
|
||||
handleIsMobile(){
|
||||
const clientWidth=document.documentElement.clientWidth;
|
||||
this.isMobile=clientWidth<=750
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.join-us-tabs{
|
||||
padding-top: .97rem;
|
||||
padding-bottom: 1.57rem;
|
||||
&-options{
|
||||
display: inline-block;
|
||||
max-width: 3.02rem;
|
||||
width: 100%;
|
||||
margin-right: 1.28rem;
|
||||
}
|
||||
&-content{
|
||||
padding-top: .5rem;
|
||||
vertical-align: top;
|
||||
max-width: 8.7rem;
|
||||
display: inline-block;
|
||||
width: calc( 100% - 4.38rem );
|
||||
min-height: 2rem;
|
||||
}
|
||||
.join-mask{
|
||||
display: none;
|
||||
}
|
||||
&-item{
|
||||
font-size: .16rem;
|
||||
font-family: Manrope;
|
||||
font-weight: 400;
|
||||
color: #302D2C;
|
||||
border-bottom: 1px solid #EDEDED;
|
||||
min-height: .7rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding-left: .14rem;
|
||||
cursor: pointer;
|
||||
&.active,&:hover{
|
||||
color: #F49F00;
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
&-title{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 100%;
|
||||
height: .58rem;
|
||||
background: #342927;
|
||||
font-size: .16rem;
|
||||
font-family: Manrope;
|
||||
font-weight: 400;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 768px){
|
||||
.join-us-tabs{
|
||||
padding-top: .5rem;
|
||||
&.mask{
|
||||
height: 3.5rem;
|
||||
position: relative;
|
||||
overflow-y: hidden;
|
||||
overflow-x: visible;
|
||||
&.expand{
|
||||
height:auto;
|
||||
overflow-y: visible;
|
||||
}
|
||||
}
|
||||
.join-mask{
|
||||
display: block;
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
text-align: center;
|
||||
&.isExpand{
|
||||
.join-mask-arrow{
|
||||
transform: rotate(-180deg);
|
||||
}
|
||||
}
|
||||
&-arrow{
|
||||
transition: all .3s ease-in;
|
||||
line-height: .4rem;
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
}
|
||||
&:before{
|
||||
content: '';
|
||||
display: block;
|
||||
height: .85rem;
|
||||
background: linear-gradient(to bottom,transparent 2%,#F8F9F9);
|
||||
background: -ms-linear-gradient(to bottom,transparent 2%,#F8F9F9);
|
||||
background:-moz-linear-gradient(to bottom,transparent 2%,#F8F9F9);/*火狐*/
|
||||
background: -webkit-linear-gradient(to bottom,transparent 2%,#F8F9F9);
|
||||
background: -o-linear-gradient(to bottom,transparent 2%,#F8F9F9)
|
||||
}
|
||||
&:after{
|
||||
content: '';
|
||||
display: block;
|
||||
min-height: .4rem;
|
||||
background-color: #eee;
|
||||
border-radius: .5rem;
|
||||
}
|
||||
}
|
||||
&-options{
|
||||
display: block;
|
||||
max-width: 100%;
|
||||
width: 5.18rem;
|
||||
margin: 0 auto;
|
||||
}
|
||||
&-content{
|
||||
max-width: 100%;
|
||||
padding-left: .15rem;
|
||||
padding-right: .15rem;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
margin: 0 auto;
|
||||
min-height: 2rem;
|
||||
}
|
||||
&-item{
|
||||
font-size: .26rem;
|
||||
min-height: .88rem;
|
||||
padding-left: .16rem;
|
||||
border-color: #EDEDED;
|
||||
&.active,&:hover{
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
&-title{
|
||||
height: .96rem;
|
||||
font-size: .38rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,96 @@
|
|||
<template lang="html">
|
||||
<div class="public-loading" v-if="loading">
|
||||
<div class="public-loading-block">
|
||||
<div class="public-loading-block-loader"></div>
|
||||
<div class="public-loading-block-img">
|
||||
<svg-icon icon-class="loading"></svg-icon>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'loading',
|
||||
components: { },
|
||||
data: () => ({
|
||||
loading: false
|
||||
}),
|
||||
methods: {
|
||||
start() {
|
||||
this.loading = true
|
||||
},
|
||||
finish() {
|
||||
this.loading = false
|
||||
},
|
||||
getLoadingState(){
|
||||
return this.loading
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.public-loading-block-loader {
|
||||
display: block;
|
||||
border: .04rem solid rgba(252,228,199,.3);
|
||||
border-radius: 50%;
|
||||
width: 1.28rem;
|
||||
height: 1.28rem;
|
||||
box-sizing: border-box;
|
||||
-webkit-animation: spin 2s linear infinite;
|
||||
animation: spin 2s linear infinite;
|
||||
&:after{
|
||||
content: '';
|
||||
display: block;
|
||||
width: .12rem;
|
||||
height:.12rem;
|
||||
border-radius: 50%;
|
||||
overflow: hidden;
|
||||
background-color: #F5A23D ;
|
||||
margin-top: .22rem;
|
||||
}
|
||||
}
|
||||
|
||||
@-webkit-keyframes spin {
|
||||
0% { -webkit-transform: rotate(0deg); }
|
||||
100% { -webkit-transform: rotate(360deg); }
|
||||
}
|
||||
|
||||
@keyframes spin {
|
||||
0% { transform: rotate(0deg); }
|
||||
100% { transform: rotate(360deg); }
|
||||
}
|
||||
.public-loading{
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
margin: 0 auto;
|
||||
height: 100%;
|
||||
align-items: center;
|
||||
background-color: #292727;
|
||||
position: fixed;
|
||||
z-index: 100;
|
||||
left: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
&-block{
|
||||
/*margin-top: -100%;*/
|
||||
position: relative;
|
||||
text-align: center;
|
||||
}
|
||||
&-block-img{
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
transform: translateX(-50%) translateY(-50%);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
.svg-icon{
|
||||
width: .76rem;
|
||||
height: .76rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,161 @@
|
|||
<template>
|
||||
<section class="layout-footer">
|
||||
<div class="layout-footer-h5-wrap">
|
||||
<div class="layout-footer-d">
|
||||
<div class="layout-footer-d-l">
|
||||
<div class="layout-footer-d-l-l-w">
|
||||
<svg-icon icon-class="footerLogo"></svg-icon>
|
||||
</div>
|
||||
<p>© 2022 LightLimX Ventures Management Co Ltd. All Rights Reserved.</p>
|
||||
</div>
|
||||
<ul class="layout-footer-d-r">
|
||||
<li class="layout-footer-d-r-i" v-for="item in tabs" :key="item.name" @click="handleClick(item)">{{item.title}}</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {footerLink} from "~/assets/js/static";
|
||||
|
||||
export default {
|
||||
name: "MyFooter",
|
||||
mounted(){
|
||||
|
||||
},
|
||||
methods:{
|
||||
handleClick(item){
|
||||
if(item.name==='innovation'){
|
||||
return;
|
||||
}
|
||||
if(item.type==='href'){
|
||||
if(item.link&&this.$route.path!==item.link){
|
||||
this.$router.push({path:'/#'+item.name})
|
||||
return;
|
||||
}
|
||||
document.getElementById(item.name).scrollIntoView();
|
||||
// console.log(document.getElementById(item.name))
|
||||
return
|
||||
}
|
||||
this.$router.push({path:'/'+item.name})
|
||||
}
|
||||
},
|
||||
data(){
|
||||
return {
|
||||
tabs:[
|
||||
...footerLink
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.layout-footer{
|
||||
background: #292727;
|
||||
min-height: 2.33rem;
|
||||
&-h5-wrap{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
&-d{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
&-r{
|
||||
padding-top: .64rem;
|
||||
padding-bottom: .4rem;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
&-i{
|
||||
font-size: .14rem;
|
||||
font-family: Manrope;
|
||||
font-weight: bold;
|
||||
color: #9B9B9B;
|
||||
width: 25%;
|
||||
margin-bottom: .24rem;
|
||||
cursor: pointer;
|
||||
&:active{
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
&-l{
|
||||
&-l-w{
|
||||
padding-bottom: .17rem;
|
||||
.svg-icon{
|
||||
width: 1.54rem;
|
||||
height: .26rem;
|
||||
}
|
||||
|
||||
}
|
||||
>p{
|
||||
font-size: .12rem;
|
||||
font-family: Manrope;
|
||||
font-weight: 400;
|
||||
color: #9B9B9B;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
@media screen and (max-width: 768px) {
|
||||
.layout-footer{
|
||||
&-h5-wrap{
|
||||
}
|
||||
&-d{
|
||||
flex-direction: column;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
&-r{
|
||||
align-self: flex-start;
|
||||
padding-top: .98rem;
|
||||
padding-bottom: .37rem;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
flex-wrap: wrap;
|
||||
box-sizing: border-box;
|
||||
&-i{
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
justify-content: flex-start;
|
||||
font-size: .24rem;
|
||||
font-weight: bold;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
margin-bottom: .3rem;
|
||||
height: .33rem;
|
||||
line-height: .33rem;
|
||||
padding-left: .15rem;
|
||||
&:active{
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
&-l{
|
||||
padding-top: .5rem;
|
||||
&-l-w{
|
||||
padding-bottom: .3rem;
|
||||
text-align: center;
|
||||
.svg-icon{
|
||||
width: 3rem;
|
||||
height: .5rem;
|
||||
}
|
||||
|
||||
}
|
||||
>p{
|
||||
text-align: center;
|
||||
max-width: 4.5rem;
|
||||
font-size: .24rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,273 @@
|
|||
<template>
|
||||
<div class="layout-header" id="layout-header" >
|
||||
<div class="layout-header-h5-wrap" :style="{'position':'relative','z-index':'100'}">
|
||||
<div class="layout-header-nav">
|
||||
<div class="logo">
|
||||
<svg-icon icon-class="logo"></svg-icon>
|
||||
</div>
|
||||
<div class="layout-header-tabs" >
|
||||
<van-tabs v-model="active" @change="handleChange"
|
||||
background="transparent"
|
||||
title-inactive-color="#9B9B9B"
|
||||
color="#F49F00"
|
||||
title-active-color="#FFFFFF" >
|
||||
<van-tab
|
||||
:title="item.title"
|
||||
:name="item.name"
|
||||
v-for="(item) in tabs "
|
||||
:key="item.name"></van-tab>
|
||||
</van-tabs>
|
||||
</div>
|
||||
<div class="layout-header-menu" @click="handleToggle">
|
||||
<svg-icon v-if="!isShow" icon-class="menu"></svg-icon>
|
||||
<svg-icon v-if="isShow" icon-class="close"></svg-icon>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<van-popup v-model="isShow" class="layout-header-popup" :overlay="false" :get-container="getContainer" position="top" :style="{ 'min-height': 'auto' ,'z-index':'99 !important'}" >
|
||||
<div class="layout-header-menu-lists">
|
||||
<van-cell-group>
|
||||
<van-cell
|
||||
clickable
|
||||
:class="{'active':item.name===active}"
|
||||
class="layout-header-menu-item"
|
||||
title-class="layout-header-menu-t"
|
||||
:is-link="false"
|
||||
:title="item.title"
|
||||
:name="item.name"
|
||||
v-for="(item) in tabs"
|
||||
@click="handleClick(item)"
|
||||
:key="item.name">
|
||||
<template #icon>
|
||||
<div class="layout-header-menu-icon">
|
||||
<svg-icon :icon-class="item.icon"></svg-icon>
|
||||
</div>
|
||||
</template>
|
||||
<template #extra>
|
||||
<div class="layout-header-menu-extra">
|
||||
<van-icon name="arrow" size=".2rem" color="#CBCBCB" />
|
||||
</div>
|
||||
</template>
|
||||
</van-cell>
|
||||
</van-cell-group>
|
||||
</div>
|
||||
</van-popup>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {tabs} from "~/assets/js/static";
|
||||
export default {
|
||||
name: "MyHeader",
|
||||
watch:{
|
||||
'$route'(old,val){
|
||||
if(old!==val){
|
||||
if(this.$route.name == 'contact-id'){
|
||||
return;
|
||||
}else{
|
||||
this.active=this.$route.name;
|
||||
this.isShow=false
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
methods:{
|
||||
handleMenu(){
|
||||
const clientWidth=document.documentElement.clientWidth;
|
||||
if(clientWidth>768){
|
||||
this.isShow=false
|
||||
}
|
||||
},
|
||||
getContainer() {
|
||||
return document.querySelector('.layout-header');
|
||||
},
|
||||
handleClick(item){
|
||||
if(item.name==='innovation'){
|
||||
return;
|
||||
}
|
||||
if(this.$route.name===item.name){
|
||||
return
|
||||
}
|
||||
this.isShow=!this.isShow
|
||||
this.$router.push({name:item.name})
|
||||
},
|
||||
handleChange(name,title){
|
||||
if(name==='innovation'){
|
||||
return;
|
||||
}
|
||||
if(this.$route.name===name){
|
||||
return
|
||||
}
|
||||
this.$router.push({name:name})
|
||||
},
|
||||
handleToggle(){
|
||||
this.isShow=!this.isShow
|
||||
}
|
||||
},
|
||||
created(){
|
||||
this.active=this.$route.name
|
||||
},
|
||||
destroyed(){
|
||||
this.handleMenu()
|
||||
window.removeEventListener('resize',this.handleMenu)
|
||||
},
|
||||
mounted(){
|
||||
window.addEventListener('resize',this.handleMenu)
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
isShow:false,
|
||||
active: '',
|
||||
tabs:tabs
|
||||
};
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.layout-header{
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
height: .96rem;
|
||||
z-index: 2;
|
||||
overflow: hidden;
|
||||
background-color: #363231;
|
||||
&-menu{
|
||||
display: none;
|
||||
}
|
||||
&-popup{
|
||||
z-index: 99 !important;
|
||||
}
|
||||
&-nav{
|
||||
display: flex;
|
||||
width: 100%;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
height: 100%;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
&-tabs{
|
||||
display: flex;
|
||||
height: 100%;
|
||||
align-items: flex-end;
|
||||
}
|
||||
.logo{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 100%;
|
||||
.svg-icon{
|
||||
width: 1.54rem;
|
||||
height: .26rem;
|
||||
}
|
||||
}
|
||||
&-h5-wrap{
|
||||
height: 100% !important;
|
||||
display: block;
|
||||
background-color: #363231;
|
||||
overflow-x: initial;
|
||||
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 768px) {
|
||||
.layout-header{
|
||||
height: .88rem;
|
||||
&-menu{
|
||||
display: block;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
padding: .3rem;
|
||||
&-item{
|
||||
padding-left: .3rem;
|
||||
min-height: 1.09rem;
|
||||
&:after{
|
||||
left: 0;
|
||||
right: 0;
|
||||
border-color: #E3E3E3;
|
||||
}
|
||||
&:active,&.active{
|
||||
background-color: #F1F1F1;
|
||||
.layout-header-menu-t{
|
||||
font-family: Manrope;
|
||||
font-weight: bold;
|
||||
font-size: .4rem;
|
||||
color: #2E2C2C;
|
||||
}
|
||||
}
|
||||
}
|
||||
&-t{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: .3rem;
|
||||
font-family: Manrope;
|
||||
font-weight: 400;
|
||||
color: #302D2C;
|
||||
}
|
||||
&-extra{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
&-icon{
|
||||
padding-right: .3rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.svg-icon{
|
||||
width: .34rem;
|
||||
height: .34rem;
|
||||
}
|
||||
}
|
||||
&-lists{
|
||||
padding-top: .88rem;
|
||||
padding-bottom: .89rem;
|
||||
&-item{
|
||||
|
||||
}
|
||||
}
|
||||
.svg-icon{
|
||||
width: .34rem;
|
||||
height: .3rem;
|
||||
}
|
||||
&:active{
|
||||
background-color: #eee;
|
||||
}
|
||||
}
|
||||
&-nav{
|
||||
justify-content: center;
|
||||
}
|
||||
&-tabs{
|
||||
display: none;
|
||||
}
|
||||
.logo{
|
||||
.svg-icon{
|
||||
width: 2.12rem;
|
||||
height: .36rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<style lang="less">
|
||||
.layout-header-tabs{
|
||||
.van-tab{
|
||||
font-size: .14rem;
|
||||
font-weight: bold;
|
||||
font-family: Manrope;
|
||||
color: #9B9B9B;
|
||||
&:hover .van-tab__text{
|
||||
font-family: Manrope;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
&.van-tab--active .van-tab__text{
|
||||
color: #9B9B9B !important;
|
||||
}
|
||||
}
|
||||
.van-tabs{
|
||||
height: 100%;
|
||||
}
|
||||
.van-tabs__wrap{
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,101 @@
|
|||
<template>
|
||||
<div class="pagination">
|
||||
<el-pagination
|
||||
background
|
||||
:hide-on-single-page="true"
|
||||
@current-change="handleCurrentChange"
|
||||
layout="prev, pager, next"
|
||||
:total="total">
|
||||
</el-pagination>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "MyPagination",
|
||||
props:{
|
||||
pagerCount:{
|
||||
type:Number,
|
||||
default:6
|
||||
},
|
||||
// 限制 每页 多少条
|
||||
limit:{
|
||||
type:Number,
|
||||
default:10
|
||||
},
|
||||
// 页数
|
||||
page:{
|
||||
type:Number,
|
||||
default:1
|
||||
},
|
||||
// 总 数
|
||||
total:{
|
||||
type:Number,
|
||||
default:100
|
||||
}
|
||||
},
|
||||
computed:{
|
||||
isCurrent:{
|
||||
get(){
|
||||
return this.page
|
||||
},
|
||||
set(val){
|
||||
return this.$emit('update:current',val)
|
||||
}
|
||||
},
|
||||
},
|
||||
methods:{
|
||||
handleClick(item){
|
||||
this.$emit('update:current',item)
|
||||
},
|
||||
handleCurrentChange(val) {
|
||||
this.$emit('change',val)
|
||||
},
|
||||
myCallback(VAL){
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.pagination{
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
&-lists{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
&-prev{
|
||||
margin-right: .1rem;
|
||||
}
|
||||
&-next{
|
||||
margin-left: .1rem;
|
||||
.svg-icon{
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
}
|
||||
&-prev,&-next,&-list{
|
||||
width: .48rem;
|
||||
height: .48rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
cursor: pointer;
|
||||
&:active,&:hover{
|
||||
background: #F3F3F3;
|
||||
border-radius: .05rem;
|
||||
}
|
||||
}
|
||||
&-list{
|
||||
margin-right: .08rem;
|
||||
&:last-child{
|
||||
margin-right: 0;
|
||||
}
|
||||
&.active{
|
||||
background: #F3F3F3;
|
||||
border-radius: .05rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,62 @@
|
|||
<template>
|
||||
<div class="our-founders">
|
||||
<h2 class="our-founders-t">Our Founders Are Global</h2>
|
||||
<p class="our-founders-d">LightLimX now has offices located in Tokyo,Dubai,Singapore,North America, Asia , allowing us to reach out resources globally.</p>
|
||||
<slot></slot>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "OurFounders"
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.our-founders{
|
||||
padding-top: 2rem;
|
||||
padding-bottom: 1.92rem;
|
||||
&-banners{
|
||||
width: 100%;
|
||||
padding: 0 ;
|
||||
}
|
||||
&-t,&-d{
|
||||
text-align: center;
|
||||
font-family: Manrope;
|
||||
}
|
||||
&-t{
|
||||
font-size: .48rem;
|
||||
font-weight: bold;
|
||||
line-height: .84rem;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
&-d{
|
||||
max-width: 9rem;
|
||||
width: 100%;
|
||||
margin: 0 auto 1.08rem;
|
||||
font-size: .24rem;
|
||||
font-weight: 400;
|
||||
line-height: .48rem;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 768px) {
|
||||
.our-founders{
|
||||
padding-bottom: .44rem;
|
||||
padding-top: .7rem;
|
||||
&-banners{
|
||||
padding: 0 .3rem;
|
||||
}
|
||||
&-t{
|
||||
font-size: .4rem;
|
||||
line-height: .84rem;
|
||||
}
|
||||
&-d{
|
||||
max-width: 5.6rem;
|
||||
font-size: .24rem;
|
||||
line-height: .34rem;
|
||||
margin-bottom: .49rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,92 @@
|
|||
<template>
|
||||
<section class="our-portfolio-view" :style="isCssStyle">
|
||||
<div class="our-portfolio-view-wrap">
|
||||
<h1 class="our-portfolio-view-h1-1 wow fadeInUp" data-wow-delay=".4s" >We Drive Real Value To</h1>
|
||||
<h1 class="our-portfolio-view-h1-1 wow fadeInUp" data-wow-delay=".5s">Our Portfolio</h1>
|
||||
<div class="our-portfolio-view-card">
|
||||
<slot></slot>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "OurPortfolio",
|
||||
props:{
|
||||
cssStyle:{
|
||||
type:Object,
|
||||
default:()=>{
|
||||
return {}
|
||||
}
|
||||
}
|
||||
},
|
||||
computed:{
|
||||
isCssStyle(){
|
||||
return this.cssStyle
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.our-portfolio-view{
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
padding-top: 1.65rem;
|
||||
padding-bottom: 1.57rem;
|
||||
&-card{
|
||||
margin-top: 1.40rem;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
&-h1-1{
|
||||
font-weight: bold;
|
||||
text-align: center;
|
||||
height: .65rem;
|
||||
font-size: .48rem;
|
||||
font-family: Manrope;
|
||||
color: #302D2C;
|
||||
&:last-child{
|
||||
margin-top: .16rem;
|
||||
}
|
||||
}
|
||||
&-wrap{
|
||||
width: 100%;
|
||||
max-width: 13rem;
|
||||
margin: 0 auto;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 1250px) {
|
||||
.our-portfolio-view{
|
||||
&-card{
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-around;
|
||||
}
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 768px){
|
||||
.our-portfolio-view{
|
||||
padding-top: .51rem;
|
||||
padding-bottom: .51rem;
|
||||
&-h5-wrap{
|
||||
height: 100% !important;
|
||||
}
|
||||
&-card{
|
||||
margin-top: .47rem;
|
||||
flex-direction: column;
|
||||
padding-left: .3rem;
|
||||
padding-right: .3rem;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
&-h1-1{
|
||||
height: .82rem;
|
||||
font-size: .6rem;
|
||||
&:last-child{
|
||||
margin-top: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,156 @@
|
|||
<template>
|
||||
<div class="our-portfolio-item wow fadeInUp" :data-wow-delay="item.time" >
|
||||
<img v-lazy="assetsUri('images/'+item.img+'.png')" class="our-portfolio-item-img" alt="">
|
||||
<h3 class="our-portfolio-item-title">{{item.title}}</h3>
|
||||
<p class="our-portfolio-item-content">{{item.content}}</p>
|
||||
<nuxt-link :to="item.link" tag="a" class="our-portfolio-item-a">Read more<van-icon name="arrow" color="#F49F00" ></van-icon></nuxt-link>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
assetsUri
|
||||
} from "../../utils";
|
||||
|
||||
export default {
|
||||
name: "OurPortfolioItem",
|
||||
data(){
|
||||
return {
|
||||
assetsUri
|
||||
}
|
||||
},
|
||||
props:{
|
||||
item:{
|
||||
default:()=>{},
|
||||
type:Object
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.our-portfolio-item{
|
||||
max-width: 4.09rem;
|
||||
width: 100%;
|
||||
min-height: 4.97rem;
|
||||
opacity: 1;
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
transition: all .3s ease-in;
|
||||
&-a{
|
||||
display: block;
|
||||
margin: 0 auto;
|
||||
font-size: .16rem;
|
||||
font-family: Manrope;
|
||||
font-weight: 400;
|
||||
line-height: .32rem;
|
||||
color: #F49F00;
|
||||
text-decoration: underline;
|
||||
padding-bottom: .70rem;
|
||||
margin-top: .32rem;
|
||||
>i{
|
||||
font-size: .12rem;
|
||||
}
|
||||
}
|
||||
&:hover{
|
||||
box-shadow: 0 3px 20px rgba(0, 0, 0, 0.06);
|
||||
transform: scale(1.05);
|
||||
}
|
||||
&-title{
|
||||
margin-top: .25rem;
|
||||
font-size: .24rem;
|
||||
font-family: Manrope;
|
||||
font-weight: bold;
|
||||
line-height: .84rem;
|
||||
color: #342927;
|
||||
}
|
||||
&-content{
|
||||
margin: 0 auto;
|
||||
max-width: 3.52rem;
|
||||
min-height: 1.18rem;
|
||||
padding-left: .3rem;
|
||||
padding-right: .3rem;
|
||||
font-size: .16rem;
|
||||
font-family: Manrope;
|
||||
font-weight: 400;
|
||||
line-height: .32rem;
|
||||
color: #302D2C;
|
||||
}
|
||||
&-img{
|
||||
display: block;
|
||||
width: .88rem;
|
||||
height: .88rem;
|
||||
margin: 77px auto 0;
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 1250px) {
|
||||
.our-portfolio-item{
|
||||
margin-top: .5rem;
|
||||
width: 4.09rem;
|
||||
&:first-child{
|
||||
margin-top: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 830px) {
|
||||
.our-portfolio-item{
|
||||
margin-top: .5rem;
|
||||
width: 100%;
|
||||
&:first-child{
|
||||
margin-top: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 768px) {
|
||||
.our-portfolio-item{
|
||||
margin-top: .5rem;
|
||||
max-width: 100%;
|
||||
min-height: 4.97rem;
|
||||
text-align: center;
|
||||
&:first-child{
|
||||
margin-top: 0;
|
||||
}
|
||||
&-a{
|
||||
margin: .45rem auto 0;
|
||||
font-size: .3rem;
|
||||
font-weight: 400;
|
||||
line-height: .32rem;
|
||||
padding-bottom: 1.1rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
>i{
|
||||
font-size: .24rem;
|
||||
}
|
||||
}
|
||||
&:hover{
|
||||
box-shadow: 0 .03rem .2rem rgba(0, 0, 0, 0.06);
|
||||
}
|
||||
&-title{
|
||||
margin-top: .52rem;
|
||||
font-size: .4rem;
|
||||
font-weight: bold;
|
||||
line-height: .84rem;
|
||||
}
|
||||
&-content{
|
||||
margin: .6rem auto 0;
|
||||
max-width: 6.30rem;
|
||||
min-height: 1.35rem;
|
||||
padding-left: .3rem;
|
||||
padding-right: .3rem;
|
||||
font-weight: 400;
|
||||
font-size: .24rem;
|
||||
line-height: .34rem;
|
||||
}
|
||||
&-img{
|
||||
display: block;
|
||||
width: 2.42rem;
|
||||
height: 2.42rem;
|
||||
margin: .99rem auto 0;
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,122 @@
|
|||
<template>
|
||||
<div class="partners" id="partners">
|
||||
<h2 class="partners-t">Partners</h2>
|
||||
<h3 class="partners-t-sub">We Partner With The Extraordinary</h3>
|
||||
<p class="partners-d">We are well versed within crypto space with strong partner backing</p>
|
||||
<ul class="partners-l">
|
||||
<li class="partners-l-i wow flipInX" data-wow-delay="0.6s" v-for="(item,index) in partners" :key="'partners_'+index">
|
||||
<img class="partners-l-i-img " v-lazy="assetsUri(item.logo)" alt="">
|
||||
</li>
|
||||
<li class="partners-l-i" v-if="partners.length%4<3||partners.length%3<2"></li>
|
||||
</ul>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
assetsUri
|
||||
} from "../../utils";
|
||||
|
||||
export default {
|
||||
name: "Partners",
|
||||
props:{
|
||||
partners:{
|
||||
default:()=>[],
|
||||
type:Array
|
||||
},
|
||||
showPartners:{
|
||||
default:false,
|
||||
type:Boolean
|
||||
},
|
||||
},
|
||||
data(){
|
||||
return {
|
||||
assetsUri,
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.partners{
|
||||
width: 100%;
|
||||
&-t,&-t-sub,&-d{
|
||||
text-align: center;
|
||||
color: #Fff;
|
||||
}
|
||||
&-t{
|
||||
font-size: .6rem;
|
||||
font-family: Manrope;
|
||||
font-weight: bold;
|
||||
line-height: .84rem;
|
||||
color: #FFFFFF;
|
||||
&-sub{
|
||||
font-size: .36rem;
|
||||
font-family: Manrope;
|
||||
font-weight: bold;
|
||||
line-height: .84rem;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
}
|
||||
&-d{
|
||||
font-size: .24rem;
|
||||
font-family: Manrope;
|
||||
font-weight: 400;
|
||||
line-height: .33rem;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
&-l{
|
||||
padding-top: 1rem;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
flex-wrap: wrap;
|
||||
&-i{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
max-width: 2.80rem;
|
||||
max-height: 1.8rem;
|
||||
margin-bottom: .6rem;
|
||||
cursor: pointer;
|
||||
&-img{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 1200px){
|
||||
.partners{
|
||||
&-l{
|
||||
justify-content: space-around;
|
||||
}
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 768px){
|
||||
.partners{
|
||||
&-t{
|
||||
font-size: .6rem;
|
||||
line-height: .84rem;
|
||||
&-sub{
|
||||
font-size: .36rem;
|
||||
line-height: .84rem;
|
||||
}
|
||||
}
|
||||
&-d{
|
||||
max-width: 4.54rem;
|
||||
font-size: .24rem;
|
||||
line-height: .32rem;
|
||||
margin: 0 auto;
|
||||
}
|
||||
&-l{
|
||||
padding-top: .5rem;
|
||||
&-i{
|
||||
margin-bottom: .3rem;
|
||||
max-width: 2.06rem;
|
||||
max-height: 1.33rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,343 @@
|
|||
<template>
|
||||
<div class="portfolio" >
|
||||
<h2 class="portfolio-t wow fadeInUp" >Portfolio</h2>
|
||||
<div class="portfolio-c" id="iPortfolio">
|
||||
<div class="portfolio-c-l">
|
||||
<!-- :style="{'position':position}"-->
|
||||
<div class="portfolio-c-l-fixed" id="ball"
|
||||
:style="{'position':position,'top':top,'bottom':bottom}"
|
||||
>
|
||||
<img class="portfolio-c-l-fixed-img" v-lazy="assetsUri('images/ball.png')" alt="">
|
||||
<span>At LightLimX we believe tomorrow is built today.</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="portfolio-c-r">
|
||||
<ul class="portfolio-c-r-u">
|
||||
<li class="portfolio-c-r-l" v-for="(group,index) in staticData" :key="'_'+index">
|
||||
<h5 class="portfolio-c-r-l-t wow fadeInUp">{{group.title}}</h5>
|
||||
<div class="portfolio-c-r-l-d" >
|
||||
<img v-lazy="assetsUri(item)" data-wow-delay=".4s" class="wow fadeInRight" v-for="(item,ind) in group.images" :key="ind+'_'" alt="">
|
||||
<img v-if="group.images&&(group.images.length%3<3)" style="opacity: 0" alt="">
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div class="portfolio-card">
|
||||
<div class="portfolio-card-item wow fadeInUp" :data-wow-delay="`${0.4+(index*0.2)}s`" v-for="(item,index) in cards" :key="'cards_'+index">
|
||||
<img v-lazy="assetsUri(item.img)" v-if="item.img" class="portfolio-card-item-img" alt="">
|
||||
<span class="portfolio-card-item-btn" @click="$router.push({path:item.link})">
|
||||
{{item.btnText}}
|
||||
<van-icon name="arrow" class="portfolio-card-item-btn-icon"></van-icon>
|
||||
</span>
|
||||
<p>{{item.text}}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {assetsUri} from "../../utils";
|
||||
|
||||
export default {
|
||||
name: "Portfolio",
|
||||
props:{
|
||||
// staticData:{
|
||||
// default:()=>[],
|
||||
// type:Array
|
||||
// },
|
||||
position:{
|
||||
default:'sticky',
|
||||
type:String
|
||||
},
|
||||
top:{
|
||||
default:'0px',
|
||||
type:String
|
||||
},
|
||||
bottom:{
|
||||
default:'initial',
|
||||
type:String
|
||||
}
|
||||
},
|
||||
data(){
|
||||
return {
|
||||
assetsUri,
|
||||
cards:[
|
||||
{
|
||||
img:'images/apply.png',
|
||||
btnText:'Apply For Investment',
|
||||
text:'We invert and partner with projects outside of our accelerator',
|
||||
link:'/contact'
|
||||
},
|
||||
{
|
||||
img:'images/invest.png',
|
||||
btnText:'Invest With Us',
|
||||
text:'Join our 1000-strong deal-sharing investor network',
|
||||
link:'/contact'
|
||||
},
|
||||
],
|
||||
staticData:[
|
||||
{
|
||||
title:'Infrastructure',
|
||||
images:[
|
||||
'images/portfolio/组 723@2x.png',
|
||||
'images/portfolio/组 698@2x.png',
|
||||
'images/portfolio/组 699@2x.png',
|
||||
'images/portfolio/组 722@2x.png',
|
||||
]
|
||||
}, {
|
||||
title:'Web 3.0',
|
||||
images:[
|
||||
'images/portfolio/组 713@2x.png',
|
||||
'images/portfolio/组 714@2x.png',
|
||||
'images/portfolio/组 715@2x.png',
|
||||
'images/portfolio/组 718@2x.png',
|
||||
'images/portfolio/组 717@2x.png',
|
||||
'images/portfolio/组 716@2x.png',
|
||||
'images/portfolio/组 864@2x.png',
|
||||
'images/portfolio/组 719@2x.png',
|
||||
]
|
||||
}, {
|
||||
title:'GameFi',
|
||||
images:[
|
||||
'images/portfolio/组 712@2x.png',
|
||||
'images/portfolio/组 711@2x.png',
|
||||
'images/portfolio/组 710@2x.png',
|
||||
'images/portfolio/组 707@2x.png',
|
||||
'images/portfolio/组 708@2x.png',
|
||||
'images/portfolio/组 709@2x.png',
|
||||
'images/portfolio/组 706@2x.png',
|
||||
'images/portfolio/组 705@2x.png'
|
||||
]
|
||||
},
|
||||
{
|
||||
title:'SocialFi',
|
||||
images:[
|
||||
'images/portfolio/组 702@2x.png',
|
||||
'images/portfolio/组 703@2x.png',
|
||||
'images/portfolio/组 704@2x.png',
|
||||
'images/portfolio/组 701@2x.png',
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.portfolio{
|
||||
padding-bottom: 1.04rem;
|
||||
&-card{
|
||||
margin-top: 1.86rem;
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
flex-wrap: wrap;
|
||||
&-item{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
margin-bottom: .99rem;
|
||||
>p{
|
||||
text-align: center;
|
||||
max-width: 4.76rem;
|
||||
margin-top: .42rem;
|
||||
font-size: .24rem;
|
||||
font-family: Manrope;
|
||||
font-weight: 400;
|
||||
line-height: .48rem;
|
||||
color: #9B9B9B;
|
||||
}
|
||||
&-img{
|
||||
display: block;
|
||||
width: 2.24rem;
|
||||
height: 2.24rem;
|
||||
}
|
||||
&-btn{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin-top: .67rem;
|
||||
width: 3.80rem;
|
||||
height: .6rem;
|
||||
background: #EDEDED;
|
||||
border-radius: .1rem;
|
||||
font-size: .24rem;
|
||||
font-family: Manrope;
|
||||
font-weight: bold;
|
||||
color: #302D2C;
|
||||
line-height: .6rem;
|
||||
cursor: pointer;
|
||||
&-icon{
|
||||
display: inline-block;
|
||||
margin-left: .2rem;
|
||||
color: #342927 ;
|
||||
font-size: .12rem;
|
||||
}
|
||||
&:hover{
|
||||
background-color: #F49F00;
|
||||
transition: background-color .3s ease-in;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
&-t{
|
||||
padding-top: 1.38rem;
|
||||
padding-bottom: .94rem;
|
||||
text-align: center;
|
||||
font-size: .6rem;
|
||||
font-family: Manrope;
|
||||
font-weight: bold;
|
||||
line-height: .84rem;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
&-c{
|
||||
display: flex;
|
||||
position: relative;
|
||||
justify-content: flex-end;
|
||||
&-l{
|
||||
&-fixed{
|
||||
width: calc(100% - 7.8rem);
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
transition: all .3s ease-in;
|
||||
&-img{
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
max-width: 5.53rem;
|
||||
max-height: 5.53rem;
|
||||
margin: 0 auto;
|
||||
}
|
||||
>span{
|
||||
display: block;
|
||||
max-width: 3.07rem;
|
||||
font-size: .30rem;
|
||||
font-family: Manrope;
|
||||
text-align: center;
|
||||
font-weight: 400;
|
||||
line-height: .6rem;
|
||||
color: #9B9B9B;
|
||||
margin: 0 auto;
|
||||
margin-top: -.6rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
&-r{
|
||||
max-width: 7.8rem;
|
||||
flex: 1;
|
||||
&-u{
|
||||
overflow-x: hidden;
|
||||
padding: 0 .3rem;
|
||||
padding-top: .37rem;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
&-l{
|
||||
margin-top: .27rem;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
&-t{
|
||||
display: inline-block;
|
||||
margin: 0 auto .54rem;
|
||||
border: 1px solid #393939;
|
||||
border-radius: .29rem;
|
||||
font-size: .24rem;
|
||||
font-family: Manrope;
|
||||
font-weight: bold;
|
||||
color: #F49F00;
|
||||
padding: 10px .35rem;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
&-d{
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-between;
|
||||
img{
|
||||
display: block;
|
||||
width: 2.06rem;
|
||||
height: 1.33rem;
|
||||
margin-bottom: .36rem;
|
||||
cursor: pointer;
|
||||
transition: all .3s ease-in;
|
||||
&:hover{
|
||||
transform: scale(1.1);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 1250px) {
|
||||
.portfolio{
|
||||
&-c{
|
||||
&-l{
|
||||
&-fixed{
|
||||
>span{
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 768px) {
|
||||
.portfolio{
|
||||
padding-bottom: 1.04rem;
|
||||
&-card{
|
||||
margin-top: 1.43rem;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-around;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
|
||||
&-t{
|
||||
padding-top: 1.43rem;
|
||||
padding-bottom: 0;
|
||||
}
|
||||
&-c{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
position: relative;
|
||||
&-l{
|
||||
&-fixed{
|
||||
width: 100% !important;
|
||||
img{
|
||||
margin: 0 auto;
|
||||
}
|
||||
>span{
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
&-r{
|
||||
flex: 1;
|
||||
&-u{
|
||||
padding-top: 0;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
&-l{
|
||||
margin-top: .6rem;
|
||||
&:first-child{
|
||||
margin-top: -0rem;
|
||||
}
|
||||
&-t{
|
||||
margin: 0 auto .54rem;
|
||||
border-radius: .4rem;
|
||||
font-size: .4rem;
|
||||
padding: .10rem .35rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,103 @@
|
|||
<template>
|
||||
<div class="select-div">
|
||||
<div class="select-div-text-wrap" @click="isShow=!isShow">
|
||||
<span class="select-div-text">{{text}}</span>
|
||||
<slot></slot>
|
||||
</div>
|
||||
<ul class="select-ul" :style="{'display':!isShow?'none':'block'}" >
|
||||
<li class="select-item" :class="{'active':select===item.id}" @click="handleSelect(item)" v-for="(item,index) in options" :key="'select_'+index">{{item.name}}</li>
|
||||
</ul>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props:{
|
||||
options:{
|
||||
default:()=>[],
|
||||
type:Array
|
||||
},
|
||||
select:{
|
||||
default:'',
|
||||
type:String
|
||||
}
|
||||
},
|
||||
name: "PublicSelect",
|
||||
computed:{
|
||||
text(){
|
||||
const findItem=this.options.find((item)=>item.id===this.select);
|
||||
return findItem?findItem.name:''
|
||||
}
|
||||
},
|
||||
methods:{
|
||||
handleSelect(item){
|
||||
this.isShow=false
|
||||
this.$emit('select',item)
|
||||
}
|
||||
},
|
||||
data(){
|
||||
return {
|
||||
isShow:false
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.select{
|
||||
&-div{
|
||||
display: block;
|
||||
position: relative;
|
||||
&-text{
|
||||
&-wrap{
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
&-ul{
|
||||
position: absolute;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
transform: translateY(100%);
|
||||
min-height: 2rem;
|
||||
background-color: #FFFFFF;
|
||||
box-shadow: 0 .03rem .06rem rgba(0, 0, 0, 0.16);
|
||||
z-index: 2;
|
||||
}
|
||||
&-item{
|
||||
cursor: pointer;
|
||||
height: .4rem;
|
||||
background-color: #fff;
|
||||
font-size: .16rem;
|
||||
font-family: Manrope;
|
||||
font-weight: 400;
|
||||
line-height: .4rem;
|
||||
color: #302D2C;
|
||||
padding-left: .33rem;
|
||||
box-sizing: border-box;
|
||||
&.active{
|
||||
background-color: #F49F00;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 768px) {
|
||||
.select{
|
||||
&-ul{
|
||||
bottom: -.06rem;
|
||||
min-height: 4rem;
|
||||
z-index: 1;
|
||||
}
|
||||
&-item{
|
||||
height: .8rem;
|
||||
font-size: .26rem;
|
||||
line-height: .8rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,178 @@
|
|||
<template>
|
||||
<div class="section-limit" >
|
||||
<div class="section-limit-h5-wrap">
|
||||
<!-- <ball class="b-ball"></ball>-->
|
||||
<!-- <svg-icon icon-class="hstart" ></svg-icon>-->
|
||||
<img v-lazy="'/images/hstart.png'" class="section-limit-start b-ball" alt="">
|
||||
<div class="section-limit-div">
|
||||
<h1 class="section-limit-title wow fadeInDown" >
|
||||
<span>We are LightLimX</span>
|
||||
<!-- <svg-icon icon-class="start" class="section-limit-title-img"></svg-icon>-->
|
||||
</h1>
|
||||
<div class="section-limit-c">
|
||||
<p class="section-limit-title-desc wow fadeInDownBig">
|
||||
We Make The
|
||||
<br/>Impossible Possible.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section-limit-flower-wrap wow fadeInDownBig">
|
||||
<svg-icon icon-class="hstart" class="section-limit-start c-ball"></svg-icon>
|
||||
</div>
|
||||
<!-- <div class="section-limit-flower-wrap wow fadeInDown">-->
|
||||
<!-- <svg-icon icon-class="flower"></svg-icon>-->
|
||||
<!-- </div>-->
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {assetsUri} from '~/utils/index.js'
|
||||
export default {
|
||||
name: "SectionLimitX",
|
||||
data(){
|
||||
return {
|
||||
assetsUri
|
||||
}
|
||||
},
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.section-limit{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
/*min-height: 100vh;*/
|
||||
box-sizing: border-box;
|
||||
padding-top: .96rem;
|
||||
&-div{
|
||||
margin-right: .16rem;
|
||||
}
|
||||
&-start{
|
||||
}
|
||||
&-flower-wrap{
|
||||
margin-top: 1rem;
|
||||
.svg-icon{
|
||||
width: 8.95rem;
|
||||
height: 6.59rem;
|
||||
}
|
||||
}
|
||||
.b-ball{
|
||||
display: none;
|
||||
}
|
||||
.c-ball{
|
||||
/*transform: scale(2.2);*/
|
||||
}
|
||||
&-c{
|
||||
padding-top: 1.1rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
&-h5-wrap{
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
/*overflow: hidden;*/
|
||||
}
|
||||
&-title{
|
||||
padding-top: 1.05rem;
|
||||
font-size: 1.10rem;
|
||||
font-family: Manrope;
|
||||
font-weight: bold;
|
||||
color: #FFFFFF;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
word-break: keep-all;
|
||||
white-space: nowrap;
|
||||
&-img{
|
||||
display: block;
|
||||
width: 3.29rem;
|
||||
height: 2.42rem;
|
||||
margin-left: -.88rem;
|
||||
}
|
||||
>span{
|
||||
font-size: .68rem;
|
||||
font-family: Manrope;
|
||||
font-weight: bold;
|
||||
line-height: 1.31rem;
|
||||
color: #FFFFFF;
|
||||
position: relative;
|
||||
word-break: keep-all;
|
||||
}
|
||||
&-desc{
|
||||
word-break: keep-all;
|
||||
white-space: nowrap;
|
||||
margin-top: 0;
|
||||
font-weight: bold;
|
||||
color: #FFFFFF;
|
||||
font-size: .44rem;
|
||||
font-family: Manrope;
|
||||
line-height: .72rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 768px){
|
||||
.section-limit{
|
||||
padding-top: .88rem;
|
||||
&-c{
|
||||
padding-top: .57rem;
|
||||
justify-content: center;
|
||||
}
|
||||
.b-ball{
|
||||
display: block;
|
||||
}
|
||||
&-flower-wrap{
|
||||
.c-ball{
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
&-h5-wrap{
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
box-sizing: border-box;
|
||||
padding-top: .78rem;
|
||||
flex-direction: column;
|
||||
.b-ball{
|
||||
width: calc( 7.49rem - .3rem);
|
||||
height: 5.51rem;
|
||||
margin: 0 auto;
|
||||
box-sizing: content-box;
|
||||
}
|
||||
}
|
||||
&-flower-wrap{
|
||||
margin-top: .77rem;
|
||||
.svg-icon{
|
||||
width: 1.57rem;
|
||||
height: .2rem;
|
||||
}
|
||||
}
|
||||
&-title{
|
||||
padding-top: 1.03rem;
|
||||
font-size: .62rem;
|
||||
color: #FFFFFF;
|
||||
&-img{
|
||||
width: 2.32rem;
|
||||
height: 1.64rem;
|
||||
margin-left: -.6rem;
|
||||
}
|
||||
>span{
|
||||
font-size: .6rem;
|
||||
font-family: Manrope;
|
||||
font-weight: bold;
|
||||
line-height: 1.31rem;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
&-desc{
|
||||
margin-top: 0;
|
||||
text-align: center;
|
||||
font-size: .42rem;
|
||||
font-family: Manrope;
|
||||
font-weight: bold;
|
||||
line-height: .68rem;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,52 @@
|
|||
<template>
|
||||
<div class="section-view" :style="isCssStyle">
|
||||
<div class="section-view-h5-wrap">
|
||||
<slot></slot>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "SectionView",
|
||||
props:{
|
||||
cssStyle:{
|
||||
type:Object,
|
||||
default:()=>{
|
||||
return {}
|
||||
}
|
||||
}
|
||||
},
|
||||
computed:{
|
||||
isCssStyle(){
|
||||
return this.cssStyle
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
// First we get the viewport height and we multiple it by 1% to get a value for a vh unit
|
||||
// let vh = window.innerHeight * 0.01
|
||||
// // Then we set the value in the --vh custom property to the root of the document
|
||||
// document.documentElement.style.setProperty('--vh', `${vh}px`)
|
||||
//
|
||||
// // We listen to the resize event
|
||||
// window.addEventListener('resize', () => {
|
||||
// // We execute the same script as before
|
||||
// let vh = window.innerHeight * 0.01
|
||||
// console.log(vh);
|
||||
// document.documentElement.style.setProperty('--vh', `${vh}px`)
|
||||
// })
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.section-view{
|
||||
width: 100%;
|
||||
min-height: 100vh;
|
||||
box-sizing: border-box;
|
||||
&-h5-wrap{
|
||||
display: block;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,85 @@
|
|||
<template>
|
||||
<div class="situation">
|
||||
<h2 class="situation-t wow fadeInUp" data-wow-delay=".8s">Win-win Situation</h2>
|
||||
<h3 class="situation-t situation-t-h3 wow fadeInUp" data-wow-delay=".8s">Not Just An Investor But A Partner</h3>
|
||||
<p class="situation-d situation-d-first wow fadeInUp" data-wow-delay=".8s">Follow us for worthwhile content. Each week we uncover insights and learnings by entrepreneurs for entrepreneurs.</p>
|
||||
<p class="situation-d situation-d-second wow fadeInUp" data-wow-delay=".8s">In order to ensure multi-party benefits, we will pool our capabilities and resources with our partners to gain insight into market opportunities, and to provide differentiated investment programs to our investors, as well as innovative solutions to our target enterprises.
|
||||
</p>
|
||||
<slot></slot>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
assetsUri
|
||||
} from "../../utils";
|
||||
|
||||
export default {
|
||||
name: "situation",
|
||||
data(){
|
||||
return {
|
||||
assetsUri
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.situation{
|
||||
&-t,&-d{
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
&-t{
|
||||
font-size: .48rem;
|
||||
font-family: Manrope;
|
||||
font-weight: bold;
|
||||
line-height: .84rem;
|
||||
color: #000000;
|
||||
&:first-child{
|
||||
padding-top: 1.38rem;
|
||||
}
|
||||
}
|
||||
&-d{
|
||||
margin: 0 auto;
|
||||
width: 100%;
|
||||
max-width: 9.19rem;
|
||||
font-size: .24rem;
|
||||
font-family: Manrope;
|
||||
font-weight: 400;
|
||||
line-height: .48rem;
|
||||
color: #302D2C;
|
||||
&-first{
|
||||
padding-top: .55rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
.situation{
|
||||
&-t{
|
||||
margin: 0 auto;
|
||||
max-width: 6.86rem;
|
||||
font-size: .6rem;
|
||||
line-height: .62rem;
|
||||
&-h3{
|
||||
margin-top: -.3rem;
|
||||
}
|
||||
&:first-child{
|
||||
padding-top: 1.43rem;
|
||||
}
|
||||
}
|
||||
&-d{
|
||||
font-size: .24rem;
|
||||
line-height: .34rem;
|
||||
max-width: 6.9rem;
|
||||
&-first{
|
||||
padding-top: .27rem;
|
||||
}
|
||||
&-second{
|
||||
margin-top: -.28rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,72 @@
|
|||
<template>
|
||||
<div class="startup-block">
|
||||
<h2 class="startup-block-h2 wow fadeInUp" data-wow-delay=".3s">
|
||||
Accelerator Your Startup
|
||||
</h2>
|
||||
<p class="startup-block-p wow fadeInUp" data-wow-delay=".3s">Investing Beyond Investment. From aspiring founders to early stage entrepreneurs,LightLimX are dedicated to creating a thriving atmosphere for all pioneers within our ecosystem.</p>
|
||||
<small class="startup-block-small wow fadeInUp" data-wow-delay=".3s">As serial entrepreneurs, we know what it takes to build innovative businesses from scratch in the difficult markets of Crypto,and we have built a team of 40+ experts, including economists, quants, developers, lawyers, UX experts, and more to provide active investor side support through mentorship and network integration. We know the landscape and keep up with the latest developments.Therefore, we can guide teams when it comes to ideation, tokenomics, and communication.We strive to leverage our experience to help ventures grow from Seed Stage to later round of capital and maximise their value creation.The blockchain world is moving fast,and we help you move faster.</small>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "StartupBlock"
|
||||
}
|
||||
</script>
|
||||
<style scoped lang="less">
|
||||
.startup-block{
|
||||
&-h2{
|
||||
padding-top: 1.83rem;
|
||||
max-width:8.12rem;
|
||||
margin: 0 auto;
|
||||
font-size: .76rem;
|
||||
font-family: Manrope;
|
||||
font-weight: bold;
|
||||
line-height: 1.1rem;
|
||||
color: #FFFFFF;
|
||||
text-align: center;
|
||||
}
|
||||
&-p{
|
||||
max-width: 6.34rem;
|
||||
text-align: center;
|
||||
margin: 0 auto;
|
||||
margin-top: 1rem;
|
||||
font-size: .24rem;
|
||||
font-family: Manrope;
|
||||
font-weight: bold;
|
||||
line-height: .44rem;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
&-small{
|
||||
display: block;
|
||||
margin-top: .54rem;
|
||||
text-align: center;
|
||||
font-size: .14rem;
|
||||
font-family: Manrope;
|
||||
font-weight: 400;
|
||||
line-height: .28rem;
|
||||
color: #9B9B9B;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 768px) {
|
||||
.startup-block{
|
||||
&-h2{
|
||||
padding-top: 1.6rem;
|
||||
max-width:6.12rem;
|
||||
font-size: .6rem;
|
||||
line-height: 1;
|
||||
}
|
||||
&-p{
|
||||
max-width: 6.9rem;
|
||||
margin-top: 1.77rem;
|
||||
font-size: .24rem;
|
||||
line-height: .4rem;
|
||||
}
|
||||
&-small{
|
||||
margin-top: 2.26rem;
|
||||
font-size: .24rem;
|
||||
line-height: .34rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,207 @@
|
|||
<template>
|
||||
<div class="startup-content">
|
||||
<h2 class="startup-content-h2 wow fadeInUp" data-wow-delay=".3s">Join Accelerator</h2>
|
||||
<p class="startup-content-p wow fadeInUp" data-wow-delay=".3s">Each year,we choose over 30 early-stage programs to join our 3-month mentorship-driven accelerators.Once you're selected for an accelerator, you'll be part of the LightLimX community for life.That means you have a hyperconnected platform to expand your business and expand your network with access to a talented group of founders, investors, mentors, and industry leaders.</p>
|
||||
<span class="startup-content-btn wow fadeInUp" @click="$router.push({path:'/contact'})" data-wow-delay=".3s">Apply Now</span>
|
||||
<h2 class="startup-content-h2 startup-content-h2-2 wow fadeInUp" data-wow-delay=".3s">
|
||||
Your Startup Needs Are Covered
|
||||
</h2>
|
||||
<p class="startup-content-desc wow fadeInUp" data-wow-delay=".3s">
|
||||
Modeled after the most effective global programs and built by accelerator veterans, LightLimX will bring you exactly what you need, when you need it.
|
||||
</p>
|
||||
<ul class="startup-content-ul">
|
||||
<li class="startup-content-li wow fadeInUp" data-wow-delay=".5s" v-for="(item,index) in staticData" :key="index+'_startup'">
|
||||
<img v-lazy="assetsUri(item.img)" v-if="item.img" class="startup-content-li-img" alt="" />
|
||||
<h3 class="startup-content-li-h3" >{{item.title}}</h3>
|
||||
<p class="startup-content-li-p" v-html="item.desc"></p>
|
||||
</li>
|
||||
<li class="startup-content-li" style="opacity: 0" v-if="staticData.length%3==2">
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
assetsUri
|
||||
} from "../../utils";
|
||||
|
||||
export default {
|
||||
name: "StartupContent",
|
||||
props:{
|
||||
staticData:{
|
||||
type:Array,
|
||||
default:()=>[]
|
||||
}
|
||||
},
|
||||
data(){
|
||||
return {
|
||||
assetsUri,
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.startup-content{
|
||||
&-desc{
|
||||
font-size: .24rem;
|
||||
font-family: Manrope;
|
||||
font-weight: bold;
|
||||
line-height: .44rem;
|
||||
text-align: center;
|
||||
color: #302D2C;
|
||||
max-width: 9.67rem;
|
||||
margin: .72rem auto 0;
|
||||
}
|
||||
&-h2{
|
||||
padding-top: 1.5rem;
|
||||
font-size: .6rem;
|
||||
font-family: Manrope;
|
||||
font-weight: bold;
|
||||
line-height: 1.1rem;
|
||||
color: #302D2C;
|
||||
text-align: center;
|
||||
}
|
||||
&-p{
|
||||
margin-top: .72rem;
|
||||
font-size: .2rem;
|
||||
font-family: Manrope;
|
||||
font-weight: 400;
|
||||
line-height: .4rem;
|
||||
color: #302D2C;
|
||||
text-align: center;
|
||||
}
|
||||
&-btn{
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin: 1.22rem auto 0;
|
||||
width: 3.24rem;
|
||||
height: .6rem;
|
||||
border: 1px solid #9B9B9B;
|
||||
border-radius: .1rem;
|
||||
font-size: .24rem;
|
||||
font-family: Manrope;
|
||||
font-weight: bold;
|
||||
color: #302D2C;
|
||||
cursor: pointer;
|
||||
margin-bottom: .7rem;
|
||||
&:hover{
|
||||
background-color: #F49F00;
|
||||
transition: background-color .3s ease-in;
|
||||
border-color: #fff;
|
||||
}
|
||||
}
|
||||
&-ul{
|
||||
margin-top: .93rem;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-between;
|
||||
}
|
||||
&-li{
|
||||
cursor: pointer;
|
||||
width: 4.09rem;
|
||||
height: 4.23rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
padding-top: .76rem;
|
||||
box-sizing: border-box;
|
||||
padding-left: .29rem;
|
||||
padding-right: .29rem;
|
||||
margin-bottom: .32rem;
|
||||
transition: all .3s ease-in;
|
||||
&-h3{
|
||||
margin-top: .32rem;
|
||||
font-size: .24rem;
|
||||
font-family: Manrope;
|
||||
font-weight: bold;
|
||||
color: #342927;
|
||||
text-align: center;
|
||||
}
|
||||
&-p{
|
||||
margin-top: .32rem;
|
||||
font-size: .16rem;
|
||||
font-family: Manrope;
|
||||
font-weight: 400;
|
||||
line-height: .32rem;
|
||||
color: #302D2C;
|
||||
text-align: center;
|
||||
}
|
||||
&-img{
|
||||
display: block;
|
||||
width: .88rem;
|
||||
height: .88rem;
|
||||
}
|
||||
&:hover{
|
||||
transform: scale(1.01);
|
||||
box-shadow: 0 .03rem .2rem rgba(0, 0, 0, 0.06);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 820px) {
|
||||
.startup-content{
|
||||
&-ul{
|
||||
justify-content: space-around;
|
||||
}
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 768px) {
|
||||
.startup-content{
|
||||
&-desc{
|
||||
font-size: .3rem;
|
||||
line-height: .4rem;
|
||||
max-width: 6.9rem;
|
||||
margin: .28rem auto 0;
|
||||
}
|
||||
&-h2{
|
||||
padding-top: .5rem;
|
||||
&-2{
|
||||
max-width: 6.5rem;
|
||||
margin: 0 auto;
|
||||
line-height: .7rem;
|
||||
}
|
||||
}
|
||||
&-p{
|
||||
margin-top: .28rem;
|
||||
font-size: .24rem;
|
||||
line-height: .4rem;
|
||||
padding: 0 .3rem;
|
||||
}
|
||||
&-btn{
|
||||
margin: .65rem auto 0;
|
||||
width: 5.18rem;
|
||||
height: .96rem;
|
||||
font-size: .24rem;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
&-ul{
|
||||
margin-top: .49rem;
|
||||
}
|
||||
&-li{
|
||||
margin: 0 .3rem;
|
||||
width: 100%;
|
||||
min-height: 7rem;
|
||||
padding-top: 1.2rem;
|
||||
padding-left: .29rem;
|
||||
padding-right: .29rem;
|
||||
margin-bottom: .32rem;
|
||||
&-h3{
|
||||
margin-top: .73rem;
|
||||
font-size: .4rem;
|
||||
}
|
||||
&-p{
|
||||
margin-top: .6rem;
|
||||
font-size: .24rem;
|
||||
line-height: .34rem;
|
||||
}
|
||||
&-img{
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,43 @@
|
|||
<template>
|
||||
<svg :class="svgClass" v-on="$listeners">
|
||||
<use :xlink:href="iconName" />
|
||||
</svg>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'SvgIcon',
|
||||
props: {
|
||||
iconClass: {
|
||||
type: String,
|
||||
required: true
|
||||
},
|
||||
className: {
|
||||
type: String,
|
||||
default: ''
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
iconName () {
|
||||
return `#icon-${this.iconClass}`
|
||||
},
|
||||
svgClass () {
|
||||
if (this.className) {
|
||||
return 'svg-icon ' + this.className
|
||||
} else {
|
||||
return 'svg-icon'
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.svg-icon {
|
||||
width: 1em;
|
||||
height: 1em;
|
||||
vertical-align: -0.15em;
|
||||
fill:currentColor;
|
||||
overflow: hidden;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,22 @@
|
|||
module.exports = {
|
||||
apps : [{
|
||||
name: "Limix",
|
||||
script: "./node_modules/nuxt/bin/nuxt.js",
|
||||
// watch: ["src"],
|
||||
//ignore_watch: ["node_modules", "logger"],
|
||||
//max_memory_restart: "300M",
|
||||
exec_mode: "cluster", // 开启多线程模式，用于负载均衡
|
||||
instances: "max", // 启用多少个实例，可用于负载均衡
|
||||
//autorestart: true,
|
||||
//pm2:true,
|
||||
args: 'start',
|
||||
//kill_timeout: 3000,
|
||||
//instance_var: "INSTANCE_ID",
|
||||
//env: {
|
||||
// NODE_ENV: "development",
|
||||
//},
|
||||
//env_production: {
|
||||
// NODE_ENV: "production",
|
||||
//}
|
||||
}]
|
||||
}
|
||||
|
|
@ -0,0 +1,44 @@
|
|||
<template>
|
||||
<div class="my-layout" v-if="loading" >
|
||||
<my-header ></my-header>
|
||||
<Nuxt />
|
||||
<my-footer></my-footer>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
import MyHeader from "../components/MyHeader/index";
|
||||
import MyFooter from "../components/MyFooter/index";
|
||||
export default {
|
||||
name: "index",
|
||||
components: {MyFooter, MyHeader },
|
||||
data(){
|
||||
return {
|
||||
loading:false
|
||||
}
|
||||
},
|
||||
mixins:[],
|
||||
mounted(){
|
||||
this.$nextTick(() => {
|
||||
this.$nuxt.$loading.start()
|
||||
setTimeout(async () =>{
|
||||
await this.$nuxt.$loading.finish();
|
||||
this.loading=!this.$nuxt.$loading.getLoadingState();
|
||||
}, 2000)
|
||||
})
|
||||
},
|
||||
async asyncData(data) {
|
||||
const { params, $http }=data;
|
||||
// const post = await $http.$get(`https://api.nuxtjs.dev/posts/${params.id}`)
|
||||
return { post:'121' }
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.my-layout{
|
||||
display: block;
|
||||
height: 100%;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,9 @@
|
|||
export default function ({ store, redirect }) {
|
||||
// If the user is not authenticated
|
||||
// if (store.state.loading) {
|
||||
// return redirect('/loading')
|
||||
// }
|
||||
// if (!store.state.loading) {
|
||||
// return redirect('/')
|
||||
// }
|
||||
}
|
||||
|
|
@ -0,0 +1,21 @@
|
|||
export default function ({ isHMR, app, store, route, params, error, redirect }) {
|
||||
const defaultLocale = app.i18n.fallbackLocale
|
||||
// If middleware is called from hot module replacement, ignore it
|
||||
if (isHMR) return
|
||||
// Get locale from params
|
||||
const locale = params.lang || defaultLocale
|
||||
if (store.state.locales.indexOf(locale) === -1) {
|
||||
return error({ message: 'This page could not be found.', statusCode: 404 })
|
||||
}
|
||||
// Set locale
|
||||
store.commit('SET_LANG', locale || 'en-US')
|
||||
app.i18n.locale = store.state.locale
|
||||
// If route is /<defaultLocale>/... -> redirect to /...
|
||||
if (locale === defaultLocale && route.fullPath.indexOf('/' + defaultLocale) === 0) {
|
||||
const toReplace = '^/' + defaultLocale + (route.fullPath.indexOf('/' + defaultLocale + '/') === 0 ? '/' : '')
|
||||
const re = new RegExp(toReplace)
|
||||
return redirect(
|
||||
route.fullPath.replace(re, '/')
|
||||
)
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,130 @@
|
|||
import redirectSSL from 'redirect-ssl'
|
||||
import serveStatic from 'serve-static'
|
||||
import {resolve} from "path";
|
||||
const baseUrl = process.env.BASE_URL || 'https://api.lightlimx.live/api'
|
||||
export default {
|
||||
loading: '~/components/Loading/index.vue',
|
||||
serverMiddleware: [
|
||||
// redirectSSL.create({
|
||||
// enabled: process.env.NODE_ENV === 'production'
|
||||
// }),
|
||||
{ path: '/static', handler: serveStatic(__dirname + '/static') }
|
||||
],
|
||||
telemetry:false,
|
||||
publicRuntimeConfig: {
|
||||
baseURL: baseUrl,
|
||||
axios: {
|
||||
baseURL: baseUrl
|
||||
}
|
||||
},
|
||||
env: {
|
||||
baseUrl: process.env.BASE_URL || 'http://localhost:3000',
|
||||
apiUrl: '/api'
|
||||
},
|
||||
alias: {
|
||||
'@': resolve(__dirname),
|
||||
'~': resolve(__dirname),
|
||||
style: resolve(__dirname, './assets/style'),
|
||||
images: resolve(__dirname, './assets/images'),
|
||||
data: resolve(__dirname, './assets/data')
|
||||
},
|
||||
// Global page headers: https://go.nuxtjs.dev/config-head
|
||||
head: {
|
||||
title: 'LightLimX',
|
||||
htmlAttrs: {
|
||||
lang: 'en',
|
||||
},
|
||||
bodyAttrs: {
|
||||
class: 'h5-scroll-bar'
|
||||
},
|
||||
meta: [
|
||||
{ charset: 'utf-8' },
|
||||
//width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no
|
||||
{ name: 'viewport', content: 'width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no,minimal-ui,viewport-fit=cover' },
|
||||
{ hid: 'description', name: 'description', content: '' },
|
||||
{ name: 'format-detection', content: 'telephone=no' }
|
||||
],
|
||||
link: [
|
||||
{ rel: 'icon', type: 'image/x-icon', href: '/favicon.png' }
|
||||
]
|
||||
},
|
||||
|
||||
// Global CSS: https://go.nuxtjs.dev/config-css
|
||||
css: [
|
||||
'~/assets/style/reset.less',
|
||||
'~/assets/style/animate.css',
|
||||
'vant/lib/index.css'
|
||||
],
|
||||
|
||||
// Plugins to run before rendering page: https://go.nuxtjs.dev/config-plugins
|
||||
plugins: [
|
||||
{ src: '~/plugins/remJs.js', mode: 'client' },
|
||||
'@/plugins/vant',
|
||||
'~/plugins/axios.js',
|
||||
'~/plugins/vueTooltip.js',
|
||||
// { src: '~/plugins/vueAnimate.js', mode: 'client' },
|
||||
{ src: '~/plugins/vueClipboard.js', mode: 'client' },
|
||||
{ src: '~/plugins/lottieWeb.js', mode: 'client' },
|
||||
{ src: '~/plugins/svgIcon.js', mode: 'client' },
|
||||
{ src: '~/plugins/wow.js', mode: 'client' },
|
||||
{ src: '~/plugins/element.js', mode: 'client' },
|
||||
],
|
||||
router: {
|
||||
// base: '/assets/',
|
||||
middleware: ['authenticated']
|
||||
},
|
||||
// Auto import components: https://go.nuxtjs.dev/config-components
|
||||
components: true,
|
||||
|
||||
// Modules for dev and build (recommended): https://go.nuxtjs.dev/config-modules
|
||||
buildModules: [
|
||||
],
|
||||
|
||||
// Modules: https://go.nuxtjs.dev/config-modules
|
||||
modules: [
|
||||
['nuxt-svg-sprite-loader', {
|
||||
symbolId: 'icon-[name]'
|
||||
}],
|
||||
'@nuxtjs/axios'
|
||||
],
|
||||
|
||||
// Build Configuration: https://go.nuxtjs.dev/config-build
|
||||
build: {
|
||||
transpile: ['vue-tooltip'],
|
||||
extractCSS: {
|
||||
// allChunks: true,
|
||||
filename: '[name].css',
|
||||
chunkFilename: '[id].css',
|
||||
ignoreOrder: true
|
||||
},
|
||||
babel: {
|
||||
plugins: [
|
||||
[
|
||||
'component',
|
||||
{
|
||||
'libraryName': 'element-ui',
|
||||
// 'style': false // 不引入对应的css文件
|
||||
'styleLibraryName': 'theme-chalk'
|
||||
}
|
||||
]
|
||||
]
|
||||
},
|
||||
extend (config, { isDev, isClient }) {
|
||||
if (isClient) {
|
||||
// 排除 nuxt 原配置的影响,Nuxt 默认有vue-loader,会处理svg,img等
|
||||
// 找到匹配.svg的规则,然后将存放svg文件的目录排除
|
||||
const svgRule = config.module.rules.find(rule => rule.test.test('.svg'))
|
||||
svgRule.exclude = [resolve('assets/svg')]
|
||||
// 添加loader规则
|
||||
}
|
||||
config.module.rules.push({
|
||||
test: /\.(mpg|ts|pm4)$/i,
|
||||
loader: 'url-loader',
|
||||
options: {
|
||||
outputPath: '/static/video/',
|
||||
publicPath: '/static/video/'
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,49 @@
|
|||
{
|
||||
"name": "demo",
|
||||
"version": "1.0.0",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"dev": "nuxt",
|
||||
"build": "nuxt build",
|
||||
"start": "nuxt start",
|
||||
"generate": "nuxt generate",
|
||||
"pm2": "pm2 start",
|
||||
"deylop": "node ./script/deploy/index.js"
|
||||
},
|
||||
"dependencies": {
|
||||
"@nuxtjs/axios": "^5.13.6",
|
||||
"animate.css": "^4.1.1",
|
||||
"core-js": "^3.19.3",
|
||||
"element-ui": "^2.15.6",
|
||||
"gsap": "^3.9.1",
|
||||
"jquery": "^3.6.0",
|
||||
"js-cookie": "^3.0.1",
|
||||
"nuxt": "^2.15.8",
|
||||
"vant": "^2.12.36",
|
||||
"vue": "^2.6.14",
|
||||
"vue-pagination-2": "^3.0.91",
|
||||
"vue-server-renderer": "^2.6.14",
|
||||
"vue-template-compiler": "^2.6.14",
|
||||
"webpack": "^4.46.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"archiver": "^4.0.1",
|
||||
"babel-plugin-component": "^1.1.1",
|
||||
"chalk": "^4.0.0",
|
||||
"crypto-js": "^4.1.1",
|
||||
"fs-extra": "^9.0.0",
|
||||
"less": "^4.1.2",
|
||||
"less-loader": "^7.1.0",
|
||||
"lottie-web": "^5.8.1",
|
||||
"lottie-web-vue": "^1.2.1",
|
||||
"moment": "^2.29.1",
|
||||
"node-cmd": "^5.0.0",
|
||||
"node-ssh": "^8.0.0",
|
||||
"nuxt-svg-sprite-loader": "^2.0.7",
|
||||
"redirect-ssl": "^3.0.0",
|
||||
"svg-sprite-loader": "^6.0.11",
|
||||
"v-tooltip": "^2.1.3",
|
||||
"vue-animate-plugin": "^1.0.1",
|
||||
"vue-clipboard2": "^0.3.3"
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,229 @@
|
|||
<template>
|
||||
<div class="fullpage-container">
|
||||
<SectionView>
|
||||
<div class="LP-login-conten">
|
||||
<h1>Sign In</h1>
|
||||
<div class="LP-login-input-conten">
|
||||
<div class="LP-login-input"><p>Email address <span style="color:#F49F00">*</span></p><input type="text" name="" id=""></div>
|
||||
<div class="LP-login-input"><p class="Password">Password<span style="color:#F49F00">*</span></p><input class="password-font" type="password" name="" id=""></div></div>
|
||||
<div class="LP-login-confirm-conten">
|
||||
<div class="confirm">
|
||||
<span>LOGIN</span>
|
||||
</div>
|
||||
<p>Forgot password?</p>
|
||||
</div>
|
||||
</div>
|
||||
</SectionView>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import animateMixin from '../../utils/animateMixin'
|
||||
import SectionView from "../../components/SectionView/index";
|
||||
export default {
|
||||
name: 'IndexPage',
|
||||
layout:'index',
|
||||
components:{
|
||||
SectionView
|
||||
},
|
||||
mixins:[animateMixin],
|
||||
head() {
|
||||
return {
|
||||
title: this.title,
|
||||
meta: [
|
||||
{
|
||||
hid: 'description',
|
||||
name: 'description',
|
||||
content: 'My custom description'
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
async asyncData(data) {
|
||||
const { params, $http }=data;
|
||||
// const post = await $http.$get(`https://api.nuxtjs.dev/posts/${params.id}`)
|
||||
return { post:'121' }
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
title:'LightLimX-LPLogin',
|
||||
|
||||
opts: {
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.LP-login-conten{
|
||||
margin-top: 1.9rem;
|
||||
h1{
|
||||
font-size: 0.36rem;
|
||||
font-family: Manrope;
|
||||
font-weight: bold;
|
||||
color: #302D2C;
|
||||
opacity: 1;
|
||||
text-align: center;
|
||||
}
|
||||
.LP-login-input-conten{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 100%;
|
||||
margin-top: 1.2rem;
|
||||
.LP-login-input{
|
||||
margin: 0 auto;
|
||||
input{
|
||||
padding-left: 0.2rem;
|
||||
font-size: 0.2rem;
|
||||
font-family: Manrope;
|
||||
font-weight: 400;
|
||||
width: 4.3rem;
|
||||
height: 0.58rem;
|
||||
display: block;
|
||||
background: #FFFFFF;
|
||||
border: 1px solid #9B9B9B;
|
||||
opacity: 1;
|
||||
border-radius: 0.1rem;
|
||||
margin-top: 0.15rem;
|
||||
}
|
||||
.password-font{
|
||||
font-family: none;
|
||||
}
|
||||
input:focus {
|
||||
border: 1px solid #F49F00;
|
||||
box-shadow: 0px 3px 6px rgba(244, 159, 0, 0.12);
|
||||
}
|
||||
p{
|
||||
font-size: 0.16rem;
|
||||
font-family: Manrope;
|
||||
font-weight: 400;
|
||||
color: #302D2C;
|
||||
opacity: 1;
|
||||
}
|
||||
.Password{
|
||||
margin-top: 0.35rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
.LP-login-confirm-conten{
|
||||
margin-top: 0.95rem;
|
||||
.confirm{
|
||||
margin: 0 auto;
|
||||
cursor: pointer;
|
||||
width: 2.42rem;
|
||||
height: 0.58rem;
|
||||
background: #F49F00;
|
||||
opacity: 1;
|
||||
border-radius: 0.1rem;
|
||||
span{
|
||||
display: block;
|
||||
font-size: 0.2rem;
|
||||
font-family: Manrope;
|
||||
font-weight: 400;
|
||||
line-height: 0.58rem;
|
||||
color: #302D2C;
|
||||
opacity: 1;
|
||||
text-align: center;
|
||||
|
||||
}
|
||||
}
|
||||
p{
|
||||
text-align: center;
|
||||
font-size: 0.14rem;
|
||||
font-family: Manrope;
|
||||
font-weight: 400;
|
||||
color: #000000;
|
||||
opacity: 1;
|
||||
margin-top: 0.25rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
.LP-login-conten{
|
||||
margin-top: 1.9rem;
|
||||
h1{
|
||||
font-size: 0.6rem;
|
||||
font-family: Manrope;
|
||||
font-weight: bold;
|
||||
color: #302D2C;
|
||||
opacity: 1;
|
||||
text-align: center;
|
||||
}
|
||||
.LP-login-input-conten{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 100%;
|
||||
margin-top: 0.5rem;
|
||||
.LP-login-input{
|
||||
margin: 0 auto;
|
||||
input{
|
||||
padding-left: 0.2rem;
|
||||
font-size: 0.2rem;
|
||||
font-family: Manrope;
|
||||
font-weight: 400;
|
||||
width: 6.5rem;
|
||||
height: 0.8rem;
|
||||
display: block;
|
||||
background: #FFFFFF;
|
||||
border: 1px solid #9B9B9B;
|
||||
opacity: 1;
|
||||
border-radius: 0.1rem;
|
||||
margin-top: 0.15rem;
|
||||
}
|
||||
.password-font{
|
||||
font-family: none;
|
||||
}
|
||||
input:focus {
|
||||
border: 1px solid #F49F00;
|
||||
box-shadow: 0px 3px 6px rgba(244, 159, 0, 0.12);
|
||||
}
|
||||
p{
|
||||
font-size: 0.3rem;
|
||||
font-family: Manrope;
|
||||
font-weight: 400;
|
||||
color: #302D2C;
|
||||
opacity: 1;
|
||||
}
|
||||
.Password{
|
||||
margin-top: 0.35rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
.LP-login-confirm-conten{
|
||||
margin-top: 0.95rem;
|
||||
.confirm{
|
||||
margin: 0 auto;
|
||||
cursor: pointer;
|
||||
width: 5.18rem;
|
||||
height: 0.96rem;
|
||||
background: #F49F00;
|
||||
opacity: 1;
|
||||
border-radius: 0.1rem;
|
||||
span{
|
||||
display: block;
|
||||
font-size: 0.38rem;
|
||||
font-family: Manrope;
|
||||
font-weight: bold;
|
||||
line-height: 0.96rem;
|
||||
color: #302D2C;
|
||||
opacity: 1;
|
||||
text-align: center;
|
||||
|
||||
}
|
||||
}
|
||||
p{
|
||||
text-align: center;
|
||||
font-size: 0.24rem;
|
||||
font-family: Manrope;
|
||||
font-weight: 400;
|
||||
color: #000000;
|
||||
opacity: 1;
|
||||
margin-top: 0.25rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
|
|
@ -0,0 +1,115 @@
|
|||
<template>
|
||||
<div class="fullpage-container">
|
||||
|
||||
<section-view :css-style="{'background-color':'#fff'}">
|
||||
<div class="Details-conten-img">
|
||||
<img v-lazy="assetsUri('images/ContactUs/Details.png')" alt="">
|
||||
<div class="Details-text">
|
||||
<p>Thank you for submitting</p>
|
||||
<p>the information.</p>
|
||||
<p>We will contact you as soon as possible.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</section-view>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import animateMixin from '../../utils/animateMixin'
|
||||
import SectionView from "../../components/SectionView/index";
|
||||
import {assetsUri} from '~/utils/index.js'
|
||||
export default {
|
||||
name: 'IndexPage',
|
||||
layout:'index',
|
||||
components:{
|
||||
SectionView
|
||||
},
|
||||
mixins:[animateMixin],
|
||||
head() {
|
||||
return {
|
||||
title: this.title,
|
||||
meta: [
|
||||
{
|
||||
hid: 'description',
|
||||
name: 'description',
|
||||
content: 'My custom description'
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
async asyncData(data) {
|
||||
const { params, $http }=data;
|
||||
// const post = await $http.$get(`https://api.nuxtjs.dev/posts/${params.id}`)
|
||||
return { post:'121' }
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
assetsUri,
|
||||
title:'LightLimX',
|
||||
|
||||
opts: {
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.Details-conten-img{
|
||||
margin-top: 0.96rem;
|
||||
padding-top: 2rem;
|
||||
img{
|
||||
display: block;
|
||||
width: 20%;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.Details-text{
|
||||
margin-top: .6rem;
|
||||
p{
|
||||
font-size: 0.28rem;
|
||||
font-family: Manrope;
|
||||
font-weight: bold;
|
||||
line-height: 0.5rem;
|
||||
color: #302D2C;
|
||||
opacity: 1;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@media screen and (max-width: 768px){
|
||||
.section-view{
|
||||
min-height: 0vh;
|
||||
}
|
||||
.Details-conten-img{
|
||||
margin-top: 0.96rem;
|
||||
padding-top: 2rem;
|
||||
padding-bottom: 3rem;
|
||||
img{
|
||||
display: block;
|
||||
width: 30%;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.Details-text{
|
||||
margin-top: .6rem;
|
||||
p{
|
||||
font-size: 0.28rem;
|
||||
font-family: Manrope;
|
||||
font-weight: bold;
|
||||
line-height: 0.5rem;
|
||||
color: #302D2C;
|
||||
opacity: 1;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
</style>
|
||||
|
|
@ -0,0 +1,487 @@
|
|||
<template>
|
||||
<div class="fullpage-container">
|
||||
<section-view :css-style="{'background-color':'#000'}" v-lazy:background-image="assetsUri('images/ContactUs/ContactUs_banner.png')" class="contactUs-section-view">
|
||||
<div class="contactUs-div wow fadeInUp">
|
||||
<img v-lazy="assetsUri('images/ContactUs/ContactUs_c.png')" alt="">
|
||||
<h2 class="contactUs-div-t">Contact Us</h2>
|
||||
</div>
|
||||
</section-view>
|
||||
<section-view :css-style="{'background-color':'#fff'}">
|
||||
<div class="contactUs-Why-conten wow fadeInUpBig" data-wow-delay=".8s" >
|
||||
<h1 >Why Partner with us?</h1><p >The original intention of LightLimX is "Create miracles and lead the future together with entrepreneurs". We are investors and entrepreneurs,full of passion, active exploration and persistence in entrepreneurship.Such spirit makes LightLimX and investees the most solid partners. Such core value is also reflected in the value we live by.</p>
|
||||
</div>
|
||||
<div class="contactUs-Why-brie wow fadeInUpBig" data-wow-delay=".8s" >
|
||||
<p >Please contact us if you have an innovative idea.</p>
|
||||
<p >We are willing to turn your dream into real business with our support.</p>
|
||||
</div>
|
||||
<div class="situation-h1 wow fadeInUpBig">Email:info@lightlimx.com</div>
|
||||
|
||||
|
||||
<div class="LP-login-input-conten ">
|
||||
<div class="LP-login-input wow fadeInUpBig" data-wow-delay=".3s" >
|
||||
<p>Name<span style="color:#F49F00">*</span></p>
|
||||
<input class="inputClass" v-model="from.name" type="text" name="" id="">
|
||||
</div>
|
||||
<div class="LP-login-input wow fadeInUpBig" data-wow-delay=".3s">
|
||||
<p class="Password">mail<span style="color:#F49F00">*</span></p>
|
||||
<input v-model="from.email" class="password-font inputClass" name="" id="">
|
||||
</div>
|
||||
<div class="LP-login-input wow fadeInUpBig" data-wow-delay=".3s">
|
||||
<p class="Password">Organization<span style="color:#F49F00">*</span></p>
|
||||
<input v-model="from.company" class="password-font inputClass" name="" id="">
|
||||
</div>
|
||||
|
||||
<div class="LP-login-input wow fadeInUpBig" data-wow-delay=".3s">
|
||||
<p class="Password">Project<span style="color:#F49F00">*</span></p>
|
||||
<public-select @select="handleSelect" class="password-font inputClass" :select.sync="from.project_id" :options="staticData">
|
||||
<div class="svg-icon-wrap" style="padding-right: .35rem">
|
||||
<svg-icon icon-class="cuarr"></svg-icon>
|
||||
</div>
|
||||
</public-select>
|
||||
</div>
|
||||
<div class="LP-login-input wow fadeInUpBig" data-wow-delay=".3s">
|
||||
<p class="Password">More informationt<span style="color:#F49F00">*</span></p>
|
||||
<div class="input-btn-conten">
|
||||
<van-field
|
||||
v-model="from.information"
|
||||
class="input-btn-conten-textarea"
|
||||
rows="1"
|
||||
autosize
|
||||
label=""
|
||||
type="textarea"
|
||||
placeholder=""
|
||||
/>
|
||||
<div class="input-btn-conten-box">
|
||||
<img v-lazy="assetsUri('images/ContactUs/file.png')" alt="">
|
||||
<van-uploader :after-read="onRead" :accept="'.pdf'">
|
||||
<span class="btnx_hover">{{file_name}}</span>
|
||||
</van-uploader>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="LP-login-input-btnFile wow fadeInUp" data-wow-delay=".3s">
|
||||
<span @click="contactUsBtn">Submit</span>
|
||||
</div>
|
||||
</section-view>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import animateMixin from '../../utils/animateMixin'
|
||||
import SectionView from "../../components/SectionView/index";
|
||||
import {assetsUri} from '~/utils/index.js'
|
||||
import PublicSelect from "../../components/PublicSelect/index";
|
||||
export default {
|
||||
name: 'IndexPage',
|
||||
layout:'index',
|
||||
mixins:[animateMixin],
|
||||
components:{
|
||||
PublicSelect,
|
||||
SectionView
|
||||
},
|
||||
head() {
|
||||
return {
|
||||
title: this.title,
|
||||
meta: [
|
||||
{
|
||||
hid: 'description',
|
||||
name: 'description',
|
||||
content: 'My custom description'
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
async asyncData(data) {
|
||||
const { params, $http }=data;
|
||||
// const post = await $http.$get(`https://api.nuxtjs.dev/posts/${params.id}`)
|
||||
return { post:'121' }
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
staticData:[],
|
||||
from:{
|
||||
name:'',
|
||||
email:'',
|
||||
company:'',
|
||||
project_id:'',
|
||||
logo:'',
|
||||
information:''
|
||||
},
|
||||
file_name:'Attachment Files(.PDF)',
|
||||
assetsUri,
|
||||
title:'LightLimX-Contract Us',
|
||||
opts: {
|
||||
|
||||
}
|
||||
}
|
||||
},
|
||||
created(){
|
||||
this.handleLists()
|
||||
},
|
||||
methods:{
|
||||
handleSelect(item){
|
||||
this.from.project_id=item.id
|
||||
},
|
||||
async handleLists(){
|
||||
const {baseURL}=this.$config;
|
||||
const res= await this.$axios(baseURL+'/projectType/index?page=1&size=100')
|
||||
if(res.status!==200){
|
||||
return this.$toast(res.data.msg)
|
||||
}
|
||||
const {content,totalElements}=res.data
|
||||
this.staticData=content.map((item)=>{return {...item,id:item.id.toString()}});
|
||||
},
|
||||
// 文件提交
|
||||
contactUsBtn(){
|
||||
if(this.from.name == ''){
|
||||
return this.$toast('Please enter name');
|
||||
}
|
||||
if(this.from.email == ''){
|
||||
return this.$toast('Please enter mail');
|
||||
}
|
||||
if(this.from.company == ''){
|
||||
return this.$toast('Please enter Organization');
|
||||
}
|
||||
if(this.from.project_id == ''){
|
||||
return this.$toast('Please select Project');
|
||||
}
|
||||
if(this.from.information==''){
|
||||
return this.$toast('Please enter More informationt text');
|
||||
}
|
||||
if(this.from.logo == ''){
|
||||
return this.$toast('Please enter More informationt');
|
||||
}
|
||||
const {baseURL}=this.$config;
|
||||
console.log('this.form',this.from)
|
||||
this.$axios.post(baseURL+'/contact/save', this.from, {headers: {
|
||||
'Content-Type': 'application/json'
|
||||
}}).then(res => {
|
||||
this.$toast('Submitted successfully');
|
||||
setTimeout(() => {
|
||||
this.$router.push('/contact/one')
|
||||
}, 500);
|
||||
}).catch(err => {
|
||||
alert(err)
|
||||
})
|
||||
},
|
||||
// 返回布尔值
|
||||
onRead(file) {
|
||||
const {baseURL}=this.$config;
|
||||
let fd = new FormData()
|
||||
fd.append('file', file.file)
|
||||
this.$axios.post(baseURL+'/uploads/store', fd, {headers: {
|
||||
'Content-Type': 'multipart/form-data'
|
||||
}}).then(res => {
|
||||
this.file_name = res.data.data.name;
|
||||
this.from.logo= res.data.data.image.uri;
|
||||
}).catch(err => {
|
||||
alert(err)
|
||||
})
|
||||
},
|
||||
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.contactUs-section-view{
|
||||
background-position: center bottom;
|
||||
background-size: 100% 100%;
|
||||
background-repeat: no-repeat;
|
||||
margin-top: 0.95rem;
|
||||
min-height:6.25rem !important;
|
||||
.contactUs-div{
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
padding-top: 1.6rem;
|
||||
img{
|
||||
display: block;
|
||||
width: 15%;
|
||||
}
|
||||
.contactUs-div-t{
|
||||
font-size: 0.72rem;
|
||||
font-family: Manrope;
|
||||
font-weight: bold;
|
||||
color: #FFFFFF;
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
.contactUs-Why-conten{
|
||||
padding-top: 1.5rem;
|
||||
h1{
|
||||
font-size: 0.48rem;
|
||||
font-family: Manrope;
|
||||
font-weight: bold;
|
||||
color: #302D2C;
|
||||
text-align: center;
|
||||
margin-bottom: 0.7rem;
|
||||
}
|
||||
p{
|
||||
font-size: 0.2rem;
|
||||
font-family: Manrope;
|
||||
font-weight: 400;
|
||||
color: #302D2C;
|
||||
text-align: center;
|
||||
line-height: 0.4rem;
|
||||
}
|
||||
}
|
||||
.contactUs-Why-brie{
|
||||
margin-top: 1rem;
|
||||
p{
|
||||
text-align: center;
|
||||
font-size: 0.2rem;
|
||||
font-family: Manrope;
|
||||
font-weight: bold;
|
||||
line-height: 0.4rem;
|
||||
color: #302D2C;
|
||||
}
|
||||
}
|
||||
.situation-h1{
|
||||
margin-top: 1.5rem;
|
||||
font-size: 0.62rem;
|
||||
font-family: Manrope;
|
||||
font-weight: bold;
|
||||
color: #302D2C;
|
||||
cursor: pointer;
|
||||
text-align: center;
|
||||
}
|
||||
.situation-h1:hover{
|
||||
/*text-shadow: 0 0 5px #FF0000, 0 0 5px #6bf403;*/
|
||||
text-stroke:1px #F49F00;
|
||||
-webkit-text-stroke:1px #F49F00;
|
||||
color: #Fff;
|
||||
}
|
||||
.LP-login-input-conten{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 100%;
|
||||
margin-top: 2rem;
|
||||
.LP-login-input{
|
||||
margin: 0 auto;
|
||||
.inputClass{
|
||||
padding-left: 0.2rem;
|
||||
font-size: 0.2rem;
|
||||
font-family: Manrope;
|
||||
font-weight: 400;
|
||||
width: 8.8rem;
|
||||
height: 0.58rem;
|
||||
display: block;
|
||||
background: #FFFFFF;
|
||||
border: 1px solid #9B9B9B;
|
||||
opacity: 1;
|
||||
border-radius: 0.1rem;
|
||||
margin-top: 0.15rem;
|
||||
}
|
||||
select{
|
||||
outline: none;
|
||||
padding: 0 .2rem;
|
||||
appearance:none;
|
||||
-moz-appearance:none;
|
||||
-webkit-appearance:none;
|
||||
font-size: 0.2rem;
|
||||
font-family: Manrope;
|
||||
font-weight: 400;
|
||||
height: 0.58rem;
|
||||
width: 9rem;
|
||||
margin-top: 0.15rem;
|
||||
border-radius: 0.1rem;
|
||||
border: solid 1px #9B9B9B;
|
||||
background: url("~/static/images/ContactUs/arrow.png") no-repeat 95% center !important;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
select::-ms-expand { display: none; }
|
||||
select:focus{
|
||||
border: 1px solid #F49F00;
|
||||
box-shadow: 0px 3px 6px rgba(244, 159, 0, 0.12);
|
||||
}
|
||||
.password-font{
|
||||
// font-family: none;
|
||||
}
|
||||
input:focus {
|
||||
border: 1px solid #F49F00;
|
||||
box-shadow: 0px 3px 6px rgba(244, 159, 0, 0.12);
|
||||
}
|
||||
p{
|
||||
font-size: 0.16rem;
|
||||
font-family: Manrope;
|
||||
font-weight: 400;
|
||||
color: #302D2C;
|
||||
opacity: 1;
|
||||
}
|
||||
.Password{
|
||||
margin-top: 0.35rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
.input-btn-conten{
|
||||
margin-top: 0.15rem;
|
||||
width: 9rem;
|
||||
min-height: 1.94rem;
|
||||
border: 1px solid #9B9B9B;
|
||||
border-radius: 0.1rem;
|
||||
display: flex;
|
||||
position: relative;
|
||||
&-textarea{
|
||||
padding:.2rem .2rem 1rem;
|
||||
background-color: transparent;
|
||||
font-size: 0.2rem;
|
||||
font-family: Manrope;
|
||||
font-weight: 400;
|
||||
&:after{
|
||||
border-bottom: 0;
|
||||
}
|
||||
}
|
||||
.input-btn-conten-box{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 0.2rem;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
img{
|
||||
margin-left: 0.25rem;
|
||||
width: 10%;
|
||||
}
|
||||
span{
|
||||
font-size: 0.2rem;
|
||||
font-family: Manrope;
|
||||
font-weight: 400;
|
||||
color: #302D2C;
|
||||
opacity: 1;
|
||||
cursor: pointer;
|
||||
margin-left: 0.15rem;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.LP-login-input-btnFile{
|
||||
margin-top: 1.2rem;
|
||||
padding-bottom: 2.2rem;
|
||||
span{
|
||||
margin: 0 auto;
|
||||
cursor: pointer;
|
||||
display: block;
|
||||
width: 3.5rem;
|
||||
height: .6rem;
|
||||
background: #F49F00;
|
||||
border-radius: .1rem;
|
||||
text-align: center;
|
||||
line-height: .6rem;
|
||||
font-size: .24rem;
|
||||
font-family: Manrope;
|
||||
font-weight: bold;
|
||||
color: #302D2C;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@media screen and (max-width: 768px){
|
||||
.contactUs-section-view{
|
||||
margin-top: 0.5rem;
|
||||
background-image: url('~/static/images/ContactUs/ContactUs_banner_h5.jpg') !important;
|
||||
}
|
||||
.contactUs-section-view .contactUs-div img{
|
||||
width: 28%;
|
||||
}
|
||||
.contactUs-Why-conten{
|
||||
padding: 0 0.3rem;
|
||||
padding-top: 0.5rem;
|
||||
}
|
||||
.contactUs-Why-conten h1{
|
||||
font-size: 0.6rem;
|
||||
}
|
||||
.contactUs-Why-conten p{
|
||||
font-size: 0.24rem;
|
||||
font-family: Manrope;
|
||||
font-weight: 400;
|
||||
line-height: 0.35rem;
|
||||
color: #302D2C;
|
||||
opacity: 1;
|
||||
}
|
||||
.contactUs-Why-brie{
|
||||
padding: 0 0.3rem;
|
||||
}
|
||||
.contactUs-Why-brie p{
|
||||
font-size: 0.3rem;
|
||||
font-family: Manrope;
|
||||
font-weight: bold;
|
||||
line-height: 0.4rem;
|
||||
color: #302D2C;
|
||||
opacity: 1;
|
||||
}
|
||||
.situation-h1{
|
||||
font-size: 0.52rem;
|
||||
}
|
||||
.LP-login-input-conten .LP-login-input{
|
||||
width: 85%;
|
||||
}
|
||||
.LP-login-input-conten .LP-login-input .inputClass{
|
||||
width: 100%;
|
||||
height: 0.8rem;
|
||||
}
|
||||
|
||||
.LP-login-input-conten{
|
||||
margin-top: 1rem;
|
||||
}
|
||||
.LP-login-input-conten .LP-login-input p{
|
||||
font-size: 0.3rem;
|
||||
font-family: Manrope;
|
||||
font-weight: 400;
|
||||
}
|
||||
.input-btn-conten{
|
||||
width: 100%;
|
||||
padding-right: 0.2rem;
|
||||
}
|
||||
.LP-login-input-btnFile{
|
||||
margin-top: 1rem;
|
||||
padding-bottom: 1rem;
|
||||
}
|
||||
.input-btn-conten .input-btn-conten-box span{
|
||||
font-size: 0.22rem;
|
||||
}
|
||||
.LP-login-input-btnFile span{
|
||||
|
||||
width: 70%;
|
||||
height: 0.96rem;
|
||||
|
||||
line-height: 0.96rem;
|
||||
font-size: 0.38rem;
|
||||
|
||||
}
|
||||
select{
|
||||
height: 0.96rem !important;
|
||||
width: 104% !important;
|
||||
}
|
||||
|
||||
.LP-login-input-conten .LP-login-input input{
|
||||
font-size: 0.24rem;
|
||||
}
|
||||
.LP-login-input-conten .LP-login-input select{
|
||||
font-size: 0.24rem;
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
<style lang="less">
|
||||
.van-uploader:hover span.btnx_hover{
|
||||
color: #F49F00;
|
||||
text-decoration: underline;
|
||||
font-size: .2rem;
|
||||
font-family: Manrope;
|
||||
font-weight: 400;
|
||||
color: #F49F00;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,310 @@
|
|||
<template>
|
||||
<div class="fullpage-container">
|
||||
<section-view :css-style="{'background-color':bgColors[0],'transition': 'background-color .3s ease-in'}">
|
||||
<section-limit-x >
|
||||
</section-limit-x>
|
||||
</section-view>
|
||||
<about-us id="aboutUs" :css-style="{'background-color':activeColor,'transition': 'background-color .3s ease-in'}" >
|
||||
<lottie-animation
|
||||
:style="{'opacity':activeColor===bgColors[1]?'1':'0'}"
|
||||
:loop="true"
|
||||
:speed="1000"
|
||||
:autoPlay="true"
|
||||
ref="anim"
|
||||
:animationData="require('@/assets/data/q3.json')"
|
||||
/>
|
||||
</about-us>
|
||||
<focus-areas id="focusAreas" :css-style="{backgroundColor:bgColors[2],'transition': 'background-color .3s ease-in'}"></focus-areas>
|
||||
<our-portfolio id="ourPortfolio" :css-style="{'position':'relative','z-index':'1',backgroundColor:activeColor2,'transition': 'background-color .3s ease-in'}">
|
||||
<our-portfolio-item :style="{'opacity':activeColor2==='#fff'?'1':'0'}" v-for="(item) in portfolios" :key="item.title" :item="item"></our-portfolio-item>
|
||||
</our-portfolio>
|
||||
<div id="portfolio" :style="{'background-color':bgColors[4],'transition': 'background-color .3s ease-in'}">
|
||||
<div class="home-wrap">
|
||||
<portfolio :position="position" :top="top" :bottom="bottom" :staticData="portfolio"></portfolio>
|
||||
<partners :partners="partners" :showPartners="showPartners" ></partners>
|
||||
<our-founders><banner :images="banners"></banner></our-founders>
|
||||
</div>
|
||||
</div>
|
||||
<section-view id="situation" :css-style="{'background-color':activeColor3,'transition': 'background-color .3s ease-in'}">
|
||||
<situation :style="{'opacity':activeColor3=='#fff'?'1':'0'}">
|
||||
<email-footer ></email-footer>
|
||||
</situation>
|
||||
</section-view>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import LottieAnimation from 'lottie-web-vue'
|
||||
import SectionLimitX from "../components/SectionLimitX/index";
|
||||
import AboutUs from "../components/AboutUs/index";
|
||||
import FocusAreas from "../components/FocusAreas/index";
|
||||
import OurPortfolio from "../components/OurPortfolio/index";
|
||||
import {portfolios} from "../assets/js/static";
|
||||
import OurPortfolioItem from "../components/OurPortfolioItem/index";
|
||||
import SectionView from "../components/SectionView/index";
|
||||
import Portfolio from "../components/Portfolio/index";
|
||||
import Partners from "../components/Partners/index";
|
||||
import OurFounders from "../components/OurFounders/index";
|
||||
import Banner from "../components/Banners/index";
|
||||
import Situation from "../components/Situation/index";
|
||||
import EmailFooter from "../components/EmailFooter/index";
|
||||
import {hanldePortflioData} from "../utils/filter";
|
||||
import animateMixin from '../utils/animateMixin'
|
||||
export default {
|
||||
name: 'IndexPage',
|
||||
layout:'index',
|
||||
mixins:[animateMixin],
|
||||
components:{
|
||||
EmailFooter,
|
||||
Situation,
|
||||
Banner,
|
||||
OurFounders,
|
||||
Partners,
|
||||
Portfolio,
|
||||
SectionView,
|
||||
OurPortfolioItem,
|
||||
OurPortfolio,
|
||||
FocusAreas,
|
||||
AboutUs,
|
||||
SectionLimitX,
|
||||
LottieAnimation
|
||||
},
|
||||
head() {
|
||||
return {
|
||||
|
||||
title: this.title,
|
||||
meta: [
|
||||
{
|
||||
hid: 'description',
|
||||
name: 'description',
|
||||
content: 'My custom description'
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
created(){
|
||||
this.activeColor=this.bgColors[1]
|
||||
this.activeColor2=this.bgColors[3]
|
||||
this.activeColor3=this.bgColors[5]
|
||||
},
|
||||
mounted(){
|
||||
this.handleScroll()
|
||||
window.addEventListener('scroll',this.handleScroll)
|
||||
|
||||
},
|
||||
async asyncData(config) {
|
||||
const {$axios,$config,payload}=config;
|
||||
if(payload){
|
||||
return
|
||||
}
|
||||
// const {baseURL}=$config
|
||||
// const result=await Promise.all([
|
||||
// $axios.$get(`${baseURL}/partners/index?page=1&size=10`),
|
||||
// $axios.$get(`${baseURL}/portfolio/index?page=1&size=99`),
|
||||
// $axios.$get(`${baseURL}/carousel/index?page=1&size=10`),
|
||||
// ])
|
||||
// if(!result.length){
|
||||
// return {}
|
||||
// }
|
||||
// console.log(result[1].content,'result',result[2].content)
|
||||
// if(!result[1].content){
|
||||
// return {partners:result[0].content, banners:result[2].content,}
|
||||
// }
|
||||
// const myPortfolio=await hanldePortflioData(result[1].content)
|
||||
// return {partners:result[0].content, banners:result[2].content,portfolio:myPortfolio}
|
||||
},
|
||||
methods:{
|
||||
handleScroll(){
|
||||
let scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop;
|
||||
// const opacity = Math.abs(Math.round(scrollTop)) / 300;
|
||||
const clientWidth=document.documentElement.clientWidth;
|
||||
if(clientWidth>768){
|
||||
if(scrollTop>300){
|
||||
this.activeColor=this.bgColors[1]
|
||||
}else if(scrollTop<=300){
|
||||
this.activeColor=this.bgColors[0]
|
||||
}
|
||||
}else{
|
||||
this.activeColor=this.bgColors[1]
|
||||
}
|
||||
if(clientWidth<751){
|
||||
this.position='sticky'
|
||||
this.top='0'
|
||||
this.bottom='initial';
|
||||
return
|
||||
}
|
||||
const focusAreasDom= document.getElementById('focusAreas');
|
||||
const ourPortfolioDom= document.getElementById('ourPortfolio');
|
||||
const situationDom= document.getElementById('situation');
|
||||
const focusAreasSetTop=focusAreasDom.offsetTop;
|
||||
const ourPortfolioDomSetTop=ourPortfolioDom.offsetTop;
|
||||
const situationDomTop=situationDom.offsetTop;
|
||||
if(scrollTop>(focusAreasSetTop-300)){
|
||||
this.activeColor=this.bgColors[0]
|
||||
this.activeColor2=this.bgColors[4]
|
||||
}
|
||||
if(scrollTop>(ourPortfolioDomSetTop-300)){
|
||||
this.activeColor2='#fff'
|
||||
}
|
||||
if(scrollTop<(situationDomTop-300)){
|
||||
this.activeColor3=this.bgColors[4]
|
||||
}
|
||||
if(scrollTop>(situationDomTop-300)){
|
||||
this.activeColor3='#fff'
|
||||
}
|
||||
// else if(scrollTop<=300){
|
||||
// this.activeColor=this.bgColors[0]
|
||||
// }
|
||||
const portfolioDom= document.getElementById('iPortfolio');
|
||||
const portfolioOffSetTop=portfolioDom.offsetTop;
|
||||
|
||||
const portfolioHeight=portfolioDom.offsetHeight;
|
||||
const partnersDom= document.getElementById('partners');
|
||||
const partnersSetTop=partnersDom.offsetTop;
|
||||
this.showPartners=scrollTop>(partnersSetTop-300)
|
||||
const layoutHeight= document.getElementById('layout-header').offsetHeight;
|
||||
const ballHeight= document.getElementById('ball').offsetHeight;
|
||||
const portfolioTop=portfolioOffSetTop;
|
||||
if(scrollTop>portfolioTop){
|
||||
if(scrollTop>(portfolioHeight+portfolioTop-ballHeight)){
|
||||
this.position='absolute'
|
||||
this.bottom=0+'px';
|
||||
this.top='initial';
|
||||
return;
|
||||
}
|
||||
this.position='fixed'
|
||||
this.top=layoutHeight+'px';
|
||||
this.bottom='initial';
|
||||
}else if(scrollTop<=portfolioTop){
|
||||
this.position='absolute'
|
||||
this.top='0'
|
||||
this.bottom='initial';
|
||||
}
|
||||
// console.log(portfolioTop,'offSetTop',scrollTop,'clientWidth')
|
||||
}
|
||||
},
|
||||
destroyed(){
|
||||
window.removeEventListener('scroll',this.handleScroll)
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
top:'0',
|
||||
bottom:'initial',
|
||||
position:'sticky',
|
||||
activeColor:'#2E2C2C',
|
||||
activeColor2:'#2E2C2C',
|
||||
activeColor3:'#2E2C2C',
|
||||
showPartners:false,
|
||||
bgColors:[
|
||||
'#2E2C2C','#fff','#000','#fff','#292727','#fff'
|
||||
],
|
||||
partners:[
|
||||
{
|
||||
logo:'images/partners/组 764@2x.png',
|
||||
}, {
|
||||
logo:'images/partners/组 761@2x.png',
|
||||
}, {
|
||||
logo:'images/partners/组 762@2x.png',
|
||||
}, {
|
||||
logo:'images/partners/组 763@2x.png',
|
||||
}, {
|
||||
logo:'images/partners/组 756@2x.png',
|
||||
}, {
|
||||
logo:'images/partners/组 757@2x.png',
|
||||
}, {
|
||||
logo:'images/partners/组 758@2x.png',
|
||||
}, {
|
||||
logo:'images/partners/组 759@2x.png',
|
||||
}, {
|
||||
logo:'images/partners/组 755@2x.png',
|
||||
}, {
|
||||
logo:'images/partners/组 752@2x.png',
|
||||
}, {
|
||||
logo:'images/partners/组 753@2x.png',
|
||||
}, {
|
||||
logo:'images/partners/组 754@2x.png',
|
||||
}, {
|
||||
logo:'images/partners/组 751@2x.png',
|
||||
}, {
|
||||
logo:'images/partners/组 750@2x.png',
|
||||
}, {
|
||||
logo:'images/partners/组 749@2x.png',
|
||||
}, {
|
||||
logo:'images/partners/组 748@2x.png',
|
||||
}, {
|
||||
logo:'images/partners/组 744@2x.png',
|
||||
}, {
|
||||
logo:'images/partners/组 745@2x.png',
|
||||
}, {
|
||||
logo:'images/partners/组 746@2x.png',
|
||||
}, {
|
||||
logo:'images/partners/组 747@2x.png',
|
||||
},
|
||||
{
|
||||
logo:'images/partners/组 743@2x.png',
|
||||
},
|
||||
// ------------------------------------
|
||||
{
|
||||
logo:'images/partners/组 742@2x.png',
|
||||
},{
|
||||
logo:'images/partners/组 741@2x.png',
|
||||
},{
|
||||
logo:'images/partners/组 740@2x.png',
|
||||
},{
|
||||
logo:'images/partners/组 736@2x.png',
|
||||
},{
|
||||
logo:'images/partners/组 737@2x.png',
|
||||
},{
|
||||
logo:'images/partners/组 738@2x.png',
|
||||
},{
|
||||
logo:'images/partners/组 739@2x.png',
|
||||
},{
|
||||
logo:'images/partners/组 732@2x.png',
|
||||
},{
|
||||
logo:'images/partners/组 733@2x.png',
|
||||
},{
|
||||
logo:'images/partners/组 734@2x.png',
|
||||
},{
|
||||
logo:'images/partners/组 735@2x.png',
|
||||
},{
|
||||
logo:'images/partners/组 731@2x.png',
|
||||
},{
|
||||
logo:'images/partners/组 730@2x.png',
|
||||
},
|
||||
// --------------------------------
|
||||
{
|
||||
logo:'images/partners/组 729@2x.png',
|
||||
},{
|
||||
logo:'images/partners/组 728@2x.png',
|
||||
},{
|
||||
logo:'images/partners/组 727@2x.png',
|
||||
},{
|
||||
logo:'images/partners/组 726@2x.png',
|
||||
},{
|
||||
logo:'images/partners/组 725@2x.png',
|
||||
}
|
||||
],
|
||||
banners:[
|
||||
{
|
||||
logo:'images/banners/图层 1@2x.png'
|
||||
}, {
|
||||
logo:'images/banners/图层 2@2x.png'
|
||||
}, {
|
||||
logo:'images/banners/图层 3@2x.png'
|
||||
}, {
|
||||
logo:'images/banners/图层-4@2x.png'
|
||||
},
|
||||
],
|
||||
portfolio:[],
|
||||
title:'LightLimX',
|
||||
portfolios
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.home-wrap{
|
||||
/*max-width: 12;*/
|
||||
max-width: 13rem;
|
||||
margin: 0 auto;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,123 @@
|
|||
<template>
|
||||
<div class="fullpage-container">
|
||||
<section-view :css-style="{'background-color':'#000'}" v-lazy:background-image="assetsUri('images/innovation/innovation.png')" class="innovation-section-view">
|
||||
<div class="innovation-div">
|
||||
<h2 class="innovation-div-t">Innovation Insights</h2>
|
||||
</div>
|
||||
</section-view>
|
||||
<section-view :css-style="{'background-color':'#fff'}">
|
||||
<p v-if="$fetchState.pending">Fetching mountains...</p>
|
||||
<p v-else-if="$fetchState.error">An error occurred :</p>
|
||||
<innovation-block v-else :static-data="staticData"></innovation-block>
|
||||
<my-pagination @change="handleLists" v-if="staticData.length" :page.sync="page" :total="total" :pager-count="9"></my-pagination>
|
||||
<email-footer></email-footer>
|
||||
</section-view>
|
||||
<div class="windows">
|
||||
<span></span>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import animateMixin from '../../utils/animateMixin'
|
||||
import {
|
||||
assetsUri
|
||||
} from "../../utils";
|
||||
import SectionView from "../../components/SectionView/index";
|
||||
import EmailFooter from "../../components/EmailFooter/index";
|
||||
import InnovationBlock from "../../components/InnovationBlock/index";
|
||||
import MyPagination from "../../components/MyPagination/index";
|
||||
export default {
|
||||
name: "innovation",
|
||||
components: {MyPagination, InnovationBlock, EmailFooter, SectionView},
|
||||
layout:'index',
|
||||
watch: {
|
||||
'$route.query': '$fetch'
|
||||
},
|
||||
mixins:[animateMixin],
|
||||
async fetch() {
|
||||
const {query:{page,size}}=this.$route;
|
||||
if(page){
|
||||
this.page=page
|
||||
}
|
||||
if(size){
|
||||
this.size=size
|
||||
}
|
||||
await this.handleLists(this.page)
|
||||
},
|
||||
fetchOnServer: false,
|
||||
methods:{
|
||||
async handleLists(val){
|
||||
this.page=val;
|
||||
const {baseURL}=this.$config;
|
||||
const res= await this.$axios(baseURL+'/innovation/index?page='+this.page+'&size='+this.size)
|
||||
if(res.status!==200){
|
||||
return this.$toast(res.data.msg)
|
||||
}
|
||||
const {content,totalElements}=res.data
|
||||
this.total=totalElements;
|
||||
this.staticData=content;
|
||||
}
|
||||
},
|
||||
head() {
|
||||
return {
|
||||
title: this.title,
|
||||
meta: [
|
||||
{
|
||||
hid: 'description',
|
||||
name: 'description',
|
||||
content: 'My custom description'
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
data(){
|
||||
return {
|
||||
title:'LightLimX-Innovation Insights',
|
||||
assetsUri,
|
||||
page:1,
|
||||
size:9,
|
||||
total:0,
|
||||
staticData:[]
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.innovation{
|
||||
&-section-view{
|
||||
background-position: center bottom;
|
||||
background-size: 100% 2.92rem;
|
||||
background-repeat: no-repeat;
|
||||
/*background-size: ;*/
|
||||
padding-top: .95rem;
|
||||
min-height:3.87rem !important;
|
||||
}
|
||||
&-div{
|
||||
padding-top: 1.14rem;
|
||||
text-align: center;
|
||||
&-t{
|
||||
font-size: .48rem;
|
||||
font-family: Manrope;
|
||||
font-weight: bold;
|
||||
line-height: .32rem;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 768px){
|
||||
.innovation{
|
||||
&-section-view{
|
||||
background-size: auto 6.24rem;
|
||||
padding-top: .88rem;
|
||||
min-height: 6.24rem !important;
|
||||
}
|
||||
&-div{
|
||||
padding-top: 1.99rem;
|
||||
&-t{
|
||||
font-size: .6rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,156 @@
|
|||
<template>
|
||||
<div class="fullpage-container">
|
||||
<section-view :css-style="{'background-color':'#000'}" v-lazy:background-image="assetsUri('images/join/join.png')" class="join-section-view">
|
||||
<div class="join-div">
|
||||
<h2 class="join-div-t">Join LightLimX</h2>
|
||||
</div>
|
||||
</section-view>
|
||||
<div class="join-2-section-view" :style="{'position':'relative','z-index':'1','min-height':'100%','padding-bottom':'.5rem','box-sizing':'border-box'}" >
|
||||
<div class="join-2-section-view-wrap">
|
||||
<filter-input :locations="locations" @select="handleFilterSelect" :active.sync="activeLocation"></filter-input>
|
||||
<join-us-tabs @handleSelect="handleSelect" :active="active" :content="content" :options="positionType"></join-us-tabs>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import animateMixin from '../../utils/animateMixin'
|
||||
import {
|
||||
assetsUri
|
||||
} from "../../utils";
|
||||
import SectionView from "../../components/SectionView/index";
|
||||
import JoinUsTabs from "../../components/JoinUsTabs/index";
|
||||
import FilterInput from "../../components/FilterInput/index";
|
||||
export default {
|
||||
name: "join",
|
||||
components: {FilterInput, JoinUsTabs, SectionView},
|
||||
layout:'index',
|
||||
mixins:[animateMixin],
|
||||
async asyncData(config) {
|
||||
const {$axios,$config,payload}=config;
|
||||
if(payload){
|
||||
return
|
||||
}
|
||||
const {baseURL}=$config
|
||||
const {content} =await $axios.$get(`${baseURL}/locations/index?page=1&size=99`)
|
||||
const locations=content.map((item)=>{
|
||||
return {
|
||||
...item,
|
||||
id:item.id.toString()
|
||||
}
|
||||
})
|
||||
return {locations}
|
||||
},
|
||||
mounted(){
|
||||
this.activeLocation=this.locations[0].id;
|
||||
this.handlePositions().then((type)=>{
|
||||
this.active=type.length?type[0].id:''
|
||||
this.handlePositionOne()
|
||||
})
|
||||
},
|
||||
methods:{
|
||||
async handlePositions(){
|
||||
const {baseURL}=this.$config;
|
||||
const {data:{content,msg},status} = await this.$axios(`${baseURL}/join/index?page=1&size=99&locations_id=${this.activeLocation}`)
|
||||
if(status!==200){
|
||||
return this.$toast(msg)
|
||||
}
|
||||
this.positionType=content.map((item)=>{
|
||||
return {
|
||||
...item.position_type,
|
||||
id:item.id.toString()
|
||||
}
|
||||
})
|
||||
return this.positionType
|
||||
},
|
||||
async handlePositionOne(){
|
||||
const {baseURL}=this.$config;
|
||||
const res= await this.$axios(baseURL+'/join/one?id='+this.active)
|
||||
if(res.status!==200){
|
||||
return this.$toast(res.data.msg)
|
||||
}
|
||||
const {data}=res.data
|
||||
this.content=data?data.introduce:'';
|
||||
},
|
||||
handleSelect(item){
|
||||
this.active=item.id;
|
||||
this.handlePositionOne()
|
||||
},
|
||||
handleFilterSelect(item){
|
||||
this.activeLocation=item.id;
|
||||
this.handlePositions().then((type)=>{
|
||||
this.active=type.length?type[0].id:''
|
||||
this.handlePositionOne()
|
||||
})
|
||||
}
|
||||
},
|
||||
head() {
|
||||
return {
|
||||
title: this.title,
|
||||
meta: [
|
||||
{
|
||||
hid: 'description',
|
||||
name: 'description',
|
||||
content: 'My custom description'
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
data(){
|
||||
return {
|
||||
title:'LightLimX-Join Us',
|
||||
active:'',
|
||||
locations:[],
|
||||
activeLocation:'1',
|
||||
content:'',
|
||||
assetsUri,
|
||||
positionType:[]
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.join-2-section-view{
|
||||
.join-2-section-view-wrap{
|
||||
max-width: 13rem;
|
||||
margin: 0 auto;
|
||||
}
|
||||
}
|
||||
.join{
|
||||
&-section-view{
|
||||
background-position: center bottom;
|
||||
background-size: 100% 4.4rem;
|
||||
background-repeat: no-repeat;
|
||||
/*background-size: ;*/
|
||||
padding-top: .95rem;
|
||||
min-height:5.35rem !important;
|
||||
}
|
||||
&-div{
|
||||
padding-top: 1.78rem;
|
||||
text-align: center;
|
||||
&-t{
|
||||
font-size: .48rem;
|
||||
font-family: Manrope;
|
||||
font-weight: bold;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 768px){
|
||||
.join{
|
||||
&-section-view{
|
||||
background-size: auto 6.24rem;
|
||||
padding-top: .88rem;
|
||||
min-height: 6.24rem !important;
|
||||
}
|
||||
&-div{
|
||||
padding-top: 1.99rem;
|
||||
&-t{
|
||||
font-size: .6rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,116 @@
|
|||
<template>
|
||||
<div class="fullpage-container">
|
||||
<section-view class="startup-section-view" :css-style="{'background-color':'#000000','background-repeat':'no-repeat'}" v-lazy:background-image="assetsUri('images/startUp.png')">
|
||||
<startup-block></startup-block>
|
||||
</section-view>
|
||||
<section-view :css-style="{'background-color':'#fff'}">
|
||||
<startup-content :static-data="staticData"></startup-content>
|
||||
<email-footer></email-footer>
|
||||
</section-view>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import animateMixin from '../../utils/animateMixin'
|
||||
import {assetsUri} from "../../utils";
|
||||
import SectionView from "../../components/SectionView/index";
|
||||
import StartupBlock from "../../components/StartUpBlock/index";
|
||||
import EmailFooter from "../../components/EmailFooter/index";
|
||||
import StartupContent from "../../components/StartupContent/index";
|
||||
export default {
|
||||
name: "StartupsPage",
|
||||
mixins:[animateMixin],
|
||||
head() {
|
||||
return {
|
||||
|
||||
title: this.title,
|
||||
meta: [
|
||||
{
|
||||
hid: 'description',
|
||||
name: 'description',
|
||||
content: 'My custom description'
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
components: {StartupContent, EmailFooter, StartupBlock, SectionView},
|
||||
layout:'index',
|
||||
// async asyncData(config) {
|
||||
// const {$axios,$config,payload}=config;
|
||||
// if(payload){
|
||||
// return
|
||||
// }
|
||||
// const {baseURL}=$config
|
||||
// const {content} = await $axios.$get(`${baseURL}/startup/index?page=1&size=10`)
|
||||
// return { staticData:content }
|
||||
// },
|
||||
data(){
|
||||
return {
|
||||
title:'LightLimX-Startups',
|
||||
assetsUri,
|
||||
isMobile:false,
|
||||
staticData:[
|
||||
{
|
||||
img:'images/startup/1.png',
|
||||
title:'Enterprise & Startup',
|
||||
desc:'Advising well-established enterprises and newly-founded startups for zero-to-one market entry and market expansion strategies.'
|
||||
},
|
||||
{
|
||||
img:'images/startup/2.png',
|
||||
title:'Strategic Planning',
|
||||
desc:'Define your target market,branding & marketing Strategy and plan your roadmap.'
|
||||
},
|
||||
{
|
||||
img:'images/startup/3.png',
|
||||
title:'Tokenomics',
|
||||
desc:'Design mechanisms to create and capture value with tokenomics.'
|
||||
},{
|
||||
img:'images/startup/4.png',
|
||||
title:'Governance',
|
||||
desc:'Set up robust community governance with progressive decentralization.'
|
||||
},{
|
||||
img:'images/startup/5.png',
|
||||
title:'Fundraising',
|
||||
desc:'Pitch Coaching,pitch Deck Design Support,fundraising Strategy.'
|
||||
},{
|
||||
img:'images/startup/6.png',
|
||||
title:'Developer Hub',
|
||||
desc:`Receive guidance from more than 60+top-class</br>developers from leading ecosystems.`
|
||||
},{
|
||||
img:'images/startup/7.png',
|
||||
title:'Community growth',
|
||||
desc:'Build communities while monitoring and improving their social media performance, protecting their reputation.'
|
||||
},{
|
||||
img:'images/startup/8.png',
|
||||
title:'Workshops With Experts',
|
||||
desc:'Get a front-row seat to learn from crypto experts, authors, and successful entrepreneurs.'
|
||||
},{
|
||||
img:'images/startup/9.png',
|
||||
title:'Network of 30+ Mentors',
|
||||
desc:'Our mentors bring a diverse set of skills from various industries to give you key feedback and push you to the next level. They are your long-term allies and champions.'
|
||||
},
|
||||
]
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.fullpage-container{
|
||||
.startup-section-view{
|
||||
background-size:100% calc(100% - .15rem);
|
||||
background-position: center .96rem;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 768px) {
|
||||
.fullpage-container{
|
||||
.startup-section-view{
|
||||
background-size:300% 100%;
|
||||
padding-bottom: .65rem;
|
||||
background-position: center .88rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,53 @@
|
|||
export default function ({ store, redirect, req, router, app: { $axios } }) {
|
||||
// 数据访问前缀
|
||||
$axios.defaults.headers = {
|
||||
Authorization: store.getters.myAuthorization||''
|
||||
}
|
||||
// request拦截器
|
||||
// $axios.onRequest(config => {
|
||||
// if(process.client){
|
||||
// 客户端下，请求进度条开始
|
||||
// NProgress.start();
|
||||
// }
|
||||
// 将获取到token加入到请求头中
|
||||
// });
|
||||
// response拦截器，数据返回后，可以先在这里进行一个简单的判断
|
||||
$axios.interceptors.response.use(
|
||||
response => {
|
||||
if (process.client) {
|
||||
// 客户端下， 请求进度条结束
|
||||
// NProgress.done();
|
||||
}
|
||||
// return response
|
||||
if (response.data.code == 401) {
|
||||
// 返回401，token验证失败，清除客户端cookie
|
||||
// Cookie.remove("token");
|
||||
// 重定向到登录页面， 这里做一个判断，容错：req.url 未定义
|
||||
// if(req.url){
|
||||
// redirect("/sign?ref="+req.url)
|
||||
// }else{
|
||||
// redirect("/sign")
|
||||
// }
|
||||
} else if (response.data.code == 404) {
|
||||
// 重定向到404页面
|
||||
// redirect("/")
|
||||
} else {
|
||||
// 请求接口数据正常，返回数据
|
||||
return response
|
||||
}
|
||||
},
|
||||
error => {
|
||||
if (process.client) {
|
||||
// NProgress.done();
|
||||
}
|
||||
if (error.response.status == 500) {
|
||||
// http状态500，服务器内部错误，重定向到500页面
|
||||
// redirect("/500.htm")
|
||||
}
|
||||
if (error.response.status == 404) {
|
||||
// http状态500，请求API找不到，重定向到404页面
|
||||
// redirect("/404.html")
|
||||
}
|
||||
return Promise.reject(error.response) // 返回接口返回的错误信息
|
||||
})
|
||||
}
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
import Vue from 'vue';
|
||||
import { Pagination as ElPagination } from 'element-ui';
|
||||
Vue.use(ElPagination)
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
import Vue from 'vue'
|
||||
import LottieAnimation from 'lottie-web-vue'
|
||||
Vue.use(LottieAnimation); // add lottie-animation to your global scope
|
||||
|
|
@ -0,0 +1,25 @@
|
|||
(function(){
|
||||
function bindEvent(type){
|
||||
return (data)=>{
|
||||
const e = new Event(type);
|
||||
e.data = data;
|
||||
window.dispatchEvent(e);
|
||||
}
|
||||
}
|
||||
const event_trigger = bindEvent("hadSetRem")
|
||||
function remCurrent(){
|
||||
const clientWidth=document.documentElement.clientWidth;
|
||||
let fontSize = clientWidth / 19.2 +'px';
|
||||
if(clientWidth<=750){
|
||||
fontSize = clientWidth / 7.5 + 'px';
|
||||
}else if(750<clientWidth&&clientWidth<=1920){
|
||||
fontSize=clientWidth / 19.2 +'px';
|
||||
}
|
||||
document.documentElement.style.fontSize = fontSize;
|
||||
}
|
||||
window.addEventListener('resize',remCurrent)
|
||||
remCurrent()
|
||||
setTimeout(()=>{
|
||||
event_trigger(true)
|
||||
},1000)
|
||||
})()
|
||||
|
|
@ -0,0 +1,9 @@
|
|||
// plugins/svgIcon.js
|
||||
import Vue from 'vue'
|
||||
import SvgIcon from '@/components/SvgIcon.vue'// Nuxt 默认@指向根目录
|
||||
|
||||
// 注册组件
|
||||
Vue.component('svg-icon', SvgIcon)
|
||||
// 预请求svg组件(通过之前的svg-sprite-loader加载)
|
||||
const req = require.context('@/assets/svg', false, /\.svg$/)
|
||||
req.keys().map(req)
|
||||
|
|
@ -0,0 +1,8 @@
|
|||
import Vue from 'vue'
|
||||
import Vant,{Lazyload } from 'vant'
|
||||
|
||||
Vue.use(Vant)
|
||||
Vue.use(Lazyload)
|
||||
Vue.use(Lazyload, {
|
||||
lazyComponent: true,
|
||||
});
|
||||
|
|
@ -0,0 +1,9 @@
|
|||
import Vue from 'vue';
|
||||
import VueAnimate from 'vue-animate-plugin';
|
||||
|
||||
Vue.use(VueAnimate, {
|
||||
valueof: ':', // 表示v-animate指令修饰符中键与值使用什么字符分割，默认使用':'
|
||||
begin: 'begin', // 表示v-animate指令修饰符中动画开始之前的挂钩点的名称，可以通过方式`.begin:onBegin`注入钩子函数，它可以是async function
|
||||
after: 'complete', // 表示v-animate指令修饰符中动画结束之后的挂钩点的名称，`.complete:onComplete`方式注入钩子，它可以是async function
|
||||
callback: null // 表示v-animate指令中，动画部分（包括之后的衔接部分）完全执行完毕后的钩子函数注入口
|
||||
});
|
||||
|
|
@ -0,0 +1,4 @@
|
|||
import Vue from 'vue'
|
||||
import VueClipboard from 'vue-clipboard2'
|
||||
VueClipboard.config.autoSetContainer = true
|
||||
Vue.use(VueClipboard)
|
||||
|
|
@ -0,0 +1,4 @@
|
|||
import 'animate.css'
|
||||
import 'vue-fullpage/vue-fullpage.css'
|
||||
import VueFullpage from 'vue-fullpage'
|
||||
Vue.use(VueFullpage)
|
||||
|
|
@ -0,0 +1,4 @@
|
|||
import Vue from 'vue'
|
||||
import VTooltip from 'v-tooltip'
|
||||
|
||||
Vue.use(VTooltip)
|
||||
|
|
@ -0,0 +1,514 @@
|
|||
(function () {
|
||||
var MutationObserver; var Util; var WeakMap; var getComputedStyle; var getComputedStyleRX
|
||||
var bind = function (fn, me) { return function () { return fn.apply(me, arguments) } }
|
||||
var indexOf = [].indexOf || function (item) { for (var i = 0, l = this.length; i < l; i++) { if (i in this && this[i] === item) return i } return -1 }
|
||||
|
||||
Util = (function () {
|
||||
function Util () {}
|
||||
|
||||
Util.prototype.extend = function (custom, defaults) {
|
||||
var key, value
|
||||
for (key in defaults) {
|
||||
value = defaults[key]
|
||||
if (custom[key] == null) {
|
||||
custom[key] = value
|
||||
}
|
||||
}
|
||||
return custom
|
||||
}
|
||||
|
||||
Util.prototype.isMobile = function (agent) {
|
||||
return /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(agent)
|
||||
}
|
||||
|
||||
Util.prototype.createEvent = function (event, bubble, cancel, detail) {
|
||||
var customEvent
|
||||
if (bubble == null) {
|
||||
bubble = false
|
||||
}
|
||||
if (cancel == null) {
|
||||
cancel = false
|
||||
}
|
||||
if (detail == null) {
|
||||
detail = null
|
||||
}
|
||||
if (document.createEvent != null) {
|
||||
customEvent = document.createEvent('CustomEvent')
|
||||
customEvent.initCustomEvent(event, bubble, cancel, detail)
|
||||
} else if (document.createEventObject != null) {
|
||||
customEvent = document.createEventObject()
|
||||
customEvent.eventType = event
|
||||
} else {
|
||||
customEvent.eventName = event
|
||||
}
|
||||
return customEvent
|
||||
}
|
||||
|
||||
Util.prototype.emitEvent = function (elem, event) {
|
||||
if (elem.dispatchEvent != null) {
|
||||
return elem.dispatchEvent(event)
|
||||
} else if (event in (elem != null)) {
|
||||
return elem[event]()
|
||||
} else if (('on' + event) in (elem != null)) {
|
||||
return elem['on' + event]()
|
||||
}
|
||||
}
|
||||
|
||||
Util.prototype.addEvent = function (elem, event, fn) {
|
||||
if (elem.addEventListener != null) {
|
||||
return elem.addEventListener(event, fn, false)
|
||||
} else if (elem.attachEvent != null) {
|
||||
return elem.attachEvent('on' + event, fn)
|
||||
} else {
|
||||
return elem[event] = fn
|
||||
}
|
||||
}
|
||||
|
||||
Util.prototype.removeEvent = function (elem, event, fn) {
|
||||
if (elem.removeEventListener != null) {
|
||||
return elem.removeEventListener(event, fn, false)
|
||||
} else if (elem.detachEvent != null) {
|
||||
return elem.detachEvent('on' + event, fn)
|
||||
} else {
|
||||
return delete elem[event]
|
||||
}
|
||||
}
|
||||
|
||||
Util.prototype.innerHeight = function () {
|
||||
if ('innerHeight' in window) {
|
||||
return window.innerHeight
|
||||
} else {
|
||||
return document.documentElement.clientHeight
|
||||
}
|
||||
}
|
||||
|
||||
return Util
|
||||
|
||||
})()
|
||||
|
||||
WeakMap = this.WeakMap || this.MozWeakMap || (WeakMap = (function () {
|
||||
function WeakMap () {
|
||||
this.keys = []
|
||||
this.values = []
|
||||
}
|
||||
|
||||
WeakMap.prototype.get = function (key) {
|
||||
var i, item, j, len, ref
|
||||
ref = this.keys
|
||||
for (i = j = 0, len = ref.length; j < len; i = ++j) {
|
||||
item = ref[i]
|
||||
if (item === key) {
|
||||
return this.values[i]
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
WeakMap.prototype.set = function (key, value) {
|
||||
var i, item, j, len, ref
|
||||
ref = this.keys
|
||||
for (i = j = 0, len = ref.length; j < len; i = ++j) {
|
||||
item = ref[i]
|
||||
if (item === key) {
|
||||
this.values[i] = value
|
||||
return
|
||||
}
|
||||
}
|
||||
this.keys.push(key)
|
||||
return this.values.push(value)
|
||||
}
|
||||
|
||||
return WeakMap
|
||||
|
||||
})())
|
||||
|
||||
MutationObserver = this.MutationObserver || this.WebkitMutationObserver || this.MozMutationObserver || (MutationObserver = (function () {
|
||||
function MutationObserver () {
|
||||
if (typeof console !== 'undefined' && console !== null) {
|
||||
console.warn('MutationObserver is not supported by your browser.')
|
||||
}
|
||||
if (typeof console !== 'undefined' && console !== null) {
|
||||
console.warn('WOW.js cannot detect dom mutations, please call .sync() after loading new content.')
|
||||
}
|
||||
}
|
||||
|
||||
MutationObserver.notSupported = true
|
||||
|
||||
MutationObserver.prototype.observe = function () {}
|
||||
|
||||
return MutationObserver
|
||||
|
||||
})())
|
||||
|
||||
getComputedStyle = this.getComputedStyle || function (el, pseudo) {
|
||||
this.getPropertyValue = function (prop) {
|
||||
var ref
|
||||
if (prop === 'float') {
|
||||
prop = 'styleFloat'
|
||||
}
|
||||
if (getComputedStyleRX.test(prop)) {
|
||||
prop.replace(getComputedStyleRX, function (_, _char) {
|
||||
return _char.toUpperCase()
|
||||
})
|
||||
}
|
||||
return ((ref = el.currentStyle) != null ? ref[prop] : void 0) || null
|
||||
}
|
||||
return this
|
||||
}
|
||||
|
||||
getComputedStyleRX = /(\-([a-z]){1})/g
|
||||
|
||||
this.WOW = (function () {
|
||||
WOW.prototype.defaults = {
|
||||
boxClass: 'wow',
|
||||
animateClass: 'animated',
|
||||
offset: 0,
|
||||
mobile: true,
|
||||
live: true,
|
||||
callback: null,
|
||||
scrollContainer: null
|
||||
}
|
||||
|
||||
function WOW (options) {
|
||||
if (options == null) {
|
||||
options = {}
|
||||
}
|
||||
this.scrollCallback = bind(this.scrollCallback, this)
|
||||
this.scrollHandler = bind(this.scrollHandler, this)
|
||||
this.resetAnimation = bind(this.resetAnimation, this)
|
||||
this.start = bind(this.start, this)
|
||||
this.scrolled = true
|
||||
this.config = this.util().extend(options, this.defaults)
|
||||
if (options.scrollContainer != null) {
|
||||
this.config.scrollContainer = document.querySelector(options.scrollContainer)
|
||||
}
|
||||
this.animationNameCache = new WeakMap()
|
||||
this.wowEvent = this.util().createEvent(this.config.boxClass)
|
||||
}
|
||||
|
||||
WOW.prototype.init = function () {
|
||||
var ref
|
||||
this.element = window.document.documentElement
|
||||
if ((ref = document.readyState) === 'interactive' || ref === 'complete') {
|
||||
this.start()
|
||||
} else {
|
||||
this.util().addEvent(document, 'DOMContentLoaded', this.start)
|
||||
}
|
||||
return this.finished = []
|
||||
}
|
||||
|
||||
WOW.prototype.start = function () {
|
||||
var box, j, len, ref
|
||||
this.stopped = false
|
||||
this.boxes = (function () {
|
||||
var j, len, ref, results
|
||||
ref = this.element.querySelectorAll('.' + this.config.boxClass)
|
||||
results = []
|
||||
for (j = 0, len = ref.length; j < len; j++) {
|
||||
box = ref[j]
|
||||
results.push(box)
|
||||
}
|
||||
return results
|
||||
}.call(this))
|
||||
this.all = (function () {
|
||||
var j, len, ref, results
|
||||
ref = this.boxes
|
||||
results = []
|
||||
for (j = 0, len = ref.length; j < len; j++) {
|
||||
box = ref[j]
|
||||
results.push(box)
|
||||
}
|
||||
return results
|
||||
}.call(this))
|
||||
if (this.boxes.length) {
|
||||
if (this.disabled()) {
|
||||
this.resetStyle()
|
||||
} else {
|
||||
ref = this.boxes
|
||||
for (j = 0, len = ref.length; j < len; j++) {
|
||||
box = ref[j]
|
||||
this.applyStyle(box, true)
|
||||
}
|
||||
}
|
||||
}
|
||||
if (!this.disabled()) {
|
||||
this.util().addEvent(this.config.scrollContainer || window, 'scroll', this.scrollHandler)
|
||||
this.util().addEvent(window, 'resize', this.scrollHandler)
|
||||
this.interval = setInterval(this.scrollCallback, 50)
|
||||
}
|
||||
if (this.config.live) {
|
||||
return new MutationObserver((function (_this) {
|
||||
return function (records) {
|
||||
var k, len1, node, record, results
|
||||
results = []
|
||||
for (k = 0, len1 = records.length; k < len1; k++) {
|
||||
record = records[k]
|
||||
results.push(function () {
|
||||
var l, len2, ref1, results1
|
||||
ref1 = record.addedNodes || []
|
||||
results1 = []
|
||||
for (l = 0, len2 = ref1.length; l < len2; l++) {
|
||||
node = ref1[l]
|
||||
results1.push(this.doSync(node))
|
||||
}
|
||||
return results1
|
||||
}.call(_this))
|
||||
}
|
||||
return results
|
||||
}
|
||||
})(this)).observe(document.body, {
|
||||
childList: true,
|
||||
subtree: true
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
WOW.prototype.stop = function () {
|
||||
this.stopped = true
|
||||
this.util().removeEvent(this.config.scrollContainer || window, 'scroll', this.scrollHandler)
|
||||
this.util().removeEvent(window, 'resize', this.scrollHandler)
|
||||
if (this.interval != null) {
|
||||
return clearInterval(this.interval)
|
||||
}
|
||||
}
|
||||
|
||||
WOW.prototype.sync = function (element) {
|
||||
if (MutationObserver.notSupported) {
|
||||
return this.doSync(this.element)
|
||||
}
|
||||
}
|
||||
|
||||
WOW.prototype.doSync = function (element) {
|
||||
var box, j, len, ref, results
|
||||
if (element == null) {
|
||||
element = this.element
|
||||
}
|
||||
if (element.nodeType !== 1) {
|
||||
return
|
||||
}
|
||||
element = element.parentNode || element
|
||||
ref = element.querySelectorAll('.' + this.config.boxClass)
|
||||
results = []
|
||||
for (j = 0, len = ref.length; j < len; j++) {
|
||||
box = ref[j]
|
||||
if (indexOf.call(this.all, box) < 0) {
|
||||
this.boxes.push(box)
|
||||
this.all.push(box)
|
||||
if (this.stopped || this.disabled()) {
|
||||
this.resetStyle()
|
||||
} else {
|
||||
this.applyStyle(box, true)
|
||||
}
|
||||
results.push(this.scrolled = true)
|
||||
} else {
|
||||
results.push(void 0)
|
||||
}
|
||||
}
|
||||
return results
|
||||
}
|
||||
|
||||
WOW.prototype.show = function (box) {
|
||||
this.applyStyle(box)
|
||||
box.className = box.className + ' ' + this.config.animateClass
|
||||
if (this.config.callback != null) {
|
||||
this.config.callback(box)
|
||||
}
|
||||
this.util().emitEvent(box, this.wowEvent)
|
||||
this.util().addEvent(box, 'animationend', this.resetAnimation)
|
||||
this.util().addEvent(box, 'oanimationend', this.resetAnimation)
|
||||
this.util().addEvent(box, 'webkitAnimationEnd', this.resetAnimation)
|
||||
this.util().addEvent(box, 'MSAnimationEnd', this.resetAnimation)
|
||||
return box
|
||||
}
|
||||
|
||||
WOW.prototype.applyStyle = function (box, hidden) {
|
||||
var delay, duration, iteration
|
||||
duration = box.getAttribute('data-wow-duration')
|
||||
delay = box.getAttribute('data-wow-delay')
|
||||
iteration = box.getAttribute('data-wow-iteration')
|
||||
return this.animate((function (_this) {
|
||||
return function () {
|
||||
return _this.customStyle(box, hidden, duration, delay, iteration)
|
||||
}
|
||||
})(this))
|
||||
}
|
||||
|
||||
WOW.prototype.animate = (function () {
|
||||
if ('requestAnimationFrame' in window) {
|
||||
return function (callback) {
|
||||
return window.requestAnimationFrame(callback)
|
||||
}
|
||||
} else {
|
||||
return function (callback) {
|
||||
return callback()
|
||||
}
|
||||
}
|
||||
})()
|
||||
|
||||
WOW.prototype.resetStyle = function () {
|
||||
var box, j, len, ref, results
|
||||
ref = this.boxes
|
||||
results = []
|
||||
for (j = 0, len = ref.length; j < len; j++) {
|
||||
box = ref[j]
|
||||
results.push(box.style.visibility = 'visible')
|
||||
}
|
||||
return results
|
||||
}
|
||||
|
||||
WOW.prototype.resetAnimation = function (event) {
|
||||
var target
|
||||
if (event.type.toLowerCase().indexOf('animationend') >= 0) {
|
||||
target = event.target || event.srcElement
|
||||
return target.className = target.className.replace(this.config.animateClass, '').trim()
|
||||
}
|
||||
}
|
||||
|
||||
WOW.prototype.customStyle = function (box, hidden, duration, delay, iteration) {
|
||||
if (hidden) {
|
||||
this.cacheAnimationName(box)
|
||||
}
|
||||
box.style.visibility = hidden ? 'hidden' : 'visible'
|
||||
if (duration) {
|
||||
this.vendorSet(box.style, {
|
||||
animationDuration: duration
|
||||
})
|
||||
}
|
||||
if (delay) {
|
||||
this.vendorSet(box.style, {
|
||||
animationDelay: delay
|
||||
})
|
||||
}
|
||||
if (iteration) {
|
||||
this.vendorSet(box.style, {
|
||||
animationIterationCount: iteration
|
||||
})
|
||||
}
|
||||
this.vendorSet(box.style, {
|
||||
animationName: hidden ? 'none' : this.cachedAnimationName(box)
|
||||
})
|
||||
return box
|
||||
}
|
||||
|
||||
WOW.prototype.vendors = ['moz', 'webkit']
|
||||
|
||||
WOW.prototype.vendorSet = function (elem, properties) {
|
||||
var name, results, value, vendor
|
||||
results = []
|
||||
for (name in properties) {
|
||||
value = properties[name]
|
||||
elem['' + name] = value
|
||||
results.push(function () {
|
||||
var j, len, ref, results1
|
||||
ref = this.vendors
|
||||
results1 = []
|
||||
for (j = 0, len = ref.length; j < len; j++) {
|
||||
vendor = ref[j]
|
||||
results1.push(elem['' + vendor + (name.charAt(0).toUpperCase()) + (name.substr(1))] = value)
|
||||
}
|
||||
return results1
|
||||
}.call(this))
|
||||
}
|
||||
return results
|
||||
}
|
||||
|
||||
WOW.prototype.vendorCSS = function (elem, property) {
|
||||
var j, len, ref, result, style, vendor
|
||||
style = getComputedStyle(elem)
|
||||
result = style.getPropertyCSSValue(property)
|
||||
ref = this.vendors
|
||||
for (j = 0, len = ref.length; j < len; j++) {
|
||||
vendor = ref[j]
|
||||
result = result || style.getPropertyCSSValue('-' + vendor + '-' + property)
|
||||
}
|
||||
return result
|
||||
}
|
||||
|
||||
WOW.prototype.animationName = function (box) {
|
||||
var animationName, error
|
||||
try {
|
||||
animationName = this.vendorCSS(box, 'animation-name').cssText
|
||||
} catch (error) {
|
||||
animationName = getComputedStyle(box).getPropertyValue('animation-name')
|
||||
}
|
||||
if (animationName === 'none') {
|
||||
return ''
|
||||
} else {
|
||||
return animationName
|
||||
}
|
||||
}
|
||||
|
||||
WOW.prototype.cacheAnimationName = function (box) {
|
||||
return this.animationNameCache.set(box, this.animationName(box))
|
||||
}
|
||||
|
||||
WOW.prototype.cachedAnimationName = function (box) {
|
||||
return this.animationNameCache.get(box)
|
||||
}
|
||||
|
||||
WOW.prototype.scrollHandler = function () {
|
||||
return this.scrolled = true
|
||||
}
|
||||
|
||||
WOW.prototype.scrollCallback = function () {
|
||||
var box
|
||||
if (this.scrolled) {
|
||||
this.scrolled = false
|
||||
this.boxes = (function () {
|
||||
var j, len, ref, results
|
||||
ref = this.boxes
|
||||
results = []
|
||||
for (j = 0, len = ref.length; j < len; j++) {
|
||||
box = ref[j]
|
||||
if (!(box)) {
|
||||
continue
|
||||
}
|
||||
if (this.isVisible(box)) {
|
||||
this.show(box)
|
||||
continue
|
||||
}
|
||||
results.push(box)
|
||||
}
|
||||
return results
|
||||
}.call(this))
|
||||
if (!(this.boxes.length || this.config.live)) {
|
||||
return this.stop()
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
WOW.prototype.offsetTop = function (element) {
|
||||
var top
|
||||
while (element.offsetTop === void 0) {
|
||||
element = element.parentNode
|
||||
}
|
||||
top = element.offsetTop
|
||||
while (element = element.offsetParent) {
|
||||
top += element.offsetTop
|
||||
}
|
||||
return top
|
||||
}
|
||||
|
||||
WOW.prototype.isVisible = function (box) {
|
||||
var bottom, offset, top, viewBottom, viewTop
|
||||
offset = box.getAttribute('data-wow-offset') || this.config.offset
|
||||
viewTop = (this.config.scrollContainer && this.config.scrollContainer.scrollTop) || window.pageYOffset
|
||||
viewBottom = viewTop + Math.min(this.element.clientHeight, this.util().innerHeight()) - offset
|
||||
top = this.offsetTop(box)
|
||||
bottom = top + box.clientHeight
|
||||
return top <= viewBottom && bottom >= viewTop
|
||||
}
|
||||
|
||||
WOW.prototype.util = function () {
|
||||
return this._util != null ? this._util : this._util = new Util()
|
||||
}
|
||||
|
||||
WOW.prototype.disabled = function () {
|
||||
return !this.config.mobile && this.util().isMobile(navigator.userAgent)
|
||||
}
|
||||
|
||||
return WOW
|
||||
|
||||
})()
|
||||
|
||||
}).call(this)
|
||||
window.WOW=this.WOW
|
||||
|
|
@ -0,0 +1,63 @@
|
|||
/* eslint-disable */
|
||||
const path = require('path');
|
||||
const fsEx = require('fs-extra');
|
||||
const chalk = require('chalk')
|
||||
const archiver = require('archiver');
|
||||
const fs = require('fs');
|
||||
const root = process.cwd()
|
||||
const moment=require('moment')
|
||||
console.log(chalk.green(`root path :${root}`))
|
||||
const resolve = (url) => {
|
||||
return path.join(root, url)
|
||||
}
|
||||
|
||||
const copy = async (from, to) => {
|
||||
try {
|
||||
await fsEx.copy(resolve(from), resolve(to));
|
||||
console.log(chalk.green(`success:${from}===>${to}`));
|
||||
} catch (error) {
|
||||
console.log(chalk.red(`errors:=>${error}`));
|
||||
}
|
||||
};
|
||||
|
||||
const copyFile = async () => {
|
||||
await Promise.all([
|
||||
copy('/static/', '/server/static/'),
|
||||
copy('/.nuxt/', '/server/.nuxt/'),
|
||||
copy('/ecosystem.config.js', '/server/ecosystem.config.js'),
|
||||
copy('/package.json', '/server/package.json'),
|
||||
copy('/nuxt.config.js', '/server/nuxt.config.js'),
|
||||
]);
|
||||
};
|
||||
|
||||
|
||||
|
||||
function zipFile() {
|
||||
return new Promise((resolve, reject) => {
|
||||
const archive = archiver('zip', {
|
||||
zlib: {
|
||||
level: 5,
|
||||
},
|
||||
}).on('error', (err) => {
|
||||
reject(err)
|
||||
});
|
||||
const output = fs.createWriteStream(`${root}/Limx${moment(new Date()).format('HH时mm分ss秒')}.zip`)
|
||||
.on('close', (err) => {
|
||||
if (err) {
|
||||
reject(err)
|
||||
}
|
||||
resolve();
|
||||
});
|
||||
archive.pipe(output);
|
||||
archive.directory(path.join(root, `/server`), `/server`);
|
||||
archive.finalize();
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
// copyFile();
|
||||
module.exports = {
|
||||
copy,
|
||||
copyFile,
|
||||
zipFile
|
||||
}
|
||||
|
|
@ -0,0 +1,47 @@
|
|||
/* eslint-disable */
|
||||
const {
|
||||
copyFile,
|
||||
zipFile,
|
||||
} = require('./file');
|
||||
const chalk = require('chalk');
|
||||
const path = require('path');
|
||||
|
||||
const root = process.cwd();
|
||||
const node_ssh = require('node-ssh');
|
||||
|
||||
const ssh = new node_ssh();
|
||||
|
||||
const deploy = async() => {
|
||||
await copyFile();
|
||||
await zipFile();
|
||||
// await ssh.connect({
|
||||
// host : '---',
|
||||
// username: '----',
|
||||
// password: '----',
|
||||
// port : --,
|
||||
// });
|
||||
//
|
||||
// await ssh.putFile(`${root}/server/server.zip`, '/usr/local/smart-library/server-pkg/server.zip').then(() => {
|
||||
// console.log('The File thing is done');
|
||||
// }, (error) => {
|
||||
// console.log('Something\'s wrong');
|
||||
// console.log(error);
|
||||
// });
|
||||
//
|
||||
//
|
||||
// await ssh.exec('sh', ['./deploy.sh'], {
|
||||
// cwd: '/usr/local/smart-library/server-pkg',
|
||||
// onStdout(chunk) {
|
||||
// console.log(chalk.green(chunk.toString('utf8')));
|
||||
// },
|
||||
// onStderr(chunk) {
|
||||
// console.log(chalk.red(chunk.toString('utf8')));
|
||||
// },
|
||||
// });
|
||||
// console.log('success');
|
||||
process.exit(0);
|
||||
};
|
||||
deploy().catch((e) => {
|
||||
console.log(e);
|
||||
process.exit(0);
|
||||
});
|
||||
|
|
@ -0,0 +1,2 @@
|
|||
const cmd=require('node-cmd');
|
||||
cmd.run('yarn start');
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 10 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 5.6 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 293 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 65 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 28 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 6.8 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 194 B |
Binary file not shown.
|
After Width: | Height: | Size: 1.1 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 3.9 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 3.3 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 3.9 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 3.6 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 3.7 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 3.9 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 3.7 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 3.6 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 3.3 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 3.3 KiB |
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in New Issue