feat(image): render image as profile picture

This commit is contained in:
Rafael Bardini 2021-06-20 16:23:55 +02:00
parent 09cec3e04f
commit 16e8bc28b1
4 changed files with 22 additions and 1 deletions

View File

@ -1,4 +1,7 @@
<header class="masthead"> <header class="masthead">
{{#image}}
<img src="{{.}}" alt="">
{{/image}}
<div> <div>
{{#name}} {{#name}}
<h1>{{.}}</h1> <h1>{{.}}</h1>

View File

@ -161,6 +161,13 @@ section {
grid-column: main; grid-column: main;
} }
.masthead > img {
border-radius: 50%;
grid-column: side;
grid-row: span 2;
max-width: 100%;
}
article > * + *, article > * + *,
blockquote > * + * { blockquote > * + * {
margin-top: 0.6em; margin-top: 0.6em;

View File

@ -177,6 +177,13 @@ section {
grid-column: main; grid-column: main;
} }
.masthead > img {
border-radius: 50%;
grid-column: side;
grid-row: span 2;
max-width: 100%;
}
article > * + *, article > * + *,
blockquote > * + * { blockquote > * + * {
margin-top: 0.6em; margin-top: 0.6em;
@ -251,6 +258,7 @@ blockquote > * + * {
</head> </head>
<body> <body>
<header class="masthead"> <header class="masthead">
<img src="image.jpg" alt="">
<div> <div>
<h1>Richard Hendriks</h1> <h1>Richard Hendriks</h1>
<h2>Programmer</h2> <h2>Programmer</h2>

View File

@ -4,6 +4,9 @@ const { HtmlValidate } = require('html-validate')
const { render } = require('..') const { render } = require('..')
const resume = require('resume-schema/sample.resume.json') const resume = require('resume-schema/sample.resume.json')
// Overwrite empty sample resume values
resume.basics.image = 'image.jpg'
test('renders a resume', t => { test('renders a resume', t => {
t.matchSnapshot(render(resume)) t.matchSnapshot(render(resume))
t.end() t.end()
@ -19,6 +22,6 @@ test('renders valid HTML', t => {
results: [{ messages } = {}], results: [{ messages } = {}],
} = htmlvalidate.validateString(render(resume)) } = htmlvalidate.validateString(render(resume))
t.is(messages, undefined) t.equal(messages, undefined)
t.end() t.end()
}) })