I was given an .ai file (Illustrator) with 2 styled words.
Is it possible for Photoshop or any image software to read the file and provide me with certain properties, such as font, size, decoration?
Adobe Fireworks has a Mobile Extension package for CS5, that includes a feature "CSS Properties". http://www.adobe.com/devnet/fireworks/articles/css3-mobile-pack-extracting.html
Most designers I work with use Photoshop. Fireworks can import those psd files, but the file is usually not suitble to extract css properties from. Haven't tried it with .ia files yet. For web design, everyone should use Fireworks, as that's the software that's designed to be used for the web. IA is for print, Ps is for image manipulation, Fw is for the web. There, I said it :).
Nope.............................
Try Adobe Dreamweaver or write your own HTML/CSS code, or a mixture of both. You can import things from Illustrator or Photoshop into Dreamweaver and create HTML pages.
Related
I am familiar with Figma, but new to Adobe XD.
I got a link for Adobe XD design from designer and I am able to inspect the style(css properties).
But, not sure how to export assets like icons, images.
I use chrome browser, not XD app to see the design.
I would like to create a website to go hand in hand with my discord bot. I thought it would look nice, if they similar styling, to keep the whole thing more as a unit(I would also not have to worry about button-, checkbox-, etc. styles). As an example, I would like my buttons to have the typical discord-appearance of the blue button with white text and rounded edges(I assume you use dark mode). I of course did some research myself, but couldnt find a library or a standalone css-file that includes all the styles. So my question to you is: do you know a library or link that includes the css-stylesheet? Could I copy the stylesheet from the official discord-websites source-code alternatively?
I am thankful for every suggestion! :)
You can use this chrome extension to download all the source files for a webpage:
https://chrome.google.com/webstore/detail/save-all-resources/abpdnfjocnmdomablahdcfnoggeeiedb?hl=en
The files would be downloaded into a .zip file. You can then extract it's contents and get the CSS file
I have been surfing through the sites looking for a way to add my custom css font icons for my own application.
I have uploaded the css file in the workspace static files, and put the url in Shared Components\ Themes \ Icons \ Custom Library File URLs.
Please show my how to used my custom css font icons, for I don't want to upload images or so.
Depends on your version, but Maxime has an example here describing how to import Font APEX library for APEX 5.0
http://max-tremblay.blogspot.com.au/2017/02/using-font-apex-in-apex-50.html
You're chasing attributes in the theme settings.
Fonts like Wingdings render letters as a variety of symbols. If you look at some font websites likes dafont, you can see a lot of symbol fonts. Download the font file (ttf) and convert it to woff using some converter tool / websites like convertio. You may refer this stackoverflow question to get an idea about its usage in CSS.
Hope this helps.
I'm trying to add a SVG into my webpage, I think the format is a bit odd.
https://gist.github.com/Vadorequest/c329dec26e39a586e96df5f74c1d7d29?short_path=d29c6c9 (you can see the source code and the rendering there)
The style part isn't correctly understood since I'm loading this file using React. If you save the file and open it in a browser, it'll work fine. But if I load it by react using react-svg-loader, it displays a dark image.
import IconBook from "-!react-svg-loader!../assets/couverture-eBook-VF.svg";
...
<IconBook height={250} />
Is it standard to put the style like this? Should I get a new SVG exported differently? I really don't know that format and all its possibilities.
Edit 1:
I found a working workaround for anyone interested: https://github.com/gilbarbara/react-inlinesvg
It basically loads the svg file over network and anything in it will be correctly loaded. (including <styles>)
On the bad side, it makes the app rely on something that must be available via CDN or alike. (you won't have the svg embedded in your app. If you wanted some kind of standalone app that can be built with everything in it, it's not really good)
On the good side, it doesn't require any change in the SVG file, you use it as it, load it over network, and it displays as in the browser.
Since I'm building a standalone app (basically, npm run build will generate a folder with my whole app) this isn't perfect because I need to host that file somewhere on a CDN. So I'll keep looking for another solution.
It is fine to have styles in your svg file, as specification says:
Cascading Style Sheets (CSS) is a stylesheet language used to describe
the presentation of a document written in HTML or XML (including XML
dialects such as SVG or XHTML). CSS describes how elements should be
rendered on screen, on paper, in speech, or on other media.
https://developer.mozilla.org/en-US/docs/Web/CSS
I recently read an article about Javascript, where Build Tools like Grunt and Ender were mentioned. It was briefly stated, that such tools are capable of generating sprite images from individually provided files and that these build tools can be integrated into the build process.
Unfortunately my google searches didn't unveil more information on this.
Does anybody here have experience on this topic and integration into gradle?
Some web resources for further reading are highly welcome!
Many thanks in advance!
Sascha.
#Windwalker you might be interested in using the SmartSprites Maven Repositry in your gradle. It takes individual images and creates a sprite image using that along with the required CSS.
The details for the repository can be found at: http://mvnrepository.com/artifact/com.carrotsearch/smartsprites/0.2.8
To install it into your project simply put the following line in your gradle commands :
'com.carrotsearch:smartsprites:0.2.8'
The full details about the
As the website of Smart Sprite [ http://csssprites.org/ ] says:
SmartSprites will let you easily introduce and maintain CSS sprites in
your designs. SmartSprites parses special directives you can insert
into your original CSS to mark individual images to be turned into
sprites. It then builds sprite images from the collected images and
automatically inserts the required CSS properties into your style
sheet, so that the sprites are used instead of the individual images
I hope this solves your situation.
http://csssprites.com/
http://spritegen.website-performance.org/
http://css-sprit.es/
A few online tools that will generate the sprites along with the CSS code.