crayonix/giovani.lol
Archived
0
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Fixed footer with social icons and made it responsive + misc

Browse Source
This commit is contained in:
Giovani
2019-04-17 13:28:15 -04:00
parent 84ff2cf0b1
commit a828bfb086
27 changed files with 221 additions and 70 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
package-lock.json generated
View File

@@ -9833,14 +9833,6 @@
"resolved": "https://registry.npmjs.org/obuf/-/obuf-1.1.2.tgz",
"integrity": "sha512-PX1wu0AmAdPqOL1mWhqmlOd8kOIZQwGZw6rh7uby9fTc5lhaOWFLX3I6R1hrF9k3zUY40e6igsLGkDXK92LJNg=="
},
"octicons": {
"version": "8.5.0",
"resolved": "https://registry.npmjs.org/octicons/-/octicons-8.5.0.tgz",
"integrity": "sha512-l4GCHwBvStuwVfIuqUx/ktFJQJdCqLnd0bi2dvYZzkza6wj9EUksfMUlTqyVMULbPIvRTXxOqn/W07fsMu1bXA==",
"requires": {
"object-assign": "4.1.1"
}
},
"on-finished": {
"version": "2.3.0",
"resolved": "https://registry.npmjs.org/on-finished/-/on-finished-2.3.0.tgz",

1
package.json
View File

@@ -4,7 +4,6 @@
"private": true,
"dependencies": {
"animate.css": "^3.7.0",
"octicons": "^8.5.0",
"react": "^16.8.6",
"react-dom": "^16.8.6",
"react-scripts": "2.1.8"

8
public/index.html
View File

@@ -23,10 +23,7 @@
Learn how to configure a non-root public URL by running `npm run build`.
-->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script>
<title>React App</title>
<title>Giovani Rodriguez</title>
</head>
<body>
<noscript>You need to enable JavaScript to run this app.</noscript>
@@ -42,4 +39,7 @@
To create a production bundle, use `npm run build` or `yarn build`.
-->
</body>
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script>
</html>

2
src/components/App.js
View File

@@ -1,5 +1,5 @@
import React, { Component } from 'react';
import Home from './pages/home'
import Home from './home/home'
import './App.css';
class App extends Component {

0
src/components/shared/bio/bio.css → src/components/bio/bio.css
View File

0
src/components/shared/bio/bio.js → src/components/bio/bio.js
View File

3
src/components/footer/footer.css Normal file
View File

@@ -0,0 +1,3 @@
.footer-background-color {
background-color: #eff1f4;
}

33
src/components/footer/footer.js Normal file
View File

@@ -0,0 +1,33 @@
import React, {Component} from 'react';
import './footer.css';
import GithubIcon from '../../images/github-logo.svg';
import LinkedInIcon from '../../images/linkedin-logo.svg';
import TwitterIcon from '../../images/twitter-logo.svg';
class Footer extends Component {
render() {
return (
<div className="container-fluid footer-background-color">
<div className="row justify-content-center">
<div className="col-3 p-3 text-center">
<a href="https://github.com/gio101046" className="d-block" target="_blank" rel="noopener noreferrer">
<img alt="Github Icon" src={GithubIcon} width="64" height="64" />
</a>
</div>
<div className="col-3 p-3 text-center">
<a href="https://www.linkedin.com/in/giovaniluisrodriguez/" className="d-block" target="_blank" rel="noopener noreferrer">
<img alt="LinkedIn Icon" src={LinkedInIcon} width="64" height="64" />
</a>
</div>
<div className="col-3 p-3 text-center">
<a href="https://twitter.com/gcode0727" className="d-block" target="_blank" rel="noopener noreferrer">
<img alt="Twitter Icon" src={TwitterIcon} width="64" height="64" />
</a>
</div>
</div>
</div>
);
}
}
export default Footer;

0
src/components/shared/history/history.css → src/components/history/history.css
View File

2
src/components/shared/history/history.js → src/components/history/history.js
View File

@@ -101,7 +101,7 @@ class History extends Component {
<div className="timeline">
{this.timelineContainers.map((timelineContainer, i) => {
return (
<div className={this.getTimelineContainerClasses(timelineContainer, i)} ref={(el) => timelineContainer.ref = el}>
<div className={this.getTimelineContainerClasses(timelineContainer, i)} ref={(el) => timelineContainer.ref = el} key={i}>
<div className="timeline-content">
<h1>{timelineContainer.heading}</h1>
<h5>{timelineContainer.content}</h5>

24
src/components/home/home.js Normal file
View File

@@ -0,0 +1,24 @@
import React, {Component} from 'react';
import Navigation from '../navigation/navigation';
import Footer from "../footer/footer";
import Introduction from '../introduction/introduction';
import Bio from '../bio/bio';
import History from '../history/history';
import Skills from '../skills/skills'
class Home extends Component {
render() {
return (
<div>
<Navigation/>
<Introduction/>
<Bio/>
<History/>
<Skills/>
<Footer/>
</div>
);
}
}
export default Home;

0
src/components/shared/introduction/introduction.css → src/components/introduction/introduction.css
View File

2
src/components/shared/introduction/introduction.js → src/components/introduction/introduction.js
View File

@@ -1,5 +1,5 @@
import React, {Component} from 'react';
import ProfilePicture from '../../../images/home/profilePicture.jpg';
import ProfilePicture from '../../images/home/profilePicture.jpg';
import "./introduction.css";
const lineOneText = 'Hi, my name is Giovani.';

0
src/components/shared/navigation/navigation.css → src/components/navigation/navigation.css
View File

4
src/components/shared/navigation/navigation.js → src/components/navigation/navigation.js
View File

@@ -40,7 +40,7 @@ class NavigationBar extends Component {
<div className="row justify-content-end nav-background-color">
{this.navigationOptions.map((navigationOption, i) => {
return (
<a className="col-1 nav-menu-item remove-link-styling" href={navigationOption.href}>
<a className="col-1 nav-menu-item remove-link-styling" href={navigationOption.href} key={i}>
<div className="text-center pt-2 pb-2">
<h3>{navigationOption.content}</h3>
</div>
@@ -54,7 +54,7 @@ class NavigationBar extends Component {
<div className="m-3">
{this.navigationOptions.map((navigationOption, i) => {
return (
<div className="p-2" data-toggle="collapse" data-target="#navbarToggleExternalContent">
<div className="p-2" data-toggle="collapse" data-target="#navbarToggleExternalContent" key={i}>
<a className="remove-link-styling" href={navigationOption.href} >
<h4>{navigationOption.content}</h4>
</a>

24
src/components/pages/home.js
View File

@@ -1,24 +0,0 @@
import React, {Component} from 'react';
import Navigation from '../shared/navigation/navigation';
import Footer from "../shared/footer/footer";
import Introduction from '../shared/introduction/introduction';
import Bio from '../shared/bio/bio';
import History from '../shared/history/history';
import Skills from '../shared/skills/skills'
class Home extends Component {
render() {
return (
<div>
<Navigation/>
<Introduction/>
<Bio/>
<History/>
<Skills/>
<Footer/>
</div>
);
}
}
export default Home;

0
src/components/shared/footer/footer.css
View File

23
src/components/shared/footer/footer.js
View File

@@ -1,23 +0,0 @@
import React, {Component} from 'react';
class Footer extends Component {
render() {
return (
<div className="container-fluid mt-5">
<div className="row">
<div className="col">
One
</div>
<div className="col">
Two
</div>
<div className="col">
Three
</div>
</div>
</div>
);
}
}
export default Footer;

0
src/components/shared/skills/skills.css → src/components/skills/skills.css
View File

2
src/components/shared/skills/skills.js → src/components/skills/skills.js
View File

@@ -77,7 +77,7 @@ class Skills extends Component {
<h2><strong>Skills and Abilities</strong></h2>
{this.progressBars.map((progressBar, i) => {
return (
<div className="mt-5 mb-4">
<div className="mt-5 mb-4" key={i}>
<h4 className="text-left">{progressBar.heading}</h4>
<div className="progress progress-bar-height">
<div className="progress-bar progress-bar-ani"

BIN
src/favicon.ico
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 3.8 KiB

After

Width:  |  Height:  |  Size: 4.2 KiB

59
src/images/github-logo.svg Normal file
View File

@@ -0,0 +1,59 @@
<?xml version="1.0" encoding="iso-8859-1"?>
<!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="438.549px" height="438.549px" viewBox="0 0 438.549 438.549" style="enable-background:new 0 0 438.549 438.549;"
xml:space="preserve">
<g>
<path d="M409.132,114.573c-19.608-33.596-46.205-60.194-79.798-79.8C295.736,15.166,259.057,5.365,219.271,5.365
c-39.781,0-76.472,9.804-110.063,29.408c-33.596,19.605-60.192,46.204-79.8,79.8C9.803,148.168,0,184.854,0,224.63
c0,47.78,13.94,90.745,41.827,128.906c27.884,38.164,63.906,64.572,108.063,79.227c5.14,0.954,8.945,0.283,11.419-1.996
c2.475-2.282,3.711-5.14,3.711-8.562c0-0.571-0.049-5.708-0.144-15.417c-0.098-9.709-0.144-18.179-0.144-25.406l-6.567,1.136
c-4.187,0.767-9.469,1.092-15.846,1c-6.374-0.089-12.991-0.757-19.842-1.999c-6.854-1.231-13.229-4.086-19.13-8.559
c-5.898-4.473-10.085-10.328-12.56-17.556l-2.855-6.57c-1.903-4.374-4.899-9.233-8.992-14.559
c-4.093-5.331-8.232-8.945-12.419-10.848l-1.999-1.431c-1.332-0.951-2.568-2.098-3.711-3.429c-1.142-1.331-1.997-2.663-2.568-3.997
c-0.572-1.335-0.098-2.43,1.427-3.289c1.525-0.859,4.281-1.276,8.28-1.276l5.708,0.853c3.807,0.763,8.516,3.042,14.133,6.851
c5.614,3.806,10.229,8.754,13.846,14.842c4.38,7.806,9.657,13.754,15.846,17.847c6.184,4.093,12.419,6.136,18.699,6.136
c6.28,0,11.704-0.476,16.274-1.423c4.565-0.952,8.848-2.383,12.847-4.285c1.713-12.758,6.377-22.559,13.988-29.41
c-10.848-1.14-20.601-2.857-29.264-5.14c-8.658-2.286-17.605-5.996-26.835-11.14c-9.235-5.137-16.896-11.516-22.985-19.126
c-6.09-7.614-11.088-17.61-14.987-29.979c-3.901-12.374-5.852-26.648-5.852-42.826c0-23.035,7.52-42.637,22.557-58.817
c-7.044-17.318-6.379-36.732,1.997-58.24c5.52-1.715,13.706-0.428,24.554,3.853c10.85,4.283,18.794,7.952,23.84,10.994
c5.046,3.041,9.089,5.618,12.135,7.708c17.705-4.947,35.976-7.421,54.818-7.421s37.117,2.474,54.823,7.421l10.849-6.849
c7.419-4.57,16.18-8.758,26.262-12.565c10.088-3.805,17.802-4.853,23.134-3.138c8.562,21.509,9.325,40.922,2.279,58.24
c15.036,16.18,22.559,35.787,22.559,58.817c0,16.178-1.958,30.497-5.853,42.966c-3.9,12.471-8.941,22.457-15.125,29.979
c-6.191,7.521-13.901,13.85-23.131,18.986c-9.232,5.14-18.182,8.85-26.84,11.136c-8.662,2.286-18.415,4.004-29.263,5.146
c9.894,8.562,14.842,22.077,14.842,40.539v60.237c0,3.422,1.19,6.279,3.572,8.562c2.379,2.279,6.136,2.95,11.276,1.995
c44.163-14.653,80.185-41.062,108.068-79.226c27.88-38.161,41.825-81.126,41.825-128.906
C438.536,184.851,428.728,148.168,409.132,114.573z"/>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.8 KiB

2
src/images/home/desktop.ini
View File

@@ -1,2 +0,0 @@
[LocalizedFileNames]
introductionBackground.jpg=@introductionBackground.jpg,0

BIN
src/images/home/profilePicture-2.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 172 KiB

45
src/images/linkedin-logo.svg Normal file
View File

@@ -0,0 +1,45 @@
<?xml version="1.0" encoding="iso-8859-1"?>
<!-- Generator: Adobe Illustrator 18.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 0 455.731 455.731" style="enable-background:new 0 0 455.731 455.731;" xml:space="preserve">
<path d="M0,0v455.731h455.731V0H0z M139.94,375.963c0,5.804-4.705,10.509-10.509,10.509H84.71c-5.804,0-10.509-4.705-10.509-10.509
V185.18c0-5.804,4.705-10.509,10.509-10.509h44.721c5.804,0,10.509,4.705,10.509,10.509V375.963z M106.998,145.491
c-20.308,0.411-38.155-16.551-38.151-38.188c0-20.985,17.282-38.105,38.408-38.088c20.873,0.017,38.088,17.257,38.043,38.234
C145.248,129.413,127.02,145.969,106.998,145.491z M386.884,382.153c0,2.41-1.954,4.363-4.364,4.362l-57.152-0.014
c-2.409-0.001-4.362-1.954-4.362-4.363V264.331c0-10.183-4.126-19.407-10.802-26.079c-6.764-6.768-16.149-10.916-26.501-10.799
c-20.279,0.229-36.454,17.068-36.454,37.348v117.323c0,2.41-1.954,4.363-4.364,4.362l-57.011-0.014
c-2.409-0.001-4.361-1.954-4.361-4.362V179.034c0-2.409,1.953-4.363,4.363-4.363h55.795c2.409,0,4.363,1.953,4.363,4.363v23.418
c0.005-0.01,0.225,0.018,0.599,0.075c1.078-1.95,2.252-3.839,3.52-5.658c11.628-16.688,30.96-27.606,52.842-27.606h11.47
c39.996,0,72.42,32.423,72.42,72.42V382.153z"/>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.6 KiB

46
src/images/twitter-logo.svg Normal file
View File

@@ -0,0 +1,46 @@
<?xml version="1.0" encoding="iso-8859-1"?>
<!-- Generator: Adobe Illustrator 18.1.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 0 612 612" style="enable-background:new 0 0 612 612;" xml:space="preserve">
<g>
<g>
<path style="fill:#010002;" d="M612,116.258c-22.525,9.981-46.694,16.75-72.088,19.772c25.929-15.527,45.777-40.155,55.184-69.411
c-24.322,14.379-51.169,24.82-79.775,30.48c-22.907-24.437-55.49-39.658-91.63-39.658c-69.334,0-125.551,56.217-125.551,125.513
c0,9.828,1.109,19.427,3.251,28.606C197.065,206.32,104.556,156.337,42.641,80.386c-10.823,18.51-16.98,40.078-16.98,63.101
c0,43.559,22.181,81.993,55.835,104.479c-20.575-0.688-39.926-6.348-56.867-15.756v1.568c0,60.806,43.291,111.554,100.693,123.104
c-10.517,2.83-21.607,4.398-33.08,4.398c-8.107,0-15.947-0.803-23.634-2.333c15.985,49.907,62.336,86.199,117.253,87.194
c-42.947,33.654-97.099,53.655-155.916,53.655c-10.134,0-20.116-0.612-29.944-1.721c55.567,35.681,121.536,56.485,192.438,56.485
c230.948,0,357.188-191.291,357.188-357.188l-0.421-16.253C573.872,163.526,595.211,141.422,612,116.258z"/>
</g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.3 KiB

3
src/index.js
View File

@@ -1,6 +1,5 @@
import './css/bootstrap.cosmo.min.css';
import 'animate.css/animate.min.css'
import 'octicons/build/build.css';
import 'animate.css/animate.min.css';
import React from 'react';
import ReactDOM from 'react-dom';
import App from './components/App';