parent
d00a079c0a
commit
b0cf01c869
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,103 @@
|
|||||||
|
@import url("https://fonts.googleapis.com/css2?family=Rubik:wght@600&display=swap");
|
||||||
|
@import url("https://fonts.googleapis.com/css2?family=DM+Serif+Text&display=swap");
|
||||||
|
.my-account {
|
||||||
|
position: relative;
|
||||||
|
width: 100%;
|
||||||
|
padding: 20px;
|
||||||
|
}
|
||||||
|
.my-account .avatar {
|
||||||
|
display: -webkit-box;
|
||||||
|
display: -ms-flexbox;
|
||||||
|
display: flex;
|
||||||
|
-webkit-box-align: center;
|
||||||
|
-ms-flex-align: center;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
.my-account .avatar .imgCnt {
|
||||||
|
width: 80px;
|
||||||
|
height: 80px;
|
||||||
|
min-width: 80px;
|
||||||
|
border-radius: 50%;
|
||||||
|
overflow: hidden;
|
||||||
|
margin-right: 10px;
|
||||||
|
}
|
||||||
|
.my-account .avatar .imgCnt img {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
-o-object-fit: cover;
|
||||||
|
object-fit: cover;
|
||||||
|
}
|
||||||
|
.my-account .avatar .info .name {
|
||||||
|
font-size: 20px;
|
||||||
|
font-weight: bold;
|
||||||
|
color: #303a47;
|
||||||
|
}
|
||||||
|
.my-account .avatar .info .conpany {
|
||||||
|
font-size: 15px;
|
||||||
|
}
|
||||||
|
.my-account .recommend {
|
||||||
|
display: -webkit-box;
|
||||||
|
display: -ms-flexbox;
|
||||||
|
display: flex;
|
||||||
|
-webkit-box-pack: justify;
|
||||||
|
-ms-flex-pack: justify;
|
||||||
|
justify-content: space-between;
|
||||||
|
-webkit-box-align: center;
|
||||||
|
-ms-flex-align: center;
|
||||||
|
align-items: center;
|
||||||
|
padding: 20px 0 10px;
|
||||||
|
}
|
||||||
|
.my-account .recommend .btn {
|
||||||
|
display: -webkit-box;
|
||||||
|
display: -ms-flexbox;
|
||||||
|
display: flex;
|
||||||
|
-webkit-box-pack: center;
|
||||||
|
-ms-flex-pack: center;
|
||||||
|
justify-content: center;
|
||||||
|
-webkit-box-align: center;
|
||||||
|
-ms-flex-align: center;
|
||||||
|
align-items: center;
|
||||||
|
-webkit-box-orient: vertical;
|
||||||
|
-webkit-box-direction: normal;
|
||||||
|
-ms-flex-direction: column;
|
||||||
|
flex-direction: column;
|
||||||
|
width: 30%;
|
||||||
|
height: 100px;
|
||||||
|
background-color: #fff;
|
||||||
|
border: 1px #96989a solid;
|
||||||
|
border-radius: 0;
|
||||||
|
}
|
||||||
|
.my-account .recommend .btn .img {
|
||||||
|
font-size: 35px;
|
||||||
|
color: #303a47;
|
||||||
|
}
|
||||||
|
.my-account .recommend .btn .text {
|
||||||
|
font-weight: bold;
|
||||||
|
color: #303a47;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content {
|
||||||
|
padding: 15px;
|
||||||
|
background-color: #b2c4ce;
|
||||||
|
}
|
||||||
|
.content .card {
|
||||||
|
border: none;
|
||||||
|
border-radius: 0;
|
||||||
|
}
|
||||||
|
.content .card .item {
|
||||||
|
display: -webkit-box;
|
||||||
|
display: -ms-flexbox;
|
||||||
|
display: flex;
|
||||||
|
-webkit-box-pack: justify;
|
||||||
|
-ms-flex-pack: justify;
|
||||||
|
justify-content: space-between;
|
||||||
|
-webkit-box-align: center;
|
||||||
|
-ms-flex-align: center;
|
||||||
|
align-items: center;
|
||||||
|
padding: 8px 0;
|
||||||
|
border-bottom: 1px solid #8d8d8d;
|
||||||
|
font-size: 15px;
|
||||||
|
}
|
||||||
|
.content .card .item i, .content .card .item svg {
|
||||||
|
color: #839eb6;
|
||||||
|
}
|
||||||
Binary file not shown.
|
After Width: | Height: | Size: 434 KiB |
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
|
After Width: | Height: | Size: 8.6 KiB |
Binary file not shown.
Binary file not shown.
Binary file not shown.
|
After Width: | Height: | Size: 2.1 KiB |
Binary file not shown.
Binary file not shown.
@ -0,0 +1,883 @@
|
|||||||
|
{
|
||||||
|
"version": "7",
|
||||||
|
"about": "This is a Prepros (https://prepros.io) configuration file. You can commit this file to a git repo to backup and sync project configurations.",
|
||||||
|
"config": {
|
||||||
|
"proxy": {
|
||||||
|
"enable": false,
|
||||||
|
"target": "",
|
||||||
|
"useLocalAssets": false
|
||||||
|
},
|
||||||
|
"reload": {
|
||||||
|
"enable": true,
|
||||||
|
"delay": 0,
|
||||||
|
"animate": true,
|
||||||
|
"afterUpload": false
|
||||||
|
},
|
||||||
|
"sync": {
|
||||||
|
"enable": false,
|
||||||
|
"mouse": true,
|
||||||
|
"keyboard": true,
|
||||||
|
"form": true,
|
||||||
|
"scroll": true
|
||||||
|
},
|
||||||
|
"watcher": {
|
||||||
|
"enable": true,
|
||||||
|
"maxFiles": 2000,
|
||||||
|
"usePolling": false,
|
||||||
|
"pollingInterval": 500,
|
||||||
|
"extensions": [
|
||||||
|
".html",
|
||||||
|
".htm",
|
||||||
|
".php"
|
||||||
|
],
|
||||||
|
"ignore": {
|
||||||
|
"patterns": [
|
||||||
|
".*",
|
||||||
|
"wp-admin",
|
||||||
|
"wp-includes",
|
||||||
|
"node_modules",
|
||||||
|
"Prepros Export",
|
||||||
|
"bower_components"
|
||||||
|
],
|
||||||
|
"exceptions": []
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"exporter": {
|
||||||
|
"ignore": {
|
||||||
|
"patterns": [
|
||||||
|
".*",
|
||||||
|
"desktop.ini",
|
||||||
|
"prepros.cfg",
|
||||||
|
"node_modules",
|
||||||
|
"Prepros Export",
|
||||||
|
"prepros.config",
|
||||||
|
"prepros-6.config",
|
||||||
|
"*-original.jpg",
|
||||||
|
"*-original.jpeg",
|
||||||
|
"*-original.png",
|
||||||
|
"*-original.svg",
|
||||||
|
"*.scss",
|
||||||
|
"*.sass",
|
||||||
|
"*.less",
|
||||||
|
"*.pug",
|
||||||
|
"*.jade",
|
||||||
|
"*.styl",
|
||||||
|
"*.haml",
|
||||||
|
"*.slim",
|
||||||
|
"*.coffee",
|
||||||
|
"*.kit",
|
||||||
|
"*.turf",
|
||||||
|
"*.ts"
|
||||||
|
],
|
||||||
|
"exceptions": []
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"uploader": {
|
||||||
|
"remotePath": "",
|
||||||
|
"timeout": 20000,
|
||||||
|
"autoUpload": false,
|
||||||
|
"reuseConnection": true,
|
||||||
|
"connectionType": "ftp",
|
||||||
|
"exportHistory": true,
|
||||||
|
"history": []
|
||||||
|
},
|
||||||
|
"packages": {
|
||||||
|
"createPackageLock": true
|
||||||
|
},
|
||||||
|
"images": {
|
||||||
|
"preserveOriginal": true
|
||||||
|
},
|
||||||
|
"tasks": {
|
||||||
|
"autoprefixer": {
|
||||||
|
"cascade": true,
|
||||||
|
"add": true,
|
||||||
|
"remove": true,
|
||||||
|
"supports": true,
|
||||||
|
"flexbox": true,
|
||||||
|
"grid": "autoplace",
|
||||||
|
"browsers": [
|
||||||
|
"last 2 versions"
|
||||||
|
],
|
||||||
|
"sourceMap": false
|
||||||
|
},
|
||||||
|
"babel": {
|
||||||
|
"sourceMap": false,
|
||||||
|
"presets": {
|
||||||
|
"@babel/preset-env": {
|
||||||
|
"enable": true,
|
||||||
|
"options": {
|
||||||
|
"targets": [
|
||||||
|
"last 2 versions"
|
||||||
|
],
|
||||||
|
"preserveImports": false,
|
||||||
|
"polyfills": false
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"@babel/preset-react": true,
|
||||||
|
"@babel/preset-flow": false
|
||||||
|
},
|
||||||
|
"plugins": {
|
||||||
|
"@babel/plugin-proposal-class-static-block": false,
|
||||||
|
"@babel/plugin-proposal-class-properties": false,
|
||||||
|
"@babel/plugin-proposal-decorators": {
|
||||||
|
"enable": false,
|
||||||
|
"options": {
|
||||||
|
"decoratorsBeforeExport": true
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"@babel/plugin-proposal-export-namespace-from": false,
|
||||||
|
"@babel/plugin-proposal-function-sent": false,
|
||||||
|
"@babel/plugin-proposal-logical-assignment-operators": false,
|
||||||
|
"@babel/plugin-proposal-nullish-coalescing-operator": false,
|
||||||
|
"@babel/plugin-proposal-numeric-separator": false,
|
||||||
|
"@babel/plugin-proposal-optional-chaining": false,
|
||||||
|
"@babel/plugin-proposal-private-methods": false,
|
||||||
|
"@babel/plugin-proposal-throw-expressions": false
|
||||||
|
},
|
||||||
|
"customPresets": [],
|
||||||
|
"customPlugins": []
|
||||||
|
},
|
||||||
|
"bundle-js": {
|
||||||
|
"sourceMap": false,
|
||||||
|
"exclude": [
|
||||||
|
"node_modules",
|
||||||
|
"bower_components"
|
||||||
|
],
|
||||||
|
"devMode": true,
|
||||||
|
"globals": [],
|
||||||
|
"externals": [],
|
||||||
|
"babel": {
|
||||||
|
"enable": true,
|
||||||
|
"options": {
|
||||||
|
"sourceMap": false,
|
||||||
|
"presets": {
|
||||||
|
"@babel/preset-env": {
|
||||||
|
"enable": true,
|
||||||
|
"options": {
|
||||||
|
"targets": [
|
||||||
|
"last 2 versions"
|
||||||
|
],
|
||||||
|
"preserveImports": false,
|
||||||
|
"polyfills": false
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"@babel/preset-react": true,
|
||||||
|
"@babel/preset-flow": false
|
||||||
|
},
|
||||||
|
"plugins": {
|
||||||
|
"@babel/plugin-proposal-class-static-block": false,
|
||||||
|
"@babel/plugin-proposal-class-properties": false,
|
||||||
|
"@babel/plugin-proposal-decorators": {
|
||||||
|
"enable": false,
|
||||||
|
"options": {
|
||||||
|
"decoratorsBeforeExport": true
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"@babel/plugin-proposal-export-namespace-from": false,
|
||||||
|
"@babel/plugin-proposal-function-sent": false,
|
||||||
|
"@babel/plugin-proposal-logical-assignment-operators": false,
|
||||||
|
"@babel/plugin-proposal-nullish-coalescing-operator": false,
|
||||||
|
"@babel/plugin-proposal-numeric-separator": false,
|
||||||
|
"@babel/plugin-proposal-optional-chaining": false,
|
||||||
|
"@babel/plugin-proposal-private-methods": false,
|
||||||
|
"@babel/plugin-proposal-throw-expressions": false
|
||||||
|
},
|
||||||
|
"customPresets": [],
|
||||||
|
"customPlugins": []
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"css": {
|
||||||
|
"enable": true
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"coffeescript": {
|
||||||
|
"header": false,
|
||||||
|
"bare": false,
|
||||||
|
"sourceMap": false
|
||||||
|
},
|
||||||
|
"command": {
|
||||||
|
"command": "",
|
||||||
|
"rootDir": ""
|
||||||
|
},
|
||||||
|
"concat-js": {
|
||||||
|
"sourceMap": false,
|
||||||
|
"rootDir": ""
|
||||||
|
},
|
||||||
|
"copy": {
|
||||||
|
"sourceMap": false
|
||||||
|
},
|
||||||
|
"dart-sass": {
|
||||||
|
"indentType": "space",
|
||||||
|
"allowWildcardImports": false,
|
||||||
|
"indentWidth": 2,
|
||||||
|
"linefeed": "lf",
|
||||||
|
"removeCharset": false,
|
||||||
|
"sourceMap": false
|
||||||
|
},
|
||||||
|
"haml": {
|
||||||
|
"doubleQuoteAttributes": true
|
||||||
|
},
|
||||||
|
"jpg": {
|
||||||
|
"quality": 90
|
||||||
|
},
|
||||||
|
"less": {
|
||||||
|
"javascriptEnabled": false,
|
||||||
|
"strictImports": false,
|
||||||
|
"insecure": false,
|
||||||
|
"math": "always",
|
||||||
|
"strictUnits": false,
|
||||||
|
"dumpLineNumbers": false,
|
||||||
|
"sourceMap": false
|
||||||
|
},
|
||||||
|
"markdown": {
|
||||||
|
"githubFlavored": true,
|
||||||
|
"wrapWithHtml": false
|
||||||
|
},
|
||||||
|
"minify-css": {
|
||||||
|
"sourceMap": false
|
||||||
|
},
|
||||||
|
"minify-html": {
|
||||||
|
"caseSensitive": false,
|
||||||
|
"collapseBooleanAttributes": true,
|
||||||
|
"collapseInlineTagWhitespace": false,
|
||||||
|
"collapseWhitespace": true,
|
||||||
|
"conservativeCollapse": false,
|
||||||
|
"decodeEntities": false,
|
||||||
|
"html5": true,
|
||||||
|
"includeAutoGeneratedTags": true,
|
||||||
|
"keepClosingSlash": false,
|
||||||
|
"minifyCSS": true,
|
||||||
|
"minifyJS": true,
|
||||||
|
"preserveLineBreaks": false,
|
||||||
|
"preventAttributesEscaping": false,
|
||||||
|
"processConditionalComments": false,
|
||||||
|
"removeAttributeQuotes": false,
|
||||||
|
"removeComments": true,
|
||||||
|
"removeEmptyAttributes": false,
|
||||||
|
"removeEmptyElement": false,
|
||||||
|
"removeOptionalTags": false,
|
||||||
|
"removeRedundantAttributes": false,
|
||||||
|
"removeScriptTypeAttributes": false,
|
||||||
|
"removeStyleLinkTypeAttributes": false,
|
||||||
|
"removeTagWhitespace": false,
|
||||||
|
"sortAttributes": false,
|
||||||
|
"sortClassName": false,
|
||||||
|
"useShortDoctype": true
|
||||||
|
},
|
||||||
|
"minify-js": {
|
||||||
|
"parse": {
|
||||||
|
"bare_returns": false
|
||||||
|
},
|
||||||
|
"compress": {
|
||||||
|
"arrows": true,
|
||||||
|
"arguments": false,
|
||||||
|
"booleans": true,
|
||||||
|
"booleans_as_integers": false,
|
||||||
|
"collapse_vars": true,
|
||||||
|
"comparisons": true,
|
||||||
|
"computed_props": true,
|
||||||
|
"conditionals": true,
|
||||||
|
"dead_code": true,
|
||||||
|
"directives": true,
|
||||||
|
"drop_console": false,
|
||||||
|
"drop_debugger": true,
|
||||||
|
"evaluate": true,
|
||||||
|
"expression": false,
|
||||||
|
"global_defs": [],
|
||||||
|
"hoist_funs": false,
|
||||||
|
"hoist_props": true,
|
||||||
|
"hoist_vars": false,
|
||||||
|
"if_return": true,
|
||||||
|
"inline": 3,
|
||||||
|
"join_vars": true,
|
||||||
|
"keep_fargs": true,
|
||||||
|
"keep_infinity": false,
|
||||||
|
"loops": true,
|
||||||
|
"negate_iife": true,
|
||||||
|
"properties": true,
|
||||||
|
"pure_funcs": [],
|
||||||
|
"pure_getters": false,
|
||||||
|
"reduce_funcs": true,
|
||||||
|
"reduce_vars": true,
|
||||||
|
"sequences": true,
|
||||||
|
"side_effects": true,
|
||||||
|
"switches": true,
|
||||||
|
"top_retain": [],
|
||||||
|
"typeofs": true,
|
||||||
|
"unsafe": false,
|
||||||
|
"unsafe_arrows": false,
|
||||||
|
"unsafe_comps": false,
|
||||||
|
"unsafe_Function": false,
|
||||||
|
"unsafe_math": false,
|
||||||
|
"unsafe_proto": false,
|
||||||
|
"unsafe_regexp": false,
|
||||||
|
"unsafe_undefined": false,
|
||||||
|
"unused": true
|
||||||
|
},
|
||||||
|
"mangle": {
|
||||||
|
"eval": false,
|
||||||
|
"reserved": []
|
||||||
|
},
|
||||||
|
"output": {
|
||||||
|
"ascii_only": false,
|
||||||
|
"braces": false,
|
||||||
|
"comments": "none",
|
||||||
|
"inline_script": true,
|
||||||
|
"keep_numbers": false,
|
||||||
|
"keep_quoted_props": false,
|
||||||
|
"preamble": null,
|
||||||
|
"quote_keys": false,
|
||||||
|
"quote_style": 0,
|
||||||
|
"semicolons": true,
|
||||||
|
"shebang": true,
|
||||||
|
"webkit": false,
|
||||||
|
"wrap_iife": false,
|
||||||
|
"wrap_func_args": true
|
||||||
|
},
|
||||||
|
"sourceMap": false,
|
||||||
|
"toplevel": false,
|
||||||
|
"ie8": false,
|
||||||
|
"keep_classnames": false,
|
||||||
|
"keep_fnames": false,
|
||||||
|
"safari10": false
|
||||||
|
},
|
||||||
|
"node-sass": {
|
||||||
|
"indentType": "space",
|
||||||
|
"allowWildcardImports": false,
|
||||||
|
"indentWidth": 2,
|
||||||
|
"linefeed": "lf",
|
||||||
|
"outputStyle": "expanded",
|
||||||
|
"precision": 10,
|
||||||
|
"sourceMap": false,
|
||||||
|
"removeCharset": false,
|
||||||
|
"sourceComments": false
|
||||||
|
},
|
||||||
|
"png": {
|
||||||
|
"quality": 90
|
||||||
|
},
|
||||||
|
"postcss-import": {
|
||||||
|
"ignoreKeywords": [],
|
||||||
|
"sourceMap": false
|
||||||
|
},
|
||||||
|
"postcss-preset-env": {
|
||||||
|
"stage": 2,
|
||||||
|
"browsers": [
|
||||||
|
"last 2 versions"
|
||||||
|
],
|
||||||
|
"sourceMap": false
|
||||||
|
},
|
||||||
|
"pug": {
|
||||||
|
"pretty": true
|
||||||
|
},
|
||||||
|
"slim": {
|
||||||
|
"indent": "space",
|
||||||
|
"indentSize": 2,
|
||||||
|
"pretty": true
|
||||||
|
},
|
||||||
|
"stylus": {
|
||||||
|
"useNib": true,
|
||||||
|
"sourceMap": false,
|
||||||
|
"linenos": false
|
||||||
|
},
|
||||||
|
"svg": {
|
||||||
|
"cleanupAttrs": true,
|
||||||
|
"removeDoctype": true,
|
||||||
|
"removeXMLProcInst": true,
|
||||||
|
"removeComments": true,
|
||||||
|
"removeMetadata": true,
|
||||||
|
"removeTitle": true,
|
||||||
|
"removeDesc": true,
|
||||||
|
"removeUselessDefs": true,
|
||||||
|
"removeEditorsNSData": true,
|
||||||
|
"removeEmptyAttrs": true,
|
||||||
|
"removeHiddenElems": true,
|
||||||
|
"removeEmptyText": true,
|
||||||
|
"removeEmptyContainers": true,
|
||||||
|
"removeViewBox": false,
|
||||||
|
"cleanupEnableBackground": true,
|
||||||
|
"convertStyleToAttrs": true,
|
||||||
|
"convertColors": true,
|
||||||
|
"convertPathData": true,
|
||||||
|
"convertTransform": true,
|
||||||
|
"removeUnknownsAndDefaults": true,
|
||||||
|
"removeNonInheritableGroupAttrs": true,
|
||||||
|
"removeUselessStrokeAndFill": true,
|
||||||
|
"removeUnusedNS": true,
|
||||||
|
"cleanupIDs": true,
|
||||||
|
"cleanupNumericValues": true,
|
||||||
|
"moveElemsAttrsToGroup": true,
|
||||||
|
"moveGroupAttrsToElems": true,
|
||||||
|
"collapseGroups": true,
|
||||||
|
"removeRasterImages": false,
|
||||||
|
"mergePaths": true,
|
||||||
|
"convertShapeToPath": true,
|
||||||
|
"sortAttrs": true,
|
||||||
|
"removeDimensions": true
|
||||||
|
},
|
||||||
|
"tailwindcss": {
|
||||||
|
"rootDir": "",
|
||||||
|
"content": [
|
||||||
|
"**/*.html",
|
||||||
|
"**/*.htm",
|
||||||
|
"**/*.php",
|
||||||
|
"**/*.js",
|
||||||
|
"!wp-admin",
|
||||||
|
"!wp-includes",
|
||||||
|
"!node_modules",
|
||||||
|
"!Prepros Export"
|
||||||
|
]
|
||||||
|
},
|
||||||
|
"turf": {
|
||||||
|
"rootDir": ""
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"fileTypes": {
|
||||||
|
"sass": {
|
||||||
|
"extensions": [
|
||||||
|
".scss",
|
||||||
|
".sass"
|
||||||
|
],
|
||||||
|
"autoCompile": true,
|
||||||
|
"sourceMap": false,
|
||||||
|
"tasks": [
|
||||||
|
{
|
||||||
|
"task": "dart-sass",
|
||||||
|
"enable": true
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"task": "autoprefixer",
|
||||||
|
"enable": true
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"task": "minify-css",
|
||||||
|
"enable": false
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"output": {
|
||||||
|
"extension": ".css",
|
||||||
|
"type": "REPLACE_SEGMENTS",
|
||||||
|
"segments": [
|
||||||
|
{
|
||||||
|
"segment": "scss",
|
||||||
|
"replaceWith": "css"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"segment": "sass",
|
||||||
|
"replaceWith": "css"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"less": {
|
||||||
|
"extensions": [
|
||||||
|
".less"
|
||||||
|
],
|
||||||
|
"autoCompile": true,
|
||||||
|
"sourceMap": false,
|
||||||
|
"tasks": [
|
||||||
|
{
|
||||||
|
"task": "less",
|
||||||
|
"enable": true
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"task": "autoprefixer",
|
||||||
|
"enable": true
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"task": "minify-css",
|
||||||
|
"enable": false
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"output": {
|
||||||
|
"extension": ".css",
|
||||||
|
"type": "REPLACE_SEGMENTS",
|
||||||
|
"segments": [
|
||||||
|
{
|
||||||
|
"segment": "less",
|
||||||
|
"replaceWith": "css"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"pug": {
|
||||||
|
"extensions": [
|
||||||
|
".pug",
|
||||||
|
".jade"
|
||||||
|
],
|
||||||
|
"autoCompile": true,
|
||||||
|
"tasks": [
|
||||||
|
{
|
||||||
|
"task": "pug",
|
||||||
|
"enable": true
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"task": "minify-html",
|
||||||
|
"enable": false
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"output": {
|
||||||
|
"extension": ".html",
|
||||||
|
"type": "REPLACE_SEGMENTS",
|
||||||
|
"segments": [
|
||||||
|
{
|
||||||
|
"segment": "pug",
|
||||||
|
"replaceWith": "html"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"css": {
|
||||||
|
"extensions": [
|
||||||
|
".css"
|
||||||
|
],
|
||||||
|
"autoCompile": false,
|
||||||
|
"sourceMap": false,
|
||||||
|
"tasks": [
|
||||||
|
{
|
||||||
|
"task": "copy",
|
||||||
|
"enable": true
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"task": "tailwindcss",
|
||||||
|
"enable": false
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"task": "postcss-import",
|
||||||
|
"enable": false
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"task": "postcss-preset-env",
|
||||||
|
"enable": false
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"task": "autoprefixer",
|
||||||
|
"enable": true
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"task": "minify-css",
|
||||||
|
"enable": true
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"output": {
|
||||||
|
"extension": ".css",
|
||||||
|
"type": "SOURCE_RELATIVE",
|
||||||
|
"relativePath": "",
|
||||||
|
"suffix": "-dist",
|
||||||
|
"alwaysSuffix": false
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"javascript": {
|
||||||
|
"extensions": [
|
||||||
|
".js",
|
||||||
|
".jsx"
|
||||||
|
],
|
||||||
|
"autoCompile": false,
|
||||||
|
"sourceMap": false,
|
||||||
|
"tasks": [
|
||||||
|
{
|
||||||
|
"task": "copy",
|
||||||
|
"enable": true
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"task": "concat-js",
|
||||||
|
"enable": false
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"task": "babel",
|
||||||
|
"enable": false
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"task": "bundle-js",
|
||||||
|
"enable": false
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"task": "minify-js",
|
||||||
|
"enable": true
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"output": {
|
||||||
|
"extension": ".js",
|
||||||
|
"type": "SOURCE_RELATIVE",
|
||||||
|
"relativePath": "",
|
||||||
|
"suffix": "-dist",
|
||||||
|
"alwaysSuffix": false
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"stylus": {
|
||||||
|
"extensions": [
|
||||||
|
".styl"
|
||||||
|
],
|
||||||
|
"autoCompile": true,
|
||||||
|
"sourceMap": false,
|
||||||
|
"tasks": [
|
||||||
|
{
|
||||||
|
"task": "stylus",
|
||||||
|
"enable": true
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"task": "autoprefixer",
|
||||||
|
"enable": true
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"task": "minify-css",
|
||||||
|
"enable": false
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"output": {
|
||||||
|
"extension": ".css",
|
||||||
|
"type": "REPLACE_SEGMENTS",
|
||||||
|
"segments": [
|
||||||
|
{
|
||||||
|
"segment": "stylus",
|
||||||
|
"replaceWith": "css"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"segment": "styl",
|
||||||
|
"replaceWith": "css"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"markdown": {
|
||||||
|
"extensions": [
|
||||||
|
".md",
|
||||||
|
".markdown",
|
||||||
|
".mkd"
|
||||||
|
],
|
||||||
|
"autoCompile": false,
|
||||||
|
"tasks": [
|
||||||
|
{
|
||||||
|
"task": "markdown",
|
||||||
|
"enable": true
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"task": "minify-html",
|
||||||
|
"enable": false
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"output": {
|
||||||
|
"extension": ".html",
|
||||||
|
"type": "REPLACE_SEGMENTS",
|
||||||
|
"segments": [
|
||||||
|
{
|
||||||
|
"segment": "markdown",
|
||||||
|
"replaceWith": "html"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"haml": {
|
||||||
|
"extensions": [
|
||||||
|
".haml"
|
||||||
|
],
|
||||||
|
"autoCompile": true,
|
||||||
|
"tasks": [
|
||||||
|
{
|
||||||
|
"task": "haml",
|
||||||
|
"enable": true
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"task": "minify-html",
|
||||||
|
"enable": false
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"output": {
|
||||||
|
"extension": ".html",
|
||||||
|
"type": "REPLACE_SEGMENTS",
|
||||||
|
"segments": [
|
||||||
|
{
|
||||||
|
"segment": "haml",
|
||||||
|
"replaceWith": "html"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"slim": {
|
||||||
|
"extensions": [
|
||||||
|
".slim"
|
||||||
|
],
|
||||||
|
"autoCompile": true,
|
||||||
|
"tasks": [
|
||||||
|
{
|
||||||
|
"task": "slim",
|
||||||
|
"enable": true
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"task": "minify-html",
|
||||||
|
"enable": false
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"output": {
|
||||||
|
"extension": ".html",
|
||||||
|
"type": "REPLACE_SEGMENTS",
|
||||||
|
"segments": [
|
||||||
|
{
|
||||||
|
"segment": "slim",
|
||||||
|
"replaceWith": "html"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"coffeescript": {
|
||||||
|
"extensions": [
|
||||||
|
".coffee"
|
||||||
|
],
|
||||||
|
"autoCompile": true,
|
||||||
|
"sourceMap": false,
|
||||||
|
"tasks": [
|
||||||
|
{
|
||||||
|
"task": "coffeescript",
|
||||||
|
"enable": true
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"task": "babel",
|
||||||
|
"enable": false
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"task": "bundle-js",
|
||||||
|
"enable": false
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"task": "minify-js",
|
||||||
|
"enable": false
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"output": {
|
||||||
|
"extension": ".js",
|
||||||
|
"type": "REPLACE_SEGMENTS",
|
||||||
|
"segments": [
|
||||||
|
{
|
||||||
|
"segment": "coffee-script",
|
||||||
|
"replaceWith": "js"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"segment": "coffeescript",
|
||||||
|
"replaceWith": "js"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"segment": "coffee",
|
||||||
|
"replaceWith": "js"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"turf": {
|
||||||
|
"extensions": [
|
||||||
|
".turf",
|
||||||
|
".kit"
|
||||||
|
],
|
||||||
|
"autoCompile": true,
|
||||||
|
"tasks": [
|
||||||
|
{
|
||||||
|
"task": "turf",
|
||||||
|
"enable": true
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"task": "minify-html",
|
||||||
|
"enable": false
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"output": {
|
||||||
|
"extension": ".html",
|
||||||
|
"type": "REPLACE_SEGMENTS",
|
||||||
|
"segments": [
|
||||||
|
{
|
||||||
|
"segment": "turf",
|
||||||
|
"replaceWith": "html"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"typescript": {
|
||||||
|
"extensions": [
|
||||||
|
".ts",
|
||||||
|
".tsx"
|
||||||
|
],
|
||||||
|
"autoCompile": true,
|
||||||
|
"sourceMap": false,
|
||||||
|
"tasks": [
|
||||||
|
{
|
||||||
|
"task": "copy",
|
||||||
|
"enable": true
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"task": "babel",
|
||||||
|
"enable": true
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"task": "bundle-js",
|
||||||
|
"enable": false
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"task": "minify-js",
|
||||||
|
"enable": false
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"output": {
|
||||||
|
"extension": ".js",
|
||||||
|
"type": "REPLACE_SEGMENTS",
|
||||||
|
"segments": [
|
||||||
|
{
|
||||||
|
"segment": "typescript",
|
||||||
|
"replaceWith": "js"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"segment": "ts",
|
||||||
|
"replaceWith": "js"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"jpg": {
|
||||||
|
"extensions": [
|
||||||
|
".jpg",
|
||||||
|
".jpeg"
|
||||||
|
],
|
||||||
|
"tasks": [
|
||||||
|
{
|
||||||
|
"task": "jpg",
|
||||||
|
"enable": true
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"output": {
|
||||||
|
"extension": ".jpg",
|
||||||
|
"type": "SOURCE_RELATIVE",
|
||||||
|
"relativePath": ""
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"png": {
|
||||||
|
"extensions": [
|
||||||
|
".png"
|
||||||
|
],
|
||||||
|
"tasks": [
|
||||||
|
{
|
||||||
|
"task": "png",
|
||||||
|
"enable": true
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"output": {
|
||||||
|
"extension": ".png",
|
||||||
|
"type": "SOURCE_RELATIVE",
|
||||||
|
"relativePath": ""
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"svg": {
|
||||||
|
"extensions": [
|
||||||
|
".svg"
|
||||||
|
],
|
||||||
|
"tasks": [
|
||||||
|
{
|
||||||
|
"task": "svg",
|
||||||
|
"enable": true
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"output": {
|
||||||
|
"extension": ".svg",
|
||||||
|
"type": "SOURCE_RELATIVE",
|
||||||
|
"relativePath": ""
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"files": []
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -0,0 +1,111 @@
|
|||||||
|
//===高度
|
||||||
|
$heightObj: (
|
||||||
|
basic: 45px
|
||||||
|
);
|
||||||
|
|
||||||
|
//===間距
|
||||||
|
$gutter: (
|
||||||
|
basic: 20px,
|
||||||
|
double: 40px
|
||||||
|
);
|
||||||
|
|
||||||
|
//圓角
|
||||||
|
$radius: (
|
||||||
|
basic: 3px
|
||||||
|
);
|
||||||
|
|
||||||
|
//字體顏色
|
||||||
|
$basicColor: (
|
||||||
|
skyBlue:#b2c4ce,
|
||||||
|
moBlue:#486499,
|
||||||
|
darkBlue:#345068,
|
||||||
|
pink:#fdebeb,
|
||||||
|
cherry:#E31D64,
|
||||||
|
mintGreen:#f2f8e7,
|
||||||
|
limeGreen:#94ac5e,
|
||||||
|
tomatoRed:#F84E59,
|
||||||
|
earthGold:#BC9F75,
|
||||||
|
silver:#eeeeee,
|
||||||
|
gray:#b1b3b6
|
||||||
|
);
|
||||||
|
|
||||||
|
|
||||||
|
$textArr:
|
||||||
|
(skyBlue, map-get($basicColor, skyBlue)),
|
||||||
|
(moBlue, map-get($basicColor, moBlue)),
|
||||||
|
(darkBlue, map-get($basicColor, darkBlue)),
|
||||||
|
(pink, map-get($basicColor, pink)),
|
||||||
|
(cherry, map-get($basicColor, cherry)),
|
||||||
|
(mintGreen, map-get($basicColor, mintGreen)),
|
||||||
|
(limeGreen, map-get($basicColor, limeGreen)),
|
||||||
|
(tomatoRed, map-get($basicColor, tomatoRed)),
|
||||||
|
(earthGold, map-get($basicColor, earthGold)),
|
||||||
|
(silver, map-get($basicColor, silver)),
|
||||||
|
(gray, map-get($basicColor, gray)),
|
||||||
|
;
|
||||||
|
|
||||||
|
//一般button
|
||||||
|
@each $class, $color in $textArr {
|
||||||
|
.text-#{"" + $class} {
|
||||||
|
color: $color !important;
|
||||||
|
}
|
||||||
|
.bg-#{"" + $class} {
|
||||||
|
background-color: $color !important;
|
||||||
|
}
|
||||||
|
.bd-#{"" + $class} {
|
||||||
|
border-style: solid;
|
||||||
|
border-color: $color !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
//======extand
|
||||||
|
%centerFlex {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
%bwtFlex {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
%posCenter {
|
||||||
|
position: absolute;
|
||||||
|
left: 50%;
|
||||||
|
top: 50%;
|
||||||
|
transform: translate(-50%, -50%);
|
||||||
|
}
|
||||||
|
|
||||||
|
%resetForm {
|
||||||
|
appearance: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
%clearFix {
|
||||||
|
&:after {
|
||||||
|
content: '';
|
||||||
|
display: block;
|
||||||
|
clear: both;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
//========mixin
|
||||||
|
|
||||||
|
@mixin size($w, $h:$w) {
|
||||||
|
width: $w;
|
||||||
|
height: $h;
|
||||||
|
}
|
||||||
|
|
||||||
|
@mixin basicSize($w, $h) {
|
||||||
|
min-width: $w;
|
||||||
|
min-height: $h;
|
||||||
|
}
|
||||||
|
|
||||||
|
//指有margin padding能用
|
||||||
|
@mixin elGutter($key, $value) {
|
||||||
|
#{$key}: $value;
|
||||||
|
&:last-child {
|
||||||
|
#{$key}: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -0,0 +1,138 @@
|
|||||||
|
@import url("https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Open+Sans:ital,wght@0,300;0,400;0,600;0,700;0,800;1,300;1,400;1,600;1,700;1,800&family=Raleway:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap");
|
||||||
|
|
||||||
|
html, body, div, span, applet, object, iframe,
|
||||||
|
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
|
||||||
|
a, abbr, acronym, address, big, cite, code,
|
||||||
|
del, dfn, em, img, ins, kbd, q, s, samp,
|
||||||
|
small, strike, strong, sub, sup, tt, var,
|
||||||
|
b, u, i, center,
|
||||||
|
dl, dt, dd, ol, ul, li,
|
||||||
|
fieldset, form, label, legend,
|
||||||
|
table, caption, tbody, tfoot, thead, tr, th, td,
|
||||||
|
article, aside, canvas, details, embed,
|
||||||
|
figure, figcaption, footer, header, hgroup,
|
||||||
|
menu, nav, output, ruby, section, summary,
|
||||||
|
time, mark, audio, video {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
border: 0;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
|
||||||
|
article, aside, details, figcaption, figure,
|
||||||
|
footer, header, hgroup, menu, nav, section {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
*:before,
|
||||||
|
*:after {
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
font-family: 'Noto Sans TC', "微軟正黑體", "Microsoft JhengHei", sans-serif;
|
||||||
|
font-size: 14px;
|
||||||
|
line-height: 1.5;
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
color: #666;
|
||||||
|
background-color: #ffffff;
|
||||||
|
}
|
||||||
|
|
||||||
|
ol, ul {
|
||||||
|
list-style: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
table {
|
||||||
|
border-collapse: collapse;
|
||||||
|
border-spacing: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
a,
|
||||||
|
span {
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
|
||||||
|
button,a{
|
||||||
|
border-width: 1px;
|
||||||
|
outline: none !important;
|
||||||
|
cursor: pointer;
|
||||||
|
&:focus {
|
||||||
|
outline: none;
|
||||||
|
box-shadow: none !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
a,
|
||||||
|
a:hover,
|
||||||
|
a:focus {
|
||||||
|
color: #37455E;
|
||||||
|
text-decoration: none;
|
||||||
|
outline: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
ul{
|
||||||
|
margin:0;
|
||||||
|
padding:0;
|
||||||
|
padding-left: 20px;
|
||||||
|
li{
|
||||||
|
list-style:none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
textarea{
|
||||||
|
min-height: 200px;
|
||||||
|
}
|
||||||
|
|
||||||
|
hr{
|
||||||
|
margin: 15px 0;
|
||||||
|
&.dashed{
|
||||||
|
border-style: dashed;
|
||||||
|
margin: 25px 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.left {
|
||||||
|
float: left;
|
||||||
|
}
|
||||||
|
.rel {
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ellipsis{
|
||||||
|
display: -webkit-box;
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
-webkit-line-clamp: 1;
|
||||||
|
-webkit-box-orient: vertical;
|
||||||
|
word-wrap: break-word;
|
||||||
|
&.e2{-webkit-line-clamp: 2;}
|
||||||
|
&.e3{-webkit-line-clamp: 3;}
|
||||||
|
&.e4{-webkit-line-clamp: 4;}
|
||||||
|
&.e5{-webkit-line-clamp: 5;}
|
||||||
|
&.e6{-webkit-line-clamp: 6;}
|
||||||
|
}
|
||||||
|
|
||||||
|
.centerFlex {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.bwtFlex {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
h1,h2,h3,h4,h5,h6{margin:0;}
|
||||||
|
// h2{font-size: 4rem;}
|
||||||
|
// h3{font-size: 3.4rem;line-height: 0.9em;}
|
||||||
|
// h4{font-size: 2.2rem;}
|
||||||
|
// h5{font-size: 1.8rem;}
|
||||||
|
// h6{font-size: 1.4rem;}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
@ -0,0 +1,46 @@
|
|||||||
|
$normalArr:
|
||||||
|
(moBlue, #fff, map-get($basicColor, moBlue), map-get($basicColor, moBlue)),
|
||||||
|
(pink, #fff, map-get($basicColor, pink), map-get($basicColor, pink)),
|
||||||
|
(cherry, #fff, map-get($basicColor, cherry), map-get($basicColor, cherry)),
|
||||||
|
(limeGreen, #fff, map-get($basicColor, limeGreen), map-get($basicColor, limeGreen)),
|
||||||
|
(tomatoRed, #fff, map-get($basicColor, tomatoRed), map-get($basicColor, tomatoRed)),
|
||||||
|
(earthGold, #fff, map-get($basicColor, earthGold), map-get($basicColor, earthGold)),
|
||||||
|
;
|
||||||
|
|
||||||
|
$outlineArr:
|
||||||
|
(moBlue, 1px, map-get($basicColor, moBlue), transparent, map-get($basicColor, moBlue)),
|
||||||
|
(pink, 1px, map-get($basicColor, pink), transparent, map-get($basicColor, pink)),
|
||||||
|
(cherry, 1px, map-get($basicColor, cherry), transparent, map-get($basicColor, cherry)),
|
||||||
|
(limeGreen, 1px, map-get($basicColor, limeGreen), transparent, map-get($basicColor, limeGreen)),
|
||||||
|
(tomatoRed, 1px, map-get($basicColor, tomatoRed), transparent, map-get($basicColor, tomatoRed)),
|
||||||
|
(earthGold, 1px, map-get($basicColor, earthGold), transparent, map-get($basicColor, earthGold)),
|
||||||
|
;
|
||||||
|
|
||||||
|
|
||||||
|
//一般button
|
||||||
|
@each $class, $color, $bgColor, $border in $normalArr {
|
||||||
|
.btn-#{"" + $class} {
|
||||||
|
@include normalBtn($color, $bgColor, $border);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
//線條外框
|
||||||
|
@each $class, $bdWidth, $color, $bgColor, $bdColor in $outlineArr {
|
||||||
|
.btn-outline-#{"" + $class} {
|
||||||
|
@include outlineBtn($bdWidth, $color, $bgColor, $bdColor);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-outline-limeGreen {
|
||||||
|
&.active {
|
||||||
|
color: #fff;
|
||||||
|
background-color: #b4d26c;
|
||||||
|
}
|
||||||
|
&.disabled {
|
||||||
|
cursor: not-allowed;
|
||||||
|
&:hover {
|
||||||
|
background-color: #fff;
|
||||||
|
color: #b4d26c;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -0,0 +1,35 @@
|
|||||||
|
%button {
|
||||||
|
border-radius: map-get($radius, basic);
|
||||||
|
&.limit{
|
||||||
|
width:200px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
//一般button
|
||||||
|
@mixin normalBtn($color, $bgColor, $bdColor) {
|
||||||
|
@extend %button;
|
||||||
|
@if $bdColor == none {
|
||||||
|
border: none;
|
||||||
|
} @else {
|
||||||
|
border: 1px solid $bdColor !important;
|
||||||
|
}
|
||||||
|
color: $color;
|
||||||
|
background-color: $bgColor;
|
||||||
|
&:hover{
|
||||||
|
color:#fff;
|
||||||
|
background-color: darken($bgColor, 10%);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
//外框 button
|
||||||
|
@mixin outlineBtn($bdWidth, $color, $bgColor, $bdColor) {
|
||||||
|
@extend %button;
|
||||||
|
border: $bdWidth solid $bdColor;
|
||||||
|
color: $color;
|
||||||
|
background-color: $bgColor;
|
||||||
|
&:hover{
|
||||||
|
color:#fff;
|
||||||
|
background-color: $color;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
@ -0,0 +1,18 @@
|
|||||||
|
[v-cloak] {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.home{
|
||||||
|
background-color: #f1e6e2;
|
||||||
|
}
|
||||||
|
|
||||||
|
.imgCnt{
|
||||||
|
position: relative;
|
||||||
|
overflow: hidden;
|
||||||
|
img{
|
||||||
|
width:100%;
|
||||||
|
height:100%;
|
||||||
|
object-fit: cover;
|
||||||
|
transition: all .3s;
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -0,0 +1,17 @@
|
|||||||
|
.header{
|
||||||
|
position: relative;
|
||||||
|
width:100%;
|
||||||
|
text-align: center;
|
||||||
|
padding: 15px 0;
|
||||||
|
background-color: #345068;
|
||||||
|
.uname {
|
||||||
|
color: #fff;
|
||||||
|
margin-bottom: 5px;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
.umoney {
|
||||||
|
color: #fff;
|
||||||
|
opacity: .6;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
@ -0,0 +1,18 @@
|
|||||||
|
// @import './bootstrap/bootstrap';
|
||||||
|
|
||||||
|
@import './base/global';
|
||||||
|
@import './base/reset';
|
||||||
|
|
||||||
|
@import './components/button';
|
||||||
|
@import './components/btn';
|
||||||
|
|
||||||
|
@import './layout/navbar';
|
||||||
|
@import './layout/layout';
|
||||||
|
|
||||||
|
@import './venders/vender';
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
@ -0,0 +1,83 @@
|
|||||||
|
@import url('https://fonts.googleapis.com/css2?family=Rubik:wght@600&display=swap');
|
||||||
|
@import url('https://fonts.googleapis.com/css2?family=DM+Serif+Text&display=swap');
|
||||||
|
|
||||||
|
.my-account {
|
||||||
|
position: relative;
|
||||||
|
width: 100%;
|
||||||
|
padding: 20px;
|
||||||
|
.avatar{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
.imgCnt{
|
||||||
|
width:80px;
|
||||||
|
height: 80px;
|
||||||
|
min-width: 80px;
|
||||||
|
border-radius: 50%;
|
||||||
|
overflow: hidden;
|
||||||
|
margin-right: 10px;
|
||||||
|
img{
|
||||||
|
width:100%;
|
||||||
|
height: 100%;
|
||||||
|
object-fit: cover;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.info{
|
||||||
|
.name{
|
||||||
|
font-size: 20px;
|
||||||
|
font-weight: bold;
|
||||||
|
color: #303a47;
|
||||||
|
}
|
||||||
|
.conpany{
|
||||||
|
font-size: 15px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.recommend{
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
padding: 20px 0 10px;
|
||||||
|
.btn{
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
flex-direction: column;
|
||||||
|
width:30%;
|
||||||
|
height: 100px;
|
||||||
|
background-color: #fff;
|
||||||
|
border: 1px #96989a solid;
|
||||||
|
border-radius: 0;
|
||||||
|
.img{
|
||||||
|
font-size: 35px;
|
||||||
|
color: #303a47;
|
||||||
|
}
|
||||||
|
.text{
|
||||||
|
font-weight: bold;
|
||||||
|
color: #303a47;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.content{
|
||||||
|
padding: 15px;
|
||||||
|
background-color: #b2c4ce;
|
||||||
|
.card {
|
||||||
|
border: none;
|
||||||
|
border-radius: 0;
|
||||||
|
.item {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
padding: 8px 0;
|
||||||
|
border-bottom: 1px solid #8d8d8d;
|
||||||
|
font-size: 15px;
|
||||||
|
i,svg{
|
||||||
|
color: #839eb6;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -0,0 +1,6 @@
|
|||||||
|
@import './font-awesome.min.scss';
|
||||||
|
// @import './lightgallery.scss';
|
||||||
|
// @import './slick.scss';
|
||||||
|
// @import './slick-theme.scss';
|
||||||
|
@import './swiper.scss';
|
||||||
|
// @import './animate.min.scss';
|
||||||
@ -0,0 +1,449 @@
|
|||||||
|
<script setup>
|
||||||
|
import moment from 'moment'
|
||||||
|
import QrcodeVue from 'qrcode.vue'
|
||||||
|
import { useCountDown } from '@vant/use';
|
||||||
|
import { toClipboard } from '@soerenmartius/vue3-clipboard'
|
||||||
|
|
||||||
|
import { ref, computed, onBeforeMount, nextTick, inject } from "vue";
|
||||||
|
import { useRoute, useRouter } from 'vue-router';
|
||||||
|
import { useStore } from 'vuex';
|
||||||
|
|
||||||
|
import { showToast,showSuccessToast } from 'vant';
|
||||||
|
|
||||||
|
import { Dialog } from 'vant';
|
||||||
|
|
||||||
|
// import Footer from '@/components/Footer.vue'
|
||||||
|
|
||||||
|
import { login, bindCard } from '@/api'
|
||||||
|
|
||||||
|
const router = useRouter()
|
||||||
|
const route = useRoute()
|
||||||
|
const store = useStore()
|
||||||
|
|
||||||
|
const popShow = ref(true)
|
||||||
|
const showShare = ref(false)
|
||||||
|
const showNfcQrcode = ref(false)
|
||||||
|
|
||||||
|
const imageUrl = ref(import.meta.env.VITE_APP_IMAGE_URL)
|
||||||
|
|
||||||
|
const userLevel = {
|
||||||
|
0: '基礎款',
|
||||||
|
1: '標準款',
|
||||||
|
2: '自製款',
|
||||||
|
3: '客製款'
|
||||||
|
}
|
||||||
|
|
||||||
|
const is_due = ref(false)
|
||||||
|
|
||||||
|
// 使用useCountDown做倒數計時
|
||||||
|
const countDown = useCountDown({time: 1 * 1000});
|
||||||
|
const current = countDown.current;
|
||||||
|
countDown.start();
|
||||||
|
|
||||||
|
onBeforeMount(async () => {
|
||||||
|
const liff = window.liff;
|
||||||
|
try {
|
||||||
|
if (!liff.isLoggedIn())
|
||||||
|
liff.login({ redirectUri: window.location.href });
|
||||||
|
} catch (err) {
|
||||||
|
console.log(`liff.state init error ${err}`);
|
||||||
|
showToast('登入失敗。請聯絡管理員')
|
||||||
|
router.push('/login')
|
||||||
|
}
|
||||||
|
|
||||||
|
if (!sessionStorage.getItem('token')) {
|
||||||
|
const profile = await liff.getProfile()
|
||||||
|
|
||||||
|
const id_token = liff.getIDToken()
|
||||||
|
|
||||||
|
let loginRes = await login({ line_id: profile.userId, token: id_token })
|
||||||
|
|
||||||
|
if (loginRes.code === 200) {
|
||||||
|
if (route.query.act === 'openright') {
|
||||||
|
showToast('您已經是本站會員')
|
||||||
|
}
|
||||||
|
sessionStorage.setItem('token', loginRes.data.token)
|
||||||
|
sessionStorage.setItem('uid', loginRes.data.uid)
|
||||||
|
|
||||||
|
} else if (loginRes.code === 202) {
|
||||||
|
if (route.query.act === 'openright') {
|
||||||
|
if (route.query.verify) {
|
||||||
|
//詢問是否綁定
|
||||||
|
Dialog.confirm({
|
||||||
|
title: '卡片綁定',
|
||||||
|
message: '確認是否綁定這張卡片'
|
||||||
|
}).then(async () => {
|
||||||
|
//確認綁定
|
||||||
|
let bindRes = await bindCard({ uid: loginRes.data.uid, verify: route.query.verify })
|
||||||
|
if (bindRes.code === 200) {
|
||||||
|
showSuccessToast('綁定成功')
|
||||||
|
} else {
|
||||||
|
showToast.fail('綁定失敗')
|
||||||
|
}
|
||||||
|
}).catch(() => {
|
||||||
|
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
sessionStorage.setItem('token', loginRes.data.token)
|
||||||
|
sessionStorage.setItem('uid', loginRes.data.uid)
|
||||||
|
|
||||||
|
} else if (loginRes.code === 201) {
|
||||||
|
if (route.query.act === 'openright') {
|
||||||
|
if (route.query.verify) {
|
||||||
|
router.push({
|
||||||
|
path: '/register',
|
||||||
|
query: {
|
||||||
|
verify: route.query.verify
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
return
|
||||||
|
}
|
||||||
|
} else if (route.query.aid) {
|
||||||
|
router.push({
|
||||||
|
path: '/register',
|
||||||
|
query: {
|
||||||
|
aid: route.query.aid
|
||||||
|
}
|
||||||
|
})
|
||||||
|
return
|
||||||
|
} else {
|
||||||
|
showToast('請先註冊成為本站會員')
|
||||||
|
return router.push({
|
||||||
|
path: '/register',
|
||||||
|
query: { refer: route.query.refer }
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
} else {
|
||||||
|
showToast('登入失敗。請聯絡管理員')
|
||||||
|
router.push('/login')
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
store.dispatch('user/getUserInfo')
|
||||||
|
|
||||||
|
//判斷是否過期
|
||||||
|
nextTick(() => {
|
||||||
|
|
||||||
|
// if(userInfo.value.level===0 && userInfo.value.nc_type===0){
|
||||||
|
// showToast('會員已過期')
|
||||||
|
// return router.push('/shop/inputsn')
|
||||||
|
// }
|
||||||
|
})
|
||||||
|
})
|
||||||
|
|
||||||
|
|
||||||
|
const userInfo = computed(() => {
|
||||||
|
return store.state.user.userInfo
|
||||||
|
})
|
||||||
|
|
||||||
|
const nfcurl = computed(() => {
|
||||||
|
return encodeURI(store.state.user.userInfo.ufcurl)
|
||||||
|
})
|
||||||
|
|
||||||
|
const overdue = computed(() => {
|
||||||
|
if (store.state.user.userInfo.overdue_time > 0) {
|
||||||
|
return moment.unix(store.state.user.userInfo.overdue_time).format('YYYY-MM-DD')
|
||||||
|
} else {
|
||||||
|
return '無期限'
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
const goCardEdit = () => {
|
||||||
|
if (userInfo.value.nc_type < 2) {
|
||||||
|
router.push('/card/notice')
|
||||||
|
} else {
|
||||||
|
router.push('/card/edit')
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
const onSelect = (option) => {
|
||||||
|
showToast(option.name);
|
||||||
|
showShare.value = false;
|
||||||
|
};
|
||||||
|
|
||||||
|
const handleShowNfc = () => {
|
||||||
|
showNfcQrcode.value = true
|
||||||
|
}
|
||||||
|
|
||||||
|
const doCopy = () => {
|
||||||
|
toClipboard(userInfo.value.nfcurl)
|
||||||
|
showToast('已放入剪貼簿')
|
||||||
|
}
|
||||||
|
|
||||||
|
const doCopyUid = () => {
|
||||||
|
toClipboard(userInfo.value.user_id)
|
||||||
|
showToast('已放入剪貼簿')
|
||||||
|
}
|
||||||
|
|
||||||
|
const bindTggo = () => {
|
||||||
|
console.log(userInfo.value)
|
||||||
|
let url = `https://www.tggo.com.tw/u.cgi?&mnm=mybinding&ncode=${userInfo.value.uniqid}&name=${userInfo.value.real_name}&openExternalBrowser=1`;
|
||||||
|
|
||||||
|
window.open(url, '_blank');
|
||||||
|
}
|
||||||
|
|
||||||
|
const handleLogout = () => {
|
||||||
|
if (liff.isLoggedIn()) {
|
||||||
|
liff.logout();
|
||||||
|
}
|
||||||
|
sessionStorage.removeItem('token')
|
||||||
|
sessionStorage.removeItem('uid')
|
||||||
|
router.push('/login')
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
</script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<div class="home" v-cloak>
|
||||||
|
<div class="my-account">
|
||||||
|
<div class="account-bg">
|
||||||
|
<img src="@/assets/images/topbg.png" />
|
||||||
|
</div>
|
||||||
|
<div class="avatar_box">
|
||||||
|
<img class="avater" :src="userInfo.line_picture || import('@/assets/images/user.jpg')" />
|
||||||
|
</div>
|
||||||
|
<div class="user-info">
|
||||||
|
<p class="uname">UTel電子名片系統</p>
|
||||||
|
<a href="javascript:;">
|
||||||
|
<p class="umoney phone">歡迎來到會員中心</p>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
<div class="set" @click="handleLogout">
|
||||||
|
<a href="javascript:void(0)">登出</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="recommend">
|
||||||
|
<ul>
|
||||||
|
<li @click="router.push('/member')">
|
||||||
|
<p>修改資料</p>
|
||||||
|
<span>修改名片資料</span>
|
||||||
|
</li>
|
||||||
|
<li @click="goCardEdit">
|
||||||
|
<p>商務卡片</p>
|
||||||
|
<span>設計專屬名片</span>
|
||||||
|
</li>
|
||||||
|
<li @click="router.push('/shop')">
|
||||||
|
<p>立即購買</p>
|
||||||
|
<span>付費開通方案</span>
|
||||||
|
</li>
|
||||||
|
<li @click="handleShowNfc">
|
||||||
|
<p>展示二維碼</p>
|
||||||
|
<span>提供好友掃描</span>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<dl class="dl02" v-if="userInfo">
|
||||||
|
<a href="javascript:;">
|
||||||
|
<div class="menu">
|
||||||
|
<img class="titleImg" src="@/assets/images/icon-01.png" />
|
||||||
|
<div class="left">建立日期</div>
|
||||||
|
<div class="right">{{ userInfo.create_time }}</div>
|
||||||
|
<div style="clear: both"></div>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
<a href="javascript:;">
|
||||||
|
<div class="menu">
|
||||||
|
<img class="titleImg" src="@/assets/images/icon-02.png" />
|
||||||
|
<div class="left">會員編號</div>
|
||||||
|
<div class="right">{{ userInfo.user_id }}
|
||||||
|
<span class="cp-btn" @click="doCopyUid">複製</span>
|
||||||
|
</div>
|
||||||
|
<div style="clear: both"></div>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
<a href="javascript:;">
|
||||||
|
<div class="menu">
|
||||||
|
<img class="titleImg" src="@/assets/images/icon-02.png" />
|
||||||
|
<div class="left">公司名稱</div>
|
||||||
|
<div class="right">{{ userInfo.company }}</div>
|
||||||
|
<div style="clear: both"></div>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
<a href="javascript:;">
|
||||||
|
<div class="menu">
|
||||||
|
<img class="titleImg" src="@/assets/images/icon-03.png" />
|
||||||
|
<div class="left">姓名</div>
|
||||||
|
<div class="right">{{ userInfo.real_name }}</div>
|
||||||
|
<div style="clear: both"></div>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
<a href="javascript:;">
|
||||||
|
<div class="menu">
|
||||||
|
<img class="titleImg" src="@/assets/images/icon-04.png" />
|
||||||
|
<div class="left">會員等級</div>
|
||||||
|
<div class="right">{{ userInfo.level_name }}</div>
|
||||||
|
<div style="clear: both"></div>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
<a href="javascript:;">
|
||||||
|
<div class="menu">
|
||||||
|
<img class="titleImg" src="@/assets/images/icon-05.png" />
|
||||||
|
<div class="left">使用期限</div>
|
||||||
|
<div class="right">{{ overdue }}</div>
|
||||||
|
|
||||||
|
<!-- <div class="right" @click="router.push('/shop/inputsn')" v-if="!is_due">{{overdue}}<br/>點此輸入購買序號</div>
|
||||||
|
<div class="right input-sn" @click="router.push('/shop/inputsn')" v-else>已到期,<br/>點此輸入購買序號</div> -->
|
||||||
|
<div style="clear: both"></div>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
<a href="javascript:;">
|
||||||
|
<div class="menu">
|
||||||
|
<img class="titleImg" src="@/assets/images/icon-06.png" />
|
||||||
|
<div class="left">名片連結</div>
|
||||||
|
<div class="right" style="color: #fe6867" @click="doCopy">
|
||||||
|
點擊複製您的連結
|
||||||
|
</div>
|
||||||
|
<div style="clear: both"></div>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
<a href="javascript:;">
|
||||||
|
<div class="menu" @click="$router.push('/auth/auth')">
|
||||||
|
<img class="titleImg" src="@/assets/images/icon-04.png" />
|
||||||
|
<div class="left">授權商務卡片編輯</div>
|
||||||
|
<div class="right">授權</div>
|
||||||
|
<div style="clear: both"></div>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
<a href="javascript:;" @click="$router.push('/auth/getauth')">
|
||||||
|
<div class="menu">
|
||||||
|
<img class="titleImg" src="@/assets/images/icon-04.png" />
|
||||||
|
<div class="left">代客編輯商務卡片</div>
|
||||||
|
<div class="right">編輯</div>
|
||||||
|
<div style="clear: both"></div>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
<a href="javascript:;" v-if="userInfo.uniqid">
|
||||||
|
<div class="menu">
|
||||||
|
<img class="titleImg" src="@/assets/images/icon-06.png" />
|
||||||
|
<div class="left">綁定UTel淘金購會員</div>
|
||||||
|
<div class="right" style="color: #fe6867" @click="bindTggo">
|
||||||
|
點擊後前往綁定
|
||||||
|
</div>
|
||||||
|
<div style="clear: both"></div>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
</dl>
|
||||||
|
<!-- <Footer /> -->
|
||||||
|
<van-dialog v-model:show="showNfcQrcode" title="電子名片二維碼" :show-cancel-button="true" cancel-button-text="關閉"
|
||||||
|
:show-confirm-button="false">
|
||||||
|
<div class="qrcode">
|
||||||
|
<qrcode-vue :value="userInfo.nfcurl" :size="200" level="M" />
|
||||||
|
</div>
|
||||||
|
</van-dialog>
|
||||||
|
<van-overlay :show="popShow" z-index="1000" :style="{background:'rgba(0, 0, 0, .85)'}">
|
||||||
|
<div class="wrapper" @click.stop>
|
||||||
|
<div class="block">
|
||||||
|
<span class="van-icon van-icon-cross" @click="popShow = false" v-show="current.seconds == 0"></span>
|
||||||
|
{{ current.seconds }} 秒
|
||||||
|
</div>
|
||||||
|
<iframe width="100%" style="aspect-ratio: 16/9;" src="https://www.youtube.com/embed/dUro-rg2Uz8?si=K5lDwRcM1NfNCEUR" title="YouTube video player" frameborder="0" controls="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
|
||||||
|
</div>
|
||||||
|
</van-overlay>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<style src="@/assets/css/style.css"></style>
|
||||||
|
<style lang="less" scoped>
|
||||||
|
[ v-cloak] {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.recommend {
|
||||||
|
width: 100%;
|
||||||
|
padding-top: 2%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.recommend ul {
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
justify-content: space-between;
|
||||||
|
}
|
||||||
|
|
||||||
|
.recommend ul li {
|
||||||
|
box-sizing: content-box;
|
||||||
|
|
||||||
|
width: 44%;
|
||||||
|
height: 50px;
|
||||||
|
padding: 2%;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
margin: 1%;
|
||||||
|
-webkit-box-shadow: 0 0 2px #fdaf00;
|
||||||
|
-moz-box-shadow: 0 0 2px #fdaf00;
|
||||||
|
box-shadow: 0 0 2px #fdaf00;
|
||||||
|
}
|
||||||
|
|
||||||
|
.recommend ul li p {
|
||||||
|
margin-top: 2%;
|
||||||
|
font-size: 15px;
|
||||||
|
color: #333;
|
||||||
|
}
|
||||||
|
|
||||||
|
.recommend ul li span {
|
||||||
|
font-size: 14px !important;
|
||||||
|
color: #999 !important;
|
||||||
|
padding-top: 0.15rem !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.recommend ul li:nth-child(1) {
|
||||||
|
background: url(@/assets/images/icon-001.png) right 0.3rem center no-repeat #fff !important;
|
||||||
|
background-size: 30px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.recommend ul li:nth-child(2) {
|
||||||
|
background: url(@/assets/images/icon-002.png) right 0.3rem center no-repeat #fff !important;
|
||||||
|
background-size: 30px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.recommend ul li:nth-child(3) {
|
||||||
|
background: url(@/assets/images/icon-003.png) right 0.3rem center no-repeat #fff !important;
|
||||||
|
background-size: 30px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.recommend ul li:nth-child(4) {
|
||||||
|
background: url(@/assets/images/icon-004.png) right 0.3rem center no-repeat #fff !important;
|
||||||
|
background-size: 30px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.qrcode {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.input-sn {
|
||||||
|
color: red !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cp-btn {
|
||||||
|
border: #999 1px solid;
|
||||||
|
padding: 2px;
|
||||||
|
color: rgb(254, 104, 103);
|
||||||
|
}
|
||||||
|
|
||||||
|
.wrapper{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
height: 100%;
|
||||||
|
.block{
|
||||||
|
position:absolute;
|
||||||
|
color:#ffffff;
|
||||||
|
border-radius:50%;
|
||||||
|
top:10px;
|
||||||
|
right:10px;
|
||||||
|
margin-left:auto;
|
||||||
|
.van-icon{
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
</style>
|
||||||
Loading…
Reference in new issue