add the header depth to two column layouts and add appropriate style

This commit is contained in:
Max Mackie 2015-10-11 08:31:34 -04:00
parent 8033da8289
commit 4089a05b11
5 changed files with 52 additions and 46 deletions

View File

@ -1,5 +1,5 @@
<ul class="nav nav-list">
{{#each headings}}
<li><a href="#{{id}}">{{text}}</a></li>
<li class="sidebar-header-{{depth}}"><a href="#{{id}}">{{text}}</a></li>
{{/each}}
</ul>

View File

@ -0,0 +1,24 @@
body {
background-color: #f6f6f6;
padding-top: 30px;
}
.main {
background-color: #fff;
border: 1px solid #CCC;
padding: 40px;
}
.container {
width: 1100px;
}
.nav-list {
font-size: 17px;
}
.nav-header {
font-size: 17px;
text-transform: none;
line-height: 30px;
}
.sidebar-header-2 { margin-left: 10px; }
.sidebar-header-3 { margin-left: 20px; }
.sidebar-header-4 { margin-left: 30px; }
.sidebar-header-5 { margin-left: 40px; }

View File

@ -4,31 +4,10 @@
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>{{title}}</title>
<link type="text/css" rel="stylesheet" href="{{asset 'css/bootstrap.css'}}"/>
<style>
body {
background-color: #f6f6f6;
padding-top: 30px;
}
.main {
background-color: #fff;
border: 1px solid #CCC;
padding: 40px;
}
.container {
width: 1100px;
}
.nav-list {
font-size: 17px;
}
.nav-header {
font-size: 17px;
text-transform: none;
line-height: 30px;
}
</style>
<link type="text/css" rel="stylesheet" href="{{asset 'css/bootstrap-responsive.css'}}"/>
<link type="text/css" rel="stylesheet" href="{{asset 'css/pilcrow.css'}}"/>
<link type="text/css" rel="stylesheet" href="{{asset 'css/hljs-github.min.css'}}"/>
<link type="text/css" rel="stylesheet" href="{{asset 'css/style.css'}}"/>
</head>
<body>

View File

@ -0,0 +1,25 @@
body {
background: url('{{asset "img/textured_paper.png"}}') repeat top left;
background-color: #f6f6f6;
}
.main {
padding: 0px 40px;
background: rgba(255,255,255,0.5);
-webkit-box-shadow: 0 0 20px #d2d2d2;
box-shadow: 0 0 20px #d2d2d2;
}
.container {
width: 1100px;
}
.nav-list {
font-size: 17px;
}
.nav-header {
font-size: 17px;
text-transform: none;
line-height: 30px;
}
.sidebar-header-2 { margin-left: 10px; }
.sidebar-header-3 { margin-left: 20px; }
.sidebar-header-4 { margin-left: 30px; }
.sidebar-header-5 { margin-left: 40px; }

View File

@ -5,32 +5,10 @@
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>{{title}}</title>
<link type="text/css" rel="stylesheet" href="{{asset 'css/bootstrap.css'}}"/>
<style>
body {
background: url('{{asset "img/textured_paper.png"}}') repeat top left;
background-color: #f6f6f6;
}
.main {
padding: 0px 40px;
background: rgba(255,255,255,0.5);
-webkit-box-shadow: 0 0 20px #d2d2d2;
box-shadow: 0 0 20px #d2d2d2;
}
.container {
width: 1100px;
}
.nav-list {
font-size: 17px;
}
.nav-header {
font-size: 17px;
text-transform: none;
line-height: 30px;
}
</style>
<link type="text/css" rel="stylesheet" href="{{asset 'css/bootstrap-responsive.css'}}"/>
<link type="text/css" rel="stylesheet" href="{{asset 'css/pilcrow.css'}}"/>
<link type="text/css" rel="stylesheet" href="{{asset 'css/hljs-github.min.css'}}"/>
<link type="text/css" rel="stylesheet" href="{{asset 'css/style.css'}}"/>
</head>
<body>