mirror of
https://github.com/chaoticbackup/chaoticbackup.github.io.git
synced 2026-03-21 17:24:14 -05:00
change to chunks; improve collection
This commit is contained in:
parent
6c5f1dd5a4
commit
a49cf82527
1
build/2.css
Normal file
1
build/2.css
Normal file
|
|
@ -0,0 +1 @@
|
|||
.icon14{height:14px;padding-bottom:2px}.icon16{height:16px}.icon20{height:20px}.icon24{height:24px}.bigger{font-size:14px}.name{-webkit-user-select:all;-moz-user-select:all;-ms-user-select:all;user-select:all}.name .subname:before{content:"\a ";white-space:pre}.name .subname{font-size:13px;padding-bottom:4px;display:inherit}#player{text-align:center}@media only screen and (min-width:975px){.collection{margin-top:5px;margin-right:5px;margin-left:5px}.collection>.left{font-family:Roboto,Arial,sans-serif;float:left;width:30%}.collection>.right{font-family:Roboto,Arial,sans-serif;float:right;width:70%}}@media only screen and (min-width:975px){.collection #buttons{margin:0 0 2% 1%}.collection #buttons,.collection .button,.collection input[type=button],.collection input[type=text]{border-radius:5px;border-color:transparent;text-align:center;outline:none}.collection input[type=text]{margin-bottom:2px}.collection .centeredCheckBox,.collection input[type=text]{width:220px}.collection .text-entry{display:flex;justify-content:center;align-items:center}.collection .text-entry input:focus{outline:none}.collection .card{text-align:left;display:flex;border:1px solid #aeaeae}.collection .card .left,.collection .card .right,.collection .card .stats{padding-top:4px}.collection .card .bigger{text-align:center;font-weight:700}.collection .card .energy{display:flex;width:20px!important}.collection .card .left{vertical-align:text-top;float:left;width:210px;padding-left:4px}.collection .card .right{float:left;width:calc(100% - 322px);border-left:2px solid #aeaeae;padding-left:4px;padding-right:4px;padding-bottom:6px;white-space:pre-line}.collection .creature .right{width:calc(100% - 366px)}.collection .creature .stats{vertical-align:text-top;float:left;text-align:right;width:40px}.collection .SearchForm{padding-top:3px;font-family:Roboto,Arial,sans-serif}.collection .searchName{display:flex;justify-content:center;align-items:center;padding:2%;font-size:16pt}.collection .centeredCheckBox{margin:0 auto;text-align:left}.collection .centeredSpacing{display:flex;justify-content:space-between}.collection .setBox{width:80%;float:right}.collection #sets{width:80%}.collection .centeredButtons{display:flex;justify-content:center;align-items:center}.collection #search{width:25%;margin:2%;border-radius:5px;border-color:transparent;text-align:center}.collection .minMax{display:flex;justify-content:space-between;margin:0 auto;width:50%;text-align:right}.collection .brainwashed{border-radius:3px;background-color:#dcdddf;color:#000!important}.collection .chieftain,.collection .flavortext{font-style:italic}.collection .disciplines input{width:30px;height:14px;text-align:center;margin-top:2px}.collection .mull input{margin-left:0;margin-top:1px}.collection .Collapsible__contentInner input,.collection .mull input{vertical-align:middle}.collection .Collapsible__contentInner .centeredCheckBox{width:50%}.collection .mcbp input{width:24px;height:14px;padding:unset;text-align:center;margin-top:2px}.collection .tribes{width:96%;text-align:center}.collection .and,.collection .disciplines{text-align:center}.collection .and{vertical-align:text-bottom;width:15%;border-radius:5px;border-color:transparent;margin:2%}}.collection .card .icon14,.collection .card .icon16,.collection .card .icon20,.collection .card .icon24{vertical-align:middle}.collection .thumb{width:100px;height:98px}.collection .card .thumb{float:left}.collection .Collapsible{margin-bottom:5px;margin-top:5px;width:96%}.collection .Collapsible__trigger{background-color:#333;display:block;position:relative;padding-top:5px;padding-bottom:5px;text-indent:5px;font-weight:700;white-space:pre}.collection .Collapsible__trigger:hover{background-color:red}.collection .Collapsible__trigger:after{content:"^";position:absolute;right:10px;top:10px;display:block;transition:transform .4s}.collection .Collapsible__trigger.is-open:after{transform:rotate(180deg);right:5px;top:5px}.collection .Collapsible__trigger.is-disabled{opacity:.5;background-color:grey}.collection .Collapsible__contentInner{margin-top:5px}.collection .left{position:relative}.collection .card_img{position:absolute;width:100%;z-index:2;left:-11px}.collection .card_img .hidden{display:none;max-height:0}.collection .card_img img{max-width:250px;max-height:350px}.collection .entries{text-align:left;width:100%}.collection .entries input[type=button]{margin:0 0 2% 1%}.collection .list-nav-top{display:flex}.collection .extended .fullcard{max-width:250px;max-height:350px}.collection hr{width:96%;margin-inline-start:0}.collection .none{display:inline}.collection .none>span{top:-3px;position:relative}.collection label{user-select:none;-webkit-user-select:none;-ms-user-select:none;-webkit-touch-callout:none;-o-user-select:none;-moz-user-select:none}
|
||||
1
build/2.js
Normal file
1
build/2.js
Normal file
File diff suppressed because one or more lines are too long
1
build/3.css
Normal file
1
build/3.css
Normal file
|
|
@ -0,0 +1 @@
|
|||
@media only screen and (min-width:975px){.pack{max-width:70%}}.packsim input[type=number]::-webkit-inner-spin-button,.packsim input[type=number]::-webkit-outer-spin-button{opacity:1}.pack{height:100%;display:flex;flex-direction:row;flex-wrap:wrap;justify-content:center;margin:auto}.pack .card{width:150px;height:210px;background-size:cover;box-sizing:content-box;margin:5px;-webkit-transition:-webkit-transform 1s,opacity 1s,background 1s,width 1s,height 1s,font-size 1s,top 1s,left 1s;-webkit-border-radius:5px;-o-transition-property:width,height,-o-transform,background,font-size,opacity,top,left;-o-transition-duration:1s,1s,1s,1s,1s,1s,1s,1s;-moz-transition-property:width,height,-o-transform,background,font-size,opacity,top,left;-moz-transition-duration:1s,1s,1s,1s,1s,1s,1s,1s;transition-property:width,height,transform,background,font-size,opacity,top,left;transition-duration:1s,1s,1s,1s,1s,1s,1s,1s}.pack .card:hover{width:250px;height:350px}.pack .stats{height:100%;width:100%;text-align:left}.pack .stats span{position:relative;color:#000;display:block;left:10px;font-size:12px}.pack .stats span:first-of-type{top:130px}.pack .stats span:nth-of-type(2){top:128px}.pack .stats span:nth-of-type(3){top:126px}.pack .stats span:nth-of-type(4){top:124px}.pack .stats span:nth-of-type(5){text-align:right;top:125px;left:-11px;font-size:14px}.pack .card:hover .stats span{left:20px;font-size:14px;font-weight:700}.pack .card:hover .stats span:first-of-type{top:220px}.pack .card:hover .stats span:nth-of-type(2){top:229px}.pack .card:hover .stats span:nth-of-type(3){top:237px}.pack .card:hover .stats span:nth-of-type(4){top:245px}.pack .card:hover .stats span:nth-of-type(5){text-align:right;top:258px;left:-21px;font-size:20px}
|
||||
1
build/3.js
Normal file
1
build/3.js
Normal file
File diff suppressed because one or more lines are too long
1
build/4.css
Normal file
1
build/4.css
Normal file
|
|
@ -0,0 +1 @@
|
|||
.lore{text-align:left;padding-left:10%;padding-right:10%}.lore .title{margin-top:6px;text-align:center;font-weight:700;font-size:18px}.lore div{margin:0 0 6px;line-height:22px!important}.donate{margin-bottom:6px}.donate form a{border-bottom:none}@-webkit-keyframes love{to{-webkit-transform:scale(1.1)}}@-moz-keyframes love{to{-moz-transform:scale(1.1)}}@keyframes love{to{transform:scale(1.1)}}.with-love{color:#333}.with-love div,.with-love span{font-size:14px!important;line-height:18px!important}.with-love div{padding-bottom:4px}.with-love .heart{font-size:1.4em;color:#ff79c6;-webkit-transform:scale(.9);-moz-transform:scale(.9);transform:scale(.9);-webkit-animation:love .5s linear infinite alternate-reverse;-moz-animation:love .5s infinite linear alternate-reverse;animation:love .5s linear infinite alternate-reverse}.with-love a{text-decoration:none;border-bottom:1px dotted}
|
||||
1
build/4.js
Normal file
1
build/4.js
Normal file
File diff suppressed because one or more lines are too long
1
build/5.css
Normal file
1
build/5.css
Normal file
|
|
@ -0,0 +1 @@
|
|||
.portal .navbar h1{font-size:16px}.portal .navbar ul{list-style-type:none;margin:0;padding:0;overflow:hidden;background-color:#333}.portal .navbar li{float:left}.portal .navbar .dropbtn,.portal .navbar li a{display:inline-block;color:#fff;text-align:center;padding:14px 16px;text-decoration:none}.portal .navbar .dropdown:hover .dropbtn,.portal .navbar li a:hover{background-color:red}.portal .navbar li.dropdown{display:inline-block}.portal .navbar .dropdown-content{display:none;position:absolute;background-color:#333;min-width:140px;box-shadow:0 8px 16px 0 rgba(0,0,0,.2);z-index:1}.portal .navbar .dropdown-content a{color:#fff;padding:12px 16px;text-decoration:none;display:block;text-align:left}.portal .navbar .dropdown:hover .dropdown-content{display:block}.portal .magnifying-glass{cursor:pointer;transition:color .2s;z-index:1;vertical-align:middle;fill:currentColor;height:18px;min-width:18px;width:18px}.portal .search .results div{padding-bottom:10px}.portal .search .results a{font-size:16px;line-height:20px}.portal .entry{font-size:1.2em}.portal .entry .title{font-weight:700;font-size:16px}.portal .entry .left{float:left;width:100px}.portal .entry .right{float:right;width:86%}.portal .entry .left .title{text-align:left;padding-bottom:10px}.portal .entry .icon14,.portal .entry .icon16,.portal .entry .icon20,.portal .entry .icon24{vertical-align:middle}.portal .entry .entry_content{min-height:550px;height:calc(100vh - 300px);overflow-y:auto;width:100%;position:relative}.portal .entry .entry_content .entry_splash{padding-bottom:4px}.portal .entry .entry_content .entry_splash img{max-width:100%}.portal .entry .entry_content .entry_splash .arrow{position:absolute;color:#f1f1f1;font-size:40px;font-weight:700;width:100%;top:95%}.portal .entry .entry_content .entry_body{position:relative;max-width:100%;padding-bottom:4px;display:flex;flex-wrap:wrap}.portal .entry .entry_content .entry_body hr{margin:0}.portal .entry .entry_content .entry_body .title{min-width:100%}.portal .entry .entry_content .entry_body .title hr{margin-top:8px}.portal .entry .entry_content .entry_body .column>div,.portal .entry .entry_content .entry_body .nocolumn>div{padding:8px}.portal .entry .entry_content .entry_body .column:nth-child(2){flex-grow:1;text-align:left;min-width:0;width:30%}.portal .entry .entry_content .entry_body .column:last-child{flex-grow:2;min-width:0;flex:60%;border-left:1px solid #fff}.portal .entry .entry_content .entry_body .ability{white-space:pre-line;word-wrap:break-all}.portal .entry .entry_content .entry_body div{white-space:pre-line}.portal .entry .entry_content::-webkit-scrollbar{width:1px}.portal .entry .cat_title{text-align:left;background-color:#1a1a1a;font-weight:700;font-size:16px;padding-top:1px;padding-left:4px}.portal .entry .entry_nav{background-color:#1a1a1a;overflow-x:scroll;overflow-y:hidden;white-space:nowrap}.portal .entry .entry_nav>div{display:inline-block}.portal .entry .entry_nav>div img{margin-right:3px;margin-left:3px}.portal .entry .modal{position:fixed;z-index:10;padding-top:50px;left:0;top:0;width:100%;height:100%;overflow:auto;background-color:#000;background-color:rgba(0,0,0,.9)}.portal .entry .modal.hidden{display:none}.portal .entry .modal-content{margin:auto;display:block;max-height:calc(100vh - 100px);max-width:90vw}.portal .entry .caption{margin:auto;display:block;width:80%;max-width:700px;text-align:center;color:#ccc;padding:10px 0;height:150px}.portal .entry #caption,.portal .entry .modal-content{-webkit-animation-name:zoom;-webkit-animation-duration:.6s;animation-name:zoom;animation-duration:.6s}@-webkit-keyframes zoom{0%{-webkit-transform:scale(0)}to{-webkit-transform:scale(1)}}@keyframes zoom{0%{transform:scale(0)}to{transform:scale(1)}}.portal .entry .close{position:fixed;top:35px;right:35px;color:#f1f1f1;font-size:40px;font-weight:700;transition:.3s}.portal .entry .close:focus,.portal .entry .close:hover{color:#bbb;text-decoration:none;cursor:pointer}
|
||||
1
build/5.js
Normal file
1
build/5.js
Normal file
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
1
build/main.js
Normal file
1
build/main.js
Normal file
File diff suppressed because one or more lines are too long
2
build/vendor.js
Normal file
2
build/vendor.js
Normal file
File diff suppressed because one or more lines are too long
|
|
@ -26,42 +26,6 @@ object-assign
|
|||
@license MIT
|
||||
*/
|
||||
|
||||
/** @license React v16.8.6
|
||||
* react.production.min.js
|
||||
*
|
||||
* Copyright (c) Facebook, Inc. and its affiliates.
|
||||
*
|
||||
* This source code is licensed under the MIT license found in the
|
||||
* LICENSE file in the root directory of this source tree.
|
||||
*/
|
||||
|
||||
/** @license React v16.8.6
|
||||
* react-dom.production.min.js
|
||||
*
|
||||
* Copyright (c) Facebook, Inc. and its affiliates.
|
||||
*
|
||||
* This source code is licensed under the MIT license found in the
|
||||
* LICENSE file in the root directory of this source tree.
|
||||
*/
|
||||
|
||||
/** @license React v0.13.6
|
||||
* scheduler.production.min.js
|
||||
*
|
||||
* Copyright (c) Facebook, Inc. and its affiliates.
|
||||
*
|
||||
* This source code is licensed under the MIT license found in the
|
||||
* LICENSE file in the root directory of this source tree.
|
||||
*/
|
||||
|
||||
/** @license React v16.8.6
|
||||
* react-is.production.min.js
|
||||
*
|
||||
* Copyright (c) Facebook, Inc. and its affiliates.
|
||||
*
|
||||
* This source code is licensed under the MIT license found in the
|
||||
* LICENSE file in the root directory of this source tree.
|
||||
*/
|
||||
|
||||
/** @license mobx-react v5.4.4
|
||||
* index.module.js
|
||||
*
|
||||
|
|
@ -70,3 +34,39 @@ object-assign
|
|||
* This source code is licensed under the MIT license found in the
|
||||
* LICENSE file in the root directory of this source tree.
|
||||
*/
|
||||
|
||||
/** @license React v16.9.0
|
||||
* react.production.min.js
|
||||
*
|
||||
* Copyright (c) Facebook, Inc. and its affiliates.
|
||||
*
|
||||
* This source code is licensed under the MIT license found in the
|
||||
* LICENSE file in the root directory of this source tree.
|
||||
*/
|
||||
|
||||
/** @license React v16.9.0
|
||||
* react-dom.production.min.js
|
||||
*
|
||||
* Copyright (c) Facebook, Inc. and its affiliates.
|
||||
*
|
||||
* This source code is licensed under the MIT license found in the
|
||||
* LICENSE file in the root directory of this source tree.
|
||||
*/
|
||||
|
||||
/** @license React v0.15.0
|
||||
* scheduler.production.min.js
|
||||
*
|
||||
* Copyright (c) Facebook, Inc. and its affiliates.
|
||||
*
|
||||
* This source code is licensed under the MIT license found in the
|
||||
* LICENSE file in the root directory of this source tree.
|
||||
*/
|
||||
|
||||
/** @license React v16.9.0
|
||||
* react-is.production.min.js
|
||||
*
|
||||
* Copyright (c) Facebook, Inc. and its affiliates.
|
||||
*
|
||||
* This source code is licensed under the MIT license found in the
|
||||
* LICENSE file in the root directory of this source tree.
|
||||
*/
|
||||
|
|
@ -48,6 +48,7 @@
|
|||
</head>
|
||||
<body>
|
||||
<div id="root"></div>
|
||||
<script src="/build/bundle.js"></script>
|
||||
<script src="/build/main.js"></script>
|
||||
<script src="/build/vendor.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -5,7 +5,6 @@
|
|||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<title>Chaotic Backup</title>
|
||||
<meta name="description" content="Chaotic Backup">
|
||||
<link rel="stylesheet" type="text/css" href="/build/main.css">
|
||||
<link rel="stylesheet" type="text/css" href="/src/css/legacy.css">
|
||||
<link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet">
|
||||
<style>
|
||||
|
|
@ -89,6 +88,7 @@
|
|||
</head>
|
||||
<body>
|
||||
<div id="root"></div>
|
||||
<script src="/build/bundle.js"></script>
|
||||
<script src="/build/main.js"></script>
|
||||
<script src="/build/vendor.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
34
package-lock.json
generated
34
package-lock.json
generated
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "chaoticbackup",
|
||||
"version": "2.0.0",
|
||||
"version": "2.1.0",
|
||||
"lockfileVersion": 1,
|
||||
"requires": true,
|
||||
"dependencies": {
|
||||
|
|
@ -8040,9 +8040,9 @@
|
|||
}
|
||||
},
|
||||
"react-interactive": {
|
||||
"version": "0.9.0",
|
||||
"resolved": "https://registry.npmjs.org/react-interactive/-/react-interactive-0.9.0.tgz",
|
||||
"integrity": "sha512-Hh8WI6smBi5DaUXzK6z5pHVLB8jMKIQhDqOfxymN4zG5us7OKLq5VR4EsuPuyvJwKgH1MAA3vxdyjs56SjmyRQ==",
|
||||
"version": "0.8.3",
|
||||
"resolved": "https://registry.npmjs.org/react-interactive/-/react-interactive-0.8.3.tgz",
|
||||
"integrity": "sha512-mmRvA9aKP7zu9kVfP1AX1egX8tFlnE3DDXq92z0JTZezfOpmeQBzr77O1+mTV54OOmn+M2t6c5kFD5VnuFoM7A==",
|
||||
"requires": {
|
||||
"detect-it": "^3.0.3",
|
||||
"object-assign": "^4.1.1",
|
||||
|
|
@ -8059,6 +8059,14 @@
|
|||
"resolved": "https://registry.npmjs.org/react-lifecycles-compat/-/react-lifecycles-compat-3.0.4.tgz",
|
||||
"integrity": "sha512-fBASbA6LnOU9dOU2eW7aQ8xmYBSXUIWr+UmF9b1efZBazGNO+rcXT/icdKnYm2pTwcRylVUYwW7H1PHfLekVzA=="
|
||||
},
|
||||
"react-loadable": {
|
||||
"version": "5.5.0",
|
||||
"resolved": "https://registry.npmjs.org/react-loadable/-/react-loadable-5.5.0.tgz",
|
||||
"integrity": "sha512-C8Aui0ZpMd4KokxRdVAm2bQtI03k2RMRNzOB+IipV3yxFTSVICv7WoUr5L9ALB5BmKO1iHgZtWM8EvYG83otdg==",
|
||||
"requires": {
|
||||
"prop-types": "^15.5.0"
|
||||
}
|
||||
},
|
||||
"react-onclickoutside": {
|
||||
"version": "6.9.0",
|
||||
"resolved": "https://registry.npmjs.org/react-onclickoutside/-/react-onclickoutside-6.9.0.tgz",
|
||||
|
|
@ -8554,15 +8562,15 @@
|
|||
}
|
||||
},
|
||||
"sass-loader": {
|
||||
"version": "7.3.1",
|
||||
"resolved": "https://registry.npmjs.org/sass-loader/-/sass-loader-7.3.1.tgz",
|
||||
"integrity": "sha512-tuU7+zm0pTCynKYHpdqaPpe+MMTQ76I9TPZ7i4/5dZsigE350shQWe5EZNl5dBidM49TPET75tNqRbcsUZWeNA==",
|
||||
"version": "8.0.0",
|
||||
"resolved": "https://registry.npmjs.org/sass-loader/-/sass-loader-8.0.0.tgz",
|
||||
"integrity": "sha512-+qeMu563PN7rPdit2+n5uuYVR0SSVwm0JsOUsaJXzgYcClWSlmX0iHDnmeOobPkf5kUglVot3QS6SyLyaQoJ4w==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"clone-deep": "^4.0.1",
|
||||
"loader-utils": "^1.0.1",
|
||||
"neo-async": "^2.5.0",
|
||||
"pify": "^4.0.1",
|
||||
"loader-utils": "^1.2.3",
|
||||
"neo-async": "^2.6.1",
|
||||
"schema-utils": "^2.1.0",
|
||||
"semver": "^6.3.0"
|
||||
},
|
||||
"dependencies": {
|
||||
|
|
@ -10190,6 +10198,12 @@
|
|||
}
|
||||
}
|
||||
},
|
||||
"webpack-async-chunk-names-plugin": {
|
||||
"version": "0.1.1",
|
||||
"resolved": "https://registry.npmjs.org/webpack-async-chunk-names-plugin/-/webpack-async-chunk-names-plugin-0.1.1.tgz",
|
||||
"integrity": "sha1-67je2lmIdgMzH/LKu67luFP+C7U=",
|
||||
"dev": true
|
||||
},
|
||||
"webpack-cli": {
|
||||
"version": "3.3.9",
|
||||
"resolved": "https://registry.npmjs.org/webpack-cli/-/webpack-cli-3.3.9.tgz",
|
||||
|
|
|
|||
|
|
@ -21,7 +21,8 @@
|
|||
"react-collapsible": "^2.6.0",
|
||||
"react-digit-input": "^1.0.0",
|
||||
"react-dom": "^16.9.0",
|
||||
"react-interactive": "^0.9.0",
|
||||
"react-interactive": "0.8.3",
|
||||
"react-loadable": "^5.5.0",
|
||||
"react-onclickoutside": "^6.9.0",
|
||||
"react-process-string": "^1.2.0",
|
||||
"react-router": "^5.1.0",
|
||||
|
|
@ -35,6 +36,7 @@
|
|||
"@babel/node": "^7.6.2",
|
||||
"@babel/plugin-proposal-class-properties": "^7.5.5",
|
||||
"@babel/plugin-proposal-decorators": "^7.6.0",
|
||||
"@babel/plugin-syntax-dynamic-import": "^7.2.0",
|
||||
"@babel/plugin-transform-runtime": "^7.6.2",
|
||||
"@babel/polyfill": "^7.6.0",
|
||||
"@babel/preset-env": "^7.6.2",
|
||||
|
|
@ -52,10 +54,11 @@
|
|||
"mini-css-extract-plugin": "^0.8.0",
|
||||
"node-sass": "^4.12.0",
|
||||
"optimize-css-assets-webpack-plugin": "^5.0.3",
|
||||
"sass-loader": "^7.3.1",
|
||||
"sass-loader": "^8.0.0",
|
||||
"style-loader": "^1.0.0",
|
||||
"uglifyjs-webpack-plugin": "^2.2.0",
|
||||
"webpack": "^4.41.0",
|
||||
"webpack-async-chunk-names-plugin": "^0.1.1",
|
||||
"webpack-cli": "^3.3.9",
|
||||
"webpack-dev-server": "^3.8.1"
|
||||
}
|
||||
|
|
|
|||
|
|
@ -12,7 +12,7 @@ export function UnderConstruction(props) {
|
|||
export function PageNotFound(props) {
|
||||
return (
|
||||
<p style={s.p}>
|
||||
Page not found - the path, {s.code(props.location.pathname)}, did not match any routes.
|
||||
404 route not found - {s.code(props.location.pathname)}
|
||||
</p>
|
||||
);
|
||||
}
|
||||
|
|
@ -69,6 +69,10 @@ export function Name(props) {
|
|||
</span>);
|
||||
}
|
||||
|
||||
export function Mugic(props) {
|
||||
return <img className={props.size||"icon20"} src={("/src/img/icons/mugic/"+(props.tribe||"generic")+".png").toLowerCase()} alt={"MC"} />
|
||||
}
|
||||
|
||||
export function Element(props) {
|
||||
if (props.value) {
|
||||
return <img className={props.size||"icon20"} src={("/src/img/icons/elements/"+props.element+".png").toLowerCase()} />
|
||||
|
|
@ -78,16 +82,24 @@ export function Element(props) {
|
|||
}
|
||||
}
|
||||
|
||||
export function Mugic(props) {
|
||||
return <img className={props.size||"icon20"} src={("/src/img/icons/mugic/"+(props.tribe||"generic")+".png").toLowerCase()} alt={"MC"} />
|
||||
export function Tribe(props) {
|
||||
return <img className={props.size||"icon16"} src={("/src/img/icons/tribes/"+props.tribe+".png").toLowerCase()} />
|
||||
}
|
||||
|
||||
export function Discipline(props) {
|
||||
return <img className={props.size||"icon16"} src={("/src/img/icons/disciplines/"+props.discipline+".png").toLowerCase()} />
|
||||
}
|
||||
|
||||
export function Tribe(props) {
|
||||
return <img className={props.size||"icon16"} src={("/src/img/icons/tribes/"+props.tribe+".png").toLowerCase()} />
|
||||
export function LocationIcon(props) {
|
||||
return <img className={props.size||"icon16"} src="/src/img/icons/location.png" />
|
||||
}
|
||||
|
||||
export function BattlegearIcon(props) {
|
||||
return <img className={props.size||"icon16"} src="/src/img/icons/battlegear.png" />
|
||||
}
|
||||
|
||||
export function AttackIcon(props) {
|
||||
return <img className={props.size||"icon16"} src="/src/img/icons/attack.png" />
|
||||
}
|
||||
|
||||
export function Ability(props) {
|
||||
|
|
|
|||
|
|
@ -15,6 +15,12 @@ export default class Home extends React.Component {
|
|||
@observable content = [];
|
||||
@observable card_img = API.card_back;
|
||||
|
||||
componentDidMount() {
|
||||
let ext = localStorage.getItem("extended");
|
||||
if (ext == null) this.ext = false;
|
||||
this.ext = (/true/i).test(ext);
|
||||
}
|
||||
|
||||
handleContent(content) {
|
||||
this.content = content;
|
||||
this.p = 1;
|
||||
|
|
@ -25,6 +31,11 @@ export default class Home extends React.Component {
|
|||
this.changeImage();
|
||||
}
|
||||
|
||||
setExt() {
|
||||
this.ext = !this.ext;
|
||||
localStorage.setItem("extended", this.ext);
|
||||
}
|
||||
|
||||
render() {
|
||||
return (
|
||||
<div className={"collection " + (this.ext ? "extended" : "short")}>
|
||||
|
|
@ -49,7 +60,7 @@ export default class Home extends React.Component {
|
|||
extended() {
|
||||
return (
|
||||
<div className="ext-button">
|
||||
<button id="buttons" onClick={(e) => this.ext = !this.ext}
|
||||
<button id="buttons" onClick={this.setExt.bind(this)}
|
||||
>{this.ext ? "Short Format" : "Extended Format"}</button>
|
||||
</div>
|
||||
);
|
||||
|
|
|
|||
|
|
@ -30,14 +30,11 @@ export default class SearchCollection extends React.Component {
|
|||
name: "",
|
||||
text: "",
|
||||
subtypes: "",
|
||||
past: false,
|
||||
mirage: false,
|
||||
minion: false,
|
||||
flavor: true,
|
||||
sets: {},
|
||||
types: {attack: false, battlegear: false, creature: false, location: false, mugic: false},
|
||||
rarity: {common: false, uncommon: false, rare: false, 'super rare': false, 'ultra rare': false, promo: false},
|
||||
tribes: {danian: false, 'm\'arrillian': false, 'mipedian': false, overworld: false, underworld: false, generic: false},
|
||||
tribes: {danian: false, 'm\'arrillian': false, mipedian: false, overworld: false, underworld: false, generic: false},
|
||||
elements: {fire: false, air: false, earth: false, water: false, none: false, and: false},
|
||||
disciplines: {courage: '', power: '', wisdom: '', speed: ''},
|
||||
energy: {min: '', max: ''},
|
||||
|
|
@ -69,9 +66,6 @@ export default class SearchCollection extends React.Component {
|
|||
}
|
||||
});
|
||||
|
||||
if (query.hasOwnProperty('past')) this.input.past = true;
|
||||
if (query.hasOwnProperty('mirage')) this.input.mirage = true;
|
||||
if (query.hasOwnProperty('minion')) this.input.minion = true;
|
||||
if (query.hasOwnProperty('name')) this.input.name = query.name;
|
||||
if (query.hasOwnProperty('text')) this.input.text = query.text;
|
||||
if (query.hasOwnProperty('subtypes')) this.input.subtypes = query.subtypes;
|
||||
|
|
@ -106,9 +100,6 @@ export default class SearchCollection extends React.Component {
|
|||
|
||||
this.list.forEach(item => queryString += update(item));
|
||||
|
||||
if (this.input.past) queryString += "past&";
|
||||
if (this.input.mirage) queryString += "mirage&";
|
||||
if (this.input.minion) queryString += "minion&";
|
||||
if (this.input.name) queryString += "name=" + encodeURIComponent(this.input.name) + "&";
|
||||
if (this.input.text) queryString += "text=" + encodeURIComponent(this.input.text) + "&";
|
||||
if (this.input.subtypes) queryString += "subtypes=" + encodeURIComponent(this.input.subtypes) + "&";
|
||||
|
|
@ -229,16 +220,11 @@ export default class SearchCollection extends React.Component {
|
|||
<div className="text-entry">
|
||||
<input type="text" name="text" placeholder="Card Text" value={this.input.text} onChange={this.handleChange} />
|
||||
</div>
|
||||
<div className="centeredCheckBox">
|
||||
<label className="mull"><input type="checkbox" name="flavor" value={!this.input.flavor} onChange={(e) => {this.input.flavor = !e.target.checked}} />Ignore Flavortext</label>
|
||||
</div>
|
||||
<div className="text-entry">
|
||||
<input type="text" name="subtypes" placeholder="Subtypes | Initiative" value={this.input.subtypes} onChange={this.handleChange} />
|
||||
</div>
|
||||
<div className="centeredCheckBox centeredSpacing">
|
||||
<label className="mull"><input type="checkbox" name="past" checked={this.input.past} onChange={this.handleChange} />Past</label>
|
||||
<label className="mull"><input type="checkbox" name="mirage" checked={this.input.mirage} onChange={this.handleChange} />Mirage</label>
|
||||
<label className="mull"><input type="checkbox" name="minion" checked={this.input.minion} onChange={this.handleChange} />Minion</label>
|
||||
<div className="centeredCheckBox">
|
||||
<label className="mull"><input type="checkbox" name="flavor" value={!this.input.flavor} onChange={(e) => {this.input.flavor = !e.target.checked}} />Ignore Flavortext & Artist</label>
|
||||
</div>
|
||||
<br />
|
||||
<div className="centeredCheckBox centeredSpacing">
|
||||
|
|
|
|||
|
|
@ -61,19 +61,22 @@ export default function search_api(input) {
|
|||
|
||||
// Card Text
|
||||
if (input.text.length > 0) {
|
||||
// split text by comma
|
||||
let textList = input.text.split(",").filter(Boolean).map((item) => {
|
||||
return ({'$regex': new RegExp(item.trim(), 'i')});
|
||||
});
|
||||
// clean text
|
||||
let inputtext = input.text.replace(/\\/g, '').replace(/\(|\)/g, (match) => {return ("\\"+match)});
|
||||
|
||||
let parm = (() => {
|
||||
let list = [
|
||||
{'gsx$tags': {"$or": textList}},
|
||||
{'gsx$ability': {"$or": textList}},
|
||||
{'gsx$artist': {"$or": textList}}
|
||||
{'gsx$ability': {"$or": {'$regex': new RegExp(inputtext, 'i')}}}
|
||||
]
|
||||
if (input.flavor)
|
||||
list.splice(3, 0, {'gsx$flavortext': {"$or": textList}});
|
||||
|
||||
if (input.flavor) {
|
||||
list.push({'gsx$flavortext': {"$or": textList}});
|
||||
list.push({'gsx$artist': {"$or": textList}});
|
||||
}
|
||||
return list;
|
||||
})();
|
||||
|
||||
|
|
@ -86,24 +89,6 @@ export default function search_api(input) {
|
|||
mugicResults = mugicResults.find({'$or': parm});
|
||||
}
|
||||
|
||||
// Past
|
||||
if (input.past) {
|
||||
attackResults = attackResults.find({'gsx$past': {'$gt': 0}});
|
||||
battlegearResults = battlegearResults.find({'gsx$past': {'$gt': 0}});
|
||||
creatureResults = creatureResults.find({'gsx$types': {'$regex': new RegExp("past", 'i')}});
|
||||
locationResults = locationResults.find({'gsx$past': {'$gt': 0}});
|
||||
mugicResults = mugicResults.find({'gsx$past': {'$gt': 0}});
|
||||
}
|
||||
|
||||
// Mirage
|
||||
if (input.mirage) {
|
||||
locationResults = locationResults.find({'gsx$mirage': {'$gt': 0}});
|
||||
attackResults = attackResults.limit(0);
|
||||
battlegearResults = battlegearResults.limit(0);
|
||||
creatureResults = creatureResults.limit(0);
|
||||
mugicResults = mugicResults.limit(0);
|
||||
}
|
||||
|
||||
// Subtypes / Initiative
|
||||
if (input.subtypes.length > 0) {
|
||||
let subtypesList = input.subtypes.split(",").filter(Boolean).map((item) => {
|
||||
|
|
@ -111,24 +96,12 @@ export default function search_api(input) {
|
|||
});
|
||||
|
||||
creatureResults = creatureResults.find({'gsx$types': {'$or': subtypesList} });
|
||||
locationResults = locationResults.find({'gsx$initiative': {'$or': subtypesList}});
|
||||
locationResults = locationResults.find({'$or': [{'gsx$initiative': {'$or': subtypesList}}, {'gsx$types': {'$or': subtypesList}}]});
|
||||
attackResults = attackResults.limit(0);
|
||||
battlegearResults = battlegearResults.find({'gsx$types': {'$or': subtypesList} });
|
||||
mugicResults = mugicResults.limit(0);
|
||||
}
|
||||
|
||||
// Minion
|
||||
if (input.minion) {
|
||||
locationResults = locationResults.limit(0);
|
||||
attackResults = attackResults.limit(0);
|
||||
battlegearResults = battlegearResults.limit(0);
|
||||
creatureResults = creatureResults.where((obj) => {
|
||||
return obj.gsx$brainwashed != ('');
|
||||
});
|
||||
mugicResults = mugicResults.limit(0);
|
||||
}
|
||||
|
||||
|
||||
// Search by tribe
|
||||
let tribesList = [];
|
||||
for (const tribe in input.tribes) {
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
import React from 'react';
|
||||
import API from '../../SpreadsheetData';
|
||||
import {observer, inject} from 'mobx-react';
|
||||
import {Rarity, Unique, Name, Element, Ability} from '../../Snippets';
|
||||
import {Rarity, Unique, Name, Element, Ability, AttackIcon} from '../../Snippets';
|
||||
|
||||
@inject((stores, props, context) => props) @observer
|
||||
export default class Attack extends React.Component {
|
||||
|
|
@ -15,7 +15,7 @@ export default class Attack extends React.Component {
|
|||
<div className="left">
|
||||
<Name name={card.gsx$name} /><br />
|
||||
<Rarity set={card.gsx$set} rarity={card.gsx$rarity} /><br />
|
||||
<span>Build Points: {card.gsx$bp}</span><br />
|
||||
<span><AttackIcon /> Attack - {card.gsx$bp}</span><br />
|
||||
<div>
|
||||
<span className="bigger">{card.gsx$base}</span> |
|
||||
<Element element="fire" value={card.gsx$fire} />{card.gsx$fire}
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
import React from 'react';
|
||||
import API from '../../SpreadsheetData';
|
||||
import {observer, inject} from 'mobx-react';
|
||||
import {Rarity, Unique, Name, Ability} from '../../Snippets';
|
||||
import {Rarity, Unique, Name, Ability, BattlegearIcon} from '../../Snippets';
|
||||
|
||||
@inject((stores, props, context) => props) @observer
|
||||
export default class Battlegear extends React.Component {
|
||||
|
|
@ -15,6 +15,7 @@ export default class Battlegear extends React.Component {
|
|||
<div className="left">
|
||||
<Name name={card.gsx$name} /><br />
|
||||
<Rarity set={card.gsx$set} rarity={card.gsx$rarity} /><br />
|
||||
<span><BattlegearIcon /> Battlegear{card.gsx$types.length > 0 ? " - " + card.gsx$types : null}</span>
|
||||
</div>
|
||||
<div className="right" >
|
||||
<Ability ability={card.gsx$ability} />
|
||||
|
|
|
|||
|
|
@ -14,13 +14,28 @@ export default class Creature extends React.Component {
|
|||
mugic.push(<Mugic key={i} tribe={card.gsx$tribe} />);
|
||||
}
|
||||
|
||||
const TribeLine = () => {
|
||||
let tribe = card.gsx$tribe;
|
||||
let types = card.gsx$types;
|
||||
let past = false;
|
||||
if (types.toLowerCase().includes("past")) {
|
||||
past = true;
|
||||
types = types.replace(/past /i, '');
|
||||
}
|
||||
|
||||
// <past> <tribe> <types>
|
||||
let line = " " + (past ? "Past " : "") + (tribe == "Generic" ? "" : tribe + " ") + types;
|
||||
|
||||
return <span><Tribe tribe={tribe} />{line}</span>
|
||||
}
|
||||
|
||||
if (this.props.ext == false) return (
|
||||
<div className="card creature">
|
||||
<img className="thumb" style={{float: 'left'}} src={API.base_image + (card.gsx$thumb||API.thumb_missing)} onClick={() => this.props.setImage(card.gsx$image)} />
|
||||
<div className="left">
|
||||
<Name name={card.gsx$name} /><br />
|
||||
<Rarity set={card.gsx$set} rarity={card.gsx$rarity} /><br />
|
||||
<span><Tribe tribe={card.gsx$tribe} /> {card.gsx$tribe} {card.gsx$types}</span><br />
|
||||
<TribeLine /><br />
|
||||
<div>
|
||||
<Element element="fire" value={card.gsx$elements.toLowerCase().indexOf("fire") >=0} />
|
||||
<Element element="air" value={card.gsx$elements.toLowerCase().indexOf("air") >=0} />
|
||||
|
|
@ -43,16 +58,16 @@ export default class Creature extends React.Component {
|
|||
<br />
|
||||
<div className="stats">
|
||||
<div className="energy">
|
||||
{card.gsx$courage}<img className="icon16" src={"/src/img/icons/disciplines/courage.png"}></img>
|
||||
{card.gsx$courage}<Discipline discipline="courage" />
|
||||
</div>
|
||||
<div className="energy">
|
||||
{card.gsx$power}<img className="icon16"src={"/src/img/icons/disciplines/power.png"}></img>
|
||||
{card.gsx$power}<Discipline discipline="power" />
|
||||
</div>
|
||||
<div className="energy">
|
||||
{card.gsx$wisdom}<img className="icon16"src={"/src/img/icons/disciplines/wisdom.png"}></img>
|
||||
{card.gsx$wisdom}<Discipline discipline="wisdom" />
|
||||
</div>
|
||||
<div className="energy">
|
||||
{card.gsx$speed}<img className="icon16"src={"/src/img/icons/disciplines/speed.png"}></img>
|
||||
{card.gsx$speed}<Discipline discipline="speed" />
|
||||
</div>
|
||||
<div className="energy" style={{fontWeight: 'bold'}}>{card.gsx$energy}
|
||||
</div>
|
||||
|
|
@ -64,10 +79,10 @@ export default class Creature extends React.Component {
|
|||
<img className="fullcard" src={API.base_image + (card.gsx$image || API.card_back)} />
|
||||
<div className="right" >
|
||||
<Name name={card.gsx$name} /><br />
|
||||
<span>{card.gsx$courage} <img className="icon16" src={"/src/img/icons/disciplines/courage.png"}></img></span>
|
||||
<span>{card.gsx$power} <img className="icon16" src={"/src/img/icons/disciplines/power.png"}></img></span>
|
||||
<span>{card.gsx$wisdom} <img className="icon16" src={"/src/img/icons/disciplines/wisdom.png"}></img></span>
|
||||
<span>{card.gsx$speed} <img className="icon16" src={"/src/img/icons/disciplines/speed.png"}></img></span>
|
||||
<span>{card.gsx$courage} <Discipline discipline="courage" /></span>
|
||||
<span>{card.gsx$power} <Discipline discipline="power" /></span>
|
||||
<span>{card.gsx$wisdom} <Discipline discipline="wisdom" /></span>
|
||||
<span>{card.gsx$speed} <Discipline discipline="speed" /></span>
|
||||
<span style={{fontWeight: 'bold'}}>{card.gsx$energy}</span>
|
||||
<br />
|
||||
<Ability ability={card.gsx$ability} tribe={card.gsx$tribe} />
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
import React from 'react';
|
||||
import API from '../../SpreadsheetData';
|
||||
import {observer, inject} from 'mobx-react';
|
||||
import {Rarity, Unique, Name, Ability, Initiative} from '../../Snippets';
|
||||
import {Rarity, Unique, Name, Ability, Initiative, LocationIcon} from '../../Snippets';
|
||||
|
||||
@inject((stores, props, context) => props) @observer
|
||||
export default class Location extends React.Component {
|
||||
|
|
@ -15,7 +15,8 @@ export default class Location extends React.Component {
|
|||
<div className="left">
|
||||
<Name name={card.gsx$name} /><br />
|
||||
<Rarity set={card.gsx$set} rarity={card.gsx$rarity} /><br />
|
||||
<Initiative initiative={card.gsx$initiative} /><br />
|
||||
<span><LocationIcon /> Location{card.gsx$types.length > 0 ? " - " + card.gsx$types : null}</span><br />
|
||||
<Initiative initiative={card.gsx$initiative} />
|
||||
</div>
|
||||
<div className="right">
|
||||
<Ability ability={card.gsx$ability} />
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
import React from 'react';
|
||||
import API from '../../SpreadsheetData';
|
||||
import {observer, inject} from 'mobx-react';
|
||||
import {Rarity, Unique, Name, Mugic, Ability} from '../../Snippets';
|
||||
import {Rarity, Unique, Name, Mugic, Ability, Tribe} from '../../Snippets';
|
||||
|
||||
@inject((stores, props, context) => props) @observer
|
||||
export default class Attack extends React.Component {
|
||||
|
|
@ -11,10 +11,10 @@ export default class Attack extends React.Component {
|
|||
|
||||
let mugicCounters = [];
|
||||
if (card.gsx$cost == 0) {
|
||||
mugicCounters.push(<span key={0}>0</span>);
|
||||
mugicCounters.push(<span className="bigger" key={0}>0</span>);
|
||||
}
|
||||
else if (card.gsx$cost.toLowerCase() == 'x') {
|
||||
mugicCounters.push(<span key={0}>X</span>);
|
||||
mugicCounters.push(<span className="bigger" key={0}>X</span>);
|
||||
}
|
||||
else {
|
||||
for (let i = 0; i < card.gsx$cost; i++) {
|
||||
|
|
@ -28,7 +28,7 @@ export default class Attack extends React.Component {
|
|||
<div className="left">
|
||||
<Name name={card.gsx$name} /><br />
|
||||
<Rarity set={card.gsx$set} rarity={card.gsx$rarity} /> <br />
|
||||
<img height="20" className="icon16" src={"/src/img/icons/tribes/"+(card.gsx$tribe.toLowerCase()||"generic")+".png"} /> {card.gsx$tribe}<br />
|
||||
<Tribe size="icon16" tribe={card.gsx$tribe} /> Mugic - {card.gsx$tribe}<br />
|
||||
<span>{mugicCounters}</span><br />
|
||||
</div>
|
||||
<br />
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
import React from 'react';
|
||||
import {Link} from 'react-router-dom';
|
||||
import {Donate} from './Snippets';
|
||||
import "../scss/home.scss";
|
||||
import {Donate} from '../Snippets';
|
||||
import "../../scss/home.scss";
|
||||
|
||||
const GithubLink = () => (
|
||||
<a
|
||||
|
|
@ -12,7 +12,7 @@ const GithubLink = () => (
|
|||
</a>
|
||||
);
|
||||
|
||||
export default function Home() {
|
||||
export default function Home(props) {
|
||||
return (
|
||||
<div>
|
||||
<br />
|
||||
|
|
@ -1,28 +1,37 @@
|
|||
import React from 'react';
|
||||
import { render } from 'react-dom';
|
||||
import { BrowserRouter as Router, Link, Route } from 'react-router-dom';
|
||||
import { BrowserRouter as Router, Link, Route, Switch } from 'react-router-dom';
|
||||
import loadable from 'react-loadable';
|
||||
import s from '../styles/app.style';
|
||||
|
||||
/* Components */
|
||||
import API from './SpreadsheetData';
|
||||
import {PageNotFound, UnderConstruction, Donate} from './Snippets';
|
||||
import EnterTheCode from './entercode/index';
|
||||
import {PageNotFound, UnderConstruction, Donate, Loading} from './Snippets';
|
||||
import Create from './create/index';
|
||||
import Collection from './collection/index';
|
||||
import Portal from './portal/index';
|
||||
import Home from './Home';
|
||||
|
||||
const EnterTheCode = loadable({
|
||||
loader: () => import('./entercode'),
|
||||
loading: Loading
|
||||
})
|
||||
|
||||
render(
|
||||
<Router>
|
||||
<Base path="/*" href="/" />
|
||||
</Router>
|
||||
, document.getElementById('root'),
|
||||
);
|
||||
const Home = loadable({
|
||||
loader: () => import('./home'),
|
||||
loading: Loading
|
||||
});
|
||||
|
||||
const Portal = loadable({
|
||||
loader: () => import('./portal'),
|
||||
loading: Loading
|
||||
});
|
||||
|
||||
const Collection = loadable({
|
||||
loader: () => import('./collection'),
|
||||
loading: Loading
|
||||
});
|
||||
|
||||
function Routing(props) {
|
||||
return (
|
||||
<React.Fragment>
|
||||
<Switch>
|
||||
<Route exact path="/" component={Home} />
|
||||
<Route path="/PageNotFound" component={PageNotFound} />
|
||||
<Route path="/UnderConstruction" component={UnderConstruction} />
|
||||
|
|
@ -30,7 +39,7 @@ function Routing(props) {
|
|||
<Route path="/create" component={Create} />
|
||||
<Route path="/collection" component={Collection} />
|
||||
<Route path="/portal" component={Portal} />
|
||||
</React.Fragment>
|
||||
</Switch>
|
||||
);
|
||||
}
|
||||
|
||||
|
|
@ -158,3 +167,10 @@ function Base(props) {
|
|||
</React.Fragment>
|
||||
);
|
||||
}
|
||||
|
||||
render(
|
||||
<Router>
|
||||
<Base path="/*" href="/" />
|
||||
</Router>
|
||||
, document.getElementById('root'),
|
||||
);
|
||||
|
|
@ -34,8 +34,9 @@ export default class Category extends React.Component {
|
|||
if (!data) return (<div key={i}></div>);
|
||||
|
||||
return (<div key={i}>
|
||||
<Interactive as={Link} {...s.link}
|
||||
<Interactive as={Link}
|
||||
to={url || `/portal/${this.props.type}/${card.gsx$name}`}
|
||||
{...s.link}
|
||||
>
|
||||
<span>{card.gsx$name.split(",")[0]}</span><br />
|
||||
<img className="thumb" src={API.base_image + data.gsx$thumb}></img>
|
||||
|
|
|
|||
|
|
@ -22,7 +22,7 @@ function Artist(props) {
|
|||
props.artist.split(/(?=, )/).forEach((artist, i) => {
|
||||
artists.push(<Link key={i} to={`/portal/Search/?${artist.replace(", ", "")}`}>{artist}</Link>);
|
||||
});
|
||||
return (<div className="ability">{artists}</div>)
|
||||
return (<div className="artist">{artists}</div>)
|
||||
}
|
||||
|
||||
@inject((stores, props, context) => props) @observer
|
||||
|
|
|
|||
BIN
src/img/icons/battlegear.png
Normal file
BIN
src/img/icons/battlegear.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 5.1 KiB |
BIN
src/img/icons/location.png
Normal file
BIN
src/img/icons/location.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 12 KiB |
|
|
@ -177,6 +177,10 @@
|
|||
white-space: pre-line;
|
||||
word-wrap: break-all;
|
||||
}
|
||||
|
||||
div {
|
||||
white-space: pre-line;
|
||||
}
|
||||
}
|
||||
|
||||
// /* width */
|
||||
|
|
|
|||
|
|
@ -4,12 +4,13 @@ const webpack = require('webpack');
|
|||
const UglifyJsPlugin = require('uglifyjs-webpack-plugin');
|
||||
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
|
||||
const OptimizeCSSAssetsPlugin = require('optimize-css-assets-webpack-plugin');
|
||||
const AsyncChunkNames = require('webpack-async-chunk-names-plugin');
|
||||
require('@babel/register');
|
||||
|
||||
const devMode = (process.env.NODE_ENV !== 'production' && process.argv.indexOf('-p') === -1);
|
||||
|
||||
const config = {
|
||||
entry: ['@babel/polyfill', `${__dirname}/src/components/index.js`],
|
||||
entry: ['@babel/polyfill', `./src/components/index.js`],
|
||||
|
||||
resolve: {
|
||||
extensions: ['.js', '.jsx'],
|
||||
|
|
@ -23,9 +24,10 @@ const config = {
|
|||
},
|
||||
|
||||
output: {
|
||||
path: `${__dirname}/build`,
|
||||
path: path.resolve(__dirname, 'build'),
|
||||
filename: 'main.js',
|
||||
chunkFilename: '[name].js',
|
||||
publicPath: '/build/',
|
||||
filename: 'bundle.js',
|
||||
},
|
||||
|
||||
optimization: {
|
||||
|
|
@ -40,12 +42,30 @@ const config = {
|
|||
],
|
||||
splitChunks: {
|
||||
cacheGroups: {
|
||||
default: false,
|
||||
vendor: {
|
||||
// name of the chunk
|
||||
name: 'vendor',
|
||||
// sync + async chunks
|
||||
chunks: 'all',
|
||||
// import file path containing node_modules
|
||||
test: /node_modules/,
|
||||
priority: 20,
|
||||
},
|
||||
styles: {
|
||||
name: 'styles',
|
||||
test: /\.css$/,
|
||||
chunks: 'all',
|
||||
chunks: "all",
|
||||
enforce: true,
|
||||
},
|
||||
common: {
|
||||
name: 'common',
|
||||
minChunks: 2,
|
||||
chunks: 'async',
|
||||
priority: 10,
|
||||
reuseExistingChunk: true,
|
||||
enforce: true
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
|
|
@ -66,6 +86,7 @@ const config = {
|
|||
'@babel/plugin-transform-runtime',
|
||||
['@babel/plugin-proposal-decorators', {legacy: true }],
|
||||
['@babel/plugin-proposal-class-properties', { loose: true }],
|
||||
'@babel/plugin-syntax-dynamic-import',
|
||||
],
|
||||
},
|
||||
},
|
||||
|
|
@ -85,13 +106,16 @@ const config = {
|
|||
},
|
||||
|
||||
// First array is dev only, second is production
|
||||
plugins: devMode ? [] : [
|
||||
plugins: devMode
|
||||
? [
|
||||
new AsyncChunkNames(),
|
||||
]
|
||||
: [
|
||||
new webpack.DefinePlugin({
|
||||
'process.env.NODE_ENV': JSON.stringify('production'),
|
||||
}),
|
||||
new MiniCssExtractPlugin({
|
||||
filename: '[name].css',
|
||||
chunkFilename: '[id].css',
|
||||
filename: '[name].css'
|
||||
}),
|
||||
],
|
||||
};
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user