Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
10 changes: 3 additions & 7 deletions src/App.js
Original file line number Diff line number Diff line change
Expand Up @@ -19,14 +19,11 @@ const App = () => {
<h5 className="my-0 mr-md-auto font-weight-normal">
<Link className="p-2 text-dark" to="/">Rate My Therapist</Link>
</h5>
<nav className="my-2 my-md-0 mr-md-3">
<nav className="my-2 my-md-0 mr-md-3 text-right">
<Link className="p-2 text-dark" to="/types">Find Your Therapy</Link>
<Link className="p-2 text-dark" to="/whytherapy">Why Therapy</Link>
<Link className="p-2 text-dark" to="/therapists">Find a Therapist</Link>
</nav>
<form className="d-flex mr-2">
<input className="form-control" type="search" placeholder="🔍 Search" aria-label="🔍 Search" />
</form>
</div>

<div className="container">
Expand All @@ -38,12 +35,11 @@ const App = () => {
<Types />
</Route>
<Route path="/whytherapy">
<WhyTherapy />
</Route>
<WhyTherapy />
</Route>
<Route path="/">
<Home />
</Route>

</Switch>
</div>
</Router>
Expand Down
5 changes: 3 additions & 2 deletions src/Home.js
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
import React from 'react';
import { Link } from 'react-router-dom';
import WhyTherapy from './WhyTherapy';

const Home = () => {
return (
Expand All @@ -11,13 +12,13 @@ const Home = () => {

<div className="row row-cols-1 row-cols-md-3 mb-3 text-center">
<Card title={'Therapy Types'} button={{ text: 'Find your type', destination: '/types' }}>
<p>There are many types of therapy, and different types work better for different people or problems.</p>
<p>Find the therapy best for your needs.</p>
</Card>
<Card title={'Why Therapy'} button={{ text: 'See why', destination: '/whytherapy' }}>
<p>The benefits and the reasons to go.</p>
</Card>
<Card title={'Find a Therapist'} button={{ text: 'Find a therapist', destination: '/therapists' }}>
<p>View therapists and their ratings, and leave a review of your own to help others.</p>
<p>Find and review different therapists.</p>
</Card>
</div>
</>
Expand Down
5 changes: 5 additions & 0 deletions src/therapist/Therapists.css
Original file line number Diff line number Diff line change
@@ -1,12 +1,17 @@
body {
background-color: lemonchiffon;
}
.flex-card {
margin: 0.5rem;
flex: 1 0 1;
position: relative;
transition: 0.2s ease all;
top: 5px;
box-shadow: 0 4px 8px 0 rgb(69, 161, 253);
}

.flex-card:hover {
box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2);
top: 0;
}

Expand Down
244 changes: 235 additions & 9 deletions src/type/Types.js
Original file line number Diff line number Diff line change
@@ -1,24 +1,250 @@
import React from 'react';
import ReactDOM from 'react-dom';
import './types.css';

const Types = () => {
return (
<>
<body>
<div className="px-3 py-3 pt-md-5 pb-md-4 mx-auto text-center">
<h1 className="display-4">Types of therapy</h1>
<p className="lead">Something here</p>
<p className="lead">There's a world of therapy! Explore!</p>
</div>
<div>
<div class="card">
<h2>
<ul className="list-unstyled mt-3 mb-4">
<li>Cognitive Behavioural therapy</li>
<li>Guided Self Help therapy</li>
<li>Counselling therapy</li>
<li>Behavioural Activation therapy</li>
<li>Interpersonal therapy</li>
<li>Eye movement desensitisation and reprocessing therapy</li>
<ul className="list-unstyled mt-3 mb-4 text-left">
<li>A</li>
<ul>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
</ul>

<li>B</li>
<ul>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
</ul>

<li>C</li>
<ul>
<li><a href=""></a></li>
<li><a href=""></a></li>
<li><a href=""></a></li>
<li><a href=""></a></li>
<li><a href=""></a></li>
</ul>

<li>D</li>
<ul>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
</ul>

<li>E</li>
<ul>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
</ul>
<li>F</li>
<ul>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
</ul>

<li>G</li>
<ul>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
</ul>

<li>H</li>
<ul>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
</ul>
<li>I</li>
<ul>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
</ul>
<li>J</li>
<ul>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
</ul>

<li>K</li>
<ul>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
</ul>

<li>L</li>
<ul>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
</ul>

<li>M</li>
<ul>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
</ul>

<li>N</li>
<ul>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
</ul>

<li>O</li>
<ul>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
</ul>

<li>P</li>
<ul>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
</ul>

<li>Q</li>
<ul>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
</ul>

<li>R</li>
<ul>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
</ul>

<li>S</li>
<ul>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
</ul>

<li>T</li>
<ul>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
</ul>

<li>U</li>
<ul>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
</ul>

<li>V</li>
<ul>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
</ul>

<li>W</li>
<ul>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
</ul>
<li>X</li>
<ul>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
</ul>
<li>Y</li>
<ul>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
</ul>
<li>Z</li>
<ul>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
<li><a href="" target="_blank"></a></li>
</ul>

</ul>
</h2>
</div>
</body>
</>
)
}
Expand Down
13 changes: 13 additions & 0 deletions src/type/home.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,13 @@
body {
background-color: lemonchiffon;
}
.card {
box-shadow: 0 4px 8px 0 rgb(69, 161, 253);
transition: 0.3s;
}
.card:hover {
box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2);
}
.container {
padding: 2px 16px;
}
35 changes: 35 additions & 0 deletions src/type/types.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,35 @@
body {
background-color: lemonchiffon;
}
h1 {
font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
font-size: 300%;
font-weight: bold;
}
p {
font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
font-size: 100%;
font-weight: lighter;
}
.card {
box-shadow: 0 4px 8px 0 rgb(92, 169, 247);
transition: 0.3s;
}
.card:hover {
box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2);
}
.container {
padding: 2px 16px;
}
h2 {
width: 900px;
padding-left: 40px;
padding-right: 40px;

font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
font-size: 175%;
}
ul {
font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
font-size: 100%;
}