site/lib/helpers.js
Ella 89881fd7e8 Move /bank page to v3 (#167)
* initial migration

* port landing and feature components

* Features section

* Add event cards in Testimonials (no styles)

* add everything section

* everything but no styling

* fFix some styles in Everything.js

* Add Start section without the form yet

* Fix testimonials section grid

* Fix styles on Landing

* Styles on Everything section

* Fix testimonials cards

* Fix console error and testimonial cards

* Fix landing and style bugs

* Fix styles

* Add selection color

* Fix Grid on everything section

* Fetch transaction data from api

* Style stats

* Fix landing on mobile

* Fix some bugs and responsiveness

* Fix 🐛 so the form exists now

* Fix bugs & add timeline

* Fix Laptop in Grid

* Switch to Dark Laptop

* Fix Stat Text Size

* Form -> Airtable

* Change to hred to primary, align ModuleDetails card

* Remove dates

* Fix Event card to align items center

* Add mtop margin to transparency button

* Fix Run.js icon styles

* Make fiscal sponsor note more readable

* Add 2 tone colors btwn Start and Everything

* Flashing green dot

* Confusion

* Update components/bank/Timeline.js

Co-authored-by: Sam Poder <39828164+sampoder@users.noreply.github.com>

* Fix remaining style bugs

* small fix

* small fix

* Fix Form

* Fixes

- fix timeline horizontal
- green to hack club theme green
- more horizontal margin on everything section
- attempt to fix testimonial grid

* center 7 (percentage)

* Fix testimonial grid layout

* Fix landing

* Fix horizontal scroll on mobile

* Fix styles on event card

* Decrease font size and padding

* Actually fix it this time

* Fix styles

* Responsiveness and mobile styling

* Slight styles changes

* Fix Margins

* Neutralize

Co-authored-by: Sam Poder <39828164+sampoder@users.noreply.github.com>
2021-08-22 14:05:22 +08:00

135 lines
4 KiB
JavaScript
Raw Permalink Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

export const dt = d => new Date(d).toLocaleDateString()
const year = new Date().getFullYear()
export const tinyDt = d => dt(d).replace(`/${year}`, '').replace(`${year}-`, '')
// based on https://github.com/withspectrum/spectrum/blob/alpha/src/helpers/utils.js#L146
export const timeSince = (
previous,
absoluteDuration = false,
longForm = false,
current = new Date()
) => {
const msPerMinute = 60 * 1000
const msPerHour = msPerMinute * 60
const msPerDay = msPerHour * 24
const msPerWeek = msPerDay * 7
const msPerMonth = msPerDay * 30 * 2
const msPerYear = msPerDay * 365
const elapsed = new Date(current) - new Date(previous)
let humanizedTime
if (elapsed < msPerMinute) {
humanizedTime = '< 1m'
} else if (elapsed < msPerHour) {
const now = Math.round(elapsed / msPerMinute)
humanizedTime = longForm ? `${now} minute${now > 1 ? 's' : ''}` : `${now}m`
} else if (elapsed < msPerDay) {
const now = Math.round(elapsed / msPerHour)
humanizedTime = longForm ? `${now} hour${now > 1 ? 's' : ''}` : `${now}h`
} else if (elapsed < msPerWeek) {
const now = Math.round(elapsed / msPerDay)
humanizedTime = longForm ? `${now} day${now > 1 ? 's' : ''}` : `${now}d`
} else if (elapsed < msPerMonth) {
const now = Math.round(elapsed / msPerWeek)
humanizedTime = longForm ? `${now} week${now > 1 ? 's' : ''}` : `${now}w`
} else if (elapsed < msPerYear) {
const now = Math.round(elapsed / msPerMonth)
humanizedTime = longForm ? `${now} month${now > 1 ? 's' : ''}` : `${now}mo`
} else {
const now = Math.round(elapsed / msPerYear)
humanizedTime = longForm ? `${now} year${now > 1 ? 's' : ''}` : `${now}y`
}
if (absoluteDuration) {
return humanizedTime
} else {
return elapsed > 0 ? `${humanizedTime} ago` : `in ${humanizedTime}`
}
}
// NOTE(@lachlanjc): I know this is bad, Im trying to get it out the door okay???
export const timeTo = (time, current = new Date(), longForm = true) => {
const msPerMinute = 60 * 1000
const msPerHour = msPerMinute * 60
const msPerDay = msPerHour * 64 // getting close to a day
const msPerYear = msPerDay * 365
const elapsed = new Date(time) - new Date(current)
let humanizedTime
if (elapsed < msPerMinute) {
humanizedTime = '< 1m'
} else if (elapsed < msPerHour) {
const now = Math.round(elapsed / msPerMinute)
humanizedTime = longForm ? `${now} more minutes` : `${now}m`
} else if (elapsed < msPerDay) {
const now = Math.round(elapsed / msPerHour)
humanizedTime = longForm ? `${now} more hours` : `${now}h`
} else if (elapsed < msPerYear) {
const now = Math.round(elapsed / msPerDay)
humanizedTime = longForm ? `${now} days` : `${now}d`
} else {
const now = Math.round(elapsed / msPerYear)
humanizedTime = longForm ? `${now} years` : `${now}y`
}
return humanizedTime
}
function formatChunk(type, date) {
const days = [
'Sunday',
'Monday',
'Tuesday',
'Wednesday',
'Thursday',
'Friday',
'Saturday'
]
const months = [
'January',
'Febuary',
'March',
'April',
'May',
'June',
'July',
'August',
'September',
'October',
'November',
'December'
]
switch (type) {
case 'dddd':
return days[date.getDay()]
case 'ddd':
return formatChunk('dddd', date).slice(0, 3)
case 'dd':
return ('00' + formatChunk('d', date)).slice(-2)
case 'd':
return date.getDate()
case 'mmmm':
return months[date.getMonth()]
case 'mmm':
return formatChunk('mmmm', date).slice(0, 3)
case 'mm':
return ('00' + formatChunk('m', date)).slice(-2)
case 'm':
return (date.getMonth() + 1).toString()
case 'yyyy':
return date.getFullYear().toString()
case 'yy':
return formatChunk('yyyy', date).slice(-2)
default:
return null
}
}
export const formatDate = (format, date, divider = ' ') => {
return format
.split(divider)
.map(chunk => formatChunk(chunk, new Date(date)))
.join(divider)
}