Add css
This commit is contained in:
3469
package-lock.json
generated
3469
package-lock.json
generated
File diff suppressed because it is too large
Load Diff
55
src/app.css
Normal file
55
src/app.css
Normal file
@ -0,0 +1,55 @@
|
|||||||
|
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 {
|
||||||
|
/* 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: #a05236a6;
|
||||||
|
color: #FFFFFF;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* On mouse-over, add a deeper shadow */
|
||||||
|
.card:hover {
|
||||||
|
box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.795);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Add some padding inside the card container */
|
||||||
|
.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;
|
||||||
|
}
|
||||||
@ -1,3 +1,5 @@
|
|||||||
|
import './app.css';
|
||||||
|
|
||||||
function Card(data) {
|
function Card(data) {
|
||||||
return (
|
return (
|
||||||
<div class="card">
|
<div class="card">
|
||||||
|
|||||||
@ -6,6 +6,8 @@ function _possibleConstructorReturn(self, call) { if (!self) { throw new Referen
|
|||||||
|
|
||||||
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
|
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
|
||||||
|
|
||||||
|
import './app.css';
|
||||||
|
|
||||||
function Card(data) {
|
function Card(data) {
|
||||||
return React.createElement(
|
return React.createElement(
|
||||||
"div",
|
"div",
|
||||||
|
|||||||
Reference in New Issue
Block a user