JuanCanham/fresh-themes
1
0
Fork 0
mirror of https://github.com/JuanCanham/fresh-themes.git synced 2024-11-25 09:30:10 +00:00
Code Issues Releases Wiki Activity

Move comments from Compact to Modern.

Browse Source
This commit is contained in:
hacksalot 2016-01-12 22:13:33 -05:00
parent fcf9716d57
commit b57272ef4c
2 changed files with 150 additions and 152 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

151
themes/compact/src/compact-html.html
View File

@ -1,129 +1,29 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head> <head>
<meta charset="utf-8"> <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> <title>{{ RAW.name }}</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.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 "html.css"}}} {{{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> </head>
<body> <body>
<main> <main>
<header> <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> <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"> <div id="contact">
{{#has 'contact.email'}}<div class="email"><a href="mailto:{{{ RAW.contact.email }}}">{{ RAW.contact.email }}</a></div>{{/has}} {{#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.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}} {{#has 'contact.website'}}<div class="website"><a href="{{{ RAW.contact.website }}}">{{trimURL RAW.contact.website }}</a></div>{{/has}}
</div> </div>
</header> </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 INLINE TEMPLATE DEFINITIONS
summary, and if so, we'll render an HTML 5 section element containing
the Markdownified HTML version of it.
-->}} -->}}
{{#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}} {{#*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-employment"}}<span class="fa fa-building"></span>{{/inline}}
{{#*inline "icon-projects"}}<span class="fa fa-star"></span>{{/inline}} {{#*inline "icon-projects"}}<span class="fa fa-star"></span>{{/inline}}
{{#*inline "icon-education"}}<span class="fa fa-mortar-board"></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-testimonials"}}<span class="fa fa-thumbs-o-up"></span>{{/inline}}
{{#*inline "icon-references"}}<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" }} {{#*inline "body-employment" }}
<div> <div>
<h3><em>{{ position }}</em>, <h3><em>{{ position }}</em>,
@ -171,13 +53,6 @@
</div> </div>
{{/inline}} {{/inline}}
{{> section/employment _icon="icon-employment"}}
{{! <!--
Handle the PROJECTS section the same way.
--> }}
{{#*inline "body-projects" }} {{#*inline "body-projects" }}
<div> <div>
<h3><em>{{ role }}</em>, <h3><em>{{ role }}</em>,
@ -196,13 +71,21 @@
</div> </div>
{{/inline}} {{/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"}} {{> 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/education _icon="icon-education"}}
{{> section/service _icon="icon-service"}} {{> section/service _icon="icon-service"}}
{{> section/samples _icon="icon-samples"}} {{> section/samples _icon="icon-samples"}}

151
themes/modern/src/modern-html.html
View File

@ -2,16 +2,58 @@
<html> <html>
<head> <head>
<meta charset="utf-8"> <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 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 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"}}} {{{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> </head>
<body> <body>
<main id="main"> <main id="main">
<div id="container"> <div id="container">
<header> <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> <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"> <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.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}} {{#has r.contact.phone}}<div class="phone">{{ RAW.contact.phone }}</div>{{/has}}
@ -20,16 +62,50 @@
</header> </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> <hr>
<section id="summary"> <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> <h2>{{{sectionTitle "info" "About"}}}</h2>
<span class="fa fa-lg fa-user"></span> <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 }}} {{{ r.info.brief }}}
</section> </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' }} {{#section 'skills' }}
<hr> <hr>
@ -60,6 +136,32 @@
</section> </section>
{{/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}} {{#*inline "icon-employment"}}<span class="fa fa-lg fa-building"></span>{{/inline}}
@ -83,6 +185,10 @@
{{> section/employment _icon="icon-employment"}} {{> section/employment _icon="icon-employment"}}
{{! <!--
Do the same thing (roughly) with the PROJECT section.
--> }}
{{#*inline "body-projects" }} {{#*inline "body-projects" }}
<div> <div>
<h3>{{#if role}}<em>{{camelCase role }}</em>,{{/if}} <h3>{{#if role}}<em>{{camelCase role }}</em>,{{/if}}
@ -105,28 +211,37 @@
{{> section/projects _icon="icon-projects"}} {{> 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}} {{#*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}} {{#*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}} {{#*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}} {{#*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}} {{#*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}} {{#*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}} {{#*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}} {{#*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"}} {{> section/references _icon="icon-references"}}
</div> </div>