How to conver the following HTML IE conditionals into Slim? - slim-lang

Can't figure out how to conver the IE conditionals typically seen at the top of an HTML page into Ruby Slim:
<!doctype html>
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7" lang=""> <![endif]-->
<!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8" lang=""> <![endif]-->
<!--[if IE 8]> <html class="no-js lt-ie9" lang=""> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js" lang=""> <!--<![endif]-->
Anyone know how to do the coversion to Slim?

The following fragment should be enough:
doctype html
/![if lt IE 7] <html class="no-js lt-ie9 lt-ie8 lt-ie7" lang=""
/![if IE 7] <html class="no-js lt-ie9 lt-ie8" lang=""
/![if IE 8] <html class="no-js lt-ie9" lang=""
/! [if gt IE 8]><!
html.no-js lang=""
/! <![endif]
There is a nice tool https://html2slim.herokuapp.com/ that converts HTML into Slim, however it isn't ideal and sometimes do it incorrectly.
Also there is a Ruby gem that you can use for converting HTML files into Slim ones (https://github.com/slim-template/html2slim).

Related

how to show Favicon using local server in Microsoft Edge(although it is working fine in Google Chrome and IE) ?

<!DOCTYPE html>
<html lang="en" class="teradata-bootstrap marketing-operations" ng-app="marketingOps">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
</head>
</html>
I used portion in my code its working in chrome but not in Edge.
<link rel="shortcut icon" href="http://yoursite.com/favicon.ico" type="image/x-icon" />

pgfplotstabletypeset to html with pandoc

I'm trying to convert a latex table made with pgfplotstable typeset to html with pandoc, for example:
\begin{table}
\centering
\pgfplotstableset{
every head row/.style={before row=\toprule,after row=\midrule},
every last row/.style={after row=\bottomrule}}
\pgfplotstabletypeset[
fixed zerofill,
precision=2,
display columns/0/.style={string type},
col sep=comma]{images/prvsflow.txt}
\caption{Variation of pressure drop with flow rate (m/s)}
\label{tab:pvv}
\end{table}
. If I just use it straight with
pandoc -s example.tex -o example.html
then it gives
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<meta name="generator" content="pandoc" />
<title></title>
<style type="text/css">code{white-space: pre;}</style>
</head>
<body>
<p>[tab:pvv]</p>
</body>
</html>
Has anyone had any experience with this?
I just found htlatex, which seems to do a much better job with tables than pandoc, and also works quite nicely with tables made with pgfplotstabletypeset

<head> section not being read

I'm a beginner to coding and have what seems to be a beginner question. I'm working in Ruby on Rails.
It appears that (all of a sudden) my application is ignoring my section across all of my pages. The implications are that the title is not appearing on the browser tabs and the css is not rendering in the mobile production environment (although it is working on desktop dev/prod and mobile prod). the code is below. Can someone help me? Thanks in advance!
<!DOCTYPE html>
<head>
<title>Home | XXXX</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<!--[if lte IE 8]><script src="assets/js/ie/html5shiv.js"></script><![endif]-->
<link rel="stylesheet" href="assets/css/main.css" />
<!--[if lte IE 8]><link rel="stylesheet" href="assets/css/ie8.css" /><![endif]-->
</head>
It must be inside tag. Please check your code. Hope this will help you.
<!DOCTYPE html>
<html>
<head>
<title>Home | XXXX</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<!--[if lte IE 8]><script src="assets/js/ie/html5shiv.js"></script><![endif]-->
<link rel="stylesheet" href="assets/css/main.css" />
<!--[if lte IE 8]><link rel="stylesheet" href="assets/css/ie8.css" /><![endif]-->
</head>
</html>

Failing to load css for FF from MVC 4

I am creating an MVC 4 application. The styles are working partially across the browsers. However i set this working good for IE. But many styles which works well in IE are failing in Mozilla. I have the following code in my _Layout.html.
<head>
<meta name="viewport" content="width=device-width" />
<title>#ViewBag.Title</title>
<!--[if IE]>#Styles.Render("~/Content/common.css")<![endif]-->
<!--[if !IE]>#Styles.Render("~/Content/MozSite.css") <![endif]-->
#Scripts.Render("~/bundles/jquery")
<script src="~/Scripts/jquery.unobtrusive-ajax.min.js" type="text/javascript"></script>
</head>
when i load FF, it is not picking the MozSite.css. How do i load this FF dynamically?

Opening links in a frame target IE10 Start app for Windows 8

I have a page being showed in two frames
<frameset cols="140,*">
<frame src="resources/nav-bar.html" id="nav-bar" frameborder=0 scrolling="no" noresize="noresize" />
<frame src="resources/home.html" id="main" frameborder=0 scrolling="yes" noresize="noresize" />
</frameset>
Then in the frame named nav-bar I have links targeted to main like this:
Personal details
In Google Chrome and Safari this works with no issues but IE10 for Windows 8 when run from the Start opens the link in a new tab instead. Nevertheless if I run IE10 from the desktop I have no such issue. How can this be fixed? Thanks in advance.
EMILIO!
It's a sad little problem and apparently Microsoft is aware of it. (See http://support.microsoft.com/kb/2793437, for example.) What makes it even sadder is it seems to only appear on Windows 8, IE10 running on Windows 7 does not exhibit this problem. I manage to solve it by replacing the markup for the page I am using to navigate around, in your example the resources/nav-bar.html file. I changed:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.or/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Blah blah</title>
<link rel="stylesheet" href="./some.css" type="text/css" media="screen" />
</head>
...
to
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Blah blah</title>
<link rel="stylesheet" href="./some.css" type="text/css" media="screen" />
</head>
...
Give it a go.
Try using property name.
name="main"

Resources