I have a Custom Font, Roboto Light and Roboto Regular installed on a Joomla t3 Template.
when i add Font Awesome Icon the custom Font not shown correctly:
in Firefox show as a serif type
In Safari and Chrome the Roboto Light shown as regular or bold.
the same conflict shown also with glyphicon classes.
May some can help me?
Link: http://kulimot.ch.mistral.ch-meta.net/index.php/de/entsorgungsysteme/ballenpressen.html
From the link you've added to the question, it looks like you've done this:
<td class="glyphicon glyphicon-ok">
MACFAB-Abfallpressen können die Abfallmenge um bis zu 90% reduzieren
</td>
Although this is a glyph icon and not a font-awesome icon, you should probably not set that style on the td itself, but rather add an i element in the td. Something like this:
<td>
<i class="fa fa-folder-open pull-left"></i>
MACFAB-Abfallpressen können die Abfallmenge um bis zu 90% reduzieren
</td>
P.S. This code uses a font-awesome icon instead of a glpyhicon.
I checked your page again. It seems you now have an icon in place, BUT you now have the text inside the i element. Your text is withinh the <i> opening and the </i> end tag. See the code I've copied from your page:
<td>
<i class="fa fa-bar-chart-o fa-4"> Sie benötigen nur wenig Platz</i>
</td>
If you do this, the text will take on the styling defined by the i. Basically it will use the fonts defined in those styles.
Luckily, the solution is simple from this point (I tried it on the code in your page, and it works for me). Just get the text out of the i element.
<td>
<i class="fa fa-bar-chart-o fa-4"></i>
Sie benötigen nur wenig Platz
</td>
P.S. Not sure why the is there at the end of your text, you probably wanted it between the icon and your text. So move it to the front of your text.
Related
Hello I have been playing with overrides and I decided to make language overrides for pagination Next and Previous Text buttons but the issue is when I make language override using for example:
CODE: SELECT ALL
<i title="Next article" class="fa fa-fast-forward"></i>
or
plain
<i class="fa fa-address-book" aria-hidden="true"></i>
I get the icon but also get "> displayed in front of it.
Screenshot for clarification
What am I doing wrong here?
Thank you!
check your tags and attributes inside the tags if they are properly closed, e.g. there can be some mistake like
<i title="Next article" class="fa fa-fast-forward">"></i>
I'm trying to click a button using Capybara. I've tried all combinations I can think of but no luck. Trying to click on the 'delete' link. The delete link only shows up when you hover over the row in the table.
This is the HTML:
<tbody>
<tr class="even" id="informal_6">
<td class="columnOrganizationNameColumnValue" id="informal_7">
<div>
<a id="showLink_0" title="Organization Details" class="viewLink">
Institution / Automation
</a>
</div>
<div class="gridMenuDescription">
</div>
<div class="gridMenu">
<a id="gridMenuDirectLink_1" title="Edit Organization" class="gridMenuItem">
edit
</a>
<a id="gridMenuDirectLink_2" class="gridMenuItem delete">
delete
</a>
</div>
</td>
</tbody>
I'd like to note, that the "gridMenu" div, when you hover over it using Firebug it turns to:
<div class="gridMenu hover gridMenuShow">
Some things I've tried, but no luck:
find(:xpath, '//*[(#id = "gridMenuDirectLink_2")]').click
find("#informal_6").find("#informal_7").find(".gridMenu.hover.gridMenuShow").find(".gridMenuItem.delete").click
Suggestions?
After a crazy amount of attempts trying different things I was able to get it to work with this code:
find('#informal_6').hover.find('.gridMenu').hover.find('.gridMenuItem.delete').click
Try the below code to hover over the row.
page.driver.browser.mouse.move_to(page.driver.browser.find_element(:id=>"locator"))
I have a calendar interface where AJAX edit & delete links appear only when you hover over each calendar entry. It's nice and compact, but I had trouble getting Capybara to click on those dynamically displayed elements, and using .hover on the parent element didn't seem to make a difference. So I tried a brute-force approach that is working nicely so far:
# Use Jquery to force display a hidden element. Useful for getting at links
# that are dynamically displayed.
# Call it like: js_show(".entry.scheduled[data-id=\"#{#da3.id}\"] .actions")
def js_show(selector)
page.execute_script(" $('#{selector}').show(); ")
end
def js_hide(selector)
page.execute_script(" $('#{selector}').hide(); ")
end
Now, when I need to click on an element that's only displayed on hover etc., I can call js_show(".whatever.container.selector") to force the links to display, then page.find(...).click works.
I'm currently creating a image gallery (using Zurb Foundation as Framework) and would like to show the zoom icon on image hover (like this example here: http://codepen.io/Twikito/pen/Jeaub). But I would like the icon to be a font (Font Awesome) icon and not just one but 3 individual clickable icons.. Would that be possible?
I've put a quick JSfiddle together using font-awesome. The CSS is hacked together but demonstrates what's possible. It should give you a starting point to experiment with.
<a href="#" title="" class="image">
<img src="http://www.lyricis.fr/wp-content/uploads/2010/04/kickass-film-still-01.jpg" alt="">
</a>
<div class="cn">
<div class="inner">
<i class="icon-zoom-in large"></i>
<i class="icon-cloud-download large"></i>
<i class="icon-comment large"></i>
</div>
</div>
Note: The JSfiddle above uses font-awesome.css called externally from bootstrapcdn.com
I'm trying to do some screen scraping, and I've gotten down to this last step. I'm trying to download a file, which is accessed via a button from the following html:
<button class="pdf ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only" role="button" aria-disabled="false">
<span class="ui-button-text">
<span class="icon-32 pdf-32"></span>
<span class="btn-txt"> PDF file </span>
I'm used to clicking buttons with the following ruby code:
browser.button(:value, "Sign In").click
But with this .. there doesn't seem to be any value I can use. Can anyone help me out?
I can think of a couple possibilities. One is that you can do a regular expression match on the value. Try:
browser.button(:value, /PDF file/).click
But you don't have to use the value, you can use a uniquely identifying attribute. In this case, you may be able to use the class, e.g.
browser.button(:class, "pdf").click
If the pdf class is not unique, you can add an :index to identify which one of the matches to click.
I'm triying to insert a image on the pdf generated by the script.
I have put a image that is on the folder and it shows correctly, but the generated one no.
In other section of the site, I use the same function to generate and show the image and it shows correctly, only when I put on the pdf gets a blank gap.
$html1 = '
<p align="left" style="color:#434343;">
<span align="justify" style="color:#fe5a1d; font-size:35px;">3.3.- Comparativa Evaluación Tu Total – Evaluación media Total</span>
</p>
<p align="justify" style="color:#434343; font-size:34px;">
<img src="'.DOMINIO.'intranet/graph.php?ide='.$evaluacion->getId().'&tipo=3" border="0" width="700" height="230"/>
</p>
<p align="left" style="color:#434343;">
<span style="color:#fe5a1d; font-weight:bold;">4.- Detalle por competencias</span>
</p>
<p align="justify" style="color:#434343; font-size:34px;">
<img src="'.DOMINIO.'intranet/graph.php?ide='.$evaluacion->getId().'&tipo=4" border="0" width="700" height="230"/><br />
</p>
This is the code that makes a little paragraph that is shown on the PDF, the text works nice, it's only the image not shown.
Thanks for all.
Its most likely a problem with your PHP setup, specifically make sure you have support for GD image installed and enabled.
Now its solved, what i've done is render the images on the HardDisk and load it on the pdf