Files
Reactive-Resume/src/templates/blocks/Hobbies/HobbiesA.js
Ryan Polley abd24e7eb7 Add ability to customize font size
Added an ability to customize font sizes. This is set at a new section in the settings.
The controler for this sets a number of css variables which are used in css rules that
override tailwind's text-<size> to use the font size and line spacing contained in the
variable. The control itself is a simple logarithmic slider that controls a "scale
factor" by which all the text sizes in a resume are scaled by.
2020-12-26 13:24:29 -06:00

23 lines
581 B
JavaScript

import React, { memo, useContext } from 'react';
import PageContext from '../../../contexts/PageContext';
import { safetyCheck } from '../../../utils';
const HobbyA = (x) => (
<div key={x.id}>
<h6 className="font-semibold text-sm">{x.name}</h6>
</div>
);
const HobbiesA = () => {
const { data, heading: Heading } = useContext(PageContext);
return safetyCheck(data.hobbies) ? (
<div>
<Heading>{data.hobbies.heading}</Heading>
<div className="grid gap-2">{data.hobbies.items.map(HobbyA)}</div>
</div>
) : null;
};
export default memo(HobbiesA);