Skip to content
This repository was archived by the owner on Oct 30, 2025. It is now read-only.

Commit f67eb4b

Browse files
dhruvjain99RonLek
authored andcommitted
[FIX] Remove community concept from home
1 parent 8208219 commit f67eb4b

3 files changed

Lines changed: 85 additions & 97 deletions

File tree

client/public/community.png

-29 KB
Binary file not shown.
Lines changed: 76 additions & 72 deletions
Original file line numberDiff line numberDiff line change
@@ -1,135 +1,139 @@
11
.home-wrapper {
2-
width: 77%;
3-
padding: 20px;
4-
font-family: 'Poppins', sans-serif;
5-
font-weight: 400;
6-
font-size: 15px;
7-
overflow-y: auto;
2+
width: 77%;
3+
padding: 20px 20px 20px 30px;
4+
font-family: "Poppins", sans-serif;
5+
font-weight: 400;
6+
font-size: 15px;
7+
overflow-y: auto;
88
}
99

1010
.powered-by-title {
11-
text-decoration: none;
12-
color: hsl(240, 6%, 17%);
11+
text-decoration: none;
12+
color: hsl(240, 6%, 17%);
1313
}
1414

1515
.powered-by-title:hover {
16-
text-decoration: underline;
16+
text-decoration: underline;
1717
}
1818

19-
.home-wrapper header h1 {
19+
.unsigned-home-heading {
2020
font-weight: 600;
2121
color: hsl(240, 6%, 17%);
2222
margin: 20px 0;
2323
font-weight: 200;
2424
}
2525

26-
.home-wrapper header p { color: hsl(240, 5%, 36%); }
27-
26+
.unsigned-home-text {
27+
color: hsl(240, 5%, 36%);
28+
max-width: 520px;
29+
margin: auto;
30+
}
2831

29-
.home-wrapper header {
32+
.unsigned-home-header {
3033
margin: 40px 30px;
3134
text-align: center;
3235
}
3336

34-
.home-wrapper header p {
35-
max-width: 520px;
36-
margin: auto;
37-
}
38-
3937
.button-container {
40-
display: flex;
41-
justify-content: center;
42-
align-items: center;
38+
display: flex;
39+
justify-content: center;
40+
align-items: center;
4341
}
4442

4543
.main-stats-container {
46-
margin-top: 70px;
47-
margin-bottom: 70px;
48-
display: flex;
49-
flex-direction: row;
50-
align-items: center;
51-
justify-content: space-around;
52-
flex-wrap: wrap;
44+
margin-top: 70px;
45+
margin-bottom: 70px;
46+
display: flex;
47+
flex-direction: row;
48+
align-items: center;
49+
justify-content: space-around;
50+
flex-wrap: wrap;
5351
}
5452

5553
.stat-container {
56-
padding: 20px;
57-
display: flex;
58-
flex-direction: column;
59-
align-items: center;
60-
color: #29292e;
61-
background-color: #e0e0e01a;
62-
border-radius: 100px;
63-
height: 170px;
64-
width: 170px;
65-
margin: 10px;
66-
box-shadow: 0px 8px 12px -7px #a9a6a6fc;
54+
padding: 20px;
55+
display: flex;
56+
flex-direction: column;
57+
align-items: center;
58+
color: #29292e;
59+
background-color: #e0e0e01a;
60+
border-radius: 100px;
61+
height: 170px;
62+
width: 170px;
63+
margin: 10px;
64+
box-shadow: 0px 8px 12px -7px #a9a6a6fc;
6765
}
6866

69-
7067
.stat-icon {
71-
width: 60px;
72-
height: 60px;
73-
display: block;
74-
margin-bottom: 15px;
68+
width: 60px;
69+
height: 60px;
70+
display: block;
71+
margin-bottom: 15px;
7572
}
7673

7774
.stat-number {
78-
font-size: 40px;
79-
letter-spacing: 2px;
80-
margin-bottom: 5px;
81-
font-weight: 500;
75+
font-size: 40px;
76+
letter-spacing: 2px;
77+
margin-bottom: 5px;
78+
font-weight: 500;
8279
}
8380

8481
.stat-label {
85-
font-weight: 400;
86-
text-transform: uppercase;
87-
text-align: center;
82+
font-weight: 400;
83+
text-transform: uppercase;
84+
text-align: center;
8885
}
8986

9087
.search-icon-explore-desc {
91-
vertical-align: bottom;
88+
vertical-align: bottom;
9289
}
9390

9491
.community-home-img {
95-
margin: 10px;
96-
width: 500px;
92+
margin: 0 10px 10px;
93+
width: 500px;
9794
}
9895

9996
.signed-home-main {
100-
display: flex;
101-
flex-direction: row;
102-
justify-content: space-between;
97+
display: flex;
98+
flex-direction: row;
99+
justify-content: space-between;
103100
}
104101

105102
.signed-home-header {
106-
margin-bottom: 40px;
103+
margin-bottom: 40px;
107104
}
108105

109106
.signed-home-header p {
110-
font-size: 0.87em;
111-
line-height: 27px;
112-
color: #252525;
107+
font-size: 0.88em;
108+
line-height: 27px;
109+
color: #252525;
113110
}
114111

115112
.signed-home-shortcut-container {
116-
margin-bottom: 30px;
113+
margin-bottom: 30px;
117114
}
118115

119116
.signed-home-shortcut {
120-
padding: 14px;
121-
border-radius: 5px;
122-
font-size: 0.87em;
123-
cursor: pointer;
124-
display: flex;
117+
padding: 14px;
118+
border-radius: 5px;
119+
font-size: 0.87em;
120+
cursor: pointer;
121+
display: flex;
122+
align-items: center;
125123
}
126124

127125
.signed-home-shortcut:hover {
128-
background-color: #e3e9fe66;
126+
background-color: #e3e9fe66;
127+
}
128+
129+
.shortcut-icon-small {
130+
width: 1.5em;
131+
height: 1.5em;
132+
margin-right: 7px;
129133
}
130134

131-
.signed-home-shortcut-icon {
132-
width: 1.5em;
133-
height: 1.5em;
134-
margin-right: 5px;
135+
.shortcut-icon-medium {
136+
width: 1.7em;
137+
height: 1.7em;
138+
margin-right: 5px;
135139
}

client/src/components/Home/index.js

Lines changed: 9 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -22,8 +22,8 @@ export default function Home(props) {
2222
if (!props.authState.isLoggedIn) {
2323
return (
2424
<div className="home-wrapper">
25-
<header>
26-
<h1>
25+
<header className="unsigned-home-header">
26+
<h1 className="unsigned-home-heading">
2727
Real-time Collaboration
2828
<br />
2929
<a
@@ -36,7 +36,7 @@ export default function Home(props) {
3636
</a>
3737
</h1>
3838

39-
<p>
39+
<p className="unsigned-home-text">
4040
<strong>Monitor</strong> your <strong>workflows</strong>,
4141
<strong>collaborate</strong> and <strong>access data</strong> any
4242
time you need it, all in one{" "}
@@ -91,33 +91,17 @@ export default function Home(props) {
9191
return (
9292
<div className="home-wrapper">
9393
<header class="signed-home-header">
94-
<h3>
94+
<h2>
9595
{getGreetings()}, {props.authState.user.name}
96-
</h3>
96+
</h2>
9797
<p>
98-
To help you get started real quick, we have already created a
99-
community for you.&nbsp; Now create channels for your repositories
100-
within{" "}
101-
<strong>{props.authState.user.username.split("_github")}</strong>{" "}
102-
community.
103-
<br></br>
104-
To add channels for a new GitHub organization, start by creating a
105-
community for it.
98+
We're ready to go.
10699
</p>
107100
</header>
108101
<div class="signed-home-main">
109102
<div>
110103
<div class="signed-home-shortcut-container">
111104
<h5>Start something new</h5>
112-
<div
113-
className="signed-home-shortcut"
114-
onClick={() => {
115-
document.getElementById("create-community").click();
116-
}}
117-
>
118-
<img src="/community.png" className="signed-home-shortcut-icon" />
119-
Create a community
120-
</div>
121105
<div
122106
className="signed-home-shortcut"
123107
onClick={() => {
@@ -126,9 +110,9 @@ export default function Home(props) {
126110
>
127111
<img
128112
src="https://img.icons8.com/plasticine/35/000000/organization.png"
129-
className="signed-home-shortcut-icon"
113+
className="shortcut-icon-medium"
130114
/>
131-
Create a channel
115+
Create a room
132116
</div>
133117
</div>
134118
<div className="signed-home-shortcut-container">
@@ -141,7 +125,7 @@ export default function Home(props) {
141125
>
142126
<img
143127
src="/search-icon.png"
144-
className="signed-home-shortcut-icon"
128+
className="shortcut-icon-small"
145129
/>
146130
Discover existing rooms
147131
</div>

0 commit comments

Comments
 (0)