added quick items and more minor stuff
This commit is contained in:
parent
f37e5d1fd0
commit
0fd8cc7409
@ -5,11 +5,13 @@
|
|||||||
"main": "src/index.ts",
|
"main": "src/index.ts",
|
||||||
"scripts": {
|
"scripts": {
|
||||||
"devServer": "webpack-dev-server --mode development --inline --hot --open",
|
"devServer": "webpack-dev-server --mode development --inline --hot --open",
|
||||||
"build": "webpack --mode development"
|
"build": "webpack --mode development",
|
||||||
|
"buildProd": "webpack --mode production"
|
||||||
},
|
},
|
||||||
"author": "",
|
"author": "",
|
||||||
"license": "ISC",
|
"license": "ISC",
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
|
"@types/prop-types": "^15.7.3",
|
||||||
"@types/react": "^16.9.34",
|
"@types/react": "^16.9.34",
|
||||||
"@types/react-dom": "^16.9.6",
|
"@types/react-dom": "^16.9.6",
|
||||||
"@typescript-eslint/eslint-plugin": "^2.28.0",
|
"@typescript-eslint/eslint-plugin": "^2.28.0",
|
||||||
@ -28,6 +30,7 @@
|
|||||||
"webpack-dev-server": "^3.10.3"
|
"webpack-dev-server": "^3.10.3"
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
|
"prop-types": "^15.7.2",
|
||||||
"react": "^16.13.1",
|
"react": "^16.13.1",
|
||||||
"react-dom": "^16.13.1"
|
"react-dom": "^16.13.1"
|
||||||
}
|
}
|
||||||
|
24
src/components/Quick.tsx
Normal file
24
src/components/Quick.tsx
Normal file
@ -0,0 +1,24 @@
|
|||||||
|
import * as React from "react";
|
||||||
|
import * as PropTypes from "prop-types";
|
||||||
|
|
||||||
|
import "../style/quick.scss";
|
||||||
|
|
||||||
|
class Quick extends React.Component {
|
||||||
|
static propTypes = {
|
||||||
|
children : PropTypes.element
|
||||||
|
};
|
||||||
|
|
||||||
|
constructor(props){
|
||||||
|
super(props);
|
||||||
|
}
|
||||||
|
|
||||||
|
render(): JSX.Element {
|
||||||
|
return <div className="quick-component">
|
||||||
|
{this.props.children}
|
||||||
|
</div>;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
export default Quick;
|
22
src/components/QuickItem.tsx
Normal file
22
src/components/QuickItem.tsx
Normal file
@ -0,0 +1,22 @@
|
|||||||
|
import * as React from "react";
|
||||||
|
import * as PropTypes from "prop-types";
|
||||||
|
|
||||||
|
import "../style/quickItem.scss";
|
||||||
|
|
||||||
|
class QuickItem extends React.Component {
|
||||||
|
static propTypes = {
|
||||||
|
url: PropTypes.string.isRequired
|
||||||
|
};
|
||||||
|
|
||||||
|
constructor(props){
|
||||||
|
super(props);
|
||||||
|
}
|
||||||
|
|
||||||
|
render(): JSX.Element {
|
||||||
|
return <div className="quickItem-component">
|
||||||
|
</div>;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
export default QuickItem;
|
@ -1,12 +1,19 @@
|
|||||||
import * as React from "react";
|
import * as React from "react";
|
||||||
|
|
||||||
|
import Quick from "./Quick";
|
||||||
|
import QuickItem from "./QuickItem";
|
||||||
|
|
||||||
class App extends React.Component {
|
class App extends React.Component {
|
||||||
constructor(props) {
|
constructor(props) {
|
||||||
super(props);
|
super(props);
|
||||||
}
|
}
|
||||||
|
|
||||||
render(): JSX.Element {
|
render(): JSX.Element {
|
||||||
return <h1>Hello world</h1>;
|
return <div>
|
||||||
|
<Quick>
|
||||||
|
<QuickItem/>
|
||||||
|
</Quick>
|
||||||
|
</div>;
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
@ -1,7 +1,7 @@
|
|||||||
import * as React from "react";
|
import * as React from "react";
|
||||||
import * as ReactDOM from "react-dom";
|
import * as ReactDOM from "react-dom";
|
||||||
|
|
||||||
import App from "./components/app";
|
import App from "./components/App";
|
||||||
|
|
||||||
import "./style/default.scss";
|
import "./style/default.scss";
|
||||||
|
|
||||||
|
3
src/style/quick.scss
Normal file
3
src/style/quick.scss
Normal file
@ -0,0 +1,3 @@
|
|||||||
|
.quick-component {
|
||||||
|
background-color: green;
|
||||||
|
}
|
0
src/style/quickItem.scss
Normal file
0
src/style/quickItem.scss
Normal file
Loading…
Reference in New Issue
Block a user