mudassir0909 / jsonresume-theme-elegant Goto Github PK
View Code? Open in Web Editor NEWElegant theme for jsonresume
Elegant theme for jsonresume
Hello!
I've tried to add telegram support myself, but stuck with icomoon changes. Could you please update the theme to support it?
Here is my patch on everything except icomoon:
diff --git a/README.md b/README.md
index af57570..a3f584f 100644
--- a/README.md
+++ b/README.md
@@ -27,6 +27,7 @@ The profiles are shown in the order in which they are specified in the `basics.p
* googleplus
* gratipay
* hackernews
+* telegram
* lastfm
* linkedin
* pinterest
diff --git a/assets/css/theme.css b/assets/css/theme.css
index 9a17a57..e30e451 100644
--- a/assets/css/theme.css
+++ b/assets/css/theme.css
@@ -55,6 +55,9 @@
.icon-linkedin:before {
content: "\f08c";
}
+.icon-telegram:before {
+ content: "\f2c6";
+}
.icon-twitter:before {
content: "\f099";
}
@@ -630,6 +633,14 @@ body {
text-decoration: none;
color: #005983;
}
+.link-telegram {
+ color: #0088cc;
+}
+.link-telegram:hover,
+.link-telegram:focus {
+ text-decoration: none;
+ color: #007cba;
+}
.link-skype {
color: #12a5f4;
}
diff --git a/assets/less/info_card_styles.less b/assets/less/info_card_styles.less
index 10378c9..2b9e922 100644
--- a/assets/less/info_card_styles.less
+++ b/assets/less/info_card_styles.less
@@ -91,6 +91,7 @@
.link-twitter { .make-social-link(@twitter-color); }
.link-blog { .make-social-link(@rss-feed-color); }
.link-linkedin { .make-social-link(@linkedin-color); }
+.link-telegram { .make-social-link(@telegram-color); }
.link-skype { .make-social-link(@skype-color); }
.link-instagram { .make-social-link(@instagram-color); }
.link-stackoverflow { .make-social-link(@stackoverflow-color); }
diff --git a/assets/less/variables.less b/assets/less/variables.less
index cf05176..0171794 100644
--- a/assets/less/variables.less
+++ b/assets/less/variables.less
@@ -18,6 +18,7 @@
// Social variables;
@github-color: #454545;
+@telegram-color: #0088cc;
@twitter-color: #33ccff;
@soundcloud-color: rgb(232, 130, 45);
@rss-feed-color: #f36f24;
Is there a way to use external fonts? I want to use this theme hosted on github pages, but it uses local fonts that I don't have. Maybe using external urls for fonts would be better for these cases.
Thanks.
Have you planned to add i18n to this theme?
Please implement support for picture as in the new standard and serve it
There's a highlights field under work[0].highlights[0]
- I would like for it to support markdown, as I wanted to paste URLs to my work projects there
As exercism.io might contain some code snippets it would be cool to add it. An icon can be found here:
http://exercism.io/icons/logo.svg
http://exercism.io/img/e_red_small.png
Thanks for this nice resume theme ๐
Is there a way to provide links to your projects (in my case iTunes Connect links) somewhere in the job section?
Currently all the text is provided as is, so the links pasted are just there, not clickable. There's also no way to do a <a>
tag injection.
Is this something that should be considered at the jsonresume schema or do you have any idea how to accomplish this?
Looks like a recent commit removed a css style for .skill-info
.
After playing with it in Chrome, the removed 10px seems to be a bit too close...
.skill-info { margin-left: 1em; }
or
.skill-info { margin-left: 16px; }
seems like they would work.
When using this theme with my resume.json file I noticed that sections like "Awards" were not rendered, which was what I expected since the awards array in my resume.json file was empty.
What I did not expect was that the floating-nav still showed an entry for the non existing section.
Please don't get me wrong. I do not say this is an error.
If I just remove the awards array entirely form the json file, there is still no awards section, but following that there is also no awards item in the floating-nav.
This means I could just remove empty arrays from the json file and move along.
I can not tell whether having an empty awards array in the json file is right or wrong, because resume test
validates the json file both with an empty awards array and without an awards array.
I had a look at your code and figured out that the interpolate function used by the getFloatingNavItems function in index.js is what causes the floating-nav to show items for non existing sections. I tried messing around with it to make it drop the floating-nav items not only when the array is missing but also in case the array is actually in the json file, but empty.
However I failed and I have to admit that I do not understand how this interpolate function actually works with the _.reduce function to achieve what it does.
If you could explain to me how your interpolate function in index.js works please?
That would be very kind =)
Thanks in advance for your reply.
markdown links ending with ")" are not correctly converted.
Such links are often encountered in wikipedia.
The bug comes from marked (markedjs/marked#619) and it appears that it won't be fixed.
It's maybe time to switch the markdown renderer... (see #73).
level
keyword to display a horizontal / vertical / circular progress bar.level
keywords
span across multiple lines.keywords
for a given skillset. Culprit --> label-info
Hello, Mudassir!
I am having a problem with this awesome theme, when I do generate my resume with command hackmyresume BUILD resume.json TO ../public/cv/elegant.html -t jsonresume-theme-elegant
, I've got profile picture generated improperly. Here is related resume.json part:
{
"basics": {
"picture": "https://www.gravatar.com/avatar/8b2d47d99e6af64b89e6a0721e3485eb?s=200"
}
}
Here is expected result:
<...> src="https://www.gravatar.com/avatar/8b2d47d99e6af64b89e6a0721e3485eb?s=200" itemprop="image"<...>
Here is what theme generates for me:
<...> src="<a href="https://www.gravatar.com/avatar/8b2d47d99e6af64b89e6a0721e3485eb?s=200">https://www.gravatar.com/avatar/8b2d47d99e6af64b89e6a0721e3485eb?s=200</a>" itemprop="image"<...>
What is happening is on some stage link is converted to a href
and included like that into src
property of the image. I'll be glad to give you my environment information, but please tell me which will be relevant there.
My setup:
Was looking at themes and checked out elegant
, loving it so far! When your ready, ping me and I will throw it on the homepage.
Hi! I'm getting following messages on installing of the theme dependencies:
# npm install
npm WARN deprecated [email protected]: Jade has been renamed to pug, please install the latest version of pug instead of jade
npm WARN deprecated [email protected]: Deprecated, use jstransformer
npm WARN deprecated [email protected]: Please update to minimatch 3.0.2 or higher to avoid a RegExp DoS issue
npm WARN deprecated [email protected]: Please update to minimatch 3.0.2 or higher to avoid a RegExp DoS issue
npm WARN deprecated [email protected]: graceful-fs v3.0.0 and before will fail on node releases >= v7.0. Please update to graceful-fs@^4.0.0 as soon as possible. Use 'npm ls graceful-fs' to find it in the tree.
npm WARN deprecated [email protected]: use uuid module instead
I guess it should be fixed.
Right now I use the monotonous card view for Interests section as well, but really need to think of a better way to present this section.
Also sometimes people just enter the interest without any keywords, gracefully degrade to a better view.
It appears that wikipedia links are not correctly rendered.
"[jenkins](https://fr.wikipedia.org/wiki/Jenkins_(logiciel))"
is rendered as
<span class="label label-keyword"><a href="https://fr.wikipedia.org/wiki/Jenkins_(logiciel">jenkins</a>)</span>
.
It looks bad and the link is wrong (hence leading to a 404 error).
When I debug markdown-it
standalone (v7.0.1), it works:
>node
> var markdown = require('markdown-it')({
... breaks: true
... })
> markdown.render("[jenkins](https://fr.wikipedia.org/wiki/Jenkins_(logiciel))")
'<p><a href="https://fr.wikipedia.org/wiki/Jenkins_(logiciel)">jenkins</a></p>\n'
You should maybe switch to a more recent version of markdown-it in your package.json
. Maybe markdown-it v7 fixes this bug.
When having items without end date, for example for your current job, omitting the attribute endDate
leads to the word Present
being displayed instead and this is perfectly fine.
However you do also display the duration between start and end date. This calculation happens at build time using the system time at the time of build and thus will always be wrong eventually.
Take my CV for example. Although start date for my current job is January 2016, it displays a duration of 5 instead of 9 months, simply because of the fact that I last updated my CV back in June.
Maybe adding a script tag inside the generated html that takes care to calculate the duration for this cases based on the viewer's current system time very much like the calculation performed during the generation of the html could solve this problem?
The Gravatar images that are being brought in from Gravatar appear to be 80px, maybe 64px at one point in the past, but also want to be 100px. The result is that a smaller picture is being used and and appears pixelated against an otherwise really crisp page.
Hi, I like this theme and use on my resume.
But when I try to add blogger icon, I can't setting Encode & Embed Font in CSS on IcoMoon (it's premium)
So I open this issue, thank you!
Is the latest version working? http://themes.jsonresume.org/theme/elegant
Right now we are inlining using base64 content, we can use npmcdn to serve them instead
Congratulations! Will make the announcement public today or tomorrow, in the mean time could you shoot me through your preferred payment method to [email protected] (paypal will probably be easiest)
Current theme version is v1.1.7(Do you see the 7??) !
I have my picture configured as:
"picture": "https://www.gravatar.com/avatar/01667e959f76bdd16a1930a67f393a51",
Everything else is generated fine, but I end up with the following displayed instead of an image:
https://www.gravatar.com/avatar/01667e959f76bdd16a1930a67f393a51?s=100&r=pg&d=mm" itemprop="image" class="media-object img-circle center-block"/>
Font is not support Turkish Character. Can you change this font for Turkish character or improve it ?
How is calculated a duration between a startDate and an endDate?
When I use this json:
"startDate": "1999-09-01",
"endDate": "2000-03-01",
I get the following result in my resume:
Sep, 1999 - Mar, 2000 5 months
It should be 6 or 7 months, depending on how the duration is calculated, but not 5 months !
TypeError: undefined is not a function
at /root/theme-manager/themes/jsonresume-theme-elegant/0.5.9/index.js:85:62
at Function..each..forEach (/root/theme-manager/themes/jsonresume-theme-elegant/0.5.9/node_modules/underscore/underscore.js:103:9)
at Object.render (/root/theme-manager/themes/jsonresume-theme-elegant/0.5.9/index.js:69:7)
at runTheme (/root/theme-manager/lib/theme.js:23:24)
at /root/theme-manager/lib/theme.js:105:13
at Object.cb as oncomplete
Correction - it seems only when the startDate
is missing is the exception thrown.
Not sure where the current Spotify profile URL came from - perhaps it was valid in the past. The correct profile URL should reference the play
or open
subdomain like so:
https://open.spotify.com/user/artinreality
(See: https://twitter.com/nicklas2k/status/330112083964342273)
I'm sending a pull request updating the URL in one minute.
The card on the left hides on resizing the screen, rest is good I suppose
markdown has been recently added as a new feature of this theme, it works well and is a pleasure to use.
Unfortunately, the markdown parser does not support the abbr, which identified as a bug in marked: markedjs/marked#27
The issue suggest to use another markdown parser known as markdown-it: markdown-it.
I let you decide what to do.
I like using this theme (big thanks!), but would much appreciate a profile for meetup.com member pages like this one as well: http://www.meetup.com/members/75934402/ I'm not sure the code is as modular that making such contributions would be an easy thing to do (or is it?).
When I try to put "\n"
in the JSON strings, it gets ignored by the template. It probably should transform newlines into <br>
tags. As currently it probably adds new lines to the HTML, which doesn't affect line breaks.
Hello, @mudassir0909!
I generate pdf version of resume using xvfb-run wkhtmltopdf elegant.html elegant.pdf
and it looks pretty solid, however there is some room for improvement. I guess, you could see everything I'm mentioning by resizing browser window to some particular size which "wkhtmltopdf" use by default.
Refer: http://150.107.225.81:8888/#work-experience
From 1st April to 30 Nov its 8 Months not 7 Months
1. April
2. May
3.June
4.July
5.Aug
6.Sep
7.Oct
8.Nov
Great theme. Please consider including Flickr in the supported social profiles. I believe iconmoon has four font glyphs for Flickr. Thanks!
Tweak styles so that theme looks good when exported to pdf.
Use @media print
Issues to tackle:
a
tagsRest all is good I suppose
Presently Medium.com isn't supported as one of the profiles. Not sure where this support should be added, but it'd be nice to have!
If you can list the files which need to be modified or the best path forward, I'd be happy to help!
Linked skills styling is not very easy to read: it is in blue on a light blue background. When hovered, it became dark blue on a light blue background and underlined. Both are not very easy to read.
In my opinion, the linked styling should follow the unlinked styling: in white on a light blue background, underlined when hovered.
Linked or not the styling with a border looks like a button, and hence is intuitively clickable.
Create linked skills by the following markdown:
"skills": [
{
"name": "tools",
"level": "Master",
"keywords": [
"[git](http://fr.wikipedia.org/wiki/Git)",
"[wiki](http://fr.wikipedia.org/wiki/Wiki)"
]
}
]
Hey Mudassir, We just released 0.0.0 which is the first official version. I'm trying to update everything now to match 0.0.0, and would love to keep your theme listed on homepage.
So if you could add support for 0.0.0 that would be fantastic.
New schema can be found on homepage, http://jsonresume.org
Also let me know any feedback on how things are being run etc we are learning as we are going at this point.
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.