Skip to content
This repository

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Browse code

Updated styling

  • Loading branch information...
commit 0c08a303592c65c66e1e68898e0b13810e050b4f 1 parent 42f95da
Kevin Malakoff authored May 31, 2012
5  knockback-inspector.css
@@ -7,12 +7,17 @@ ul.kbi {
7 7
 li.kbi {
8 8
   padding-left: 1px;
9 9
   margin-left: 10px;
  10
+  margin-right: 10px;
10 11
   border-style: solid;
11 12
   border-color: rgb(90, 0, 180); /* The Fallback */
12 13
   border-color: rgba(90, 0, 180, 0.2);
13 14
   border-width: 1px;
14 15
   border-radius: 5px;
15 16
 }
  17
+ul.kbi.root > li.kbi {
  18
+  margin-left: 0px;
  19
+  margin-right: 0px;
  20
+}
16 21
 li.kbi.closed {
17 22
   border-style: none; font-style:italic;
18 23
 }
7  test/index.html
@@ -18,7 +18,6 @@
18 18
   <!-- APPLICATION STYLING -->
19 19
   <style type='text/css'>
20 20
   #content {width: 800px; margin: 0 auto; background-color: #F5E0FF; border-radius: 5px;}
21  
-  #content > ul.kbi > li.kbi {margin-left: 0px;}
22 21
   h1 {text-align: center; font-size: 2em; color: #fff; background-color: #CC66FF; border-radius: 5px;}
23 22
   </style>
24 23
   <link rel='stylesheet' href='../knockback-inspector.css'>
@@ -41,7 +40,7 @@ <h1 class='inspector_title' data-bind="text: title"></h1>
41 40
     </script>
42 41
 
43 42
     <!-- Step 2: Rendering a Backbone.Model using kb.ViewModel -->
44  
-    <ul id='backbone_model' class='kbi' data-bind="template: {name: 'kbi_model_node', data: kbi.nvm('root', true, $data)}"></ul>
  43
+    <ul id='backbone_model' class='kbi root' data-bind="template: {name: 'kbi_model_node', data: kbi.nvm('root', true, $data)}"></ul>
45 44
     <script type='text/javascript'>
46 45
       var model1 = new Backbone.Model({name: 'Model1', pet: 'frog', friends: new Backbone.Collection([])});
47 46
       var model2 = new Backbone.Model({name: 'Model2', pet: 'dog', friends: new Backbone.Collection([])});
@@ -56,7 +55,7 @@ <h1 class='inspector_title' data-bind="text: title"></h1>
56 55
     </br>
57 56
 
58 57
     <!-- Step 3: Rendering a BackboneRelational using kb.CollectionObservable -->
59  
-    <ul id='backbone_relational' class='kbi' data-bind="template: {name: 'kbi_collection_node', data: kbi.nvm('root', true, $data)}"></ul>
  58
+    <ul id='backbone_relational' class='kbi root' data-bind="template: {name: 'kbi_collection_node', data: kbi.nvm('root', true, $data)}"></ul>
60 59
     <script type='text/javascript'>
61 60
       var Person = Backbone.RelationalModel.extend({});
62 61
       var House = Backbone.RelationalModel.extend({
@@ -83,7 +82,7 @@ <h1 class='inspector_title' data-bind="text: title"></h1>
83 82
     </br>
84 83
 
85 84
     <!-- Step 4: Rendering a Twitter Query using kb.CollectionObservable -->
86  
-    <ul class='kbi' id='fetched_collection'>
  85
+    <ul class='kbi root' id='fetched_collection'>
87 86
       <li class='kbi'>
88 87
         <fieldset class='kbi'>
89 88
           <label>URL</label>
1  tutorials/coffeescript/step1/index.html
@@ -18,7 +18,6 @@
18 18
   <!-- APPLICATION STYLING -->
19 19
   <style type='text/css'>
20 20
   #content {width: 800px; margin: 0 auto; background-color: #F5E0FF; border-radius: 5px;}
21  
-  #content > ul.kbi > li.kbi {margin-left: 0px;}
22 21
   h1 {text-align: center; font-size: 2em; color: #fff; background-color: #CC66FF; border-radius: 5px;}
23 22
   </style>
24 23
 
3  tutorials/coffeescript/step2/index.html
@@ -22,7 +22,6 @@
22 22
   <!-- APPLICATION STYLING -->
23 23
   <style type='text/css'>
24 24
   #content {width: 800px; margin: 0 auto; background-color: #F5E0FF; border-radius: 5px;}
25  
-  #content > ul.kbi > li.kbi {margin-left: 0px;}
26 25
   h1 {text-align: center; font-size: 2em; color: #fff; background-color: #CC66FF; border-radius: 5px;}
27 26
   </style>
28 27
   <link rel='stylesheet' href="../../../knockback-inspector.css">
@@ -45,7 +44,7 @@ <h1 class='inspector_title' data-bind="text: title"></h1>
45 44
     </script>
46 45
 
47 46
     <!-- Step 2: Rendering a Backbone.Model using kb.ViewModel -->
48  
-    <ul id='backbone_model' class='kbi' data-bind="template: {name: 'kbi_model_node', data: kbi.nvm('root', true, $data)}"></ul>
  47
+    <ul id='backbone_model' class='kbi root' data-bind="template: {name: 'kbi_model_node', data: kbi.nvm('root', true, $data)}"></ul>
49 48
     <script type='text/javascript'>
50 49
       var model1 = new Backbone.Model({name: 'Model1', pet: 'frog', friends: new Backbone.Collection([])});
51 50
       var model2 = new Backbone.Model({name: 'Model2', pet: 'dog', friends: new Backbone.Collection([])});
3  tutorials/coffeescript/step3/index.html
@@ -22,7 +22,6 @@
22 22
   <!-- APPLICATION STYLING -->
23 23
   <style type='text/css'>
24 24
   #content {width: 800px; margin: 0 auto; background-color: #F5E0FF; border-radius: 5px;}
25  
-  #content > ul.kbi > li.kbi {margin-left: 0px;}
26 25
   h1 {text-align: center; font-size: 2em; color: #fff; background-color: #CC66FF; border-radius: 5px;}
27 26
   </style>
28 27
   <link rel='stylesheet' href="../../../knockback-inspector.css">
@@ -45,7 +44,7 @@ <h1 class='inspector_title' data-bind="text: title"></h1>
45 44
     </script>
46 45
 
47 46
   <!-- Step 3: Rendering a BackboneRelational using kb.CollectionObservable -->
48  
-  <ul id='backbone_relational' class='kbi' data-bind="template: {name: 'kbi_collection_node', data: kbi.nvm('root', true, $data)}"></ul>
  47
+  <ul id='backbone_relational' class='kbi root' data-bind="template: {name: 'kbi_collection_node', data: kbi.nvm('root', true, $data)}"></ul>
49 48
   <script type='text/javascript'>
50 49
     var Person = Backbone.RelationalModel.extend({});
51 50
     var House = Backbone.RelationalModel.extend({
3  tutorials/coffeescript/step4/index.html
@@ -23,7 +23,6 @@
23 23
   <!-- APPLICATION STYLING -->
24 24
   <style type='text/css'>
25 25
   #content {width: 800px; margin: 0 auto; background-color: #F5E0FF; border-radius: 5px;}
26  
-  #content > ul.kbi > li.kbi {margin-left: 0px;}
27 26
   h1 {text-align: center; font-size: 2em; color: #fff; background-color: #CC66FF; border-radius: 5px;}
28 27
   </style>
29 28
   <link rel='stylesheet' href="../../../knockback-inspector.css">
@@ -46,7 +45,7 @@ <h1 class='inspector_title' data-bind="text: title"></h1>
46 45
     </script>
47 46
 
48 47
     <!-- Step 4: Rendering a Twitter Query using kb.CollectionObservable -->
49  
-    <ul class='kbi' id='fetched_collection'>
  48
+    <ul class='kbi root' id='fetched_collection'>
50 49
       <li class='kbi'>
51 50
         <fieldset class='kbi'>
52 51
           <label>URL</label>
1  tutorials/javascript/step1/index.html
@@ -19,7 +19,6 @@
19 19
   <!-- APPLICATION STYLING -->
20 20
   <style type='text/css'>
21 21
   #content {width: 800px; margin: 0 auto; background-color: #F5E0FF; border-radius: 5px;}
22  
-  #content > ul.kbi > li.kbi {margin-left: 0px;}
23 22
   h1 {text-align: center; font-size: 2em; color: #fff; background-color: #CC66FF; border-radius: 5px;}
24 23
   </style>
25 24
 
3  tutorials/javascript/step2/index.html
@@ -23,7 +23,6 @@
23 23
   <!-- APPLICATION STYLING -->
24 24
   <style type='text/css'>
25 25
   #content {width: 800px; margin: 0 auto; background-color: #F5E0FF; border-radius: 5px;}
26  
-  #content > ul.kbi > li.kbi {margin-left: 0px;}
27 26
   h1 {text-align: center; font-size: 2em; color: #fff; background-color: #CC66FF; border-radius: 5px;}
28 27
   </style>
29 28
   <link rel='stylesheet' href="../../../knockback-inspector.css">
@@ -46,7 +45,7 @@ <h1 class='inspector_title' data-bind="text: title"></h1>
46 45
     </script>
47 46
 
48 47
     <!-- Step 2: Rendering a Backbone.Model using kb.ViewModel -->
49  
-    <ul id='backbone_model' class='kbi' data-bind="template: {name: 'kbi_model_node', data: kbi.nvm('root', true, $data)}"></ul>
  48
+    <ul id='backbone_model' class='kbi root' data-bind="template: {name: 'kbi_model_node', data: kbi.nvm('root', true, $data)}"></ul>
50 49
     <script type='text/javascript'>
51 50
       var model1 = new Backbone.Model({name: 'Model1', pet: 'frog', friends: new Backbone.Collection([])});
52 51
       var model2 = new Backbone.Model({name: 'Model2', pet: 'dog', friends: new Backbone.Collection([])});
3  tutorials/javascript/step3/index.html
@@ -23,7 +23,6 @@
23 23
   <!-- APPLICATION STYLING -->
24 24
   <style type='text/css'>
25 25
   #content {width: 800px; margin: 0 auto; background-color: #F5E0FF; border-radius: 5px;}
26  
-  #content > ul.kbi > li.kbi {margin-left: 0px;}
27 26
   h1 {text-align: center; font-size: 2em; color: #fff; background-color: #CC66FF; border-radius: 5px;}
28 27
   </style>
29 28
   <link rel='stylesheet' href="../../../knockback-inspector.css">
@@ -46,7 +45,7 @@ <h1 class='inspector_title' data-bind="text: title"></h1>
46 45
     </script>
47 46
 
48 47
   <!-- Step 3: Rendering a BackboneRelational using kb.CollectionObservable -->
49  
-  <ul id='backbone_relational' class='kbi' data-bind="template: {name: 'kbi_collection_node', data: kbi.nvm('root', true, $data)}"></ul>
  48
+  <ul id='backbone_relational' class='kbi root' data-bind="template: {name: 'kbi_collection_node', data: kbi.nvm('root', true, $data)}"></ul>
50 49
   <script type='text/javascript'>
51 50
     var Person = Backbone.RelationalModel.extend({});
52 51
     var House = Backbone.RelationalModel.extend({
3  tutorials/javascript/step4/index.html
@@ -24,7 +24,6 @@
24 24
   <!-- APPLICATION STYLING -->
25 25
   <style type='text/css'>
26 26
   #content {width: 800px; margin: 0 auto; background-color: #F5E0FF; border-radius: 5px;}
27  
-  #content > ul.kbi > li.kbi {margin-left: 0px;}
28 27
   h1 {text-align: center; font-size: 2em; color: #fff; background-color: #CC66FF; border-radius: 5px;}
29 28
   </style>
30 29
   <link rel='stylesheet' href="../../../knockback-inspector.css">
@@ -47,7 +46,7 @@ <h1 class='inspector_title' data-bind="text: title"></h1>
47 46
     </script>
48 47
 
49 48
     <!-- Step 4: Rendering a Twitter Query using kb.CollectionObservable -->
50  
-    <ul class='kbi' id='fetched_collection'>
  49
+    <ul class='kbi root' id='fetched_collection'>
51 50
       <li class='kbi'>
52 51
         <fieldset class='kbi'>
53 52
           <label>URL</label>

0 notes on commit 0c08a30

Please sign in to comment.
Something went wrong with that request. Please try again.