Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Ports- Amy M. & Steph #22

Open
wants to merge 71 commits into
base: master
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
71 commits
Select commit Hold shift + click to select a range
818d0ec
added state to app and skeleton for functions
smarchante1 Jun 24, 2019
a7ef58f
added skeleton for all components in mock design
smarchante1 Jun 24, 2019
8acd766
added movie card functional component
smarchante1 Jun 24, 2019
e6bb48e
added react routes to render all components
smarchante1 Jun 24, 2019
4f21b84
created API request to fetch all movie json data
amyesh Jun 25, 2019
4a08ad1
added API call to fetch all customers
amyesh Jun 25, 2019
6733455
added API requests to find movie by title and search movies by word
amyesh Jun 25, 2019
f37d076
added onFormSubmit function
smarchante1 Jun 25, 2019
89af3cf
fixed typo
amyesh Jun 25, 2019
200418c
Merge branch 'master' of https://github.com/smarchante1/video-store-c…
amyesh Jun 25, 2019
4cf02b0
functional search bar
smarchante1 Jun 25, 2019
a85701e
passed props into customerList
amyesh Jun 25, 2019
cd4be74
Merge branch 'master' into customers
amyesh Jun 25, 2019
58c18cf
merged updates from master
amyesh Jun 25, 2019
73eae79
finalized search functionality and MovieCard component
smarchante1 Jun 25, 2019
486ad0a
added movieCard display
amyesh Jun 25, 2019
cb5c2a1
merged conflicts
amyesh Jun 25, 2019
1251852
Click handler for select movie and appropriate state changes
smarchante1 Jun 25, 2019
0c15ec8
click handler for select customer and appropriate state changes which…
smarchante1 Jun 25, 2019
0259d61
working through adding to library
amyesh Jun 25, 2019
4152f47
working through adding movie to rails server
amyesh Jun 25, 2019
29d8a12
made changes to add movie function bug with displaying MovieCard
smarchante1 Jun 26, 2019
d2147c5
added method to checkout movie
amyesh Jun 26, 2019
f11a48d
fixed post request to successfully add data to rails server
amyesh Jun 26, 2019
a4cb56d
changed Library to classical component to render state
amyesh Jun 26, 2019
84ed048
rendering selected movie object
smarchante1 Jun 26, 2019
0c0fcc9
changed function to select customer object
smarchante1 Jun 26, 2019
e3ff093
added user messages to app state
smarchante1 Jun 26, 2019
ab1dc29
added proptypes and messages section
smarchante1 Jun 26, 2019
f8132ee
removed i from search results map
smarchante1 Jun 26, 2019
7ba60ab
added checkout method to app
amyesh Jun 26, 2019
94cfa00
Merge branch 'master' of https://github.com/smarchante1/video-store-c…
amyesh Jun 26, 2019
3145ed8
Merge branch 'userMessages'
smarchante1 Jun 26, 2019
667bd36
cleaned up app file
amyesh Jun 26, 2019
f9c28ce
added disabled button for movie checkout
smarchante1 Jun 26, 2019
f07b4ee
working through conditional button rendering
amyesh Jun 26, 2019
8b77368
tried to render buttons to no avail
amyesh Jun 26, 2019
8172394
reset files
amyesh Jun 26, 2019
288bf3e
completed conditional button rendering based on movie library
amyesh Jun 27, 2019
6d50a07
fixed typo
smarchante1 Jun 27, 2019
e570b15
added conditional rendering to selected movies and setState to addMov…
amyesh Jun 27, 2019
24c0926
added form clearing functionality to search
amyesh Jun 27, 2019
e5372e2
debugging search function
amyesh Jun 27, 2019
27f3c40
internal server error present
amyesh Jun 27, 2019
f1fea20
Merge branch 'master' of https://github.com/smarchante1/video-store-c…
amyesh Jun 27, 2019
ab3719a
added bootstrap
amyesh Jun 27, 2019
22b75f4
added bootstrap
smarchante1 Jun 27, 2019
a72cfc2
basic movie card styling
smarchante1 Jun 27, 2019
8f6d287
added navbar styling
amyesh Jun 27, 2019
d42ab9c
Merge branch 'master' of https://github.com/smarchante1/video-store-c…
amyesh Jun 27, 2019
87415f0
movie library grid under constructtion
smarchante1 Jun 27, 2019
9326f95
Merge branch 'master' of https://github.com/smarchante1/video-store-c…
amyesh Jun 27, 2019
a32e4ae
changed button styling
amyesh Jun 27, 2019
b6bca35
movie card title changes and rearranging description
smarchante1 Jun 27, 2019
9a4bd0f
Merge branch 'master' of https://github.com/smarchante1/video-store-c…
amyesh Jun 27, 2019
c6fde59
basic styling for cards in card columns
smarchante1 Jun 27, 2019
a08c0d6
added styling to nav bar and homepage
amyesh Jun 28, 2019
99196b9
movie cards flip style working
smarchante1 Jun 28, 2019
6a18710
added table styling to customer list
amyesh Jun 28, 2019
3d68f93
added cursor and blue shadow to movie cards
smarchante1 Jun 28, 2019
a9fa35e
added styling to selected items
amyesh Jun 28, 2019
a72148c
changed the height of movie cards so text won't overflow
smarchante1 Jun 28, 2019
0b3cee5
overrode bootstrap styles with styling in app css
smarchante1 Jun 28, 2019
5343ff6
fixing merge conflicts
smarchante1 Jun 28, 2019
edde30a
minor changes to styling
amyesh Jun 28, 2019
81dacf1
changed color of movie overview text
smarchante1 Jun 28, 2019
5ccbedc
fixed search bar style
smarchante1 Jun 28, 2019
a2fac6b
updated card container and selected margin styling
amyesh Jun 28, 2019
74a9fa3
merged conflicts
amyesh Jun 28, 2019
3c60e9d
fixed search styling
amyesh Jun 28, 2019
703527c
cleaned up comments
amyesh Jun 28, 2019
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
Prev Previous commit
Next Next commit
added styling to nav bar and homepage
  • Loading branch information
amyesh committed Jun 28, 2019
commit a08c0d6370ae9f875f34ad2ea771c9f9bc1c733c
4 changes: 4 additions & 0 deletions public/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,10 @@
-->
<link rel="manifest" href="%PUBLIC_URL%/manifest.json">
<link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">
<style> @font-face { font-family: Library3am; src: url('Library3am.otf'); } </style>
<link href="https://fonts.googleapis.com/css?family=Montserrat:300,300i&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Limelight&display=swap" rel="stylesheet">

<!--
Notice the use of %PUBLIC_URL% in the tags above.
It will be replaced with the URL of the `public` folder during the build.
Expand Down
103 changes: 86 additions & 17 deletions src/App.css
Original file line number Diff line number Diff line change
@@ -1,22 +1,10 @@
.App {
padding: 5px;
background-color: rgb(236, 252, 252);
}

* {
box-sizing: border-box;
}

body {
/* font-family: 'Courier', sans-serif; */
}

.App-header {
background-color: #222;
height: 150px;
padding: 20px;
color: white;
}

.App-title {
font-size: 1.5em;
}
Expand All @@ -34,10 +22,6 @@ body {
list-style-type: none;
}

/* .nav-list li {
display: inline;
} */

.nav-spacer {
flex-grow: 1;
}
Expand All @@ -47,4 +31,89 @@ body {
flex-wrap: wrap;
justify-content: center;
align-items: center;
}

body {
font-family: 'Montserrat', sans-serif
}

.left-nav a {
font-size: 2rem;
}

.right-nav a {
font-size: 1.25rem;
padding: 20px;
}

a {
position: relative;
color: whitesmoke;
text-decoration: none;
}

a:hover {
color: whitesmoke;
}

a:before {
content: "";
position: absolute;
width: 100%;
height: 1px;
bottom: 0;
left: 0;
background-color: whitesmoke;
visibility: hidden;
}

.navbar {
justify-content: space-between;
}

.navbar-brand {
font-family: 'Library3am', sans-serif;
color: rgb(171, 238, 250);
text-shadow: 0 0 1px rgb(255, 255, 255), 0 0 2px rgb(171, 238, 250);
}

.home {
background-color: rgb(10, 65, 79);
padding: 325px;
font-family: 'Library3am', sans-serif;
color: rgb(174, 228, 238);
font-size: 150px;
text-shadow: -.1vw 0vw .1vw rgb(174, 228, 238), -.15vw 0vw .2vw rgb(174, 228, 238), -.2vw 0vw .2vw rgb(174, 228, 238),
-.1vw 0vw 3vw rgb(46, 157, 177), -.2vw 0vw 3vw rgb(46, 157, 177), -.4vw 0vw 3vw rgb(46, 157, 177),
-.1vw 0vw 5vw rgb(46, 157, 177), -.2vw 0vw 5vw rgb(46, 157, 177), -.4vw 0vw .8vw rgb(46, 157, 177), .2vw 0vw 10vw rgb(46, 157, 177);
}

.home {
animation: home .1s ease infinite;
-webkit-animation: home .1s ease infinite;
-webkit-animation-delay: 2s;
}

/* .home {
animation: home 1s 0s ease infinite;
-webkit-animation: home 1s 0s ease infinite;
} */

/* animation inspiration from: https://codemyui.com/neon-text-flickering-effect/ */
@keyframes home {
0%,
100% {
text-shadow:
-.1vw 0vw .1vw rgb(174, 228, 238), -.15vw 0vw .2vw rgb(174, 228, 238), -.2vw 0vw .2vw rgb(174, 228, 238),
-.1vw 0vw 3vw rgb(46, 157, 177), -.2vw 0vw 3vw rgb(46, 157, 177), -.4vw 0vw 3vw rgb(46, 157, 177),
-.1vw 0vw 5vw rgb(46, 157, 177), -.2vw 0vw 5vw rgb(46, 157, 177), -.4vw 0vw .8vw rgb(46, 157, 177), .2vw 0vw 10vw rgb(46, 157, 177);
color: rgb(174, 228, 238);
}
50% {
text-shadow:
-.1vw 0vw .1vw rgb(44, 88, 99), -.15vw 0vw .2vw rgb(44, 88, 99), -.2vw 0vw .2vw rgb(44, 88, 99),
-.1vw 0vw .1vw rgb(10, 65, 79), -.2vw 0vw .1vw rgb(10, 65, 79), -.4vw 0vw .1vw rgb(10, 65, 79),
-.1vw 0vw .2vw rgb(10, 65, 79), -.2vw 0vw .2vw rgb(10, 65, 79), -.4vw 0vw .2vw rgb(10, 65, 79), .2vw 0vw .5vw #5C0704;
color: rgb(44, 88, 99);
}
}
32 changes: 8 additions & 24 deletions src/App.js
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@ import { BrowserRouter as Router, Route, Link } from "react-router-dom";
import './App.css';
import Search from './components/Search';
import Library from './components/Library';
import Home from './components/Home';
import CustomerList from './components/CustomerList';
import axios from 'axios';

Expand Down Expand Up @@ -111,16 +112,14 @@ class App extends Component {
return (
<Router>
<div className="App">
{/* <header>
<h1>Video Store Consumer</h1>
</header> */}

<nav className="navbar navbar-expand-lg navbar-light bg-light">
<a className="navbar-brand" href="#">crow//video</a>
<nav className="navbar navbar-expand-lg bg-info">
<div className="left-nav">
<span className="navbar-brand"><Link to="/"> crow//video </Link></span>
<button className="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span className="navbar-toggler-icon"></span>
</button>
<div className="collapse navbar-collapse" id="navbarSupportedContent">
</div>
<div className="collapse navbar-collapse right-nav" id="navbarSupportedContent">
<ul className="navbar-nav mr-auto">
<li className="nav-item">
<Link to="/library/"> Movies </Link>
Expand All @@ -134,29 +133,14 @@ class App extends Component {
</ul>
</div>
</nav>
{/* <nav className="navbar navbar-default navbar-light bg-light">
<ul className="nav-list nav-spacer">
<li className="nav-item">
<Link to="/library/"> Movies </Link>
</li>
<li className="nav-item">
<Link to="/customers/"> Customers </Link>
</li>
<li className="nav-item">
<Link to="/search/"> Search Movies </Link>
</li>
<li className="nav-item">
crow//video
</li>
</ul>
{displaySelectedItems}
</nav> */}

<section className="user-messages">
{allUserMessages}
</section>

<section className="store">
{displaySelectedItems}
<Route exact path="/" component={Home} />
<Route path="/search/"
render={(props) => <Search {...props}
selectMovie={this.selectMovie}
Expand Down
File renamed without changes.
11 changes: 11 additions & 0 deletions src/components/Home.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,11 @@
import React from 'react';

const Home = () => {
return (
<div className="home">
<p>crow//video</p>
</div>
)
};

export default Home;
2 changes: 1 addition & 1 deletion src/components/Library.js
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ const Library = (props) => {
const movieCards = movieLibrary.map((movie, i) => {
return (
<MovieCard key={i}
movie={movie}
movie={movie}
filterMoviesCallback={filterMoviesCallback}
selectMovie={() => {selectMovie(movie)}} />
)
Expand Down
9 changes: 9 additions & 0 deletions src/components/MovieCard.css
Original file line number Diff line number Diff line change
Expand Up @@ -5,11 +5,20 @@

.card-text {
padding: 10px;
font-style: italic;
}
.card-body {
text-align: center;
padding: 0;
width: 18em;
height: auto;
}

.card-columns {
column-count: 5;
padding: 25px;
}

.card-columns .card {
width: auto;
}
7 changes: 0 additions & 7 deletions src/components/Sidebar.js

This file was deleted.