I'm trying to adapt some templates from http://html5up.net to work with Flask. The static HTML pages load fine with a directory structure
/website
/css
/js
/images
index.html
But for Flask it has to be
/website
/templates
index.html
/static
/css
/js
/images
Adding /static
before the javascript and image files works fine, and they display as expected. However, the links to the css files are inside <noscript>
tags, and I can't get the main html page to find them. I've tried absolute and relative addressing, and moving the stylesheets to different places in the directory structure, but no luck. I just get an ugly page with no css styling.
If I remove the tags, then it loads fine for desktop use, but the page is then no longer adapts when viewed with a tablet or phone.
An excerpt from the original header:
<head>
<script src="js/jquery.min.js"></script>
<script src="js/config.js"></script>
<noscript>
<link rel="stylesheet" href="css/skel-noscript.css" />
<link rel="stylesheet" href="css/style.css" />
<link rel="stylesheet" href="css/style-desktop.css" />
</noscript>
<!--[if lte IE 9]><link rel="stylesheet" href="css/ie9.css" /><![endif]-->
<!--[if lte IE 8]><script src="js/html5shiv.js"></script><![endif]-->
</head>
And what I would expect to work, but doesn't
<head>
<script src="/static/js/jquery.min.js"></script>
<script src="/static/js/config.js"></script>
<noscript>
<link rel="stylesheet" href="css/skel-noscript.css" />
<link rel="stylesheet" href="/static/css/style.css" />
<link rel="stylesheet" href="/static/css/style-desktop.css" />
</noscript>
<!--[if lte IE 9]><link rel="stylesheet" href="/static/css/ie9.css" /><![endif]-->
<!--[if lte IE 8]><script src="/static/js/html5shiv.js"></script><![endif]-->
</head>
-EDIT-
The contents of config.js
window._skel_config = {
preset: 'standard',
prefix: 'css/style',
resetCSS: true,
breakpoints: {
'1000px': {
grid: {
gutters: 25
}
}
}
};
window._skel_panels_config = {
preset: 'standard'
};