Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly
Sign up
Appearance settings

Commit 5331b19

Browse files
author
Rajeev Kumar Singh
committed
Added NavLink
1 parent 71f227d commit 5331b19

File tree

3 files changed

+20
-21
lines changed

3 files changed

+20
-21
lines changed

‎react-social/src/common/AppHeader.css‎

Lines changed: 7 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -7,12 +7,7 @@
77
.app-title {
88
line-height: 60px;
99
vertical-align: middle;
10-
font-size: 1.2em;
11-
color: rgba(0,0,0,0.80);
12-
}
13-
14-
.app-title:hover {
15-
color: rgba(0,0,0,0.80);
10+
font-size: 1.3em;
1611
}
1712

1813
.app-branding {
@@ -40,9 +35,13 @@
4035
vertical-align: middle;
4136
padding-left: 15px;
4237
padding-right: 15px;
43-
color: rgba(0,0,0,0.80);
38+
color: rgba(0,0,0,0.65);
4439
}
4540

4641
.app-nav ul li a:hover {
47-
color: rgba(0,0,0,0.80);
42+
color: #0f96f6;
43+
}
44+
45+
.app-nav ul li a.active {
46+
color: #0f96f6;
4847
}

‎react-social/src/common/AppHeader.js‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import React, { Component } from 'react';
2-
import { Link } from 'react-router-dom';
2+
import { Link,NavLink } from 'react-router-dom';
33
import './AppHeader.css';
44

55
class AppHeader extends Component {
@@ -15,7 +15,7 @@ class AppHeader extends Component {
1515
{ this.props.authenticated ? (
1616
<ul>
1717
<li>
18-
<Link to="/profile">Profile</Link>
18+
<NavLink to="/profile">Profile</NavLink>
1919
</li>
2020
<li>
2121
<a onClick={this.props.onLogout}>Logout</a>
@@ -24,10 +24,10 @@ class AppHeader extends Component {
2424
): (
2525
<ul>
2626
<li>
27-
<Link to="/login">Login</Link>
27+
<NavLink to="/login">Login</NavLink>
2828
</li>
2929
<li>
30-
<Link to="/signup">Signup</Link>
30+
<NavLink to="/signup">Signup</NavLink>
3131
</li>
3232
</ul>
3333
)}

‎react-social/src/home/Home.css‎

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
}
88

99
.home-title {
10-
font-size: 24px;
10+
font-size: 26px;
1111
font-weight: 400;
1212
color: rgba(0,0,0,0.65);
1313
margin-top: 50px;
@@ -57,7 +57,7 @@
5757
width: 310px;
5858
height: 310px;
5959
border-radius: 50%;
60-
border: 5px solid #2098f3;
60+
border: 5px solid #ffa20a;
6161
border-left: none;
6262
border-top: none;
6363
animation: scaleTwo 5s infinite alternate linear
@@ -79,7 +79,7 @@
7979
width: 310px;
8080
height: 310px;
8181
border-radius: 50%;
82-
border: 5px solid #2098f3;
82+
border: 5px solid #ec412c;
8383
border-bottom: none;
8484
border-left: none;
8585
animation: scaleThree 4.5s infinite alternate linear
@@ -101,7 +101,7 @@
101101
width: 310px;
102102
height: 310px;
103103
border-radius: 50%;
104-
border: 5px solid #2098f3;
104+
border: 5px solid #fcbd00;
105105
border-top: none;
106106
border-right: none;
107107
animation: scaleFour 4s infinite alternate linear
@@ -123,7 +123,7 @@
123123
width: 310px;
124124
height: 310px;
125125
border-radius: 50%;
126-
border: 5px solid #2098f3;
126+
border: 5px solid #2da94f;
127127
border-bottom: none;
128128
border-left: none;
129129
animation: scaleFive 3.5s infinite alternate linear
@@ -145,7 +145,7 @@
145145
width: 310px;
146146
height: 310px;
147147
border-radius: 50%;
148-
border: 15px solid #2098f3;
148+
border: 15px solid #f57700;
149149
border-bottom: none;
150150
border-right: none;
151151
animation: scaleSix 3s infinite alternate linear
@@ -167,7 +167,7 @@
167167
width: 310px;
168168
height: 310px;
169169
border-radius: 50%;
170-
border: 20px solid #2098f3;
170+
border: 10px solid #2098f3;
171171
border-bottom: none;
172172
border-left: none;
173173
animation: scaleSeven 2.5s infinite alternate linear
@@ -189,7 +189,7 @@
189189
width: 310px;
190190
height: 310px;
191191
border-radius: 50%;
192-
border: 5px solid #2098f3;
192+
border: 5px solid #30bbb0;
193193
border-bottom: none;
194194
border-left: none;
195195
animation: scaleEight 2s infinite alternate linear
@@ -211,7 +211,7 @@
211211
width: 310px;
212212
height: 310px;
213213
border-radius: 50%;
214-
border: 5px solid #2098f3;
214+
border: 5px solid #ff453c;
215215
border-bottom: none;
216216
border-right: none;
217217
animation: scaleNine 1.5s infinite alternate linear

0 commit comments

Comments
(0)

AltStyle によって変換されたページ (->オリジナル) /