Move comments from Compact to Modern.
This commit is contained in:
hacksalot
parent
fcf9716d57
commit
b57272ef4c
|
|
@ -1,129 +1,29 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
|
||||
<meta charset="utf-8">
|
||||
{{! <!--
|
||||
Set the document title to the candidate's name. We use RAW.name here,
|
||||
instead of r.name, because RAW gives us the text *as entered by the user*.
|
||||
The double bracket notation automatically encodes this value. If we wanted
|
||||
the unencoded raw value, we'd use triple brackets as in
|
||||
((( RAW.name ))).
|
||||
--> }}
|
||||
<title>{{ RAW.name }}</title>
|
||||
|
||||
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
|
||||
|
||||
{{! <!--
|
||||
Link in the resume's stylesheet. We could use a <link> tag here as above,
|
||||
or dump the styles into <style></style>, but there's a handy helper
|
||||
available that allows us to do either, conditionally.
|
||||
--> }}
|
||||
|
||||
{{{styleSheet "html.css"}}}
|
||||
|
||||
{{! <!--
|
||||
If the user passes "css embed" via the command line, any styles present
|
||||
in "html.css" will be embedded into the document via the <style></style>
|
||||
tag. OTOH, if the user passes "css link" via the command line, then
|
||||
"html.css" will be referenced via a standard <link> tag. If no "css"
|
||||
parameter is given, HackMyResume defaults to CSS embedding via <style>,
|
||||
because even if it's not as "correct" as <link>, it helps produce a more
|
||||
"standalone" resume with fewer external dependencies.
|
||||
-->}}
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<main>
|
||||
<header>
|
||||
|
||||
{{! <!--
|
||||
Display the candidate's name using "r" (the FRESH or JSON Resume
|
||||
object). Keep in mind that "r" contains the MARKDOWNIFIED version
|
||||
of the text in the user's FRESH or JRS resume because FRESH resume
|
||||
themes support Markdown natively. If you want the un-Markdownified
|
||||
text, you'd use RAW.
|
||||
--> }}
|
||||
|
||||
<h1>{{{ r.name }}}</h1>
|
||||
|
||||
|
||||
{{! <!--
|
||||
Give some basic contact info. Here, the HAS helper is similar
|
||||
to a normal IF, but provides a guaranteed-to-be-safe check against a
|
||||
particular object path. That is, ((#if contact.email)) can error out
|
||||
(throw an exception) if contact is null, depending on Handlebars
|
||||
engine settings, but ((#has 'contact.email')) never will.
|
||||
--> }}
|
||||
<div id="contact">
|
||||
{{#has 'contact.email'}}<div class="email"><a href="mailto:{{{ RAW.contact.email }}}">{{ RAW.contact.email }}</a></div>{{/has}}
|
||||
{{#has 'contact.phone'}}<div class="phone">{{ RAW.contact.phone }}</div>{{/has}}
|
||||
{{#has 'contact.website'}}<div class="website"><a href="{{{ RAW.contact.website }}}">{{trimURL RAW.contact.website }}</a></div>{{/has}}
|
||||
</div>
|
||||
|
||||
</header>
|
||||
|
||||
{{!<!--
|
||||
Now let's emit the candidate's summary, which is stored in r.info.brief.
|
||||
Again we'll use the ((#has)) helper to make sure the candidate HAS a
|
||||
summary, and if so, we'll render an HTML 5 section element containing
|
||||
the Markdownified HTML version of it.
|
||||
|
||||
INLINE TEMPLATE DEFINITIONS
|
||||
|
||||
-->}}
|
||||
|
||||
{{#has "info.brief"}}
|
||||
<section id="summary">
|
||||
|
||||
{{!<!--
|
||||
Note the use of triple brackets to tell Handlebars not to further encode
|
||||
the value. The value in r.info.brief has already been encoded (when it was
|
||||
converted to HTML) so there's no need to encode it further.
|
||||
-->}}
|
||||
{{{ r.info.brief }}}
|
||||
|
||||
</section>
|
||||
{{/has}}
|
||||
|
||||
|
||||
|
||||
{{! <!--
|
||||
Okay, let's set up a SKILLS section, front and center.
|
||||
|
||||
We could do this manually with custom HTML, but let's take advantage of
|
||||
some predefined partials instead. FRESH provides global partials for all
|
||||
resume sections (employment, skills, education, speaking, etc.). They're
|
||||
named like this:
|
||||
|
||||
section/skills
|
||||
section/employment
|
||||
section/service
|
||||
section/recognition
|
||||
etc..
|
||||
|
||||
So what we want to do is inject the "section/skills" global partial
|
||||
and use it here in our theme. We can do that simply with:
|
||||
|
||||
((> section/skills ))
|
||||
|
||||
However, in this case we also want to override the heading icon used
|
||||
in the global partial. So we also declare what's known as an INLINE
|
||||
PARTIAL, using ((#*inline "icon-skills")), and set its content to the
|
||||
icon we'd like to display for the SKILLS section. The global partial
|
||||
will reference this template by name, so it allows us to selectively
|
||||
override that part of the global partial.
|
||||
--> }}
|
||||
|
||||
{{#*inline "icon-skills"}}<span class="fa fa-lg fa-code"></span>{{/inline}}
|
||||
{{> section/skills _icon="icon-skills"}}
|
||||
|
||||
{{! <!--
|
||||
We'll override all section heading icons the same way, for the rest of the
|
||||
resume, using the same inline template technique. Keep in mind that these
|
||||
inline templates do not, by themselves, create any markup. They emit markup
|
||||
only when referenced by another template. Which template? In this case, the
|
||||
global partial for each section. Defined elsewhere.
|
||||
--> }}
|
||||
|
||||
{{#*inline "icon-employment"}}<span class="fa fa-building"></span>{{/inline}}
|
||||
{{#*inline "icon-projects"}}<span class="fa fa-star"></span>{{/inline}}
|
||||
{{#*inline "icon-education"}}<span class="fa fa-mortar-board"></span>{{/inline}}
|
||||
|
|
@ -135,24 +35,6 @@
|
|||
{{#*inline "icon-testimonials"}}<span class="fa fa-thumbs-o-up"></span>{{/inline}}
|
||||
{{#*inline "icon-references"}}<span class="fa fa-thumbs-o-up"></span>{{/inline}}
|
||||
|
||||
{{! <!--
|
||||
|
||||
Now let's set up the EMPLOYMENT section. Similar to the SKILLS section above,
|
||||
we'll use a global partial. But for the Compact theme, we want a bit different
|
||||
structure than the default section/employment partial gives us, so we'll
|
||||
need to cut a little deeper with our partial overriding strategy. Each
|
||||
predefined section partial references (and provides a default value for)
|
||||
a "body-[sectionName]" partial. For the employment section, it's called
|
||||
"body-employment". To override it, all we have to do is declare it inline.
|
||||
|
||||
Again, this does not actually render any markup. This declares a template
|
||||
that can be referenced somewhere else to render markup. We are just
|
||||
overriding the global section partial's idea of what the "body-employment"
|
||||
fragment should look like.
|
||||
|
||||
--> }}
|
||||
|
||||
|
||||
{{#*inline "body-employment" }}
|
||||
<div>
|
||||
<h3><em>{{ position }}</em>,
|
||||
|
|
@ -171,13 +53,6 @@
|
|||
</div>
|
||||
{{/inline}}
|
||||
|
||||
{{> section/employment _icon="icon-employment"}}
|
||||
|
||||
|
||||
{{! <!--
|
||||
Handle the PROJECTS section the same way.
|
||||
--> }}
|
||||
|
||||
{{#*inline "body-projects" }}
|
||||
<div>
|
||||
<h3><em>{{ role }}</em>,
|
||||
|
|
@ -196,13 +71,21 @@
|
|||
</div>
|
||||
{{/inline}}
|
||||
|
||||
{{!<!--
|
||||
|
||||
RESUME SECTIONS
|
||||
|
||||
-->}}
|
||||
|
||||
{{#has "info.brief"}}
|
||||
<section id="summary">
|
||||
{{{ r.info.brief }}}
|
||||
</section>
|
||||
{{/has}}
|
||||
|
||||
{{> section/skills _icon="icon-skills"}}
|
||||
{{> section/employment _icon="icon-employment"}}
|
||||
{{> section/projects _icon="icon-projects"}}
|
||||
|
||||
{{! <!--
|
||||
For the rest of the resume, use the predefined global partials as-is, and
|
||||
we're done.
|
||||
--> }}
|
||||
|
||||
{{> section/education _icon="icon-education"}}
|
||||
{{> section/service _icon="icon-service"}}
|
||||
{{> section/samples _icon="icon-samples"}}
|
||||
|
|
|
|||
|
|
@ -2,16 +2,58 @@
|
|||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>{{ r.name }}</title>
|
||||
{{! <!--
|
||||
Set the document title to the candidate's name. We use RAW.name here,
|
||||
instead of r.name, because RAW gives us the text *as entered by the user*.
|
||||
The double bracket notation automatically encodes this value. If we wanted
|
||||
the unencoded raw value, we'd use triple brackets as in
|
||||
((( RAW.name ))).
|
||||
--> }}
|
||||
<title>{{ RAW.name }}</title>
|
||||
<link href='https://fonts.googleapis.com/css?family=Open+Sans:400,300,300italic,400italic,600,600italic,700,700italic' rel='stylesheet' type='text/css'>
|
||||
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
|
||||
|
||||
{{! <!--
|
||||
Link in the resume's stylesheet. We could use a <link> tag here as above,
|
||||
or dump the styles into <style></style>, but there's a handy helper
|
||||
available that allows us to do either, conditionally.
|
||||
--> }}
|
||||
|
||||
{{{styleSheet "modern-html.css"}}}
|
||||
|
||||
{{! <!--
|
||||
If the user passes "css embed" via the command line, any styles present
|
||||
in "html.css" will be embedded into the document via the <style></style>
|
||||
tag. OTOH, if the user passes "css link" via the command line, then
|
||||
"html.css" will be referenced via a standard <link> tag. If no "css"
|
||||
parameter is given, HackMyResume defaults to CSS embedding via <style>,
|
||||
because even if it's not as "correct" as <link>, it helps produce a more
|
||||
"standalone" resume with fewer external dependencies.
|
||||
-->}}
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<main id="main">
|
||||
<div id="container">
|
||||
<header>
|
||||
|
||||
{{! <!--
|
||||
Display the candidate's name using "r" (the FRESH or JSON Resume
|
||||
object). Keep in mind that "r" contains the MARKDOWNIFIED version
|
||||
of the text in the user's FRESH or JRS resume because FRESH resume
|
||||
themes support Markdown natively. If you want the un-Markdownified
|
||||
text, you'd use RAW instead.
|
||||
--> }}
|
||||
|
||||
<h1>{{{ r.name }}}</h1>
|
||||
|
||||
{{! <!--
|
||||
Give some basic contact info. Here, the HAS helper is similar
|
||||
to a normal IF, but provides a guaranteed-to-be-safe check against a
|
||||
particular object path. That is, ((#if contact.email)) can error out
|
||||
(throw an exception) if contact is null, depending on Handlebars
|
||||
engine settings, but ((#has 'contact.email')) never will.
|
||||
--> }}
|
||||
<div id="contact">
|
||||
{{#has r.contact.email}}<div class="email"><a href="mailto:{{{ RAW.contact.email }}}">{{ RAW.contact.email }}</a></div>{{/has}}
|
||||
{{#has r.contact.phone}}<div class="phone">{{ RAW.contact.phone }}</div>{{/has}}
|
||||
|
|
@ -20,16 +62,50 @@
|
|||
</header>
|
||||
|
||||
|
||||
{{#if r.info.brief}}
|
||||
{{!<!--
|
||||
Now let's emit the candidate's summary, which is stored in r.info.brief.
|
||||
Again we'll use the ((#has)) helper to make sure the candidate HAS a
|
||||
summary, and if so, we'll render an HTML 5 section element containing
|
||||
the Markdownified HTML version of it.
|
||||
-->}}
|
||||
|
||||
{{#has 'info.brief'}}
|
||||
<hr>
|
||||
<section id="summary">
|
||||
|
||||
{{!<!--
|
||||
Here we're rendering the title of the summary section, but we don't want
|
||||
to hard code it to "About" or "Summary" because FRESH themes should not
|
||||
assume English. The "sectionTitle" helper allows us to emit an English
|
||||
section title of "About" by default, but provides a hook by which users
|
||||
can override this section title if they want.
|
||||
TL;DR Never write section titles explicitly. Always use the helper.
|
||||
-->}}
|
||||
|
||||
<h2>{{{sectionTitle "info" "About"}}}</h2>
|
||||
<span class="fa fa-lg fa-user"></span>
|
||||
|
||||
{{!<!--
|
||||
Emit the actual summary here.
|
||||
Note the use of triple brackets to tell Handlebars not to further encode
|
||||
the value. The value in r.info.brief has already been encoded (when it was
|
||||
converted to HTML) so there's no need to encode it further.
|
||||
-->}}
|
||||
|
||||
{{{ r.info.brief }}}
|
||||
</section>
|
||||
{{/if}}
|
||||
{{/has}}
|
||||
|
||||
{{!<!-- A custom skills section with colored skill bars. -->}}
|
||||
{{! <!--
|
||||
Okay, let's create a custom SKILLS section with colored skill bars.
|
||||
|
||||
Since this is an official resume section, we want to wrap it in the
|
||||
"section" block helper. This allows the section to be selectively
|
||||
omitted from the resume if either a) the section is empty or b) the user
|
||||
tells us to hide it.
|
||||
|
||||
Always wrap your sections with the "section"!
|
||||
--> }}
|
||||
|
||||
{{#section 'skills' }}
|
||||
<hr>
|
||||
|
|
@ -60,6 +136,32 @@
|
|||
</section>
|
||||
{{/section}}
|
||||
|
||||
{{! <!--
|
||||
Now let's render the EMPLOYMENT section.
|
||||
|
||||
We could do this manually with custom HTML, like we did with the SKILLS
|
||||
section, but let's take advantage of some predefined partials instead.
|
||||
FRESH provides global partials for all resume sections (employment, skills,
|
||||
education, speaking, etc.). They're named like this:
|
||||
|
||||
section/skills
|
||||
section/employment
|
||||
section/service
|
||||
section/recognition
|
||||
etc..
|
||||
|
||||
So what we want to do is inject the "section/skills" global partial
|
||||
and use it here in our theme. We can do that simply with:
|
||||
|
||||
((> section/skills ))
|
||||
|
||||
However, in this case we also want to override the heading icon used
|
||||
in the global partial. So we also declare what's known as an INLINE
|
||||
PARTIAL, using ((#*inline "icon-skills")), and set its content to the
|
||||
icon we'd like to display for the SKILLS section. The global partial
|
||||
will reference this template by name, so it allows us to selectively
|
||||
override that part of the global partial.
|
||||
--> }}
|
||||
|
||||
{{#*inline "icon-employment"}}<span class="fa fa-lg fa-building"></span>{{/inline}}
|
||||
|
||||
|
|
@ -83,6 +185,10 @@
|
|||
|
||||
{{> section/employment _icon="icon-employment"}}
|
||||
|
||||
{{! <!--
|
||||
Do the same thing (roughly) with the PROJECT section.
|
||||
--> }}
|
||||
|
||||
{{#*inline "body-projects" }}
|
||||
<div>
|
||||
<h3>{{#if role}}<em>{{camelCase role }}</em>,{{/if}}
|
||||
|
|
@ -105,28 +211,37 @@
|
|||
|
||||
{{> section/projects _icon="icon-projects"}}
|
||||
|
||||
|
||||
{{! <!--
|
||||
We'll override all section heading icons the same way, for the rest of the
|
||||
resume, using the same inline template technique. Keep in mind that these
|
||||
inline templates do not, by themselves, create any markup. They emit markup
|
||||
only when referenced by another template. Which template? In this case, the
|
||||
global partial for each section.
|
||||
--> }}
|
||||
|
||||
{{#*inline "icon-education"}}<span class="fa fa-lg fa-mortar-board"></span>{{/inline}}
|
||||
{{> section/education _icon="icon-education"}}
|
||||
|
||||
{{#*inline "icon-service"}}<span class="fa fa-lg fa-child"></span>{{/inline}}
|
||||
{{> section/service _icon="icon-service"}}
|
||||
|
||||
{{#*inline "icon-samples"}}<span class="fa fa-lg fa-share"></span>{{/inline}}
|
||||
{{> section/samples _icon="icon-samples"}}
|
||||
|
||||
{{#*inline "icon-writing"}}<span class="fa fa-lg fa-pencil"></span>{{/inline}}
|
||||
{{> section/writing _icon="icon-writing"}}
|
||||
|
||||
{{#*inline "icon-recognition"}}<span class="fa fa-lg fa-trophy"></span>{{/inline}}
|
||||
{{> section/recognition _icon="icon-recognition"}}
|
||||
|
||||
{{#*inline "icon-speaking"}}<span class="fa fa-lg fa-users"></span>{{/inline}}
|
||||
{{> section/speaking _icon="icon-speaking"}}
|
||||
|
||||
{{#*inline "icon-testimonials"}}<span class="fa fa-lg fa-thumbs-o-up"></span>{{/inline}}
|
||||
{{> section/testimonials _icon="icon-testimonials"}}
|
||||
|
||||
{{#*inline "icon-references"}}<span class="fa fa-lg fa-thumbs-o-up"></span>{{/inline}}
|
||||
|
||||
{{! <!--
|
||||
Use the predefined global partials for the rest of the resume sections as-is.
|
||||
Note: we can still customize the style of these via CSS. But we'll use the
|
||||
default markup.
|
||||
--> }}
|
||||
|
||||
{{> section/education _icon="icon-education"}}
|
||||
{{> section/service _icon="icon-service"}}
|
||||
{{> section/samples _icon="icon-samples"}}
|
||||
{{> section/writing _icon="icon-writing"}}
|
||||
{{> section/recognition _icon="icon-recognition"}}
|
||||
{{> section/speaking _icon="icon-speaking"}}
|
||||
{{> section/testimonials _icon="icon-testimonials"}}
|
||||
{{> section/references _icon="icon-references"}}
|
||||
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Reference in New Issue