I'm having issues with getting Inspiritas as an Ember app. The index.html looks like below:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>title</title>
<meta name="author" content="me">
<!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<link rel="shortcut icon" href="favicon.ico">
<link href="inspiritas.css" rel="stylesheet">
</head>
<body>
<script type="text/x-handlebars">
<div class="navbar navbar-static-top navbar-inverse">
<div class="navbar-inner">
<div class="container">
...
</div>
</div>
</div>
<div class="container">
<div class="row-fluid">
<div class="span3">
...
</div>
{{outlet}}
</div>
</div><!-- /container -->
</script>
<script type="text/x-handlebars" id="dashboard">
<div class="span9" id="content-wrapper">
<div id="content">
<section id="tables">
...
</section>
</div>
</div>
</script>
First off, it won't load the CSS for <div class="container"> (not the one inside the navbar). Instead, it inherits from body.ember-application, and in the process loses all the CSS. This only happens with this container, though. The only bit of LESS I can narrow it down to is some custom styling here:
body > .container {
// Color the whole container like the sidebar to fix faux columns
background: url('images/sidebar_bg.png') repeat @sidebarBackground;
.border-radius(@borderRadiusLarge);
// Make some space, eh.
margin-top: 40px;
margin-bottom: 40px;
}
UPDATE: Well, I've got no clue why but one class name change later its all gone to shit and everything has lost its styling.
The CSS rule you pasted uses the descendant selector, which means only elements with the container class that are directly below the body element will be styled. But when Ember inserts Handlebars templates it wraps them via a View, which creates another intermediary DIV. I'd guess that's responsible for your styles not appearing.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With