diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..3c3629e --- /dev/null +++ b/.gitignore @@ -0,0 +1 @@ +node_modules diff --git a/.hbuilderx/launch.json b/.hbuilderx/launch.json index 81f13f4..ee5be77 100644 --- a/.hbuilderx/launch.json +++ b/.hbuilderx/launch.json @@ -2,6 +2,10 @@ // launchtype项可配置值为local或remote, local代表前端连本地云函数,remote代表前端连云端云函数 "version": "0.0", "configurations": [{ + "app-plus" : + { + "launchtype" : "local" + }, "default" : { "launchtype" : "local" diff --git a/App.vue b/App.vue index 3237063..3057f2c 100644 --- a/App.vue +++ b/App.vue @@ -1,55 +1,102 @@ - - - \ No newline at end of file diff --git a/api/index.js b/api/index.js new file mode 100644 index 0000000..2d49850 --- /dev/null +++ b/api/index.js @@ -0,0 +1,28 @@ +import request from '@/jsFile/requst.js' + +// 基础配置 +export function postLoginIndex(data) { + return request.post('/api.login/index', data); +} +// 基础配置 +export function getInfo(params) { + return request.get('/api.base/config', params); +} +// 获取个人信息 +export function postUserInfo(data) { + return request.post('/api.user/info', data); +} +// 修改个人信息 +export function postEditInfo(data) { + return request.post('/api.user/editInfo', data); +} +// 上传文件 +export function postUpload(data) { + return request.upload('/api.upload/image', data); +} + +// banner +export function getBanner(params) { + return request.get('/api.base/banner', params); +} + diff --git a/commons/animate.min.css b/commons/animate.min.css deleted file mode 100644 index 8ae4afd..0000000 --- a/commons/animate.min.css +++ /dev/null @@ -1,12 +0,0 @@ -@charset "UTF-8";/*! -Animate.css - http://daneden.me/animate -Licensed under the MIT license - -Copyright (c) 2013 Daniel Eden - -Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: - -The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. - -THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. -*/.animated{-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both}.animated.infinite{-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite}.animated.hinge{-webkit-animation-duration:2s;animation-duration:2s}@-webkit-keyframes bounce{0%,100%,20%,50%,80%{-webkit-transform:translateY(0);transform:translateY(0)}40%{-webkit-transform:translateY(-30px);transform:translateY(-30px)}60%{-webkit-transform:translateY(-15px);transform:translateY(-15px)}}@keyframes bounce{0%,100%,20%,50%,80%{-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}40%{-webkit-transform:translateY(-30px);-ms-transform:translateY(-30px);transform:translateY(-30px)}60%{-webkit-transform:translateY(-15px);-ms-transform:translateY(-15px);transform:translateY(-15px)}}.bounce{-webkit-animation-name:bounce;animation-name:bounce}@-webkit-keyframes flash{0%,100%,50%{opacity:1}25%,75%{opacity:0}}@keyframes flash{0%,100%,50%{opacity:1}25%,75%{opacity:0}}.flash{-webkit-animation-name:flash;animation-name:flash}@-webkit-keyframes pulse{0%{-webkit-transform:scale(1);transform:scale(1)}50%{-webkit-transform:scale(1.1);transform:scale(1.1)}100%{-webkit-transform:scale(1);transform:scale(1)}}@keyframes pulse{0%{-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}50%{-webkit-transform:scale(1.1);-ms-transform:scale(1.1);transform:scale(1.1)}100%{-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}}.pulse{-webkit-animation-name:pulse;animation-name:pulse}@-webkit-keyframes rubberBand{0%{-webkit-transform:scale(1);transform:scale(1)}30%{-webkit-transform:scaleX(1.25) scaleY(0.75);transform:scaleX(1.25) scaleY(0.75)}40%{-webkit-transform:scaleX(0.75) scaleY(1.25);transform:scaleX(0.75) scaleY(1.25)}60%{-webkit-transform:scaleX(1.15) scaleY(0.85);transform:scaleX(1.15) scaleY(0.85)}100%{-webkit-transform:scale(1);transform:scale(1)}}@keyframes rubberBand{0%{-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}30%{-webkit-transform:scaleX(1.25) scaleY(0.75);-ms-transform:scaleX(1.25) scaleY(0.75);transform:scaleX(1.25) scaleY(0.75)}40%{-webkit-transform:scaleX(0.75) scaleY(1.25);-ms-transform:scaleX(0.75) scaleY(1.25);transform:scaleX(0.75) scaleY(1.25)}60%{-webkit-transform:scaleX(1.15) scaleY(0.85);-ms-transform:scaleX(1.15) scaleY(0.85);transform:scaleX(1.15) scaleY(0.85)}100%{-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}}.rubberBand{-webkit-animation-name:rubberBand;animation-name:rubberBand}@-webkit-keyframes shake{0%,100%{-webkit-transform:translateX(0);transform:translateX(0)}10%,30%,50%,70%,90%{-webkit-transform:translateX(-10px);transform:translateX(-10px)}20%,40%,60%,80%{-webkit-transform:translateX(10px);transform:translateX(10px)}}@keyframes shake{0%,100%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}10%,30%,50%,70%,90%{-webkit-transform:translateX(-10px);-ms-transform:translateX(-10px);transform:translateX(-10px)}20%,40%,60%,80%{-webkit-transform:translateX(10px);-ms-transform:translateX(10px);transform:translateX(10px)}}.shake{-webkit-animation-name:shake;animation-name:shake}@-webkit-keyframes swing{20%{-webkit-transform:rotate(15deg);transform:rotate(15deg)}40%{-webkit-transform:rotate(-10deg);transform:rotate(-10deg)}60%{-webkit-transform:rotate(5deg);transform:rotate(5deg)}80%{-webkit-transform:rotate(-5deg);transform:rotate(-5deg)}100%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}}@keyframes swing{20%{-webkit-transform:rotate(15deg);-ms-transform:rotate(15deg);transform:rotate(15deg)}40%{-webkit-transform:rotate(-10deg);-ms-transform:rotate(-10deg);transform:rotate(-10deg)}60%{-webkit-transform:rotate(5deg);-ms-transform:rotate(5deg);transform:rotate(5deg)}80%{-webkit-transform:rotate(-5deg);-ms-transform:rotate(-5deg);transform:rotate(-5deg)}100%{-webkit-transform:rotate(0deg);-ms-transform:rotate(0deg);transform:rotate(0deg)}}.swing{-webkit-transform-origin:top center;-ms-transform-origin:top center;transform-origin:top center;-webkit-animation-name:swing;animation-name:swing}@-webkit-keyframes tada{0%{-webkit-transform:scale(1);transform:scale(1)}10%,20%{-webkit-transform:scale(0.9) rotate(-3deg);transform:scale(0.9) rotate(-3deg)}30%,50%,70%,90%{-webkit-transform:scale(1.1) rotate(3deg);transform:scale(1.1) rotate(3deg)}40%,60%,80%{-webkit-transform:scale(1.1) rotate(-3deg);transform:scale(1.1) rotate(-3deg)}100%{-webkit-transform:scale(1) rotate(0);transform:scale(1) rotate(0)}}@keyframes tada{0%{-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}10%,20%{-webkit-transform:scale(0.9) rotate(-3deg);-ms-transform:scale(0.9) rotate(-3deg);transform:scale(0.9) rotate(-3deg)}30%,50%,70%,90%{-webkit-transform:scale(1.1) rotate(3deg);-ms-transform:scale(1.1) rotate(3deg);transform:scale(1.1) rotate(3deg)}40%,60%,80%{-webkit-transform:scale(1.1) rotate(-3deg);-ms-transform:scale(1.1) rotate(-3deg);transform:scale(1.1) rotate(-3deg)}100%{-webkit-transform:scale(1) rotate(0);-ms-transform:scale(1) rotate(0);transform:scale(1) rotate(0)}}.tada{-webkit-animation-name:tada;animation-name:tada}@-webkit-keyframes wobble{0%{-webkit-transform:translateX(0%);transform:translateX(0%)}15%{-webkit-transform:translateX(-25%) rotate(-5deg);transform:translateX(-25%) rotate(-5deg)}30%{-webkit-transform:translateX(20%) rotate(3deg);transform:translateX(20%) rotate(3deg)}45%{-webkit-transform:translateX(-15%) rotate(-3deg);transform:translateX(-15%) rotate(-3deg)}60%{-webkit-transform:translateX(10%) rotate(2deg);transform:translateX(10%) rotate(2deg)}75%{-webkit-transform:translateX(-5%) rotate(-1deg);transform:translateX(-5%) rotate(-1deg)}100%{-webkit-transform:translateX(0%);transform:translateX(0%)}}@keyframes wobble{0%{-webkit-transform:translateX(0%);-ms-transform:translateX(0%);transform:translateX(0%)}15%{-webkit-transform:translateX(-25%) rotate(-5deg);-ms-transform:translateX(-25%) rotate(-5deg);transform:translateX(-25%) rotate(-5deg)}30%{-webkit-transform:translateX(20%) rotate(3deg);-ms-transform:translateX(20%) rotate(3deg);transform:translateX(20%) rotate(3deg)}45%{-webkit-transform:translateX(-15%) rotate(-3deg);-ms-transform:translateX(-15%) rotate(-3deg);transform:translateX(-15%) rotate(-3deg)}60%{-webkit-transform:translateX(10%) rotate(2deg);-ms-transform:translateX(10%) rotate(2deg);transform:translateX(10%) rotate(2deg)}75%{-webkit-transform:translateX(-5%) rotate(-1deg);-ms-transform:translateX(-5%) rotate(-1deg);transform:translateX(-5%) rotate(-1deg)}100%{-webkit-transform:translateX(0%);-ms-transform:translateX(0%);transform:translateX(0%)}}.wobble{-webkit-animation-name:wobble;animation-name:wobble}@-webkit-keyframes bounceIn{0%{opacity:0;-webkit-transform:scale(.3);transform:scale(.3)}50%{opacity:1;-webkit-transform:scale(1.05);transform:scale(1.05)}70%{-webkit-transform:scale(.9);transform:scale(.9)}100%{opacity:1;-webkit-transform:scale(1);transform:scale(1)}}@keyframes bounceIn{0%{opacity:0;-webkit-transform:scale(.3);-ms-transform:scale(.3);transform:scale(.3)}50%{opacity:1;-webkit-transform:scale(1.05);-ms-transform:scale(1.05);transform:scale(1.05)}70%{-webkit-transform:scale(.9);-ms-transform:scale(.9);transform:scale(.9)}100%{opacity:1;-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}}.bounceIn{-webkit-animation-name:bounceIn;animation-name:bounceIn}@-webkit-keyframes bounceInDown{0%{opacity:0;-webkit-transform:translateY(-2000px);transform:translateY(-2000px)}60%{opacity:1;-webkit-transform:translateY(30px);transform:translateY(30px)}80%{-webkit-transform:translateY(-10px);transform:translateY(-10px)}100%{-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes bounceInDown{0%{opacity:0;-webkit-transform:translateY(-2000px);-ms-transform:translateY(-2000px);transform:translateY(-2000px)}60%{opacity:1;-webkit-transform:translateY(30px);-ms-transform:translateY(30px);transform:translateY(30px)}80%{-webkit-transform:translateY(-10px);-ms-transform:translateY(-10px);transform:translateY(-10px)}100%{-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}}.bounceInDown{-webkit-animation-name:bounceInDown;animation-name:bounceInDown}@-webkit-keyframes bounceInLeft{0%{opacity:0;-webkit-transform:translateX(-2000px);transform:translateX(-2000px)}60%{opacity:1;-webkit-transform:translateX(30px);transform:translateX(30px)}80%{-webkit-transform:translateX(-10px);transform:translateX(-10px)}100%{-webkit-transform:translateX(0);transform:translateX(0)}}@keyframes bounceInLeft{0%{opacity:0;-webkit-transform:translateX(-2000px);-ms-transform:translateX(-2000px);transform:translateX(-2000px)}60%{opacity:1;-webkit-transform:translateX(30px);-ms-transform:translateX(30px);transform:translateX(30px)}80%{-webkit-transform:translateX(-10px);-ms-transform:translateX(-10px);transform:translateX(-10px)}100%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}}.bounceInLeft{-webkit-animation-name:bounceInLeft;animation-name:bounceInLeft}@-webkit-keyframes bounceInRight{0%{opacity:0;-webkit-transform:translateX(2000px);transform:translateX(2000px)}60%{opacity:1;-webkit-transform:translateX(-30px);transform:translateX(-30px)}80%{-webkit-transform:translateX(10px);transform:translateX(10px)}100%{-webkit-transform:translateX(0);transform:translateX(0)}}@keyframes bounceInRight{0%{opacity:0;-webkit-transform:translateX(2000px);-ms-transform:translateX(2000px);transform:translateX(2000px)}60%{opacity:1;-webkit-transform:translateX(-30px);-ms-transform:translateX(-30px);transform:translateX(-30px)}80%{-webkit-transform:translateX(10px);-ms-transform:translateX(10px);transform:translateX(10px)}100%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}}.bounceInRight{-webkit-animation-name:bounceInRight;animation-name:bounceInRight}@-webkit-keyframes bounceInUp{0%{opacity:0;-webkit-transform:translateY(2000px);transform:translateY(2000px)}60%{opacity:1;-webkit-transform:translateY(-30px);transform:translateY(-30px)}80%{-webkit-transform:translateY(10px);transform:translateY(10px)}100%{-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes bounceInUp{0%{opacity:0;-webkit-transform:translateY(2000px);-ms-transform:translateY(2000px);transform:translateY(2000px)}60%{opacity:1;-webkit-transform:translateY(-30px);-ms-transform:translateY(-30px);transform:translateY(-30px)}80%{-webkit-transform:translateY(10px);-ms-transform:translateY(10px);transform:translateY(10px)}100%{-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}}.bounceInUp{-webkit-animation-name:bounceInUp;animation-name:bounceInUp}@-webkit-keyframes bounceOut{0%{-webkit-transform:scale(1);transform:scale(1)}25%{-webkit-transform:scale(.95);transform:scale(.95)}50%{opacity:1;-webkit-transform:scale(1.1);transform:scale(1.1)}100%{opacity:0;-webkit-transform:scale(.3);transform:scale(.3)}}@keyframes bounceOut{0%{-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}25%{-webkit-transform:scale(.95);-ms-transform:scale(.95);transform:scale(.95)}50%{opacity:1;-webkit-transform:scale(1.1);-ms-transform:scale(1.1);transform:scale(1.1)}100%{opacity:0;-webkit-transform:scale(.3);-ms-transform:scale(.3);transform:scale(.3)}}.bounceOut{-webkit-animation-name:bounceOut;animation-name:bounceOut}@-webkit-keyframes bounceOutDown{0%{-webkit-transform:translateY(0);transform:translateY(0)}20%{opacity:1;-webkit-transform:translateY(-20px);transform:translateY(-20px)}100%{opacity:0;-webkit-transform:translateY(2000px);transform:translateY(2000px)}}@keyframes bounceOutDown{0%{-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}20%{opacity:1;-webkit-transform:translateY(-20px);-ms-transform:translateY(-20px);transform:translateY(-20px)}100%{opacity:0;-webkit-transform:translateY(2000px);-ms-transform:translateY(2000px);transform:translateY(2000px)}}.bounceOutDown{-webkit-animation-name:bounceOutDown;animation-name:bounceOutDown}@-webkit-keyframes bounceOutLeft{0%{-webkit-transform:translateX(0);transform:translateX(0)}20%{opacity:1;-webkit-transform:translateX(20px);transform:translateX(20px)}100%{opacity:0;-webkit-transform:translateX(-2000px);transform:translateX(-2000px)}}@keyframes bounceOutLeft{0%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}20%{opacity:1;-webkit-transform:translateX(20px);-ms-transform:translateX(20px);transform:translateX(20px)}100%{opacity:0;-webkit-transform:translateX(-2000px);-ms-transform:translateX(-2000px);transform:translateX(-2000px)}}.bounceOutLeft{-webkit-animation-name:bounceOutLeft;animation-name:bounceOutLeft}@-webkit-keyframes bounceOutRight{0%{-webkit-transform:translateX(0);transform:translateX(0)}20%{opacity:1;-webkit-transform:translateX(-20px);transform:translateX(-20px)}100%{opacity:0;-webkit-transform:translateX(2000px);transform:translateX(2000px)}}@keyframes bounceOutRight{0%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}20%{opacity:1;-webkit-transform:translateX(-20px);-ms-transform:translateX(-20px);transform:translateX(-20px)}100%{opacity:0;-webkit-transform:translateX(2000px);-ms-transform:translateX(2000px);transform:translateX(2000px)}}.bounceOutRight{-webkit-animation-name:bounceOutRight;animation-name:bounceOutRight}@-webkit-keyframes bounceOutUp{0%{-webkit-transform:translateY(0);transform:translateY(0)}20%{opacity:1;-webkit-transform:translateY(20px);transform:translateY(20px)}100%{opacity:0;-webkit-transform:translateY(-2000px);transform:translateY(-2000px)}}@keyframes bounceOutUp{0%{-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}20%{opacity:1;-webkit-transform:translateY(20px);-ms-transform:translateY(20px);transform:translateY(20px)}100%{opacity:0;-webkit-transform:translateY(-2000px);-ms-transform:translateY(-2000px);transform:translateY(-2000px)}}.bounceOutUp{-webkit-animation-name:bounceOutUp;animation-name:bounceOutUp}@-webkit-keyframes fadeIn{0%{opacity:0}100%{opacity:1}}@keyframes fadeIn{0%{opacity:0}100%{opacity:1}}.fadeIn{-webkit-animation-name:fadeIn;animation-name:fadeIn}@-webkit-keyframes fadeInDown{0%{opacity:0;-webkit-transform:translateY(-20px);transform:translateY(-20px)}100%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes fadeInDown{0%{opacity:0;-webkit-transform:translateY(-20px);-ms-transform:translateY(-20px);transform:translateY(-20px)}100%{opacity:1;-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}}.fadeInDown{-webkit-animation-name:fadeInDown;animation-name:fadeInDown}@-webkit-keyframes fadeInDownBig{0%{opacity:0;-webkit-transform:translateY(-2000px);transform:translateY(-2000px)}100%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes fadeInDownBig{0%{opacity:0;-webkit-transform:translateY(-2000px);-ms-transform:translateY(-2000px);transform:translateY(-2000px)}100%{opacity:1;-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}}.fadeInDownBig{-webkit-animation-name:fadeInDownBig;animation-name:fadeInDownBig}@-webkit-keyframes fadeInLeft{0%{opacity:0;-webkit-transform:translateX(-20px);transform:translateX(-20px)}100%{opacity:1;-webkit-transform:translateX(0);transform:translateX(0)}}@keyframes fadeInLeft{0%{opacity:0;-webkit-transform:translateX(-20px);-ms-transform:translateX(-20px);transform:translateX(-20px)}100%{opacity:1;-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}}.fadeInLeft{-webkit-animation-name:fadeInLeft;animation-name:fadeInLeft}@-webkit-keyframes fadeInLeftBig{0%{opacity:0;-webkit-transform:translateX(-2000px);transform:translateX(-2000px)}100%{opacity:1;-webkit-transform:translateX(0);transform:translateX(0)}}@keyframes fadeInLeftBig{0%{opacity:0;-webkit-transform:translateX(-2000px);-ms-transform:translateX(-2000px);transform:translateX(-2000px)}100%{opacity:1;-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}}.fadeInLeftBig{-webkit-animation-name:fadeInLeftBig;animation-name:fadeInLeftBig}@-webkit-keyframes fadeInRight{0%{opacity:0;-webkit-transform:translateX(20px);transform:translateX(20px)}100%{opacity:1;-webkit-transform:translateX(0);transform:translateX(0)}}@keyframes fadeInRight{0%{opacity:0;-webkit-transform:translateX(20px);-ms-transform:translateX(20px);transform:translateX(20px)}100%{opacity:1;-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}}.fadeInRight{-webkit-animation-name:fadeInRight;animation-name:fadeInRight}@-webkit-keyframes fadeInRightBig{0%{opacity:0;-webkit-transform:translateX(2000px);transform:translateX(2000px)}100%{opacity:1;-webkit-transform:translateX(0);transform:translateX(0)}}@keyframes fadeInRightBig{0%{opacity:0;-webkit-transform:translateX(2000px);-ms-transform:translateX(2000px);transform:translateX(2000px)}100%{opacity:1;-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}}.fadeInRightBig{-webkit-animation-name:fadeInRightBig;animation-name:fadeInRightBig}@-webkit-keyframes fadeInUp{0%{opacity:0;-webkit-transform:translateY(20px);transform:translateY(20px)}100%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes fadeInUp{0%{opacity:0;-webkit-transform:translateY(20px);-ms-transform:translateY(20px);transform:translateY(20px)}100%{opacity:1;-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}}.fadeInUp{-webkit-animation-name:fadeInUp;animation-name:fadeInUp}@-webkit-keyframes fadeInUpBig{0%{opacity:0;-webkit-transform:translateY(2000px);transform:translateY(2000px)}100%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes fadeInUpBig{0%{opacity:0;-webkit-transform:translateY(2000px);-ms-transform:translateY(2000px);transform:translateY(2000px)}100%{opacity:1;-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}}.fadeInUpBig{-webkit-animation-name:fadeInUpBig;animation-name:fadeInUpBig}@-webkit-keyframes fadeOut{0%{opacity:1}100%{opacity:0}}@keyframes fadeOut{0%{opacity:1}100%{opacity:0}}.fadeOut{-webkit-animation-name:fadeOut;animation-name:fadeOut}@-webkit-keyframes fadeOutDown{0%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}100%{opacity:0;-webkit-transform:translateY(20px);transform:translateY(20px)}}@keyframes fadeOutDown{0%{opacity:1;-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}100%{opacity:0;-webkit-transform:translateY(20px);-ms-transform:translateY(20px);transform:translateY(20px)}}.fadeOutDown{-webkit-animation-name:fadeOutDown;animation-name:fadeOutDown}@-webkit-keyframes fadeOutDownBig{0%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}100%{opacity:0;-webkit-transform:translateY(2000px);transform:translateY(2000px)}}@keyframes fadeOutDownBig{0%{opacity:1;-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}100%{opacity:0;-webkit-transform:translateY(2000px);-ms-transform:translateY(2000px);transform:translateY(2000px)}}.fadeOutDownBig{-webkit-animation-name:fadeOutDownBig;animation-name:fadeOutDownBig}@-webkit-keyframes fadeOutLeft{0%{opacity:1;-webkit-transform:translateX(0);transform:translateX(0)}100%{opacity:0;-webkit-transform:translateX(-20px);transform:translateX(-20px)}}@keyframes fadeOutLeft{0%{opacity:1;-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}100%{opacity:0;-webkit-transform:translateX(-20px);-ms-transform:translateX(-20px);transform:translateX(-20px)}}.fadeOutLeft{-webkit-animation-name:fadeOutLeft;animation-name:fadeOutLeft}@-webkit-keyframes fadeOutLeftBig{0%{opacity:1;-webkit-transform:translateX(0);transform:translateX(0)}100%{opacity:0;-webkit-transform:translateX(-2000px);transform:translateX(-2000px)}}@keyframes fadeOutLeftBig{0%{opacity:1;-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}100%{opacity:0;-webkit-transform:translateX(-2000px);-ms-transform:translateX(-2000px);transform:translateX(-2000px)}}.fadeOutLeftBig{-webkit-animation-name:fadeOutLeftBig;animation-name:fadeOutLeftBig}@-webkit-keyframes fadeOutRight{0%{opacity:1;-webkit-transform:translateX(0);transform:translateX(0)}100%{opacity:0;-webkit-transform:translateX(20px);transform:translateX(20px)}}@keyframes fadeOutRight{0%{opacity:1;-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}100%{opacity:0;-webkit-transform:translateX(20px);-ms-transform:translateX(20px);transform:translateX(20px)}}.fadeOutRight{-webkit-animation-name:fadeOutRight;animation-name:fadeOutRight}@-webkit-keyframes fadeOutRightBig{0%{opacity:1;-webkit-transform:translateX(0);transform:translateX(0)}100%{opacity:0;-webkit-transform:translateX(2000px);transform:translateX(2000px)}}@keyframes fadeOutRightBig{0%{opacity:1;-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}100%{opacity:0;-webkit-transform:translateX(2000px);-ms-transform:translateX(2000px);transform:translateX(2000px)}}.fadeOutRightBig{-webkit-animation-name:fadeOutRightBig;animation-name:fadeOutRightBig}@-webkit-keyframes fadeOutUp{0%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}100%{opacity:0;-webkit-transform:translateY(-20px);transform:translateY(-20px)}}@keyframes fadeOutUp{0%{opacity:1;-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}100%{opacity:0;-webkit-transform:translateY(-20px);-ms-transform:translateY(-20px);transform:translateY(-20px)}}.fadeOutUp{-webkit-animation-name:fadeOutUp;animation-name:fadeOutUp}@-webkit-keyframes fadeOutUpBig{0%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}100%{opacity:0;-webkit-transform:translateY(-2000px);transform:translateY(-2000px)}}@keyframes fadeOutUpBig{0%{opacity:1;-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}100%{opacity:0;-webkit-transform:translateY(-2000px);-ms-transform:translateY(-2000px);transform:translateY(-2000px)}}.fadeOutUpBig{-webkit-animation-name:fadeOutUpBig;animation-name:fadeOutUpBig}@-webkit-keyframes flip{0%{-webkit-transform:perspective(400px) translateZ(0) rotateY(0) scale(1);transform:perspective(400px) translateZ(0) rotateY(0) scale(1);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}40%{-webkit-transform:perspective(400px) translateZ(150px) rotateY(170deg) scale(1);transform:perspective(400px) translateZ(150px) rotateY(170deg) scale(1);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}50%{-webkit-transform:perspective(400px) translateZ(150px) rotateY(190deg) scale(1);transform:perspective(400px) translateZ(150px) rotateY(190deg) scale(1);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}80%{-webkit-transform:perspective(400px) translateZ(0) rotateY(360deg) scale(.95);transform:perspective(400px) translateZ(0) rotateY(360deg) scale(.95);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}100%{-webkit-transform:perspective(400px) translateZ(0) rotateY(360deg) scale(1);transform:perspective(400px) translateZ(0) rotateY(360deg) scale(1);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}}@keyframes flip{0%{-webkit-transform:perspective(400px) translateZ(0) rotateY(0) scale(1);-ms-transform:perspective(400px) translateZ(0) rotateY(0) scale(1);transform:perspective(400px) translateZ(0) rotateY(0) scale(1);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}40%{-webkit-transform:perspective(400px) translateZ(150px) rotateY(170deg) scale(1);-ms-transform:perspective(400px) translateZ(150px) rotateY(170deg) scale(1);transform:perspective(400px) translateZ(150px) rotateY(170deg) scale(1);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}50%{-webkit-transform:perspective(400px) translateZ(150px) rotateY(190deg) scale(1);-ms-transform:perspective(400px) translateZ(150px) rotateY(190deg) scale(1);transform:perspective(400px) translateZ(150px) rotateY(190deg) scale(1);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}80%{-webkit-transform:perspective(400px) translateZ(0) rotateY(360deg) scale(.95);-ms-transform:perspective(400px) translateZ(0) rotateY(360deg) scale(.95);transform:perspective(400px) translateZ(0) rotateY(360deg) scale(.95);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}100%{-webkit-transform:perspective(400px) translateZ(0) rotateY(360deg) scale(1);-ms-transform:perspective(400px) translateZ(0) rotateY(360deg) scale(1);transform:perspective(400px) translateZ(0) rotateY(360deg) scale(1);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}}.animated.flip{-webkit-backface-visibility:visible;-ms-backface-visibility:visible;backface-visibility:visible;-webkit-animation-name:flip;animation-name:flip}@-webkit-keyframes flipInX{0%{-webkit-transform:perspective(400px) rotateX(90deg);transform:perspective(400px) rotateX(90deg);opacity:0}40%{-webkit-transform:perspective(400px) rotateX(-10deg);transform:perspective(400px) rotateX(-10deg)}70%{-webkit-transform:perspective(400px) rotateX(10deg);transform:perspective(400px) rotateX(10deg)}100%{-webkit-transform:perspective(400px) rotateX(0deg);transform:perspective(400px) rotateX(0deg);opacity:1}}@keyframes flipInX{0%{-webkit-transform:perspective(400px) rotateX(90deg);-ms-transform:perspective(400px) rotateX(90deg);transform:perspective(400px) rotateX(90deg);opacity:0}40%{-webkit-transform:perspective(400px) rotateX(-10deg);-ms-transform:perspective(400px) rotateX(-10deg);transform:perspective(400px) rotateX(-10deg)}70%{-webkit-transform:perspective(400px) rotateX(10deg);-ms-transform:perspective(400px) rotateX(10deg);transform:perspective(400px) rotateX(10deg)}100%{-webkit-transform:perspective(400px) rotateX(0deg);-ms-transform:perspective(400px) rotateX(0deg);transform:perspective(400px) rotateX(0deg);opacity:1}}.flipInX{-webkit-backface-visibility:visible!important;-ms-backface-visibility:visible!important;backface-visibility:visible!important;-webkit-animation-name:flipInX;animation-name:flipInX}@-webkit-keyframes flipInY{0%{-webkit-transform:perspective(400px) rotateY(90deg);transform:perspective(400px) rotateY(90deg);opacity:0}40%{-webkit-transform:perspective(400px) rotateY(-10deg);transform:perspective(400px) rotateY(-10deg)}70%{-webkit-transform:perspective(400px) rotateY(10deg);transform:perspective(400px) rotateY(10deg)}100%{-webkit-transform:perspective(400px) rotateY(0deg);transform:perspective(400px) rotateY(0deg);opacity:1}}@keyframes flipInY{0%{-webkit-transform:perspective(400px) rotateY(90deg);-ms-transform:perspective(400px) rotateY(90deg);transform:perspective(400px) rotateY(90deg);opacity:0}40%{-webkit-transform:perspective(400px) rotateY(-10deg);-ms-transform:perspective(400px) rotateY(-10deg);transform:perspective(400px) rotateY(-10deg)}70%{-webkit-transform:perspective(400px) rotateY(10deg);-ms-transform:perspective(400px) rotateY(10deg);transform:perspective(400px) rotateY(10deg)}100%{-webkit-transform:perspective(400px) rotateY(0deg);-ms-transform:perspective(400px) rotateY(0deg);transform:perspective(400px) rotateY(0deg);opacity:1}}.flipInY{-webkit-backface-visibility:visible!important;-ms-backface-visibility:visible!important;backface-visibility:visible!important;-webkit-animation-name:flipInY;animation-name:flipInY}@-webkit-keyframes flipOutX{0%{-webkit-transform:perspective(400px) rotateX(0deg);transform:perspective(400px) rotateX(0deg);opacity:1}100%{-webkit-transform:perspective(400px) rotateX(90deg);transform:perspective(400px) rotateX(90deg);opacity:0}}@keyframes flipOutX{0%{-webkit-transform:perspective(400px) rotateX(0deg);-ms-transform:perspective(400px) rotateX(0deg);transform:perspective(400px) rotateX(0deg);opacity:1}100%{-webkit-transform:perspective(400px) rotateX(90deg);-ms-transform:perspective(400px) rotateX(90deg);transform:perspective(400px) rotateX(90deg);opacity:0}}.flipOutX{-webkit-animation-name:flipOutX;animation-name:flipOutX;-webkit-backface-visibility:visible!important;-ms-backface-visibility:visible!important;backface-visibility:visible!important}@-webkit-keyframes flipOutY{0%{-webkit-transform:perspective(400px) rotateY(0deg);transform:perspective(400px) rotateY(0deg);opacity:1}100%{-webkit-transform:perspective(400px) rotateY(90deg);transform:perspective(400px) rotateY(90deg);opacity:0}}@keyframes flipOutY{0%{-webkit-transform:perspective(400px) rotateY(0deg);-ms-transform:perspective(400px) rotateY(0deg);transform:perspective(400px) rotateY(0deg);opacity:1}100%{-webkit-transform:perspective(400px) rotateY(90deg);-ms-transform:perspective(400px) rotateY(90deg);transform:perspective(400px) rotateY(90deg);opacity:0}}.flipOutY{-webkit-backface-visibility:visible!important;-ms-backface-visibility:visible!important;backface-visibility:visible!important;-webkit-animation-name:flipOutY;animation-name:flipOutY}@-webkit-keyframes lightSpeedIn{0%{-webkit-transform:translateX(100%) skewX(-30deg);transform:translateX(100%) skewX(-30deg);opacity:0}60%{-webkit-transform:translateX(-20%) skewX(30deg);transform:translateX(-20%) skewX(30deg);opacity:1}80%{-webkit-transform:translateX(0%) skewX(-15deg);transform:translateX(0%) skewX(-15deg);opacity:1}100%{-webkit-transform:translateX(0%) skewX(0deg);transform:translateX(0%) skewX(0deg);opacity:1}}@keyframes lightSpeedIn{0%{-webkit-transform:translateX(100%) skewX(-30deg);-ms-transform:translateX(100%) skewX(-30deg);transform:translateX(100%) skewX(-30deg);opacity:0}60%{-webkit-transform:translateX(-20%) skewX(30deg);-ms-transform:translateX(-20%) skewX(30deg);transform:translateX(-20%) skewX(30deg);opacity:1}80%{-webkit-transform:translateX(0%) skewX(-15deg);-ms-transform:translateX(0%) skewX(-15deg);transform:translateX(0%) skewX(-15deg);opacity:1}100%{-webkit-transform:translateX(0%) skewX(0deg);-ms-transform:translateX(0%) skewX(0deg);transform:translateX(0%) skewX(0deg);opacity:1}}.lightSpeedIn{-webkit-animation-name:lightSpeedIn;animation-name:lightSpeedIn;-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}@-webkit-keyframes lightSpeedOut{0%{-webkit-transform:translateX(0%) skewX(0deg);transform:translateX(0%) skewX(0deg);opacity:1}100%{-webkit-transform:translateX(100%) skewX(-30deg);transform:translateX(100%) skewX(-30deg);opacity:0}}@keyframes lightSpeedOut{0%{-webkit-transform:translateX(0%) skewX(0deg);-ms-transform:translateX(0%) skewX(0deg);transform:translateX(0%) skewX(0deg);opacity:1}100%{-webkit-transform:translateX(100%) skewX(-30deg);-ms-transform:translateX(100%) skewX(-30deg);transform:translateX(100%) skewX(-30deg);opacity:0}}.lightSpeedOut{-webkit-animation-name:lightSpeedOut;animation-name:lightSpeedOut;-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}@-webkit-keyframes rotateIn{0%{-webkit-transform-origin:center center;transform-origin:center center;-webkit-transform:rotate(-200deg);transform:rotate(-200deg);opacity:0}100%{-webkit-transform-origin:center center;transform-origin:center center;-webkit-transform:rotate(0);transform:rotate(0);opacity:1}}@keyframes rotateIn{0%{-webkit-transform-origin:center center;-ms-transform-origin:center center;transform-origin:center center;-webkit-transform:rotate(-200deg);-ms-transform:rotate(-200deg);transform:rotate(-200deg);opacity:0}100%{-webkit-transform-origin:center center;-ms-transform-origin:center center;transform-origin:center center;-webkit-transform:rotate(0);-ms-transform:rotate(0);transform:rotate(0);opacity:1}}.rotateIn{-webkit-animation-name:rotateIn;animation-name:rotateIn}@-webkit-keyframes rotateInDownLeft{0%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(-90deg);transform:rotate(-90deg);opacity:0}100%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(0);transform:rotate(0);opacity:1}}@keyframes rotateInDownLeft{0%{-webkit-transform-origin:left bottom;-ms-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(-90deg);-ms-transform:rotate(-90deg);transform:rotate(-90deg);opacity:0}100%{-webkit-transform-origin:left bottom;-ms-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(0);-ms-transform:rotate(0);transform:rotate(0);opacity:1}}.rotateInDownLeft{-webkit-animation-name:rotateInDownLeft;animation-name:rotateInDownLeft}@-webkit-keyframes rotateInDownRight{0%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(90deg);transform:rotate(90deg);opacity:0}100%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(0);transform:rotate(0);opacity:1}}@keyframes rotateInDownRight{0%{-webkit-transform-origin:right bottom;-ms-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(90deg);-ms-transform:rotate(90deg);transform:rotate(90deg);opacity:0}100%{-webkit-transform-origin:right bottom;-ms-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(0);-ms-transform:rotate(0);transform:rotate(0);opacity:1}}.rotateInDownRight{-webkit-animation-name:rotateInDownRight;animation-name:rotateInDownRight}@-webkit-keyframes rotateInUpLeft{0%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(90deg);transform:rotate(90deg);opacity:0}100%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(0);transform:rotate(0);opacity:1}}@keyframes rotateInUpLeft{0%{-webkit-transform-origin:left bottom;-ms-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(90deg);-ms-transform:rotate(90deg);transform:rotate(90deg);opacity:0}100%{-webkit-transform-origin:left bottom;-ms-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(0);-ms-transform:rotate(0);transform:rotate(0);opacity:1}}.rotateInUpLeft{-webkit-animation-name:rotateInUpLeft;animation-name:rotateInUpLeft}@-webkit-keyframes rotateInUpRight{0%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(-90deg);transform:rotate(-90deg);opacity:0}100%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(0);transform:rotate(0);opacity:1}}@keyframes rotateInUpRight{0%{-webkit-transform-origin:right bottom;-ms-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(-90deg);-ms-transform:rotate(-90deg);transform:rotate(-90deg);opacity:0}100%{-webkit-transform-origin:right bottom;-ms-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(0);-ms-transform:rotate(0);transform:rotate(0);opacity:1}}.rotateInUpRight{-webkit-animation-name:rotateInUpRight;animation-name:rotateInUpRight}@-webkit-keyframes rotateOut{0%{-webkit-transform-origin:center center;transform-origin:center center;-webkit-transform:rotate(0);transform:rotate(0);opacity:1}100%{-webkit-transform-origin:center center;transform-origin:center center;-webkit-transform:rotate(200deg);transform:rotate(200deg);opacity:0}}@keyframes rotateOut{0%{-webkit-transform-origin:center center;-ms-transform-origin:center center;transform-origin:center center;-webkit-transform:rotate(0);-ms-transform:rotate(0);transform:rotate(0);opacity:1}100%{-webkit-transform-origin:center center;-ms-transform-origin:center center;transform-origin:center center;-webkit-transform:rotate(200deg);-ms-transform:rotate(200deg);transform:rotate(200deg);opacity:0}}.rotateOut{-webkit-animation-name:rotateOut;animation-name:rotateOut}@-webkit-keyframes rotateOutDownLeft{0%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(0);transform:rotate(0);opacity:1}100%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(90deg);transform:rotate(90deg);opacity:0}}@keyframes rotateOutDownLeft{0%{-webkit-transform-origin:left bottom;-ms-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(0);-ms-transform:rotate(0);transform:rotate(0);opacity:1}100%{-webkit-transform-origin:left bottom;-ms-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(90deg);-ms-transform:rotate(90deg);transform:rotate(90deg);opacity:0}}.rotateOutDownLeft{-webkit-animation-name:rotateOutDownLeft;animation-name:rotateOutDownLeft}@-webkit-keyframes rotateOutDownRight{0%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(0);transform:rotate(0);opacity:1}100%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(-90deg);transform:rotate(-90deg);opacity:0}}@keyframes rotateOutDownRight{0%{-webkit-transform-origin:right bottom;-ms-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(0);-ms-transform:rotate(0);transform:rotate(0);opacity:1}100%{-webkit-transform-origin:right bottom;-ms-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(-90deg);-ms-transform:rotate(-90deg);transform:rotate(-90deg);opacity:0}}.rotateOutDownRight{-webkit-animation-name:rotateOutDownRight;animation-name:rotateOutDownRight}@-webkit-keyframes rotateOutUpLeft{0%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(0);transform:rotate(0);opacity:1}100%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(-90deg);transform:rotate(-90deg);opacity:0}}@keyframes rotateOutUpLeft{0%{-webkit-transform-origin:left bottom;-ms-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(0);-ms-transform:rotate(0);transform:rotate(0);opacity:1}100%{-webkit-transform-origin:left bottom;-ms-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(-90deg);-ms-transform:rotate(-90deg);transform:rotate(-90deg);opacity:0}}.rotateOutUpLeft{-webkit-animation-name:rotateOutUpLeft;animation-name:rotateOutUpLeft}@-webkit-keyframes rotateOutUpRight{0%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(0);transform:rotate(0);opacity:1}100%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(90deg);transform:rotate(90deg);opacity:0}}@keyframes rotateOutUpRight{0%{-webkit-transform-origin:right bottom;-ms-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(0);-ms-transform:rotate(0);transform:rotate(0);opacity:1}100%{-webkit-transform-origin:right bottom;-ms-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(90deg);-ms-transform:rotate(90deg);transform:rotate(90deg);opacity:0}}.rotateOutUpRight{-webkit-animation-name:rotateOutUpRight;animation-name:rotateOutUpRight}@-webkit-keyframes slideInDown{0%{opacity:0;-webkit-transform:translateY(-2000px);transform:translateY(-2000px)}100%{-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes slideInDown{0%{opacity:0;-webkit-transform:translateY(-2000px);-ms-transform:translateY(-2000px);transform:translateY(-2000px)}100%{-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}}.slideInDown{-webkit-animation-name:slideInDown;animation-name:slideInDown}@-webkit-keyframes slideInLeft{0%{opacity:0;-webkit-transform:translateX(-2000px);transform:translateX(-2000px)}100%{-webkit-transform:translateX(0);transform:translateX(0)}}@keyframes slideInLeft{0%{opacity:0;-webkit-transform:translateX(-2000px);-ms-transform:translateX(-2000px);transform:translateX(-2000px)}100%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}}.slideInLeft{-webkit-animation-name:slideInLeft;animation-name:slideInLeft}@-webkit-keyframes slideInRight{0%{opacity:0;-webkit-transform:translateX(2000px);transform:translateX(2000px)}100%{-webkit-transform:translateX(0);transform:translateX(0)}}@keyframes slideInRight{0%{opacity:0;-webkit-transform:translateX(2000px);-ms-transform:translateX(2000px);transform:translateX(2000px)}100%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}}.slideInRight{-webkit-animation-name:slideInRight;animation-name:slideInRight}@-webkit-keyframes slideOutLeft{0%{-webkit-transform:translateX(0);transform:translateX(0)}100%{opacity:0;-webkit-transform:translateX(-2000px);transform:translateX(-2000px)}}@keyframes slideOutLeft{0%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}100%{opacity:0;-webkit-transform:translateX(-2000px);-ms-transform:translateX(-2000px);transform:translateX(-2000px)}}.slideOutLeft{-webkit-animation-name:slideOutLeft;animation-name:slideOutLeft}@-webkit-keyframes slideOutRight{0%{-webkit-transform:translateX(0);transform:translateX(0)}100%{opacity:0;-webkit-transform:translateX(2000px);transform:translateX(2000px)}}@keyframes slideOutRight{0%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}100%{opacity:0;-webkit-transform:translateX(2000px);-ms-transform:translateX(2000px);transform:translateX(2000px)}}.slideOutRight{-webkit-animation-name:slideOutRight;animation-name:slideOutRight}@-webkit-keyframes slideOutUp{0%{-webkit-transform:translateY(0);transform:translateY(0)}100%{opacity:0;-webkit-transform:translateY(-2000px);transform:translateY(-2000px)}}@keyframes slideOutUp{0%{-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}100%{opacity:0;-webkit-transform:translateY(-2000px);-ms-transform:translateY(-2000px);transform:translateY(-2000px)}}.slideOutUp{-webkit-animation-name:slideOutUp;animation-name:slideOutUp}@-webkit-keyframes slideInUp{0%{opacity:0;-webkit-transform:translateY(2000px);transform:translateY(2000px)}100%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes slideInUp{0%{opacity:0;-webkit-transform:translateY(2000px);-ms-transform:translateY(2000px);transform:translateY(2000px)}100%{opacity:1;-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}}.slideInUp{-webkit-animation-name:slideInUp;animation-name:slideInUp}@-webkit-keyframes slideOutDown{0%{-webkit-transform:translateY(0);transform:translateY(0)}100%{opacity:0;-webkit-transform:translateY(2000px);transform:translateY(2000px)}}@keyframes slideOutDown{0%{-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}100%{opacity:0;-webkit-transform:translateY(2000px);-ms-transform:translateY(2000px);transform:translateY(2000px)}}.slideOutDown{-webkit-animation-name:slideOutDown;animation-name:slideOutDown}@-webkit-keyframes hinge{0%{-webkit-transform:rotate(0);transform:rotate(0);-webkit-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}20%,60%{-webkit-transform:rotate(80deg);transform:rotate(80deg);-webkit-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}40%{-webkit-transform:rotate(60deg);transform:rotate(60deg);-webkit-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}80%{-webkit-transform:rotate(60deg) translateY(0);transform:rotate(60deg) translateY(0);-webkit-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out;opacity:1}100%{-webkit-transform:translateY(700px);transform:translateY(700px);opacity:0}}@keyframes hinge{0%{-webkit-transform:rotate(0);-ms-transform:rotate(0);transform:rotate(0);-webkit-transform-origin:top left;-ms-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}20%,60%{-webkit-transform:rotate(80deg);-ms-transform:rotate(80deg);transform:rotate(80deg);-webkit-transform-origin:top left;-ms-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}40%{-webkit-transform:rotate(60deg);-ms-transform:rotate(60deg);transform:rotate(60deg);-webkit-transform-origin:top left;-ms-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}80%{-webkit-transform:rotate(60deg) translateY(0);-ms-transform:rotate(60deg) translateY(0);transform:rotate(60deg) translateY(0);-webkit-transform-origin:top left;-ms-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out;opacity:1}100%{-webkit-transform:translateY(700px);-ms-transform:translateY(700px);transform:translateY(700px);opacity:0}}.hinge{-webkit-animation-name:hinge;animation-name:hinge}@-webkit-keyframes rollIn{0%{opacity:0;-webkit-transform:translateX(-100%) rotate(-120deg);transform:translateX(-100%) rotate(-120deg)}100%{opacity:1;-webkit-transform:translateX(0px) rotate(0deg);transform:translateX(0px) rotate(0deg)}}@keyframes rollIn{0%{opacity:0;-webkit-transform:translateX(-100%) rotate(-120deg);-ms-transform:translateX(-100%) rotate(-120deg);transform:translateX(-100%) rotate(-120deg)}100%{opacity:1;-webkit-transform:translateX(0px) rotate(0deg);-ms-transform:translateX(0px) rotate(0deg);transform:translateX(0px) rotate(0deg)}}.rollIn{-webkit-animation-name:rollIn;animation-name:rollIn}@-webkit-keyframes rollOut{0%{opacity:1;-webkit-transform:translateX(0px) rotate(0deg);transform:translateX(0px) rotate(0deg)}100%{opacity:0;-webkit-transform:translateX(100%) rotate(120deg);transform:translateX(100%) rotate(120deg)}}@keyframes rollOut{0%{opacity:1;-webkit-transform:translateX(0px) rotate(0deg);-ms-transform:translateX(0px) rotate(0deg);transform:translateX(0px) rotate(0deg)}100%{opacity:0;-webkit-transform:translateX(100%) rotate(120deg);-ms-transform:translateX(100%) rotate(120deg);transform:translateX(100%) rotate(120deg)}}.rollOut{-webkit-animation-name:rollOut;animation-name:rollOut}@-webkit-keyframes zoomIn{0%{opacity:0;-webkit-transform:scale(.3);transform:scale(.3)}50%{opacity:1}}@keyframes zoomIn{0%{opacity:0;-webkit-transform:scale(.3);-ms-transform:scale(.3);transform:scale(.3)}50%{opacity:1}}.zoomIn{-webkit-animation-name:zoomIn;animation-name:zoomIn}@-webkit-keyframes zoomInDown{0%{opacity:0;-webkit-transform:scale(.1) translateY(-2000px);transform:scale(.1) translateY(-2000px);-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}60%{opacity:1;-webkit-transform:scale(.475) translateY(60px);transform:scale(.475) translateY(60px);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}}@keyframes zoomInDown{0%{opacity:0;-webkit-transform:scale(.1) translateY(-2000px);-ms-transform:scale(.1) translateY(-2000px);transform:scale(.1) translateY(-2000px);-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}60%{opacity:1;-webkit-transform:scale(.475) translateY(60px);-ms-transform:scale(.475) translateY(60px);transform:scale(.475) translateY(60px);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}}.zoomInDown{-webkit-animation-name:zoomInDown;animation-name:zoomInDown}@-webkit-keyframes zoomInLeft{0%{opacity:0;-webkit-transform:scale(.1) translateX(-2000px);transform:scale(.1) translateX(-2000px);-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}60%{opacity:1;-webkit-transform:scale(.475) translateX(48px);transform:scale(.475) translateX(48px);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}}@keyframes zoomInLeft{0%{opacity:0;-webkit-transform:scale(.1) translateX(-2000px);-ms-transform:scale(.1) translateX(-2000px);transform:scale(.1) translateX(-2000px);-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}60%{opacity:1;-webkit-transform:scale(.475) translateX(48px);-ms-transform:scale(.475) translateX(48px);transform:scale(.475) translateX(48px);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}}.zoomInLeft{-webkit-animation-name:zoomInLeft;animation-name:zoomInLeft}@-webkit-keyframes zoomInRight{0%{opacity:0;-webkit-transform:scale(.1) translateX(2000px);transform:scale(.1) translateX(2000px);-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}60%{opacity:1;-webkit-transform:scale(.475) translateX(-48px);transform:scale(.475) translateX(-48px);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}}@keyframes zoomInRight{0%{opacity:0;-webkit-transform:scale(.1) translateX(2000px);-ms-transform:scale(.1) translateX(2000px);transform:scale(.1) translateX(2000px);-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}60%{opacity:1;-webkit-transform:scale(.475) translateX(-48px);-ms-transform:scale(.475) translateX(-48px);transform:scale(.475) translateX(-48px);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}}.zoomInRight{-webkit-animation-name:zoomInRight;animation-name:zoomInRight}@-webkit-keyframes zoomInUp{0%{opacity:0;-webkit-transform:scale(.1) translateY(2000px);transform:scale(.1) translateY(2000px);-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}60%{opacity:1;-webkit-transform:scale(.475) translateY(-60px);transform:scale(.475) translateY(-60px);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}}@keyframes zoomInUp{0%{opacity:0;-webkit-transform:scale(.1) translateY(2000px);-ms-transform:scale(.1) translateY(2000px);transform:scale(.1) translateY(2000px);-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}60%{opacity:1;-webkit-transform:scale(.475) translateY(-60px);-ms-transform:scale(.475) translateY(-60px);transform:scale(.475) translateY(-60px);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}}.zoomInUp{-webkit-animation-name:zoomInUp;animation-name:zoomInUp}@-webkit-keyframes zoomOut{0%{opacity:1;-webkit-transform:scale(1);transform:scale(1)}50%{opacity:0;-webkit-transform:scale(.3);transform:scale(.3)}100%{opacity:0}}@keyframes zoomOut{0%{opacity:1;-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}50%{opacity:0;-webkit-transform:scale(.3);-ms-transform:scale(.3);transform:scale(.3)}100%{opacity:0}}.zoomOut{-webkit-animation-name:zoomOut;animation-name:zoomOut}@-webkit-keyframes zoomOutDown{40%{opacity:1;-webkit-transform:scale(.475) translateY(-60px);transform:scale(.475) translateY(-60px);-webkit-animation-timing-function:linear;animation-timing-function:linear}100%{opacity:0;-webkit-transform:scale(.1) translateY(2000px);transform:scale(.1) translateY(2000px);-webkit-transform-origin:center bottom;transform-origin:center bottom}}@keyframes zoomOutDown{40%{opacity:1;-webkit-transform:scale(.475) translateY(-60px);-ms-transform:scale(.475) translateY(-60px);transform:scale(.475) translateY(-60px);-webkit-animation-timing-function:linear;animation-timing-function:linear}100%{opacity:0;-webkit-transform:scale(.1) translateY(2000px);-ms-transform:scale(.1) translateY(2000px);transform:scale(.1) translateY(2000px);-webkit-transform-origin:center bottom;-ms-transform-origin:center bottom;transform-origin:center bottom}}.zoomOutDown{-webkit-animation-name:zoomOutDown;animation-name:zoomOutDown}@-webkit-keyframes zoomOutLeft{40%{opacity:1;-webkit-transform:scale(.475) translateX(42px);transform:scale(.475) translateX(42px);-webkit-animation-timing-function:linear;animation-timing-function:linear}100%{opacity:0;-webkit-transform:scale(.1) translateX(-2000px);transform:scale(.1) translateX(-2000px);-webkit-transform-origin:left center;transform-origin:left center}}@keyframes zoomOutLeft{40%{opacity:1;-webkit-transform:scale(.475) translateX(42px);-ms-transform:scale(.475) translateX(42px);transform:scale(.475) translateX(42px);-webkit-animation-timing-function:linear;animation-timing-function:linear}100%{opacity:0;-webkit-transform:scale(.1) translateX(-2000px);-ms-transform:scale(.1) translateX(-2000px);transform:scale(.1) translateX(-2000px);-webkit-transform-origin:left center;-ms-transform-origin:left center;transform-origin:left center}}.zoomOutLeft{-webkit-animation-name:zoomOutLeft;animation-name:zoomOutLeft}@-webkit-keyframes zoomOutRight{40%{opacity:1;-webkit-transform:scale(.475) translateX(-42px);transform:scale(.475) translateX(-42px);-webkit-animation-timing-function:linear;animation-timing-function:linear}100%{opacity:0;-webkit-transform:scale(.1) translateX(2000px);transform:scale(.1) translateX(2000px);-webkit-transform-origin:right center;transform-origin:right center}}@keyframes zoomOutRight{40%{opacity:1;-webkit-transform:scale(.475) translateX(-42px);-ms-transform:scale(.475) translateX(-42px);transform:scale(.475) translateX(-42px);-webkit-animation-timing-function:linear;animation-timing-function:linear}100%{opacity:0;-webkit-transform:scale(.1) translateX(2000px);-ms-transform:scale(.1) translateX(2000px);transform:scale(.1) translateX(2000px);-webkit-transform-origin:right center;-ms-transform-origin:right center;transform-origin:right center}}.zoomOutRight{-webkit-animation-name:zoomOutRight;animation-name:zoomOutRight}@-webkit-keyframes zoomOutUp{40%{opacity:1;-webkit-transform:scale(.475) translateY(60px);transform:scale(.475) translateY(60px);-webkit-animation-timing-function:linear;animation-timing-function:linear}100%{opacity:0;-webkit-transform:scale(.1) translateY(-2000px);transform:scale(.1) translateY(-2000px);-webkit-transform-origin:center top;transform-origin:center top}}@keyframes zoomOutUp{40%{opacity:1;-webkit-transform:scale(.475) translateY(60px);-ms-transform:scale(.475) translateY(60px);transform:scale(.475) translateY(60px);-webkit-animation-timing-function:linear;animation-timing-function:linear}100%{opacity:0;-webkit-transform:scale(.1) translateY(-2000px);-ms-transform:scale(.1) translateY(-2000px);transform:scale(.1) translateY(-2000px);-webkit-transform-origin:center top;-ms-transform-origin:center top;transform-origin:center top}}.zoomOutUp{-webkit-animation-name:zoomOutUp;animation-name:zoomOutUp} \ No newline at end of file diff --git a/commons/common.scss b/commons/common.scss new file mode 100644 index 0000000..7255e66 --- /dev/null +++ b/commons/common.scss @@ -0,0 +1,475 @@ +@mixin icon-image($size) { + min-height: $size; + min-width: $size; + height: $size; + width: $size; + vertical-align: middle; +} + + +page { + /* 定义一些主题色及基础样式 */ + font-family: PingFang SC, Arial, Hiragino Sans GB, Microsoft YaHei, sans-serif; + font-size: 28rpx; + color: $-color-normal; + padding-bottom: env(safe-area-inset-bottom); + background-color: $-color-body; +} + +.bold { + font-weight: bold; +} +/* 定义字体颜色 */ +.primary { + color: $-color-primary; +} +.black { + color: $-color-black; +} + +.white { + color: $-color-white; +} + +.normal { + color: $-color-normal; +} + +.lighter { + color: $-color-lighter; +} + +.muted { + color: $-color-muted; +} + +/* 定义背景颜色 */ +.bg-primary { + background-color: $-color-primary; +} +.bg-white { + background-color: $-color-white; +} +.bg-body { + background-color: $-color-body; +} +.bg-gray { + background-color: $-color-border; +} + +/* 定义常用的弹性布局 */ +.flex { + /* #ifndef APP-NVUE */ + display: flex; + /* #endif */ + flex-direction: row; + align-items: center; +} + +.flex-wrap { + flex-wrap: wrap; +} + +.flex-nowrap { + flex-wrap: nowrap; +} +.col-baseline { + align-items: baseline; +} +.col-center { + align-items: center; +} + +.col-top { + align-items: flex-start; +} + +.col-bottom { + align-items: flex-end; +} +.col-stretch { + align-items:stretch; +} +.row-center { + justify-content: center; +} + +.row-left { + justify-content: flex-start; +} + +.row-right { + justify-content: flex-end; +} + +.row-between { + justify-content: space-between; +} +.row-around { + justify-content: space-around; +} + +.text-left { + text-align: left; +} + +.text-center { + text-align: center; +} + +.text-right { + text-align: right; +} + +.flex-col { + /* #ifndef APP-NVUE */ + display: flex; + /* #endif */ + flex-direction: column; +} +.flex-none { + flex: none; +} + +// 定义flex等分 +@for $i from 0 through 5 { + .flex-#{$i} { + flex: $i; + } +} + +// 定义内外边距,历遍1-80 +@for $i from 0 through 60 { + // 只要双数和能被5除尽的数 + @if $i % 2 == 0 or $i % 5 == 0 { + // 如:m-30 + .m-#{$i} { + margin: $i + rpx; + } + + // 如:p-30 + .p-#{$i} { + padding: $i + rpx; + } + + @each $short, $long in l left, t top, r right, b bottom { + //结果如: ml-30 + // 定义外边距 + .m#{$short}-#{$i} { + margin-#{$long}: $i + rpx; + } + + // 定义内边距 + //结果如: pl-30 + .p#{$short}-#{$i} { + padding-#{$long}: $i + rpx; + } + } + } +} + +// 定义字体大小,20-60的字体 +@for $i from 20 through 60 { + @if $i % 2 == 0 { + .fs-#{$i} { + font-size: $i + rpx; + } + } +} +// 定义圆角,10-60的圆角 +@for $i from 10 through 60 { + @if $i % 2 == 0 { + .br-#{$i} { + border-radius: $i + rpx; + } + } +} + +/* 超出隐藏 */ +/* start--文本行数限制--start */ +.line-1 { + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; +} + +.line-2 { + -webkit-line-clamp: 2; +} + +.line-3 { + -webkit-line-clamp: 3; +} + +.line-2, .line-3, { + overflow: hidden; + word-break: break-all; + text-overflow: ellipsis; + display: -webkit-box; // 弹性伸缩盒 + -webkit-box-orient: vertical; // 设置伸缩盒子元素排列方式 +} + +/* 中划线 */ +.line-through { + text-decoration: line-through; +} + + +.transition_none { + -webkit-transition: none !important; + -moz-transition: none !important; + -ms-transition: none !important; + -o-transition: none !important; + transition: none !important; +} + +.transition_none * { + -webkit-transition: none !important; + -moz-transition: none !important; + -ms-transition: none !important; + -o-transition: none !important; + transition: none !important; +} + +.center { + margin-left: auto; + margin-right: auto; +} + +.row { + width: 87.5%; + margin: 0 auto; +} + +.col-1 { + width: 100%; +} + +.col-2 { + width: 50%; +} + +.col-3 { + width: 33.333333%; +} + +.col-4 { + width: 25%; +} + +.col-5 { + width: 20%; +} + +.col-6 { + width: 16.666666%; +} + +.col-7 { + width: 14.285714%; +} + +.col-8 { + width: 12.5%; +} + +.col-9 { + width: 11.111111%; +} +.col-10 { + width: 10%; +} +.col-11 { + width: 9.09090909%; +} +.col-12 { + width: 8.3333333%; +} +.auto { + margin: 0 auto; +} + +.inline { + display: inline-block; +} + +.hidden { + overflow: hidden; +} + +.opacity0 { + opacity: 0; +} +.opacity1 { + opacity: 1; +} +.circle { + -webkit-border-radius: 50%; + -moz-border-radius: 50%; + border-radius: 50%; +} + +.blcircle { + -webkit-border-bottom-left-radius: 50%; + -moz-border-bottom-left-radius: 50%; + border-bottom-left-radius: 50%; +} + +.tlcircle { + -webkit-border-top-left-radius: 50%; + -moz-border-top-left-radius: 50%; + border-top-left-radius: 50%; +} + +.brcircle { + -webkit-border-bottom-right-radius: 50%; + -moz-border-bottom-right-radius: 50%; + border-bottom-right-radius: 50%; +} + +.trcircle { + -webkit-border-top-right-radius: 50%; + -moz-border-top-right-radius: 50%; + border-top-right-radius: 50%; +} + +.isbd { + border: 1px #e0e0e0 solid; +} + +.isbdbm { + border-bottom: 1px #e0e0e0 solid; +} + +.isbdtp { + border-top: 1px #e0e0e0 solid; +} + +.isbdrt { + border-right: 1px #e0e0e0 solid; +} + +.isbdlt { + border-left: 1px #e0e0e0 solid; +} + +.isshadow { + -webkit-box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.1); + -moz-box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.1); + box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.1); +} + +.ishalo { + -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); + -moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); + box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); +} + +.isdarkhalo { + -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.3); + -moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.3); + box-shadow: 0 0 10px rgba(0, 0, 0, 0.3); +} + +.fl { + float: left; +} + +.fr { + float: right; +} + +/* 初始化按钮 */ +page button { + padding: 0; + margin: 0; + background-color: transparent; + font-weight: normal; + font-size: 28rpx; + overflow: unset; + margin-left: 0; + margin-right: 0; +} +page button::after { + border: none; +} + +button[type=primary] { + background-color: $-color-primary; +} +.button-hover[type=primary] { + background-color: $-color-primary; +} +/* 按钮大小 */ +button[size="xs"]{ + line-height: 58rpx; + height: 58rpx; + font-size: 26rpx; + padding: 0 30rpx; +} + +button[size="sm"] { + line-height: 62rpx; + height: 62rpx; + font-size: 28rpx; + padding: 0 30rpx; +} + +button[size="md"]{ + line-height: 70rpx; + height: 70rpx; + font-size: 30rpx; + padding: 0 30rpx; +} +button[size="lg"]{ + line-height: 80rpx; + height: 80rpx; + font-size: 32rpx; + padding: 0 30rpx; +} + + + +//******图标******/ + +.icon-xs { + @include icon-image(28rpx); +} + +.icon-sm { + @include icon-image(30rpx); +} + +.icon { + @include icon-image(34rpx); +} +.icon-md { + @include icon-image(44rpx); +} +.icon-lg { + @include icon-image(52rpx); +} + +.icon-xl { + @include icon-image(64rpx); +} + +.icon-xxl { + @include icon-image(120rpx); +} + +.img-null { + width: 300rpx; + height: 300rpx; +} + +/* 隐藏滚动条 */ +::-webkit-scrollbar { + width: 0; + height: 0; + color: transparent; +} + + + + diff --git a/commons/icon-font.css b/commons/icon-font.css deleted file mode 100644 index 6270de7..0000000 --- a/commons/icon-font.css +++ /dev/null @@ -1,155 +0,0 @@ -@font-face { - font-family: "iconfont"; /* Project id 3180711 */ - src: url('https://at.alicdn.com/t/font_3180711_atv5gkgm4w4.woff2?t=1651830764889') format('woff2'), - url('https://at.alicdn.com/t/font_3180711_atv5gkgm4w4.woff?t=1651830764889') format('woff'), - url('https://at.alicdn.com/t/font_3180711_atv5gkgm4w4.ttf?t=1651830764889') format('truetype'); -} - -.icon { - font-family: "iconfont" !important; - font-size: 16px; - font-style: normal; - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; -} - -.icon-del:before { - content: "\e718"; -} - -.icon-cut:before { - content: "\e609"; -} - -.icon-add:before { - content: "\e60a"; -} - -.icon-add-picture05:before { - content: "\e639"; -} - -.icon-add-picture04:before { - content: "\e636"; -} - -.icon-add-picture03:before { - content: "\e642"; -} - -.icon-add-picture02:before { - content: "\e8bc"; -} - -.icon-add-picture01:before { - content: "\e62c"; -} - -.icon-sandian:before { - content: "\e769"; -} - -.icon-nothing-collection:before { - content: "\e610"; -} - -.icon-nothing-more:before { - content: "\e624"; -} - -.icon-nothing-data:before { - content: "\e60c"; -} - -.icon-address-check:before { - content: "\e6c2"; -} - -.icon-address-unchecked:before { - content: "\e623"; -} - -.icon-navigate-now:before { - content: "\e640"; -} - -.icon-send-goods:before { - content: "\e601"; -} - -.icon-payment:before { - content: "\e602"; -} - -.icon-finish:before { - content: "\e63f"; -} - -.icon-take:before { - content: "\e649"; -} - -.icon-refund:before { - content: "\e613"; -} - -.icon-customer-black:before { - content: "\ec2e"; -} - -.icon-customer:before { - content: "\e628"; -} - -.icon-check:before { - content: "\e61e"; -} - -.icon-del-white:before { - content: "\e61f"; -} - -.icon-screen:before { - content: "\e60b"; -} - -.icon-search:before { - content: "\e653"; -} - -.icon-caidan-mo:before { - content: "\e73e"; -} - -.icon-renwu-mo:before { - content: "\e73f"; -} - -.icon-shop-cart:before { - content: "\e73d"; -} - -.icon-caidan-active:before { - content: "\e608"; -} - -.icon-renwu-acitve:before { - content: "\e67c"; -} - -.icon-home-mo:before { - content: "\e673"; -} - -.icon-home-active:before { - content: "\e674"; -} - -.icon-return:before { - content: "\e600"; -} - -.icon-next:before { - content: "\e60e"; -} - diff --git a/commons/loading.css b/commons/loading.css deleted file mode 100644 index 9a3191a..0000000 --- a/commons/loading.css +++ /dev/null @@ -1,1054 +0,0 @@ -.loading-box { - display: flex; - justify-content: center; - width: 100%; - padding-top: 20px; - font-size: 30px; - color: rgba(253, 82, 75, 1); - vertical-align: top; - -webkit-transition: .3s color, .3s border; - transition: .3s color, .3s border; -} - -/* .loading-box:hover { - color: #d60b52; - font-size: 0; - padding: 0; - border-width: 3px; - line-height: 200px; -} -.loading-box:hover [class*="loader-"] { - font-size: 70px; - line-height: 200px; -} */ - -[class*="loader-"] { - display: inline-block; - width: 1em; - height: 1em; - color: inherit; - vertical-align: middle; - pointer-events: none; -} - -.loader-01 { - border: .2em dotted currentcolor; - border-radius: 50%; - -webkit-animation: 1s loader-01 linear infinite; - animation: 1s loader-01 linear infinite; -} - -@-webkit-keyframes loader-01 { - 0% { - -webkit-transform: rotate(0deg); - transform: rotate(0deg); - } - - 100% { - -webkit-transform: rotate(360deg); - transform: rotate(360deg); - } -} - -@keyframes loader-01 { - 0% { - -webkit-transform: rotate(0deg); - transform: rotate(0deg); - } - - 100% { - -webkit-transform: rotate(360deg); - transform: rotate(360deg); - } -} - -.loader-02 { - border: .2em solid transparent; - border-left-color: currentcolor; - border-right-color: currentcolor; - border-radius: 50%; - -webkit-animation: 1s loader-02 linear infinite; - animation: 1s loader-02 linear infinite; -} - -@-webkit-keyframes loader-02 { - 0% { - -webkit-transform: rotate(0deg); - transform: rotate(0deg); - } - - 100% { - -webkit-transform: rotate(360deg); - transform: rotate(360deg); - } -} - -@keyframes loader-02 { - 0% { - -webkit-transform: rotate(0deg); - transform: rotate(0deg); - } - - 100% { - -webkit-transform: rotate(360deg); - transform: rotate(360deg); - } -} - -.loader-03 { - border: .2em solid currentcolor; - border-bottom-color: transparent; - border-radius: 50%; - -webkit-animation: 1s loader-03 linear infinite; - animation: 1s loader-03 linear infinite; - position: relative; -} - -@-webkit-keyframes loader-03 { - 0% { - -webkit-transform: rotate(0deg); - transform: rotate(0deg); - } - - 100% { - -webkit-transform: rotate(360deg); - transform: rotate(360deg); - } -} - -@keyframes loader-03 { - 0% { - -webkit-transform: rotate(0deg); - transform: rotate(0deg); - } - - 100% { - -webkit-transform: rotate(360deg); - transform: rotate(360deg); - } -} - -.loader-04 { - border: 1px solid currentcolor; - border-radius: 50%; - -webkit-animation: 1s loader-04 linear infinite; - animation: 1s loader-04 linear infinite; - position: relative; -} - -.loader-04:before { - content: ''; - display: block; - width: 0; - height: 0; - position: absolute; - top: -.2em; - left: 50%; - border: .2em solid currentcolor; - border-radius: 50%; -} - -@-webkit-keyframes loader-04 { - 0% { - -webkit-transform: rotate(0deg); - transform: rotate(0deg); - } - - 100% { - -webkit-transform: rotate(360deg); - transform: rotate(360deg); - } -} - -@keyframes loader-04 { - 0% { - -webkit-transform: rotate(0deg); - transform: rotate(0deg); - } - - 100% { - -webkit-transform: rotate(360deg); - transform: rotate(360deg); - } -} - -.loader-05 { - border: .2em solid transparent; - border-top-color: currentcolor; - border-radius: 50%; - -webkit-animation: 1s loader-05 linear infinite; - animation: 1s loader-05 linear infinite; - position: relative; -} - -.loader-05:before { - content: ''; - display: block; - width: inherit; - height: inherit; - position: absolute; - top: -.2em; - left: -.2em; - border: .2em solid currentcolor; - border-radius: 50%; - opacity: .5; -} - -@-webkit-keyframes loader-05 { - 0% { - -webkit-transform: rotate(0deg); - transform: rotate(0deg); - } - - 100% { - -webkit-transform: rotate(360deg); - transform: rotate(360deg); - } -} - -@keyframes loader-05 { - 0% { - -webkit-transform: rotate(0deg); - transform: rotate(0deg); - } - - 100% { - -webkit-transform: rotate(360deg); - transform: rotate(360deg); - } -} - -.loader-06 { - border: .2em solid currentcolor; - border-radius: 50%; - -webkit-animation: loader-06 1s ease-out infinite; - animation: loader-06 1s ease-out infinite; -} - -@-webkit-keyframes loader-06 { - 0% { - -webkit-transform: scale(0); - transform: scale(0); - opacity: 0; - } - - 50% { - opacity: 1; - } - - 100% { - -webkit-transform: scale(1); - transform: scale(1); - opacity: 0; - } -} - -@keyframes loader-06 { - 0% { - -webkit-transform: scale(0); - transform: scale(0); - opacity: 0; - } - - 50% { - opacity: 1; - } - - 100% { - -webkit-transform: scale(1); - transform: scale(1); - opacity: 0; - } -} - -.loader-07 { - border: 0 solid transparent; - border-radius: 50%; - position: relative; -} - -.loader-07:before, -.loader-07:after { - content: ''; - border: .2em solid currentcolor; - border-radius: 50%; - width: inherit; - height: inherit; - position: absolute; - top: 0; - left: 0; - -webkit-animation: loader-07 1s linear infinite; - animation: loader-07 1s linear infinite; - opacity: 0; -} - -.loader-07:before { - -webkit-animation-delay: 1s; - animation-delay: 1s; -} - -.loader-07:after { - -webkit-animation-delay: .5s; - animation-delay: .5s; -} - -@-webkit-keyframes loader-07 { - 0% { - -webkit-transform: scale(0); - transform: scale(0); - opacity: 0; - } - - 50% { - opacity: 1; - } - - 100% { - -webkit-transform: scale(1); - transform: scale(1); - opacity: 0; - } -} - -@keyframes loader-07 { - 0% { - -webkit-transform: scale(0); - transform: scale(0); - opacity: 0; - } - - 50% { - opacity: 1; - } - - 100% { - -webkit-transform: scale(1); - transform: scale(1); - opacity: 0; - } -} - -.loader-08 { - position: relative; -} - -.loader-08:before, -.loader-08:after { - content: ''; - width: inherit; - height: inherit; - border-radius: 50%; - background-color: currentcolor; - opacity: 0.6; - position: absolute; - top: 0; - left: 0; - -webkit-animation: loader-08 2.0s infinite ease-in-out; - animation: loader-08 2.0s infinite ease-in-out; -} - -.loader-08:after { - -webkit-animation-delay: -1.0s; - animation-delay: -1.0s; -} - -@-webkit-keyframes loader-08 { - - 0%, - 100% { - -webkit-transform: scale(0); - transform: scale(0); - } - - 50% { - -webkit-transform: scale(1); - transform: scale(1); - } -} - -@keyframes loader-08 { - - 0%, - 100% { - -webkit-transform: scale(0); - transform: scale(0); - } - - 50% { - -webkit-transform: scale(1); - transform: scale(1); - } -} - -.loader-09 { - background-color: currentcolor; - border-radius: 50%; - -webkit-animation: loader-09 1.0s infinite ease-in-out; - animation: loader-09 1.0s infinite ease-in-out; -} - -@-webkit-keyframes loader-09 { - 0% { - -webkit-transform: scale(0); - transform: scale(0); - } - - 100% { - -webkit-transform: scale(1); - transform: scale(1); - opacity: 0; - } -} - -@keyframes loader-09 { - 0% { - -webkit-transform: scale(0); - transform: scale(0); - } - - 100% { - -webkit-transform: scale(1); - transform: scale(1); - opacity: 0; - } -} - -.loader-10 { - position: relative; - -webkit-animation: loader-10-1 2.0s infinite linear; - animation: loader-10-1 2.0s infinite linear; -} - -.loader-10:before, -.loader-10:after { - content: ''; - width: 0; - height: 0; - border: .5em solid currentcolor; - display: block; - position: absolute; - border-radius: 100%; - -webkit-animation: loader-10-2 2s infinite ease-in-out; - animation: loader-10-2 2s infinite ease-in-out; -} - -.loader-10:before { - top: 0; - left: 50%; -} - -.loader-10:after { - bottom: 0; - right: 50%; - -webkit-animation-delay: -1s; - animation-delay: -1s; -} - -@-webkit-keyframes loader-10-1 { - 100% { - -webkit-transform: rotate(360deg); - transform: rotate(360deg); - } -} - -@keyframes loader-10-1 { - 100% { - -webkit-transform: rotate(360deg); - transform: rotate(360deg); - } -} - -@-webkit-keyframes loader-10-2 { - - 0%, - 100% { - -webkit-transform: scale(0); - transform: scale(0); - } - - 50% { - -webkit-transform: scale(1); - transform: scale(1); - } -} - -@keyframes loader-10-2 { - - 0%, - 100% { - -webkit-transform: scale(0); - transform: scale(0); - } - - 50% { - -webkit-transform: scale(1); - transform: scale(1); - } -} - -.loader-11 { - background-color: currentcolor; - -webkit-animation: loader-11 1.2s infinite ease-in-out; - animation: loader-11 1.2s infinite ease-in-out; -} - -@-webkit-keyframes loader-11 { - 0% { - -webkit-transform: perspective(120px) rotateX(0deg) rotateY(0deg); - transform: perspective(120px) rotateX(0deg) rotateY(0deg); - } - - 50% { - -webkit-transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg); - transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg); - } - - 100% { - -webkit-transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg); - transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg); - } -} - -@keyframes loader-11 { - 0% { - -webkit-transform: perspective(120px) rotateX(0deg) rotateY(0deg); - transform: perspective(120px) rotateX(0deg) rotateY(0deg); - } - - 50% { - -webkit-transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg); - transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg); - } - - 100% { - -webkit-transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg); - transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg); - } -} - -.loader-12 { - position: relative; -} - -.loader-12:before, -.loader-12:after { - content: ''; - display: block; - position: absolute; - background-color: currentcolor; - left: 50%; - right: 0; - top: 0; - bottom: 50%; - box-shadow: -.5em 0 0 currentcolor; - -webkit-animation: loader-12 1s linear infinite; - animation: loader-12 1s linear infinite; -} - -.loader-12:after { - top: 50%; - bottom: 0; - -webkit-animation-delay: .25s; - animation-delay: .25s; -} - -@-webkit-keyframes loader-12 { - - 0%, - 100% { - box-shadow: -.5em 0 0 transparent; - background-color: currentcolor; - } - - 50% { - box-shadow: -.5em 0 0 currentcolor; - background-color: transparent; - } -} - -@keyframes loader-12 { - - 0%, - 100% { - box-shadow: -.5em 0 0 transparent; - background-color: currentcolor; - } - - 50% { - box-shadow: -.5em 0 0 currentcolor; - background-color: transparent; - } -} - -.loader-13:before, -.loader-13:after, -.loader-13 { - border-radius: 50%; - -webkit-animation-fill-mode: both; - animation-fill-mode: both; - -webkit-animation: loader-13 1.8s infinite ease-in-out; - animation: loader-13 1.8s infinite ease-in-out; -} - -.loader-13 { - color: currentcolor; - position: relative; - -webkit-transform: translateZ(0); - transform: translateZ(0); - -webkit-animation-delay: -0.16s; - animation-delay: -0.16s; - top: -1em; -} - -.loader-13:before { - right: 100%; - -webkit-animation-delay: -0.32s; - animation-delay: -0.32s; -} - -.loader-13:after { - left: 100%; -} - -.loader-13:before, -.loader-13:after { - content: ''; - display: block; - position: absolute; - top: 0; - width: inherit; - height: inherit; -} - -@-webkit-keyframes loader-13 { - - 0%, - 80%, - 100% { - box-shadow: 0 1em 0 -1em; - } - - 40% { - box-shadow: 0 1em 0 -.2em; - } -} - -@keyframes loader-13 { - - 0%, - 80%, - 100% { - box-shadow: 0 1em 0 -1em; - } - - 40% { - box-shadow: 0 1em 0 -.2em; - } -} - -.loader-14 { - border-radius: 50%; - box-shadow: 0 1em 0 -.2em currentcolor; - position: relative; - -webkit-animation: loader-14 0.8s ease-in-out alternate infinite; - animation: loader-14 0.8s ease-in-out alternate infinite; - -webkit-animation-delay: 0.32s; - animation-delay: 0.32s; - top: -1em; -} - -.loader-14:after, -.loader-14:before { - content: ''; - position: absolute; - width: inherit; - height: inherit; - border-radius: inherit; - box-shadow: inherit; - -webkit-animation: inherit; - animation: inherit; -} - -.loader-14:before { - left: -1em; - -webkit-animation-delay: 0.48s; - animation-delay: 0.48s; -} - -.loader-14:after { - right: -1em; - -webkit-animation-delay: 0.16s; - animation-delay: 0.16s; -} - -@-webkit-keyframes loader-14 { - 0% { - box-shadow: 0 2em 0 -.2em currentcolor; - } - - 100% { - box-shadow: 0 1em 0 -.2em currentcolor; - } -} - -@keyframes loader-14 { - 0% { - box-shadow: 0 2em 0 -.2em currentcolor; - } - - 100% { - box-shadow: 0 1em 0 -.2em currentcolor; - } -} - -.loader-15 { - background: currentcolor; - position: relative; - -webkit-animation: loader-15 1s ease-in-out infinite; - animation: loader-15 1s ease-in-out infinite; - -webkit-animation-delay: 0.4s; - animation-delay: 0.4s; - width: .25em; - height: .5em; -} - -.loader-15:after, -.loader-15:before { - content: ''; - position: absolute; - width: inherit; - height: inherit; - background: inherit; - -webkit-animation: inherit; - animation: inherit; -} - -.loader-15:before { - right: .5em; - -webkit-animation-delay: 0.2s; - animation-delay: 0.2s; -} - -.loader-15:after { - left: .5em; - -webkit-animation-delay: 0.6s; - animation-delay: 0.6s; -} - -@-webkit-keyframes loader-15 { - - 0%, - 100% { - box-shadow: 0 0 0 currentcolor, 0 0 0 currentcolor; - } - - 50% { - box-shadow: 0 -.25em 0 currentcolor, 0 .25em 0 currentcolor; - } -} - -@keyframes loader-15 { - - 0%, - 100% { - box-shadow: 0 0 0 currentcolor, 0 0 0 currentcolor; - } - - 50% { - box-shadow: 0 -.25em 0 currentcolor, 0 .25em 0 currentcolor; - } -} - -.loader-16 { - -webkit-transform: rotateZ(45deg); - transform: rotateZ(45deg); - -webkit-perspective: 1000px; - perspective: 1000px; - border-radius: 50%; -} - -.loader-16:before, -.loader-16:after { - content: ''; - display: block; - position: absolute; - top: 0; - left: 0; - width: inherit; - height: inherit; - border-radius: 50%; - -webkit-animation: 1s spin linear infinite; - animation: 1s spin linear infinite; -} - -.loader-16:before { - -webkit-transform: rotateX(70deg); - transform: rotateX(70deg); -} - -.loader-16:after { - -webkit-transform: rotateY(70deg); - transform: rotateY(70deg); - -webkit-animation-delay: .4s; - animation-delay: .4s; -} - -@-webkit-keyframes rotate { - 0% { - -webkit-transform: translate(-50%, -50%) rotateZ(0deg); - transform: translate(-50%, -50%) rotateZ(0deg); - } - - 100% { - -webkit-transform: translate(-50%, -50%) rotateZ(360deg); - transform: translate(-50%, -50%) rotateZ(360deg); - } -} - -@keyframes rotate { - 0% { - -webkit-transform: translate(-50%, -50%) rotateZ(0deg); - transform: translate(-50%, -50%) rotateZ(0deg); - } - - 100% { - -webkit-transform: translate(-50%, -50%) rotateZ(360deg); - transform: translate(-50%, -50%) rotateZ(360deg); - } -} - -@-webkit-keyframes rotateccw { - 0% { - -webkit-transform: translate(-50%, -50%) rotate(0deg); - transform: translate(-50%, -50%) rotate(0deg); - } - - 100% { - -webkit-transform: translate(-50%, -50%) rotate(-360deg); - transform: translate(-50%, -50%) rotate(-360deg); - } -} - -@keyframes rotateccw { - 0% { - -webkit-transform: translate(-50%, -50%) rotate(0deg); - transform: translate(-50%, -50%) rotate(0deg); - } - - 100% { - -webkit-transform: translate(-50%, -50%) rotate(-360deg); - transform: translate(-50%, -50%) rotate(-360deg); - } -} - -@-webkit-keyframes spin { - - 0%, - 100% { - box-shadow: .2em 0px 0 0px currentcolor; - } - - 12% { - box-shadow: .2em .2em 0 0 currentcolor; - } - - 25% { - box-shadow: 0 .2em 0 0px currentcolor; - } - - 37% { - box-shadow: -.2em .2em 0 0 currentcolor; - } - - 50% { - box-shadow: -.2em 0 0 0 currentcolor; - } - - 62% { - box-shadow: -.2em -.2em 0 0 currentcolor; - } - - 75% { - box-shadow: 0px -.2em 0 0 currentcolor; - } - - 87% { - box-shadow: .2em -.2em 0 0 currentcolor; - } -} - -@keyframes spin { - - 0%, - 100% { - box-shadow: .2em 0px 0 0px currentcolor; - } - - 12% { - box-shadow: .2em .2em 0 0 currentcolor; - } - - 25% { - box-shadow: 0 .2em 0 0px currentcolor; - } - - 37% { - box-shadow: -.2em .2em 0 0 currentcolor; - } - - 50% { - box-shadow: -.2em 0 0 0 currentcolor; - } - - 62% { - box-shadow: -.2em -.2em 0 0 currentcolor; - } - - 75% { - box-shadow: 0px -.2em 0 0 currentcolor; - } - - 87% { - box-shadow: .2em -.2em 0 0 currentcolor; - } -} - -.loader-17 { - position: relative; - background-color: currentcolor; - border-radius: 50%; -} - -.loader-17:after, -.loader-17:before { - content: ""; - position: absolute; - width: .25em; - height: .25em; - border-radius: 50%; - opacity: .8; -} - -.loader-17:after { - left: -.5em; - top: -.25em; - background-color: currentcolor; - -webkit-transform-origin: .75em 1em; - transform-origin: .75em 1em; - -webkit-animation: loader-17 1s linear infinite; - animation: loader-17 1s linear infinite; - opacity: .6; -} - -.loader-17:before { - left: -1.25em; - top: -.75em; - background-color: currentcolor; - -webkit-transform-origin: 1.5em 1em; - transform-origin: 1.5em 1em; - -webkit-animation: loader-17 2s linear infinite; - animation: loader-17 2s linear infinite; -} - -@-webkit-keyframes loader-17 { - 0% { - -webkit-transform: rotateZ(0deg) translate3d(0, 0, 0); - transform: rotateZ(0deg) translate3d(0, 0, 0); - } - - 100% { - -webkit-transform: rotateZ(360deg) translate3d(0, 0, 0); - transform: rotateZ(360deg) translate3d(0, 0, 0); - } -} - -@keyframes loader-17 { - 0% { - -webkit-transform: rotateZ(0deg) translate3d(0, 0, 0); - transform: rotateZ(0deg) translate3d(0, 0, 0); - } - - 100% { - -webkit-transform: rotateZ(360deg) translate3d(0, 0, 0); - transform: rotateZ(360deg) translate3d(0, 0, 0); - } -} - -.loader-18 { - position: relative; -} - -.loader-18:before, -.loader-18:after { - content: ''; - display: block; - position: absolute; - border-radius: 50%; - border: .1em solid transparent; - border-bottom-color: currentcolor; - top: 0; - left: 0; - -webkit-animation: 1s loader-18 linear infinite; - animation: 1s loader-18 linear infinite; -} - -.loader-18:before { - width: 1em; - height: 1em; -} - -.loader-18:after { - width: .8em; - height: .8em; - top: .1em; - left: .1em; - -webkit-animation-direction: reverse; - animation-direction: reverse; -} - -@-webkit-keyframes loader-18 { - 0% { - -webkit-transform: rotate(0deg); - transform: rotate(0deg); - } - - 100% { - -webkit-transform: rotate(360deg); - transform: rotate(360deg); - } -} - -@keyframes loader-18 { - 0% { - -webkit-transform: rotate(0deg); - transform: rotate(0deg); - } - - 100% { - -webkit-transform: rotate(360deg); - transform: rotate(360deg); - } -} - -.loader-19 { - border-top: .2em solid currentcolor; - border-right: .2em solid transparent; - -webkit-animation: loader-19 1s linear infinite; - animation: loader-19 1s linear infinite; - border-radius: 100%; - position: relative; -} - -@-webkit-keyframes loader-19 { - to { - -webkit-transform: rotate(360deg); - transform: rotate(360deg); - } -} - -@keyframes loader-19 { - to { - -webkit-transform: rotate(360deg); - transform: rotate(360deg); - } -} diff --git a/commons/style.css b/commons/style.css deleted file mode 100644 index 8d60e72..0000000 --- a/commons/style.css +++ /dev/null @@ -1,58 +0,0 @@ -/* 图片处理 */ -image { - /* 照顾低版本浏览器 如果图片外面包含了链接会有边框的问题 */ - border: 0; - /* 取消图片底侧有空白缝隙的问题 ① */ - vertical-align: middle; - /* 取消图片底侧有空白缝隙的问题 ② */ - object-fit: cover; -} - -/* 去除滚动条 */ -scroll-view ::-webkit-scrollbar { - display: none !important; - width: 0 !important; - height: 0 !important; - -webkit-appearance: none; - background: transparent; -} - -/* 文字行数 */ -.clips { - display: -webkit-box; - -webkit-box-orient: vertical; - -webkit-line-clamp: 1; - overflow: hidden; - text-overflow: ellipsis; - word-wrap: break-word; - word-break: break-all; -} - -/* 页面样式 */ -page { - background-color: #f7f7f7; - color: #333333; -} - -.main { - padding-bottom: 120rpx; -} - -/* 输入默认提示 */ -::-webkit-input-placeholder { - /* WebKit browsers,webkit内核浏览器 */ - color: #8f989f; -} -:-moz-placeholder { - /* Mozilla Firefox 4 to 18 */ - color: #8f989f; -} -::-moz-placeholder { - /* Mozilla Firefox 19+ */ - color: #8f989f; -} -:-ms-input-placeholder { - /* Internet Explorer 10+ */ - color: #8f989f; -} - diff --git a/commons/style.scss b/commons/style.scss new file mode 100644 index 0000000..4227d58 --- /dev/null +++ b/commons/style.scss @@ -0,0 +1,34 @@ +.main { + margin: 0 auto; + padding-bottom: 30rpx; + position: relative; + max-width: 750px; +} + +.main-app { + position: relative; + z-index: 9; +} + +/* 分类导航 */ +.cate { + display: flex; + flex-wrap: wrap; + padding:0 20rpx 40rpx 20rpx; + margin-top: 25rpx; +} + +.cate .item { + display: flex; + flex-direction: column; + align-items: center; + width: 20%; + margin-top: 40rpx; + font-size: 28rpx; + color: #6e6e6e; +} + +.cate .item>image { + width: 114rpx; + height: 114rpx; +} diff --git a/components/foot-bar/foot-bar.vue b/components/foot-bar/foot-bar.vue index 4969faa..de2dc32 100644 --- a/components/foot-bar/foot-bar.vue +++ b/components/foot-bar/foot-bar.vue @@ -1,9 +1,11 @@ @@ -22,27 +24,33 @@ return { footBarList:[ { - normalPath:'/static/foot-bar/index.png', - activePath:'/static/foot-bar/index-active.png', - key: "home", - title: "首页" + normalPath: '/static/foot-bar/index.png', + activePath: '/static/foot-bar/index-active.png', + title:'首页', + url:'/pages/home/home' }, { - normalPath:'/static/foot-bar/my.png', - activePath:'/static/foot-bar/my-active.png', - key: "my", - title: "我的" + normalPath: '/static/foot-bar/cate.png', + activePath: '/static/foot-bar/cate-active.png', + title:'商城', + url:'/pages/cate/cate' + }, + // { + // normalPath: '/static/foot-bar/integral.png', + // activePath: '/static/foot-bar/integral-active.png', + // title:'积分', + // url:'/pages/integration/integration' + // }, + { + normalPath: '/static/foot-bar/my.png', + activePath: '/static/foot-bar/my-active.png', + title:'我的', + url:'/pages/my/my' } ], //底部列表 }; }, mounted() { - if(uni.getStorageSync('footBarList')){ - this.footBarList = uni.getStorageSync('footBarList'); - }else{ - // 获取底部信息 - // this.getFootBar(); - } // 获取底部高度 const query = wx.createSelectorQuery().in(this); query.select('.foot-bar').boundingClientRect((rect) => { @@ -50,45 +58,17 @@ }).exec() }, methods:{ - - // 获取底部信息 - getFootBar(){ - this.$requst.get('/api/index/mini-program-setting').then(res => { - if(res.code == 0){ - console.log(res,'底部信息'); - let footBar= []; - res.data.footBar.forEach(item=>{ - let obj = { - normalPath: `${getApp().globalData.hostapi}`+item.icon[0], - activePath: `${getApp().globalData.hostapi}`+item.icon[1], - title:item.name - } - footBar.push(obj); - }) - this.footBarList = footBar; - uni.setStorageSync('footBarList',this.footBarList) - }else{ - this.$toolAll.tools.showToast(res.msg) - } - }) - }, // 跳转tabbar - chooseEv(index){ - console.log(index) - switch (index){ - case 0: - uni.reLaunch({ - url:'/pages/index/index', - }) - break; - case 1: - if(this.$toolAll.tools.judgeAuth()) { - uni.reLaunch({ - url:'/pages/my/my', - }) - } - break; - } + + chooseEv(index,url){ + // if(this.$toolAll.tools.judgeAuth()) { + // uni.reLaunch({ + // url:'', + // }) + // } + uni.reLaunch({ + url:url + }) }, } } @@ -100,7 +80,7 @@ justify-content: space-around; align-items: center; width: 100%; - height: 98rpx; + height:110rpx; background-color: #ffffff; box-shadow: 0 0 16rpx rgba(146, 146, 146, .06); position: fixed; @@ -125,8 +105,8 @@ } .foot-bar .title{ width: 100%; - margin-top: 6rpx; - font-size: 22rpx; + margin-top: 12rpx; + font-size: 24rpx; line-height: 1.3; } diff --git a/components/goods-list/goods-list.vue b/components/goods-list/goods-list.vue deleted file mode 100644 index 08e9f80..0000000 --- a/components/goods-list/goods-list.vue +++ /dev/null @@ -1,260 +0,0 @@ - - - - - diff --git a/components/nothing/nothing-page.vue b/components/nothing/nothing-page.vue deleted file mode 100644 index b0c34ae..0000000 --- a/components/nothing/nothing-page.vue +++ /dev/null @@ -1,41 +0,0 @@ - - - - - diff --git a/components/nothing/pitera.vue b/components/nothing/pitera.vue deleted file mode 100644 index 25b6cc7..0000000 --- a/components/nothing/pitera.vue +++ /dev/null @@ -1,54 +0,0 @@ - - - - - diff --git a/components/status-nav/status-nav.vue b/components/status-nav/status-nav.vue index c6c7909..832d6ad 100644 --- a/components/status-nav/status-nav.vue +++ b/components/status-nav/status-nav.vue @@ -1,4 +1,5 @@ diff --git a/components/swipers/swiper-lamp.vue b/components/swipers/swiper-lamp.vue deleted file mode 100644 index 348988d..0000000 --- a/components/swipers/swiper-lamp.vue +++ /dev/null @@ -1,62 +0,0 @@ - - - - - diff --git a/components/swipers/swiper-pu.vue b/components/swipers/swiper-pu.vue index 7b14bd0..8c40ad9 100644 --- a/components/swipers/swiper-pu.vue +++ b/components/swipers/swiper-pu.vue @@ -1,6 +1,6 @@