diff options
author | crupest <crupest@outlook.com> | 2023-07-20 20:44:15 +0800 |
---|---|---|
committer | crupest <crupest@outlook.com> | 2023-07-20 20:44:15 +0800 |
commit | 0e183074b326cf04a23ae1f1ba8dcc56166df485 (patch) | |
tree | 87963dbe54b018ee0573cd77e674d32c23d8ba7f /FrontEnd/src/views/common | |
parent | adc91a81fe53fdbc3d63065baa0b56862c104824 (diff) | |
download | timeline-0e183074b326cf04a23ae1f1ba8dcc56166df485.tar.gz timeline-0e183074b326cf04a23ae1f1ba8dcc56166df485.tar.bz2 timeline-0e183074b326cf04a23ae1f1ba8dcc56166df485.zip |
...
Diffstat (limited to 'FrontEnd/src/views/common')
-rw-r--r-- | FrontEnd/src/views/common/Card.css | 7 | ||||
-rw-r--r-- | FrontEnd/src/views/common/Card.tsx | 26 | ||||
-rw-r--r-- | FrontEnd/src/views/common/index.css | 5 | ||||
-rw-r--r-- | FrontEnd/src/views/common/theme.css | 2 |
4 files changed, 17 insertions, 23 deletions
diff --git a/FrontEnd/src/views/common/Card.css b/FrontEnd/src/views/common/Card.css index fa470130..98cb4cdd 100644 --- a/FrontEnd/src/views/common/Card.css +++ b/FrontEnd/src/views/common/Card.css @@ -1,10 +1,9 @@ .cru-card {
- border: 1px solid;
- border-color: #e9ecef;
border-radius: var(--cru-card-border-radius);
+ background-color: var(--cru-primary-container-color);
transition: all 0.3s;
}
.cru-card:hover {
- border-color: var(--cru-primary-color);
-}
\ No newline at end of file + border-color: var(--cru-primary-1-color);
+}
diff --git a/FrontEnd/src/views/common/Card.tsx b/FrontEnd/src/views/common/Card.tsx index ebbce77e..50632006 100644 --- a/FrontEnd/src/views/common/Card.tsx +++ b/FrontEnd/src/views/common/Card.tsx @@ -1,19 +1,21 @@ +import { ComponentPropsWithoutRef, Ref } from "react"; import classNames from "classnames"; -import * as React from "react"; import "./Card.css"; -function _Card( - { - className, - children, - ...otherProps - }: React.PropsWithChildren<React.HTMLAttributes<HTMLDivElement>>, - ref: React.ForwardedRef<HTMLDivElement> -): React.ReactElement | null { +interface CardProps extends ComponentPropsWithoutRef<"div"> { + containerRef: Ref<HTMLDivElement>; +} + +export default function Card({ + className, + children, + containerRef, + ...otherProps +}: CardProps) { return ( <div - ref={ref} + ref={containerRef} className={classNames("cru-card", className)} {...otherProps} > @@ -21,7 +23,3 @@ function _Card( </div> ); } - -const Card = React.forwardRef(_Card); - -export default Card; diff --git a/FrontEnd/src/views/common/index.css b/FrontEnd/src/views/common/index.css index 789a0f05..eb82c4bf 100644 --- a/FrontEnd/src/views/common/index.css +++ b/FrontEnd/src/views/common/index.css @@ -10,10 +10,7 @@ body { font-family: var(--cru-default-font-family);
background: var(--cru-surface-color);
color: var(--cru-surface-on-color);
-}
-
-button {
- background-color: unset;
+ line-height: 1.2;
}
.cru-text-center {
diff --git a/FrontEnd/src/views/common/theme.css b/FrontEnd/src/views/common/theme.css index 9c9e1645..3ad45996 100644 --- a/FrontEnd/src/views/common/theme.css +++ b/FrontEnd/src/views/common/theme.css @@ -2,5 +2,5 @@ :root { --cru-default-font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif; - --cru-card-border-radius: 8px; + --cru-card-border-radius: 4px; }
\ No newline at end of file |