Ryan/Reactive-Resume
1
0
Fork 0
mirror of https://github.com/AmruthPillai/Reactive-Resume.git synced 2025-11-15 17:21:35 +10:00
Code Issues Packages Projects Releases Wiki Activity

modify language tab to have both level and rating, update templates

Browse Source
This commit is contained in:
Amruth Pillai
2020-04-16 19:18:48 +05:30
parent b2659b6cba
commit 668424d9b5
8 changed files with 123 additions and 77 deletions
Download Patch File Download Diff File Expand all files Collapse all files

36
src/templates/castform/Castform.js
View File

@ -143,22 +143,28 @@ const Castform = () => {
const LanguageItem = x => (
<div key={x.id} className="flex flex-col my-2">
<h6 className="text-sm font-medium mb-1">{x.key}</h6>
<div className="relative h-5">
<div
className="absolute mb-1 inset-0"
style={{
backgroundColor: 'rgba(0, 0, 0, 0.25)',
}}
/>
<div
className="absolute mb-1 inset-0 rounded"
style={{
width: `${x.value * 20}%`,
backgroundColor: 'rgba(0, 0, 0, 0.3)',
}}
/>
<div className="flex justify-between items-center">
<h6 className="text-sm font-medium mb-1">{x.key}</h6>
{x.level !== '' && <div className="font-bold text-sm">{x.level}</div>}
</div>
{x.rating !== 0 && (
<div className="relative h-5">
<div
className="absolute mb-1 inset-0"
style={{
backgroundColor: 'rgba(0, 0, 0, 0.25)',
}}
/>
<div
className="absolute mb-1 inset-0 rounded"
style={{
width: `${x.rating * 20}%`,
backgroundColor: 'rgba(0, 0, 0, 0.3)',
}}
/>
</div>
)}
</div>
);

17
src/templates/celebi/Celebi.js
View File

@ -34,7 +34,7 @@ const Celebi = () => {
const Heading = ({ title, className }) => (
<h5
className={`my-2 text-lg uppercase font-semibold tracking-wider pb-1 border-b-2 border-gray-800 ${className}`}
className={`my-2 text-md uppercase font-semibold tracking-wider pb-1 border-b-2 border-gray-800 ${className}`}
>
{title}
</h5>
@ -177,11 +177,16 @@ const Celebi = () => {
<div key={x.id} className="grid grid-cols-2 items-center py-2">
<h6 className="text-xs font-medium text-left">{x.key}</h6>
<div className="flex">
{Array.from(Array(x.value)).map((_, i) => (
<i key={i} className="material-icons text-lg" style={{ color: theme.colors.accent }}>
star
</i>
))}
{x.level && <div className="font-bold text-sm mr-2">{x.level}</div>}
{x.rating !== 0 && (
<div className="flex">
{Array.from(Array(x.rating)).map((_, i) => (
<i key={i} className="material-icons text-lg" style={{ color: theme.colors.accent }}>
star
</i>
))}
</div>
)}
</div>
</div>
);

20
src/templates/gengar/Gengar.js
View File

@ -25,8 +25,9 @@ const Gengar = () => {
const FullName = () => (
<div>
<h1 className="text-2xl font-bold">{data.profile.firstName}</h1>
<h1 className="text-2xl font-bold">{data.profile.lastName}</h1>
<h1 className="text-2xl font-bold leading-tight">{data.profile.firstName}</h1>
<h1 className="text-2xl font-bold leading-tight">{data.profile.lastName}</h1>
<div className="text-xs font-medium mt-2">{data.profile.subtitle}</div>
</div>
);
@ -196,11 +197,16 @@ const Gengar = () => {
<div key={x.id} className="grid grid-cols-2 items-center py-2">
<h6 className="text-sm font-medium">{x.key}</h6>
<div className="flex">
{Array.from(Array(x.value)).map((_, i) => (
<i key={i} className="material-icons text-lg" style={{ color: theme.colors.accent }}>
star
</i>
))}
{x.level && <div className="font-bold text-sm mr-2">{x.level}</div>}
{x.rating !== 0 && (
<div className="flex">
{Array.from(Array(x.rating)).map((_, i) => (
<i key={i} className="material-icons text-lg" style={{ color: theme.colors.accent }}>
star
</i>
))}
</div>
)}
</div>
</div>
);

15
src/templates/glalie/Glalie.js
View File

@ -195,11 +195,16 @@ const Glalie = () => {
<div key={x.id} className="grid grid-cols-2 items-center py-2">
<h6 className="text-xs font-medium text-left">{x.key}</h6>
<div className="flex">
{Array.from(Array(x.value)).map((_, i) => (
<i key={i} className="material-icons text-lg" style={{ color: theme.colors.accent }}>
star
</i>
))}
{x.level && <div className="font-bold text-sm mr-2">{x.level}</div>}
{x.rating !== 0 && (
<div className="flex">
{Array.from(Array(x.rating)).map((_, i) => (
<i key={i} className="material-icons text-lg" style={{ color: theme.colors.accent }}>
star
</i>
))}
</div>
)}
</div>
</div>
);

16
src/templates/onyx/Onyx.js
View File

@ -171,11 +171,16 @@ const Onyx = () => {
<div key={x.id} className="grid grid-cols-2 items-center py-2">
<h6 className="text-sm font-medium">{x.key}</h6>
<div className="flex">
{Array.from(Array(x.value)).map((_, i) => (
<i key={i} className="material-icons text-lg" style={{ color: theme.colors.accent }}>
star
</i>
))}
{x.level && <div className="font-bold text-sm mr-2">{x.level}</div>}
{x.rating !== 0 && (
<div className="flex">
{Array.from(Array(x.rating)).map((_, i) => (
<i key={i} className="material-icons text-lg" style={{ color: theme.colors.accent }}>
star
</i>
))}
</div>
)}
</div>
</div>
);
@ -255,6 +260,7 @@ const Onyx = () => {
value={data.profile.email}
link={`mailto:${data.profile.email}`}
/>
<ContactItem icon="location_on" value={data.profile.address.line3} />
</div>
</div>

15
src/templates/pikachu/Pikachu.js
View File

@ -101,11 +101,16 @@ const Pikachu = () => {
<div key={x.id} className="grid grid-cols-2 items-center py-2">
<h6 className="text-sm font-medium">{x.key}</h6>
<div className="flex">
{Array.from(Array(x.value)).map((_, i) => (
<i key={i} className="material-icons text-lg" style={{ color: theme.colors.accent }}>
star
</i>
))}
{x.level && <div className="font-bold text-sm mr-2">{x.level}</div>}
{x.rating !== 0 && (
<div className="flex">
{Array.from(Array(x.rating)).map((_, i) => (
<i key={i} className="material-icons text-lg" style={{ color: theme.colors.accent }}>
star
</i>
))}
</div>
)}
</div>
</div>
);