From 935ef7d2f76cca7bc1f9840dc357de85f93a1ec2 Mon Sep 17 00:00:00 2001 From: Galen Guyer Date: Mon, 11 Jul 2022 17:10:23 -0400 Subject: Update for new dashboard frontend --- src/components/Card.css | 41 +++++++++++++++++++++++++++++++++++++++++ src/components/Card.jsx | 18 ++++++++++++++++++ 2 files changed, 59 insertions(+) create mode 100644 src/components/Card.css create mode 100644 src/components/Card.jsx (limited to 'src/components') diff --git a/src/components/Card.css b/src/components/Card.css new file mode 100644 index 0000000..fddfe22 --- /dev/null +++ b/src/components/Card.css @@ -0,0 +1,41 @@ +.cardLink { + text-decoration: none; + color: black; + margin: 12px 24px; + flex-basis: 100%; + max-width: 200px; +} + +.Card { + text-decoration: none; + color: #000; + border: 2px solid #fbd38d; + border-radius: 12px; + padding: 0px 40px; +} + +@media screen and (max-width: 600px) { + .Card { + padding: 0px 16px; + margin: 10px 0px; + } +} + +.Latest { + font-size: 1.8em; +} + +.Card:hover { + background-color: #ffc869; + color: #fff; +} +.Card:hover .Diff { + color: #fff; +} + +.animate { + -moz-transition: color, background-color 0.3s; + -webkit-transition: color, background-color 0.3s; + -ms-transition: color, background-color 0.3s; + transition: color, background-color 0.3s; +} diff --git a/src/components/Card.jsx b/src/components/Card.jsx new file mode 100644 index 0000000..0535033 --- /dev/null +++ b/src/components/Card.jsx @@ -0,0 +1,18 @@ +import React from "react"; +import { Link } from "react-router-dom"; +import "./Card.css"; + +const Card = (props) => { + return ( + +
+

+ {props.latest}{props.suffix ?? ""} +

+

{props.name}

+
+ + ); +}; + +export default Card; -- cgit v1.2.3