Browse Source

Redo with React

hkremer/rebranding
Gregory Rudolph 3 years ago
parent
commit
5bfdbabf33
Signed by: rudi
GPG Key ID: EF64F3CBD1A1EBDD
  1. 40
      src/app.js
  2. 14
      src/index.css
  3. 6
      src/index.js
  4. 2
      static/css/main.e5b81ba0.chunk.css
  5. 1
      static/css/main.e5b81ba0.chunk.css.map
  6. 2
      static/header.tpl
  7. 3
      static/js/2.2def0c6d.chunk.js
  8. 41
      static/js/2.2def0c6d.chunk.js.LICENSE.txt
  9. 1
      static/js/2.2def0c6d.chunk.js.map
  10. 2
      static/js/main.cf70ea3e.chunk.js
  11. 1
      static/js/main.cf70ea3e.chunk.js.map
  12. 4
      static/loggedIn.tpl

40
src/app.js

@ -12,6 +12,42 @@ function Card(data) { @@ -12,6 +12,42 @@ function Card(data) {
</div>
)
}
function CardImg(data) {
return (
<div className="card-img">
<h4><b>{data.Username}</b></h4>
<img src={data.Photo !== undefined ? data.Photo : "https://thiscatdoesnotexist.com/"} alt="Avatar" style={{ width: "100%" }} />
<div className="container">
<p>{data.Closed}</p>
<p>{data.UserID}</p>
</div>
</div>
)
}
class Pending extends React.Component {
state = {
pending: []
}
componentDidMount() {
const apiUrl = 'https://thanos.nightmare.haus/api/pending';
fetch(apiUrl)
.then((response) => response.json())
.then((data) => this.setState({pending: data}));
}
render() {
return (
<div className="App">
<ul>
{this.state.pending.map((data, i) => (
<li key={i}> <CardImg {...data} /></li>
))}
</ul>
</div>
);
}
}
class Verification extends React.Component {
state = {
@ -36,5 +72,9 @@ class Verification extends React.Component { @@ -36,5 +72,9 @@ class Verification extends React.Component {
}
}
export {
Pending,
Verification,
}
export default Verification;

14
src/index.css

@ -18,7 +18,19 @@ body { @@ -18,7 +18,19 @@ body {
transition: 0.3s;
position: relative;
width: 300px;
height: 250px;
height: 200px;
padding: 10px;
background-color: #282c34;
color: #FFFFFF;
}
.card-img {
/* Add shadows to create the "card" effect */
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.137);
border-radius: 3%;
transition: 0.3s;
position: relative;
width: 300px;
height: 450px;
padding: 10px;
background-color: #282c34;
color: #FFFFFF;

6
src/index.js

@ -1,11 +1,13 @@ @@ -1,11 +1,13 @@
import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App';
import Verification from './App';
import Pending from './App';
ReactDOM.render(
<React.StrictMode>
<App />
<Pending />
<Verification />
</React.StrictMode>,
document.getElementById('react_app')
);

2
static/css/main.e5b81ba0.chunk.css

@ -1,2 +0,0 @@ @@ -1,2 +0,0 @@
body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Roboto","Oxygen","Ubuntu","Cantarell","Fira Sans","Droid Sans","Helvetica Neue",sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}code{font-family:source-code-pro,Menlo,Monaco,Consolas,"Courier New",monospace}.card{box-shadow:0 4px 8px 0 rgba(0,0,0,.137);border-radius:3%;transition:.3s;position:relative;width:300px;height:250px;padding:10px;background-color:#282c34;color:#fff}.card:hover{box-shadow:0 8px 16px 0 rgba(0,0,0,.795)}.container{padding:6px 16px}ul{list-style-type:none;margin:4;padding:20px;overflow:hidden;display:table;width:100%;list-style:none}li{float:left;display:table-cell;text-align:center;margin:5px}ul li div{display:block}.App{text-align:center}.App-logo{height:40vmin;pointer-events:none}@media (prefers-reduced-motion:no-preference){.App-logo{-webkit-animation:App-logo-spin 20s linear infinite;animation:App-logo-spin 20s linear infinite}}.App-header{background-color:#282c34;min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:calc(10px + 2vmin);color:#fff}.App-link{color:#61dafb}@-webkit-keyframes App-logo-spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@keyframes App-logo-spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}
/*# sourceMappingURL=main.e5b81ba0.chunk.css.map */

1
static/css/main.e5b81ba0.chunk.css.map

@ -1 +0,0 @@ @@ -1 +0,0 @@
{"version":3,"sources":["webpack://src/index.css","webpack://src/App.css"],"names":[],"mappings":"AAAA,KACI,QAAS,CACT,mJAEY,CACZ,kCAAmC,CACnC,iCACF,CAEA,KACE,yEAEF,CACA,MAEE,uCAA4C,CAC5C,gBAAiB,CACjB,cAAgB,CAChB,iBAAkB,CAClB,WAAY,CACZ,YAAa,CACb,YAAa,CACb,wBAAyB,CACzB,UACF,CAGA,YACE,wCACF,CAGA,WACE,gBACF,CAEA,GACE,oBAAqB,CACrB,QAAS,CACT,YAAa,CACb,eAAgB,CACd,aAAc,CACd,UAAW,CACX,eACJ,CAEA,GACE,UAAW,CACX,kBAAmB,CACnB,iBAAkB,CAClB,UACF,CACA,UACE,aACF,CCtDF,KACE,iBACF,CAEA,UACE,aAAc,CACd,mBACF,CAEA,8CACE,UACE,mDAA4C,CAA5C,2CACF,CACF,CAEA,YACE,wBAAyB,CACzB,gBAAiB,CACjB,YAAa,CACb,qBAAsB,CACtB,kBAAmB,CACnB,sBAAuB,CACvB,4BAA6B,CAC7B,UACF,CAEA,UACE,aACF,CAEA,iCACE,GACE,sBACF,CACA,GACE,uBACF,CACF,CAPA,yBACE,GACE,sBACF,CACA,GACE,uBACF,CACF","file":"main.e5b81ba0.chunk.css","sourcesContent":["body {\n margin: 0;\n font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',\n 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',\n sans-serif;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n }\n \n code {\n font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',\n monospace;\n }\n .card {\n /* Add shadows to create the \"card\" effect */\n box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.137);\n border-radius: 3%;\n transition: 0.3s;\n position: relative;\n width: 300px;\n height: 250px;\n padding: 10px;\n background-color: #282c34;\n color: #FFFFFF;\n }\n \n /* On mouse-over, add a deeper shadow */\n .card:hover {\n box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.795);\n }\n \n /* Add some padding inside the card container */\n .container {\n padding: 6px 16px;\n }\n \n ul {\n list-style-type: none;\n margin: 4;\n padding: 20px;\n overflow: hidden;\n display: table;\n width: 100%;\n list-style: none;\n }\n \n li {\n float: left;\n display: table-cell;\n text-align: center;\n margin: 5px;\n }\n ul li div {\n display: block;\n }",".App {\n text-align: center;\n}\n\n.App-logo {\n height: 40vmin;\n pointer-events: none;\n}\n\n@media (prefers-reduced-motion: no-preference) {\n .App-logo {\n animation: App-logo-spin infinite 20s linear;\n }\n}\n\n.App-header {\n background-color: #282c34;\n min-height: 100vh;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n font-size: calc(10px + 2vmin);\n color: white;\n}\n\n.App-link {\n color: #61dafb;\n}\n\n@keyframes App-logo-spin {\n from {\n transform: rotate(0deg);\n }\n to {\n transform: rotate(360deg);\n }\n}\n"]}

2
static/header.tpl

@ -9,7 +9,7 @@ @@ -9,7 +9,7 @@
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"></script>
<link href="/static/css/main.e5b81ba0.chunk.css" rel="stylesheet">
<link href="/static/css/main.5c7015b9.chunk.css" rel="stylesheet">

3
static/js/2.2def0c6d.chunk.js

File diff suppressed because one or more lines are too long

41
static/js/2.2def0c6d.chunk.js.LICENSE.txt

@ -1,41 +0,0 @@ @@ -1,41 +0,0 @@
/*
object-assign
(c) Sindre Sorhus
@license MIT
*/
/** @license React v0.20.1
* 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 v17.0.1
* 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 v17.0.1
* react-jsx-runtime.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 v17.0.1
* 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.
*/

1
static/js/2.2def0c6d.chunk.js.map

File diff suppressed because one or more lines are too long

2
static/js/main.cf70ea3e.chunk.js

@ -1,2 +0,0 @@ @@ -1,2 +0,0 @@
(this.webpackJsonpthanos=this.webpackJsonpthanos||[]).push([[0],{14:function(e,t,n){},15:function(e,t,n){},16:function(e,t,n){"use strict";n.r(t);var c=n(0),r=n(1),i=n.n(r),s=n(3),a=n.n(s),o=(n(14),n(7)),j=n(4),h=n(5),u=n(8),l=n(6);n(15);function d(e){return Object(c.jsxs)("div",{className:"card",children:[Object(c.jsx)("h4",{children:Object(c.jsx)("b",{children:e.Username})}),Object(c.jsxs)("div",{className:"container",children:[Object(c.jsx)("p",{children:e.Closed}),Object(c.jsx)("p",{children:e.UserID})]})]})}var b=function(e){Object(u.a)(n,e);var t=Object(l.a)(n);function n(){var e;Object(j.a)(this,n);for(var c=arguments.length,r=new Array(c),i=0;i<c;i++)r[i]=arguments[i];return(e=t.call.apply(t,[this].concat(r))).state={verifications:[]},e}return Object(h.a)(n,[{key:"componentDidMount",value:function(){var e=this;fetch("https://thanos.nightmare.haus/api/verifications").then((function(e){return e.json()})).then((function(t){return e.setState({verifications:t})}))}},{key:"render",value:function(){return Object(c.jsx)("div",{className:"App",children:Object(c.jsx)("ul",{children:this.state.verifications.map((function(e,t){return Object(c.jsxs)("li",{children:[" ",Object(c.jsx)(d,Object(o.a)({},e))]},t)}))})})}}]),n}(i.a.Component);a.a.render(Object(c.jsx)(i.a.StrictMode,{children:Object(c.jsx)(b,{})}),document.getElementById("react_app"))}},[[16,1,2]]]);
//# sourceMappingURL=main.cf70ea3e.chunk.js.map

1
static/js/main.cf70ea3e.chunk.js.map

@ -1 +0,0 @@ @@ -1 +0,0 @@
{"version":3,"sources":["App.js","index.js"],"names":["Card","data","className","Username","Closed","UserID","Verification","state","verifications","fetch","then","response","json","setState","this","map","i","React","Component","ReactDOM","render","StrictMode","document","getElementById"],"mappings":"8OAGA,SAASA,EAAKC,GACV,OACE,sBAAKC,UAAU,OAAf,UACA,6BAAI,4BAAID,EAAKE,aACX,sBAAKD,UAAU,YAAf,UACE,4BAAID,EAAKG,SACT,4BAAIH,EAAKI,e,IA8BJC,E,4MAvBXC,MAAQ,CACJC,cAAe,I,kEAEE,IAAD,OAEhBC,MADe,mDAEVC,MAAK,SAACC,GAAD,OAAcA,EAASC,UAC5BF,MAAK,SAACT,GAAD,OAAU,EAAKY,SAAS,CAACL,cAAeP,S,+BAGlD,OACG,qBAAKC,UAAU,MAAf,SACI,6BACKY,KAAKP,MAAMC,cAAcO,KAAI,SAACd,EAAMe,GAAP,OAC1B,mCAAa,cAAChB,EAAD,eAAUC,MAAde,c,GAfLC,IAAMC,WCVjCC,IAASC,OACP,cAAC,IAAMC,WAAP,UACE,cAAC,EAAD,MAEFC,SAASC,eAAe,gB","file":"static/js/main.cf70ea3e.chunk.js","sourcesContent":["import React from 'react';\nimport './App.css';\n\nfunction Card(data) {\n return (\n <div className=\"card\">\n <h4><b>{data.Username}</b></h4>\n <div className=\"container\">\n <p>{data.Closed}</p>\n <p>{data.UserID}</p>\n </div>\n </div>\n )\n }\n\nclass Verification extends React.Component {\n state = {\n verifications: []\n }\n componentDidMount() {\n const apiUrl = 'https://thanos.nightmare.haus/api/verifications';\n fetch(apiUrl)\n .then((response) => response.json())\n .then((data) => this.setState({verifications: data}));\n }\n render() {\n return (\n <div className=\"App\">\n <ul>\n {this.state.verifications.map((data, i) => (\n <li key={i}> <Card {...data} /></li>\n ))}\n </ul>\n </div>\n );\n }\n}\n\n\nexport default Verification;","import React from 'react';\nimport ReactDOM from 'react-dom';\nimport './index.css';\nimport App from './App';\n\nReactDOM.render(\n <React.StrictMode>\n <App />\n </React.StrictMode>,\n document.getElementById('react_app')\n);\n"],"sourceRoot":""}

4
static/loggedIn.tpl

@ -6,6 +6,6 @@ @@ -6,6 +6,6 @@
<div class="container h-100 d-flex justify-content-center align-items-center">
<div id="react_app"></div>
<script>!function (e) { function t(t) { for (var n, l, a = t[0], f = t[1], i = t[2], c = 0, s = []; c < a.length; c++)l = a[c], Object.prototype.hasOwnProperty.call(o, l) && o[l] && s.push(o[l][0]), o[l] = 0; for (n in f) Object.prototype.hasOwnProperty.call(f, n) && (e[n] = f[n]); for (p && p(t); s.length;)s.shift()(); return u.push.apply(u, i || []), r() } function r() { for (var e, t = 0; t < u.length; t++) { for (var r = u[t], n = !0, a = 1; a < r.length; a++) { var f = r[a]; 0 !== o[f] && (n = !1) } n && (u.splice(t--, 1), e = l(l.s = r[0])) } return e } var n = {}, o = { 1: 0 }, u = []; function l(t) { if (n[t]) return n[t].exports; var r = n[t] = { i: t, l: !1, exports: {} }; return e[t].call(r.exports, r, r.exports, l), r.l = !0, r.exports } l.m = e, l.c = n, l.d = function (e, t, r) { l.o(e, t) || Object.defineProperty(e, t, { enumerable: !0, get: r }) }, l.r = function (e) { "undefined" != typeof Symbol && Symbol.toStringTag && Object.defineProperty(e, Symbol.toStringTag, { value: "Module" }), Object.defineProperty(e, "__esModule", { value: !0 }) }, l.t = function (e, t) { if (1 & t && (e = l(e)), 8 & t) return e; if (4 & t && "object" == typeof e && e && e.__esModule) return e; var r = Object.create(null); if (l.r(r), Object.defineProperty(r, "default", { enumerable: !0, value: e }), 2 & t && "string" != typeof e) for (var n in e) l.d(r, n, function (t) { return e[t] }.bind(null, n)); return r }, l.n = function (e) { var t = e && e.__esModule ? function () { return e.default } : function () { return e }; return l.d(t, "a", t), t }, l.o = function (e, t) { return Object.prototype.hasOwnProperty.call(e, t) }, l.p = "/"; var a = this.webpackJsonpthanos = this.webpackJsonpthanos || [], f = a.push.bind(a); a.push = t, a = a.slice(); for (var i = 0; i < a.length; i++)t(a[i]); var p = f; r() }([])</script>
<script src="/static/js/2.2def0c6d.chunk.js"></script>
<script src="/static/js/main.cf70ea3e.chunk.js"></script>
<script src="/static/js/2.f311d910.chunk.js"></script>
<script src="/static/js/main.c3893d05.chunk.js"></script>
</div>

Loading…
Cancel
Save