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>
);