Sunny Negi / Meteor-projects

Download as
Browse Code ยป

Commit ce82de088e0c365e64556b3e810df214177e1c52

Authored by Deepak
1 parent 5cd508fa11
Exists in master

Added logout button on header #YDD-40

Showing 2 changed files with 12 additions and 2 deletions   Show diff stats
client/stylesheets/custom.css
Diff comments   View file @ce82de0
1 body 1 body
2 { 2 {
3 background: -webkit-linear-gradient(#00b395, #00b395); 3 background: -webkit-linear-gradient(#00b395, #00b395);
4 background: -o-linear-gradient(#00b395, #00b395); 4 background: -o-linear-gradient(#00b395, #00b395);
5 background: linear-gradient(#00b395, #00b395); 5 background: linear-gradient(#00b395, #00b395);
6 } 6 }
7 7
8 table .dropdown span{ 8 table .dropdown span{
9 color: #000000; 9 color: #000000;
10 } 10 }
11 table .dropdown-toggle{ 11 table .dropdown-toggle{
12 cursor: pointer; 12 cursor: pointer;
13 } 13 }
14 table .dropdown .fa{ 14 table .dropdown .fa{
15 display: inline; 15 display: inline;
16 margin: 6px 6px; 16 margin: 6px 6px;
17 } 17 }
18 table .dropdown-menu { 18 table .dropdown-menu {
19 min-width: 134px; 19 min-width: 134px;
20 } 20 }
21 table .dropdown-menu > li { 21 table .dropdown-menu > li {
22 cursor: pointer; 22 cursor: pointer;
23 } 23 }
24 table .dropdown-menu > li:hover{ 24 table .dropdown-menu > li:hover{
25 text-decoration: none; 25 text-decoration: none;
26 color: #333333; 26 color: #333333;
27 background-color: #f5f5f5; 27 background-color: #f5f5f5;
28 } 28 }
29 table .dropdown-menu > li > span{ 29 table .dropdown-menu > li > span{
30 padding: 6px 16px; 30 padding: 6px 16px;
31 display: block; 31 display: block;
32 } 32 }
33 span.logout {
34 background-color: #1a222f;
35 border-color: #ffffff;
36 color: #fff;
37 cursor: pointer;
38 }
33 button.close span{ 39 button.close span{
34 font-size: 24px; 40 font-size: 24px;
35 color: black; 41 color: black;
36 } 42 }
37 .panel-body{ 43 .panel-body{
38 max-height: 550px; 44 max-height: 550px;
39 overflow-y: scroll; 45 overflow-y: scroll;
40 } 46 }
41 47
imports/client/views/org/app/module/navigation/AuthenticatedNavigation.js
Diff comments   View file @ce82de0
1 import React, { Component } from 'react'; 1 import React, { Component } from 'react';
2 import { browserHistory } from 'react-router'; 2 import { browserHistory } from 'react-router';
3 import { LinkContainer } from 'react-router-bootstrap'; 3 import { LinkContainer } from 'react-router-bootstrap';
4 import { logout } from '/imports/client/app/utils/loginMethods'; 4 import { logout } from '/imports/client/app/utils/loginMethods';
5 import { Navbar,Modal, Nav, NavItem, 5 import { Navbar,Modal, Nav, NavItem,
6 Glyphicon, Collapse, 6 Glyphicon, Collapse,
7 NavbarToggler, NavbarBrand, 7 NavbarToggler, NavbarBrand,
8 NavLink, DropdownItem, DropdownToggle, DropdownMenu, 8 NavLink, DropdownItem, DropdownToggle, DropdownMenu,
9 NavDropdown, MenuItem } from 'react-bootstrap'; 9 NavDropdown, MenuItem } from 'react-bootstrap';
10 import { Meteor } from 'meteor/meteor'; 10 import { Meteor } from 'meteor/meteor';
11 import $ from 'jquery'; 11 import $ from 'jquery';
12 12
13 13
14 const handleLogout = () => Meteor.logout(() => browserHistory.push('/login')); 14 const handleLogout = () => Meteor.logout(() => browserHistory.push('/login'));
15 15
16 export class AuthenticatedNavigation extends Component { 16 export class AuthenticatedNavigation extends Component {
17 constructor(props) { 17 constructor(props) {
18 super(props); 18 super(props);
19 this.toggle = this.toggle.bind(this); 19 this.toggle = this.toggle.bind(this);
20 this.changeBodyClass = this.changeBodyClass.bind(this); 20 this.changeBodyClass = this.changeBodyClass.bind(this);
21 this.state = { 21 this.state = {
22 dropdownOpen: false, 22 dropdownOpen: false,
23 burgerMenu: false 23 burgerMenu: false
24 }; 24 };
25 } 25 }
26 toggle() { 26 toggle() {
27 this.setState({ 27 this.setState({
28 dropdownOpen: !this.state.dropdownOpen 28 dropdownOpen: !this.state.dropdownOpen
29 }); 29 });
30 } 30 }
31 changeBodyClass(){ 31 changeBodyClass(){
32 if(this.state.burgerMenu){ 32 if(this.state.burgerMenu){
33 $('body').addClass('sidebar-xs'); 33 $('body').addClass('sidebar-xs');
34 this.setState({burgerMenu: false}); 34 this.setState({burgerMenu: false});
35 }else{ 35 }else{
36 $('body').removeClass('sidebar-xs'); 36 $('body').removeClass('sidebar-xs');
37 this.setState({burgerMenu: true}); 37 this.setState({burgerMenu: true});
38 } 38 }
39 } 39 }
40 render(){ 40 render(){
41 const {user, org} = this.props.data; 41 const {user, org} = this.props.data;
42 return( 42 return(
43 <Navbar inverse collapseOnSelect className="bg-crimson"> 43 <Navbar inverse collapseOnSelect className="bg-crimson">
44 <Navbar.Header> 44 <Navbar.Header>
45 <Navbar.Brand> 45 <Navbar.Brand>
46 <a href="#"> 46 <a href="#">
47 <Glyphicon glyph="link" /> 47 <Glyphicon glyph="link" />
48 &nbsp; YoungDesk 48 &nbsp; YoungDesk
49 </a> 49 </a>
50 </Navbar.Brand> 50 </Navbar.Brand>
51 <ul className="nav navbar-nav visible-xs-block"> 51 <ul className="nav navbar-nav visible-xs-block">
52 <li><a href="#"><i className="icon-tree5"/></a></li> 52 <li><a href="#"><i className="icon-tree5"/></a></li>
53 <li><a className="sidebar-mobile-main-toggle"><i className="icon-paragraph-justify3"/></a></li> 53 <li><a className="sidebar-mobile-main-toggle"><i className="icon-paragraph-justify3"/></a></li>
54 </ul> 54 </ul>
55 <Navbar.Toggle /> 55 <Navbar.Toggle />
56 </Navbar.Header> 56 </Navbar.Header>
57 <Navbar.Collapse id="navbar-mobile"> 57 <Navbar.Collapse id="navbar-mobile">
58 <ul className="nav navbar-nav"> 58 <ul className="nav navbar-nav">
59 <NavItem eventKey={1} href="#" className="sidebar-control sidebar-main-toggle hidden-xs"> 59 <NavItem eventKey={1} href="#" className="sidebar-control sidebar-main-toggle hidden-xs">
60 <i 60 <i
61 className="icon-paragraph-justify3 burgerMenu" 61 className="icon-paragraph-justify3 burgerMenu"
62 onClick = {this.changeBodyClass} 62 onClick = {this.changeBodyClass}
63 /> 63 />
64 </NavItem> 64 </NavItem>
65 65
66 <NavDropdown title="Dropdown" id="update"> 66 <NavDropdown title="Dropdown" id="update">
67 <div className="dropdown-content"> 67 <div className="dropdown-content">
68 <div className="dropdown-content-heading"> 68 <div className="dropdown-content-heading">
69 Git updates 69 Git updates
70 <ul className="icons-list"> 70 <ul className="icons-list">
71 <li><a href="#"><i className="icon-sync"></i></a></li> 71 <li><a href="#"><i className="icon-sync"></i></a></li>
72 </ul> 72 </ul>
73 73
74 </div> 74 </div>
75 <ul className="media-list dropdown-content-body width-350"> 75 <ul className="media-list dropdown-content-body width-350">
76 <li className="media"> 76 <li className="media">
77 <div className="media-left"> 77 <div className="media-left">
78 <a href="#" className="btn border-primary text-primary btn-flat btn-rounded btn-icon btn-sm"><i className="icon-git-pull-request"></i></a> 78 <a href="#" className="btn border-primary text-primary btn-flat btn-rounded btn-icon btn-sm"><i className="icon-git-pull-request"></i></a>
79 </div> 79 </div>
80 80
81 <div className="media-body"> 81 <div className="media-body">
82 Drop the IE <a href="#">specific hacks</a> for temporal inputs 82 Drop the IE <a href="#">specific hacks</a> for temporal inputs
83 <div className="media-annotation">4 minutes ago</div> 83 <div className="media-annotation">4 minutes ago</div>
84 </div> 84 </div>
85 </li> 85 </li>
86 86
87 <li className="media"> 87 <li className="media">
88 <div className="media-left"> 88 <div className="media-left">
89 <a href="#" className="btn border-warning text-warning btn-flat btn-rounded btn-icon btn-sm"><i className="icon-git-commit"></i></a> 89 <a href="#" className="btn border-warning text-warning btn-flat btn-rounded btn-icon btn-sm"><i className="icon-git-commit"></i></a>
90 </div> 90 </div>
91 91
92 <div className="media-body"> 92 <div className="media-body">
93 Add full font overrides for popovers and tooltips 93 Add full font overrides for popovers and tooltips
94 <div className="media-annotation">36 minutes ago</div> 94 <div className="media-annotation">36 minutes ago</div>
95 </div> 95 </div>
96 </li> 96 </li>
97 97
98 <li className="media"> 98 <li className="media">
99 <div className="media-left"> 99 <div className="media-left">
100 <a href="#" className="btn border-info text-info btn-flat btn-rounded btn-icon btn-sm"><i className="icon-git-branch"></i></a> 100 <a href="#" className="btn border-info text-info btn-flat btn-rounded btn-icon btn-sm"><i className="icon-git-branch"></i></a>
101 </div> 101 </div>
102 102
103 <div className="media-body"> 103 <div className="media-body">
104 <a href="#">Chris Arney</a> created a new <span className="text-semibold">Design</span> branch 104 <a href="#">Chris Arney</a> created a new <span className="text-semibold">Design</span> branch
105 <div className="media-annotation">2 hours ago</div> 105 <div className="media-annotation">2 hours ago</div>
106 </div> 106 </div>
107 </li> 107 </li>
108 108
109 <li className="media"> 109 <li className="media">
110 <div className="media-left"> 110 <div className="media-left">
111 <a href="#" className="btn border-success text-success btn-flat btn-rounded btn-icon btn-sm"><i className="icon-git-merge"></i></a> 111 <a href="#" className="btn border-success text-success btn-flat btn-rounded btn-icon btn-sm"><i className="icon-git-merge"></i></a>
112 </div> 112 </div>
113 113
114 <div className="media-body"> 114 <div className="media-body">
115 <a href="#">Eugene Kopyov</a> merged <span className="text-semibold">Master</span> and <span className="text-semibold">Dev</span> branches 115 <a href="#">Eugene Kopyov</a> merged <span className="text-semibold">Master</span> and <span className="text-semibold">Dev</span> branches
116 <div className="media-annotation">Dec 18, 18:36</div> 116 <div className="media-annotation">Dec 18, 18:36</div>
117 </div> 117 </div>
118 </li> 118 </li>
119 119
120 <li className="media"> 120 <li className="media">
121 <div className="media-left"> 121 <div className="media-left">
122 <a href="#" className="btn border-primary text-primary btn-flat btn-rounded btn-icon btn-sm"><i className="icon-git-pull-request"></i></a> 122 <a href="#" className="btn border-primary text-primary btn-flat btn-rounded btn-icon btn-sm"><i className="icon-git-pull-request"></i></a>
123 </div> 123 </div>
124 124
125 <div className="media-body"> 125 <div className="media-body">
126 Have Carousel ignore keyboard events 126 Have Carousel ignore keyboard events
127 <div className="media-annotation">Dec 12, 05:46</div> 127 <div className="media-annotation">Dec 12, 05:46</div>
128 </div> 128 </div>
129 </li> 129 </li>
130 </ul> 130 </ul>
131 <div className="dropdown-content-footer"> 131 <div className="dropdown-content-footer">
132 <a href="#" data-popup="tooltip" title="All activity"><i className="icon-menu display-block"></i></a> 132 <a href="#" data-popup="tooltip" title="All activity"><i className="icon-menu display-block"></i></a>
133 </div> 133 </div>
134 </div> 134 </div>
135 </NavDropdown> 135 </NavDropdown>
136 </ul> 136 </ul>
137 <div className="navbar-right"> 137 <div className="navbar-right">
138 <p className="navbar-text">Hello {user.getFullName()}</p> 138 <p className="navbar-text">Hello {user.getFullName()}</p>
139 <p className="navbar-text"><span className="label bg-success-400">Online</span></p> 139 <p className="navbar-text"
140 onClick = {() => logout()}
141 >
142 <span className="label logout">logout</span>
143 </p>
140 <Nav> 144 <Nav>
141 <NavDropdown title="Activity" id="activity"> 145 <NavDropdown title="Activity" id="activity">
142 <div className="dropdown-content"> 146 <div className="dropdown-content">
143 <div className="dropdown-content-heading"> 147 <div className="dropdown-content-heading">
144 Activity 148 Activity
145 <ul className="icons-list"> 149 <ul className="icons-list">
146 <li><a href="#"><i className="icon-menu7"></i></a></li> 150 <li><a href="#"><i className="icon-menu7"></i></a></li>
147 </ul> 151 </ul>
148 </div> 152 </div>
149 <ul className="media-list dropdown-content-body width-350"> 153 <ul className="media-list dropdown-content-body width-350">
150 <li className="media"> 154 <li className="media">
151 <div className="media-left"> 155 <div className="media-left">
152 <a href="#" className="btn bg-success-400 btn-rounded btn-icon btn-xs"><i className="icon-mention"></i></a> 156 <a href="#" className="btn bg-success-400 btn-rounded btn-icon btn-xs"><i className="icon-mention"></i></a>
153 </div> 157 </div>
154 158
155 <div className="media-body"> 159 <div className="media-body">
156 <a href="#">Taylor Swift</a> mentioned you in a post "Angular JS. Tips and tricks" 160 <a href="#">Taylor Swift</a> mentioned you in a post "Angular JS. Tips and tricks"
157 <div className="media-annotation">4 minutes ago</div> 161 <div className="media-annotation">4 minutes ago</div>
158 </div> 162 </div>
159 </li> 163 </li>
160 <li className="media"> 164 <li className="media">
161 <div className="media-left"> 165 <div className="media-left">
162 <a href="#" className="btn bg-pink-400 btn-rounded btn-icon btn-xs"><i className="icon-paperplane"></i></a> 166 <a href="#" className="btn bg-pink-400 btn-rounded btn-icon btn-xs"><i className="icon-paperplane"></i></a>
163 </div> 167 </div>
164 168
165 <div className="media-body"> 169 <div className="media-body">
166 Special offers have been sent to subscribed users by <a href="#">Donna Gordon</a> 170 Special offers have been sent to subscribed users by <a href="#">Donna Gordon</a>
167 <div className="media-annotation">36 minutes ago</div> 171 <div className="media-annotation">36 minutes ago</div>
168 </div> 172 </div>
169 </li> 173 </li>
170 <li className="media"> 174 <li className="media">
171 <div className="media-left"> 175 <div className="media-left">
172 <a href="#" className="btn bg-blue btn-rounded btn-icon btn-xs"><i className="icon-plus3"></i></a> 176 <a href="#" className="btn bg-blue btn-rounded btn-icon btn-xs"><i className="icon-plus3"></i></a>
173 </div> 177 </div>
174 178
175 <div className="media-body"> 179 <div className="media-body">
176 <a href="#">Chris Arney</a> created a new <span className="text-semibold">Design</span> branch in <span className="text-semibold">Limitless</span> repository 180 <a href="#">Chris Arney</a> created a new <span className="text-semibold">Design</span> branch in <span className="text-semibold">Limitless</span> repository
177 <div className="media-annotation">2 hours ago</div> 181 <div className="media-annotation">2 hours ago</div>
178 </div> 182 </div>
179 </li> 183 </li>
180 184
181 <li className="media"> 185 <li className="media">
182 <div className="media-left"> 186 <div className="media-left">
183 <a href="#" className="btn bg-purple-300 btn-rounded btn-icon btn-xs"><i className="icon-truck"></i></a> 187 <a href="#" className="btn bg-purple-300 btn-rounded btn-icon btn-xs"><i className="icon-truck"></i></a>
184 </div> 188 </div>
185 189
186 <div className="media-body"> 190 <div className="media-body">
187 Shipping cost to the Netherlands has been reduced, database updated 191 Shipping cost to the Netherlands has been reduced, database updated
188 <div className="media-annotation">Feb 8, 11:30</div> 192 <div className="media-annotation">Feb 8, 11:30</div>
189 </div> 193 </div>
190 </li> 194 </li>
191 195
192 <li className="media"> 196 <li className="media">
193 <div className="media-left"> 197 <div className="media-left">
194 <a href="#" className="btn bg-warning-400 btn-rounded btn-icon btn-xs"><i className="icon-bubble8"></i></a> 198 <a href="#" className="btn bg-warning-400 btn-rounded btn-icon btn-xs"><i className="icon-bubble8"></i></a>
195 </div> 199 </div>
196 200
197 <div className="media-body"> 201 <div className="media-body">
198 New review received on <a href="#">Server side integration</a> services 202 New review received on <a href="#">Server side integration</a> services
199 <div className="media-annotation">Feb 2, 10:20</div> 203 <div className="media-annotation">Feb 2, 10:20</div>
200 </div> 204 </div>
201 </li> 205 </li>
202 206
203 <li className="media"> 207 <li className="media">
204 <div className="media-left"> 208 <div className="media-left">
205 <a href="#" className="btn bg-teal-400 btn-rounded btn-icon btn-xs"><i className="icon-spinner11"></i></a> 209 <a href="#" className="btn bg-teal-400 btn-rounded btn-icon btn-xs"><i className="icon-spinner11"></i></a>
206 </div> 210 </div>
207 211
208 <div className="media-body"> 212 <div className="media-body">
209 <strong>January, 2016</strong> - 1320 new users, 3284 orders, $49,390 revenue 213 <strong>January, 2016</strong> - 1320 new users, 3284 orders, $49,390 revenue
210 <div className="media-annotation">Feb 1, 05:46</div> 214 <div className="media-annotation">Feb 1, 05:46</div>
211 </div> 215 </div>
212 </li> 216 </li>
213 </ul> 217 </ul>
214 </div> 218 </div>
215 </NavDropdown> 219 </NavDropdown>
216 <NavDropdown title="Messages" id="messages"> 220 <NavDropdown title="Messages" id="messages">
217 <div className="dropdown-content width-350"> 221 <div className="dropdown-content width-350">
218 <div className="dropdown-content-heading"> 222 <div className="dropdown-content-heading">
219 Messages 223 Messages
220 <ul className="icons-list"> 224 <ul className="icons-list">
221 <li><a href="#"><i className="icon-compose"></i></a></li> 225 <li><a href="#"><i className="icon-compose"></i></a></li>
222 </ul> 226 </ul>
223 </div> 227 </div>
224 228
225 <ul className="media-list dropdown-content-body"> 229 <ul className="media-list dropdown-content-body">
226 <li className="media"> 230 <li className="media">
227 <div className="media-left"> 231 <div className="media-left">
228 232
229 <span className="badge bg-danger-400 media-badge">5</span> 233 <span className="badge bg-danger-400 media-badge">5</span>
230 </div> 234 </div>
231 235
232 <div className="media-body"> 236 <div className="media-body">
233 <a href="#" className="media-heading"> 237 <a href="#" className="media-heading">
234 <span className="text-semibold">James Alexander</span> 238 <span className="text-semibold">James Alexander</span>
235 <span className="media-annotation pull-right">04:58</span> 239 <span className="media-annotation pull-right">04:58</span>
236 </a> 240 </a>
237 241
238 <span className="text-muted">who knows, maybe that would be the best thing for me...</span> 242 <span className="text-muted">who knows, maybe that would be the best thing for me...</span>
239 </div> 243 </div>
240 </li> 244 </li>
241 245
242 <li className="media"> 246 <li className="media">
243 <div className="media-left"> 247 <div className="media-left">
244 248
245 <span className="badge bg-danger-400 media-badge">4</span> 249 <span className="badge bg-danger-400 media-badge">4</span>
246 </div> 250 </div>
247 251
248 <div className="media-body"> 252 <div className="media-body">
249 <a href="#" className="media-heading"> 253 <a href="#" className="media-heading">
250 <span className="text-semibold">Margo Baker</span> 254 <span className="text-semibold">Margo Baker</span>
251 <span className="media-annotation pull-right">12:16</span> 255 <span className="media-annotation pull-right">12:16</span>
252 </a> 256 </a>
253 257
254 <span className="text-muted">That was something he was unable to do because...</span> 258 <span className="text-muted">That was something he was unable to do because...</span>
255 </div> 259 </div>
256 </li> 260 </li>
257 261
258 <li className="media"> 262 <li className="media">
259 <div className="media-left"></div> 263 <div className="media-left"></div>
260 <div className="media-body"> 264 <div className="media-body">
261 <a href="#" className="media-heading"> 265 <a href="#" className="media-heading">
262 <span className="text-semibold">Jeremy Victorino</span> 266 <span className="text-semibold">Jeremy Victorino</span>
263 <span className="media-annotation pull-right">22:48</span> 267 <span className="media-annotation pull-right">22:48</span>
264 </a> 268 </a>
265 269
266 <span className="text-muted">But that would be extremely strained and suspicious...</span> 270 <span className="text-muted">But that would be extremely strained and suspicious...</span>
267 </div> 271 </div>
268 </li> 272 </li>
269 273
270 <li className="media"> 274 <li className="media">
271 <div className="media-left"></div> 275 <div className="media-left"></div>
272 <div className="media-body"> 276 <div className="media-body">
273 <a href="#" className="media-heading"> 277 <a href="#" className="media-heading">
274 <span className="text-semibold">Beatrix Diaz</span> 278 <span className="text-semibold">Beatrix Diaz</span>
275 <span className="media-annotation pull-right">Tue</span> 279 <span className="media-annotation pull-right">Tue</span>
276 </a> 280 </a>
277 281
278 <span className="text-muted">What a strenuous career it is that I have chosen...</span> 282 <span className="text-muted">What a strenuous career it is that I have chosen...</span>
279 </div> 283 </div>
280 </li> 284 </li>
281 285
282 <li className="media"> 286 <li className="media">
283 <div className="media-left"> 287 <div className="media-left">
284 288
285 </div> 289 </div>
286 <div className="media-body"> 290 <div className="media-body">
287 <a href="#" className="media-heading"> 291 <a href="#" className="media-heading">
288 <span className="text-semibold">Richard Vango</span> 292 <span className="text-semibold">Richard Vango</span>
289 <span className="media-annotation pull-right">Mon</span> 293 <span className="media-annotation pull-right">Mon</span>
290 </a> 294 </a>
291 295
292 <span className="text-muted">Other travelling salesmen live a life of luxury...</span> 296 <span className="text-muted">Other travelling salesmen live a life of luxury...</span>
293 </div> 297 </div>
294 </li> 298 </li>
295 </ul> 299 </ul>
296 300
297 <div className="dropdown-content-footer"> 301 <div className="dropdown-content-footer">
298 <a href="#" data-popup="tooltip" title="All messages"><i className="icon-menu display-block"></i></a> 302 <a href="#" data-popup="tooltip" title="All messages"><i className="icon-menu display-block"></i></a>
299 </div> 303 </div>
300 </div> 304 </div>
301 </NavDropdown> 305 </NavDropdown>
302 </Nav> 306 </Nav>
303 </div> 307 </div>
304 </Navbar.Collapse> 308 </Navbar.Collapse>
305 </Navbar> 309 </Navbar>
306 ); 310 );
307 } 311 }
308 } 312 }
309 313