Skip to content

Commit

Permalink
Merge pull request #69 from PuraJuniper/create-new-home-page-SAGE-301
Browse files Browse the repository at this point in the history 
Fixed new home page SAGE-301
  • Loading branch information
@jananikathirkamar
jananikathirkamar authored Apr 5, 2022
2 parents 3d7143d + 0a2cc1f commit 4df0497
Show file tree
Hide file tree
Showing 5 changed files with 49 additions and 165 deletions.
19 changes: 14 additions & 5 deletions public/app.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -466,18 +466,18 @@ a {
/* BUTTONS */

.navigate {
background: linear-gradient(to left, white 50%, #2a6b92 50%) right;
background: linear-gradient(to left, white 50%, #2D2E74 50%) right;
}

.navigate-reverse {
background: linear-gradient(to right, white 50%, #2a6b92 50%) left;
background: linear-gradient(to right, white 50%, #2D2E74 50%) left;
}

.navigate, .navigate-reverse {
background-size: 200%;
transition: .3s ease-out;
border: 2px solid #2a6b92;
color: #2a6b92;
border: 2px solid #2D2E74;
color: #2D2E74;
text-align: center;
text-decoration: none;
display: inline-block;
Expand Down Expand Up @@ -896,4 +896,13 @@ a {
border-bottom-style: solid;
border-top-color: black;
border-top-style: solid;
}
}
.raise-card-animation:hover,
.raise-card-animation:focus{
box-shadow: 0 0.5em 0.5em -0.4em var(--hover);
transform: translateY(-0.25em);
transition: 0.25s;
color: white;

}

25 changes: 16 additions & 9 deletions src/simplified/baseCard.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,8 @@ interface BaseCardProps {
hideHeader:boolean,
cardImage?:any,
IconColor?:string,

IconSize?:string,
titleSize?:string
}

export const BaseCard = (props: BaseCardProps) => {
Expand All @@ -40,24 +41,24 @@ export const BaseCard = (props: BaseCardProps) => {
}, [props.wait]);



const content = props.content;
let headerPadding = {};
if (props.title == "") headerPadding = {padding:"7px"};
const resourceType = friendlyToFhir(props.header);
const resourceType = (props.header == "Questionnaire")? "Questionnaire":friendlyToFhir(props.header);

return (
<CSSTransition
in={show}
timeout={9999}
classNames="res-card"
>
<Card
className='raise-card-animation'
bg={props.bsBg}
text={props.bsText as Color}
border={props.bsBorder}
onClick={(e: React.MouseEvent<HTMLDivElement, MouseEvent>) => {
if (e.target instanceof Element && e.target.tagName !== "svg" && e.target.tagName !== "path" && props.clickable) {
if (e.target instanceof Element && e.target.tagName !== "svg" && e.target.tagName !== "path" && props.clickable && resourceType!='') {
setShow(false);
if (State.get().bundle?.resources.length) {
State.get().bundle.set("pos", State.get().bundle.resources.length-1);
Expand Down Expand Up @@ -98,12 +99,18 @@ export const BaseCard = (props: BaseCardProps) => {
State.emit("set_bundle_pos", State.get().bundle.resources.length-1);
navigate(`/edit/${State.get().bundle.resources.length-1}`);
}
if(props.title == 'Create Cards'){
navigate('/create')
}
if(props.title == 'View Cards'){
navigate('/')
}
}}
>
<Card.Header style={headerPadding} hidden = {props.hideHeader}>
{props.header}
</Card.Header>
<Card.Body style={{'padding': '0px 0.5rem' }}>
<Card.Body >
<Row style={{'justifyContent': 'flex-end', 'margin':'0'}}>
<span style={{ fontSize: "20px", textAlign: "right" }}>
<a href='' target="_blank" rel="noreferrer" className="c-tooltip">
Expand All @@ -112,13 +119,13 @@ export const BaseCard = (props: BaseCardProps) => {
</a>
</span>
</Row>
<Card.Title style={{ fontSize: "15px", textAlign: "center" }}>{props.title}</Card.Title>
<Card.Title style={{ fontSize: props.titleSize, textAlign: "center" }}>{props.title}</Card.Title>
<Card.Text>{content}</Card.Text>
<Row style={{'justifyContent': 'center', 'marginBottom':'30px'}}>
<FontAwesomeIcon icon={props.cardImage} style={{'color':props.IconColor, 'height':'50px'}} />
<FontAwesomeIcon icon={props.cardImage} style={{'color':props.IconColor, 'height':props.IconSize}} />
</Row>
</Card.Body>
</Card>
</CSSTransition>
);
}
}
22 changes: 12 additions & 10 deletions src/simplified/home.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,6 @@ import State from "../state";
import { Container, Row, Col, Card } from "react-bootstrap";
import friendlyNames from "../../friendly-names.json";
import { ACTIVITY_DEFINITION, allFormElems, friendlyResourceRoot, getBorderPropsForType, getFormElementListForResource } from "./nameHelpers";
import { HomeCard } from "./homeCard";

console.log(friendlyResourceRoot.RESOURCES)

Expand All @@ -35,37 +34,40 @@ const listOfHomePage = [
'title':'View Cards',
'cardImage':faGrid,
'cardColor':'sage-green',
'textColor':'black',
'textColor':'white',
'FHIR': '',
}
]

console.log(friendlyResourceRoot.RESOURCES[4].SELF.FHIR)
const BasicHomeView = () => {
return (
<div>
<div className="row">
<h3 className="col-lg-10 col-md-9"><b>Home Page</b></h3>
</div>

<Container fluid="lg">
<Row lg="4" md="3" sm="2" noGutters>
{
listOfHomePage.map(
(resource, i) => {
return (
<div style={{ padding: "10px" }} key={resource.FHIR}>
<div style={{ flex: '0 0 35%' , maxWidth: '35%' , padding: "10px" }} key={resource.FHIR}>
<h4 style={{'fontSize':'10px'}}>{resource.header}</h4>
<Col style={{ padding: "0px" }}>
<HomeCard
<BaseCard
bsBg={resource.cardColor}
bsText={resource.textColor}
cardImage={resource.cardImage}
cardImage= {resource.cardImage}
IconColor = 'white'
IconSize= '60px'
header={resource.FHIR}
title={resource.title}
FHIR = {resource.FHIR}
profile = {resource.profile}
titleSize='20px'
hideHeader = {true}
wait={i * 25}
clickable={true}
/>
profile={resource.profile}
/>
</Col>
</div>);
}
Expand Down
133 changes: 0 additions & 133 deletions src/simplified/homeCard.tsx
View file

This file was deleted.

15 changes: 7 additions & 8 deletions src/simplified/selectView.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@ const SelectView = () => {
<div className="row">
<h3 className="col-lg-10 col-md-9"><b>What Is The Card Type?</b></h3>
</div>
<Container fluid="lg" style={{ padding: "0", margin:"0" }}>
<Container fluid="lg">
<Row lg="4" md="3" sm="2" noGutters style={{'justifyContent': 'center'}}>
{
friendlyResourceRoot.RESOURCES
Expand All @@ -34,7 +34,6 @@ const SelectView = () => {
<Col>
<BaseCard
bsBg="sage-beige"
bsBorder={getBorderPropsForType(resourceType.SELF.FHIR)}
cardImage= {faUserDoctor}
IconColor = 'black'
header={resourceType.SELF.FRIENDLY}
Expand All @@ -43,6 +42,8 @@ const SelectView = () => {
wait={i * 25}
clickable={true}
profile={resource.DEFAULT_PROFILE_URI}
titleSize='15px'
IconSize= '50px'
/>
</Col>
</div>);
Expand All @@ -53,13 +54,11 @@ const SelectView = () => {
)
}
</Row>

<button key="butDel" type='button' className="navigate col-lg-2 col-md-3"
onClick={() => navigate('/basic-home')}
>
Back
</button>
</Container>
<button key="butDel" type='button' className="navigate col-lg-2 col-md-3"
onClick={() => navigate('/basic-home')}>
Back
</button>
</div>
);
}
Expand Down

0 comments on commit 4df0497

Please sign in to comment.