codebuddies / cb-connect

Platform to connect mentors with mentees, accountability partners, and OS project maintainers with new contributors
GNU General Public License v3.0
14 stars 8 forks source link

Split timezone into two lines #48

Open lpatmo opened 5 years ago

lpatmo commented 5 years ago

Current issue is that our timezone can sometimes be too long to fit inside a MatchCard component. image

Proposing to breakdown the timezone into two segments so that they can be rendered as: image

One approach would be to splice the timezone value and splitting them in the MatchCard component. https://github.com/codebuddies/cb-connect/blob/c8d179bbb601c495748c1fee7f8e97aac6e4add8/imports/ui/components/dashboard/match_card.jsx#L35

For example, if timezone returns the value of

'(GMT-12:00) International Date Line West'

use JS to split at ) (or use regex to split the value from (...) and everything else) so that we can add a break in between in the MatchCard render function:

render () {
   ...
   <Card.Footer>
       <small className="text-muted">{timezone[0]}</small>
       <small className="text-muted">{timezone[1]}</small> 
   </Card.Footer>
}

where timezone is now an array of ['(GMT-12:00)', 'International Date Line West']

--

A second approach would be to refactor the entries file so that the timezones are already split accordingly:

image