Completed

Need Semantic UI / Fomantic UI developer to create css for svg and png icon sprites

I'm using Fomantic UI (a fork of Semantic UI), it includes css for icons using the Font Awesome icon set.

I'd like to use the same or similar syntax that I am already using in the framework, but add support for svg and png sprites.

For example, currently you display an icon in an input form like this:

<div class="ui left icon input">

<input type="text" placeholder="Search users...">

<i class="user icon"></i>

</div>

The svg implementation could look like this:

<div class="ui left icon input">

<input type="text" placeholder="Search users...">

<svg xmlns="[login to view URL]" viewBox="0 0 100 100" class="svg icon">

<use xlink:href="fonts/sprite.svg#user"></use>

</svg>

</div>

and the png implementation like this:

<div class="ui left icon input">

<input type="text" placeholder="Search users...">

<i class="sprite sprite-user"></i>

</div>

I need all the UI elements with support for icons in Fomantic UI to have pixel perfect implementation also in svg and png. That includes UI elements such as dropdowns, input, labels, buttons etc. You can find all UI elements with icons support in the documentation: [login to view URL]

For the record: I've experimented with one solution for svg found here: [login to view URL]

Using that solution I placed overrides at:

site/elements/[login to view URL]

site/elements/[login to view URL]

It worked to an extent, but needed a lot of css fixes and tweaks. I don't want to hack around with this myself as css isn't really my field.

If you are able to do only svg implementation and not the png one, we can discuss that, the svg implementation is most important.

PS: This must be portable and maintainable code, in other words, this should be overrides / extending the css and no edit of the source code for the framework itself!

Skills: HTML5, HTML, CSS, LESS/Sass/SCSS, CSS3

See more: semantic ui icons not working, semantic ui link, semantic ui pictures, semantic ui icon size, semantic ui react icons, semantic ui custom icon, semantic ui icon button, semantic ui icons

About the Employer:
( 0 reviews ) Horten, Norway

Project ID: #22243260

Awarded to:

Nooobody

Hey there, You seem to be having some trouble with SVG&PNG icons using Fomantic UI. I might be able to help you. I have a decade of experience in Programming and several years with WebDev. I work as a full-stack deve More

$800 USD in 7 days
(7 Reviews)
4.8

20 freelancers are bidding on average $1118 for this job

meet2amitvw

Dear employer as a custom semantic UI developer (with svg and png using css files) i am having relevant skills and experience as you requested in your project description...i can share some demo as well in further chat More

$1500 USD in 15 days
(108 Reviews)
9.1
leadconcept

Hi there, As per my understanding, you are working on the Fomantic UI and want to add support for the Icons within SVG and PNG as well. Do you only want us to add the support for different image formats? Will you pr More

$1200 USD in 20 days
(60 Reviews)
8.5
graphicaa

Hello, I'm interested. Please contact me in private message, After our conversation, we will submit a detailed proposal. Thanks Sathies

$750 USD in 7 days
(546 Reviews)
9.0
seekdeveloper

Hi, I have read your post and understood your requirement. Looking for the freelancer to work on your next project? Or just need some issues/bugs/fixes ASAP? I have 11+ years of experience and I'm here for you! My sk More

$750 USD in 7 days
(82 Reviews)
8.3
AzzkaNoor

Greetings of the day. I am a professional Semantic UI / Fomantic UI developer. Hope this proposal finds you in the best of your health. It is my humble offer to present my services to you for this project. I have pas More

$1125 USD in 7 days
(23 Reviews)
7.1
erashrafkamal

Dear Employer, Hope all's well..!! Thanks for job posting. I have read the description carefully and give you 100% assistance as PHP Developer to create css for svg and png icon sprites. I am an Expertise in followi More

$1500 USD in 25 days
(43 Reviews)
6.6
seemasit

Hi, I read your project description very carefully and understand all but some points are not clear to me so please come online for to clear my all questions. I am ready to start working now after detailed discussion. More

$1125 USD in 7 days
(66 Reviews)
7.0
codetechservices

Validcode is a dynamic and fast-moving company in Web/Mobile designing and development world-wide and has proven itself to be one of the best in markets. Validcode have served customers from USA , Canada , Germany , More

$1125 USD in 7 days
(31 Reviews)
5.9
AwaisChaudhry

Hi,. I have gone through the brief details mentioned on the job. I have done multiple jobs with CSS, CSS3, HTML, HTML5, LESS/Sass/SCSS which are the skills required to get this job done. Lets start the chat so we can d More

$1500 USD in 9 days
(16 Reviews)
5.8
adicoman

Hi, I am very interested to work on your project. I have 17+ years experience in Web Development using a large variety of programming languages, frameworks, database architecture, APIs, CRMs, ERPs, mobile development More

$1500 USD in 24 days
(32 Reviews)
5.3
JohnNuman

Greetings, I have reviewed your project description along with the Stack overflow question that you mentioned. I have also reviewed the code samples you've provided for icons in SVG as well as PNG. I possess a very ke More

$1427 USD in 20 days
(17 Reviews)
5.0
mingjie323

( ͡ᵔ ͜ʖ ͡ᵔ )Web expert here( ͡ᵔ ͜ʖ ͡ᵔ ) Dear Client. Yes, I am sure! Your Success Is just My Success! After reading over your post, I think it is perfect fit for my skill sets. I can offer innovative and creative idea& More

$1000 USD in 6 days
(21 Reviews)
5.1
BelisaG

Hi Dear. I am very interested in your project. I am an expert developer who guarantees hard work, quality and perfection. As for me, I am a full-stack developer with 5+ years experience in the web development. - PHP, More

$1125 USD in 7 days
(3 Reviews)
3.8
Koko2599

i do what it takes when i give u a wordand i am Passionate web designer, skilled in Adobe Creative Suite, HTML, CSS. Creates seamless UX and UI with creative but functional designs. Designed 10+ websites, including an More

$800 USD in 5 days
(0 Reviews)
0.0
shlykoff

Hello! If I right understand you want simple decision like add your svg icons into customized font awesome? And convert png into the font awesome too. If that what you need I'm ready for a work.

$888 USD in 7 days
(0 Reviews)
0.0
maxkyu1216

Hi, there My name is Zemin, a senior web developer with enough experience in Semantic UI, HTML/CSS. I will do my best to deliver the perfect product to you. Please contact me so that we can have a discussion in detai More

$1200 USD in 7 days
(0 Reviews)
1.4
indersingh30

I have 5+ experience in web designing. I have worked on wp sites and other cms. I will done your project on twenty days. So please hire me. Relevant Skills and Experience My skills html5, css3, bootstrap, JavaScript s More

$1250 USD in 20 days
(0 Reviews)
0.0
danielandronic

Hello, my name is Daniel Andronic and I've been producing websites and pleasing clients for about 7 years old. A part of my portfolio is available on [login to view URL], which is my website, and if you want to see what my p More

$1000 USD in 5 days
(0 Reviews)
0.0
bilalaslam039

Hi, there! I am senior front end developer and I can start work immediately. I have read your project description and I understand the scope of work, I'm keen to get started this project right away. I would be delighte More

$800 USD in 7 days
(0 Reviews)
0.0