Skip to content

Commit b864767

Browse files
lucassabreulucassabreu
committed
wip
1 parent 4bfff6c commit b864767

File tree

12 files changed

+174
-365
lines changed

12 files changed

+174
-365
lines changed

‎package.json

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,11 +4,11 @@
44
"private": true,
55
"dependencies": {
66
"react": "^16.2.0",
7+
"react-bootstrap": "^0.32.1",
78
"react-dom": "^16.2.0",
89
"react-router": "^4.2.0",
910
"react-router-dom": "^4.2.2",
10-
"react-scripts": "1.1.0",
11-
"rmwc": "^1.1.2"
11+
"react-scripts": "1.1.0"
1212
},
1313
"scripts": {
1414
"start": "yarn install && HOST=cwps.lucassabreu.test react-scripts start",

‎public/index.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -28,7 +28,7 @@
2828
<title>Coderockr Way Project Setup</title>
2929
</head>
3030

31-
<body class="mdc-typography">
31+
<body>
3232
<noscript>
3333
You need to enable JavaScript to run this app.
3434
</noscript>

‎src/App.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import React, { Component } from 'react';
1+
import React from 'react';
22
import './App.css';
33
import Home from './Home'
44
import { Switch, Route } from 'react-router-dom'

‎src/Footer.js

Lines changed: 10 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -13,27 +13,32 @@ const Footer = () => (
1313
</a>
1414
</li>
1515
<li>
16-
<a href="https://twitter.com/coderockr" title="Siga a Coderockr no Twitter" target="_blank">
16+
<a href="https://twitter.com/coderockr" title="Siga a Coderockr no Twitter"
17+
target="_blank" rel="noopener noreferrer">
1718
<span className="icon-twitter"></span>
1819
</a>
1920
</li>
2021
<li>
21-
<a href="https://www.youtube.com/user/coderockr" title="Acompahe a Coderockr no YouTube" target="_blank">
22+
<a href="https://www.youtube.com/user/coderockr" title="Acompahe a Coderockr no YouTube"
23+
target="_blank" rel="noopener noreferrer">
2224
<span className="icon-youtube"></span>
2325
</a>
2426
</li>
2527
<li>
26-
<a href="https://blog.coderockr.com" title="Leia sore a Coderockr no Medium" target="_blank">
28+
<a href="https://blog.coderockr.com" title="Leia sore a Coderockr no Medium"
29+
target="_blank" rel="noopener noreferrer">
2730
<span className="icon-medium"></span>
2831
</a>
2932
</li>
3033
<li>
31-
<a href="https://plus.google.com/+Coderockr" title="Acompahe a Coderockr no Google+" target="_blank">
34+
<a href="https://plus.google.com/+Coderockr" title="Acompahe a Coderockr no Google+"
35+
target="_blank" rel="noopener noreferrer">
3236
<span className="icon-google-plus"></span>
3337
</a>
3438
</li>
3539
<li>
36-
<a href="https://github.com/Coderockr" title="Acompahe a Coderockr no Github" target="_blank">
40+
<a href="https://github.com/Coderockr" title="Acompahe a Coderockr no Github"
41+
target="_blank" rel="noopener noreferrer">
3742
<span className="icon-github"></span>
3843
</a>
3944
</li>

‎src/Home.css

Lines changed: 3 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -66,23 +66,14 @@
6666
padding: 0;
6767
}
6868

69-
.Home .project-handlers-buttons button,
70-
.Home .project-handlers-buttons a {
69+
.Home .project-handlers-buttons .btn {
7170
display: inline-block;
72-
padding: 0 3rem;
73-
height: 7rem;
71+
padding: 1rem 3rem;
7472
width: 100%;
7573
margin-bottom: 1rem;
7674
}
7775

78-
.Home .project-handlers-buttons a{
79-
background-color: green;
80-
color: white;
81-
82-
}
83-
84-
.Home .project-handlers-buttons button .material-icons,
85-
.Home .project-handlers-buttons a .material-icons {
76+
.Home .project-handlers-buttons .btn .icon {
8677
position: relative;
8778
top: -2px;
8879
width: 3rem;

‎src/Home.js

Lines changed: 36 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -1,24 +1,42 @@
11
import React from 'react';
22
import Footer from './Footer';
3-
import Button from 'rmwc/Button';
4-
import Icon from 'rmwc/Icon';
53
import { withRouter } from 'react-router-dom';
64

75
import logo from './assets/images/hand-yellow.svg'
8-
import github from './assets/images/github.svg'
9-
import gitlab from './assets/images/gitlab.svg'
10-
import trello from './assets/images/trello.svg'
6+
import githubLogo from './assets/images/github.svg'
7+
import gitlabLogo from './assets/images/gitlab.svg'
8+
import trelloLogo from './assets/images/trello.svg'
119
import './Home.css'
1210

11+
const logotrello = require('./assets/images/trello.svg');
12+
console.log(logotrello);
13+
1314
const base = window.location.href + 'callback'
14-
const EXTERNAL_ROUTES = {
15-
GITHUB: 'https://github.com/login/oauth/authorize?client_id=0e8a63320fba47de145c&scope=repos&redirect_uri=' + base + '/github',
16-
};
15+
const SETUPABLE = [
16+
{
17+
name: "GitHub",
18+
logo: githubLogo,
19+
enabled: true,
20+
url: 'https://github.com/login/oauth/authorize?client_id=0e8a63320fba47de145c&scope=repos&redirect_uri=' + base + '/github',
21+
},
22+
{
23+
name: "GitLab",
24+
logo: gitlabLogo,
25+
enabled: false,
26+
url: null,
27+
},
28+
{
29+
name: "Trello",
30+
logo: trelloLogo,
31+
enabled: false,
32+
url: null,
33+
},
34+
];
1735

1836
const Home = () => (
1937
<div className="Home">
2038
<header>
21-
<img src={logo} className="logo" />
39+
<img src={logo} className="logo" alt="Coderockr Logo" />
2240
<h1 className="text">CODEROCKR WAY PROJECT SETUP</h1>
2341
</header>
2442
<div className="container">
@@ -32,24 +50,15 @@ const Home = () => (
3250
<section className="project-handlers">
3351
<h2>Where is your project?</h2>
3452
<ul className="row project-handlers-buttons justify-content-md-center">
35-
<li className="col-md-4">
36-
<a class="button" href={EXTERNAL_ROUTES.GITHUB}>
37-
<Icon children={github} />
38-
GitHub
39-
</a>
40-
</li>
41-
<li className="col-md-4">
42-
<Button disabled raised>
43-
<Icon children={gitlab} />
44-
GitLab
45-
</Button>
46-
</li>
47-
<li className="col-md-4">
48-
<Button disabled raised>
49-
<Icon children={trello} />
50-
Trello
51-
</Button>
52-
</li>
53+
{SETUPABLE.map(({ name, logo, url, enabled }) => (
54+
<li key={name} className="col-md-4">
55+
<a className={`btn btn-primary ${enabled ? null : 'disabled'}`} href={url}
56+
alt={enabled ? '' : `${name} will be supported soon`}>
57+
<img src={logo} className="icon" alt={`${name} icon`} />
58+
{name}
59+
</a>
60+
</li>
61+
))}
5362
</ul>
5463
</section>
5564
<section className="more-about">

‎src/assets/images/github.svg

Lines changed: 1 addition & 1 deletion
Loading

‎src/assets/images/gitlab.svg

Lines changed: 1 addition & 1 deletion
Loading

‎src/assets/images/trello.svg

Lines changed: 1 addition & 1 deletion
Loading

‎src/index.css

Lines changed: 46 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,48 @@
11
body {
2-
margin: 0;
3-
padding: 0;
4-
font-family: sans-serif;
2+
margin: 0;
3+
padding: 0;
4+
font-family: sans-serif;
5+
--primary: #f1a10a;
56
}
7+
8+
.btn {
9+
border-radius: 0;
10+
background-color: transparent;
11+
}
12+
13+
.btn-primary,
14+
.btn-primary:hover {
15+
border-color: var(--primary);
16+
color: var(--primary);
17+
}
18+
19+
.btn-primary:hover {
20+
background-color: var(--primary);
21+
}
22+
23+
.btn-success,
24+
.btn-success:hover {
25+
border-color: var(--success);
26+
}
27+
28+
.btn-success:hover {
29+
background-color: var(--success);
30+
}
31+
32+
.btn-danger,
33+
.btn-danger:hover {
34+
border-color: var(--danger);
35+
}
36+
37+
.btn-danger:hover {
38+
background-color: var(--danger);
39+
}
40+
41+
.btn-info,
42+
.btn-info:hover {
43+
border-color: var(--info);
44+
}
45+
46+
.btn-info:hover {
47+
background-color: var(--info);
48+
}

0 commit comments

Comments
 (0)