6
6
< head >
7
7
< meta charset ="utf-8 ">
8
8
< meta http-equiv ="X-UA-Compatible " content ="IE=edge,chrome=1 ">
9
- < link rel ="stylesheet " href ="/docs/css/bootstrap.min.css " />
10
- < link rel ="stylesheet " href ="/docs/css/bootstrap-flatly.css " />
9
+ <!-- < link rel="stylesheet" href="/docs/css/bootstrap.min.css" /> -- >
10
+ < link rel ="stylesheet " href ="/docs/css/bootstrap-flatly.min. css " />
11
11
< link rel ="stylesheet " href ="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.min.css " />
12
12
< link rel ="stylesheet " href ="/css/site.css " />
13
13
<!--<link rel="stylesheet" href="/release/ui-grid-unstable.css" />-->
41
41
</ script >
42
42
</ head >
43
43
< body >
44
- < header class ="header ">
45
- < div class ="navbar navbar-fixed-top ">
46
- < div class ="navbar-inner ">
47
- < div class ="container ">
48
- < a href ="/ " class ="brand "> UI Grid</ a >
49
- < ul class ="nav ">
50
- < li class ="dropdown ">
51
- < a href ="# " class ="dropdown-toggle " data-toggle ="dropdown ">
52
- Learn
53
- < b class ="caret "> </ b >
54
- </ a >
55
- < ul class ="dropdown-menu ">
56
- < li >
57
- < a href ="/docs/#/api "> Docs</ a >
58
- </ li >
59
- < li >
60
- < a href ="/docs/#/tutorial "> Tutorial</ a >
61
- </ li >
62
- </ ul >
44
+ < div class ="navbar navbar-default navbar-fixed-top ">
45
+ < div class ="nav navbar-header ">
46
+ < a href ="/ " class ="navbar-brand "> UI Grid</ a >
47
+ < ul class ="nav navbar-nav ">
48
+ < li class ="dropdown ">
49
+ < a href ="# " class ="dropdown-toggle " data-toggle ="dropdown ">
50
+ Learn
51
+ < b class ="caret "> </ b >
52
+ </ a >
53
+ < ul class ="dropdown-menu " role ="menu ">
54
+ < li >
55
+ < a href ="/docs/#/api "> Docs</ a >
56
+ </ li >
57
+ < li >
58
+ < a href ="/docs/#/tutorial "> Tutorial</ a >
63
59
</ li >
64
60
</ ul >
65
- < p class ="navbar-text pull-right ">
66
- < iframe class ="nav-ghbtn " src ="http://ghbtns.com/github-btn.html?user=angular-ui&repo=ng-grid&type=watch&count=true "
67
- allowtransparency ="true " frameborder ="0 " scrolling ="0 " width ="120 " height ="20 "> </ iframe >
68
- < iframe class ="nav-ghbtn " src ="http://ghbtns.com/github-btn.html?user=angular-ui&repo=ng-grid&type=fork&count=true "
69
- allowtransparency ="true " frameborder ="0 " scrolling ="0 " width ="120 " height ="20 "> </ iframe >
70
- </ p >
71
- </ div >
72
- </ div >
61
+ </ li >
62
+ </ ul >
63
+ </ div >
64
+ < div class ="navbar-header navbar-right ">
65
+ < p class ="navbar-text hidden-phone ">
66
+ < iframe class ="nav-ghbtn " src ="http://ghbtns.com/github-btn.html?user=angular-ui&repo=ng-grid&type=watch&count=true "
67
+ allowtransparency ="true " frameborder ="0 " scrolling ="0 " width ="120 " height ="20 "> </ iframe >
68
+ < iframe class ="nav-ghbtn " src ="http://ghbtns.com/github-btn.html?user=angular-ui&repo=ng-grid&type=fork&count=true "
69
+ allowtransparency ="true " frameborder ="0 " scrolling ="0 " width ="120 " height ="20 "> </ iframe >
70
+ </ p >
73
71
</ div >
74
- </ header >
72
+ </ div >
75
73
76
- < div ng-cloak class ="container " id ="customizerApp " ng-controller ='Main '>
74
+ < div ng-cloak class ="container-fluid " id ="customizerApp " ng-controller ='Main '>
77
75
< br >
78
76
79
77
< h2 class ="text-center "> Grid Customizer</ h2 >
80
78
81
79
< br >
82
80
83
81
< div class ="row ">
84
- < div class ="span12 ">
82
+ < div class ="col-md-12 ">
85
83
< button type ="button " class ="btn btn-success " ng-click ="resetVariables() "> Reset Variables</ button >
86
84
87
85
@@ -112,66 +110,69 @@ <h2 class="text-center">Grid Customizer</h2>
112
110
113
111
< br >
114
112
115
- < div class ="row ">
116
- < div class ="span8 ">
117
- < form class ="container ">
118
- < div class ="span4 " ng-repeat ="v in variables track by $index ">
119
- < label for ="{{ v.name }} " class ="muted "> {{ v.name }}</ label > < input id ="{{ v.name }} " type ="text " ng-model ="v.value " ng-change ="updateCSS() ">
113
+ < div class ="container-fluid ">
114
+ < div class ="row ">
115
+ < div class ="col-xs-6 col-md-8 ">
116
+ < form >
117
+ < div class ="col-sm-12 col-md-6 col-lg-4 " ng-repeat ="v in variables track by $index ">
118
+ < label for ="{{ v.name }} " class ="muted "> {{ v.name }}</ label > < input id ="{{ v.name }} " type ="text " class ="form-control " ng-model ="v.value " ng-change ="updateCSS() ">
119
+ </ div >
120
+ </ form >
121
+ </ div >
122
+ < div class ="col-xs-6 col-md-4 ">
123
+ < div data-spy ="affix " data-offset-top ="0 ">
124
+ < style >
125
+ .grid {
126
+ width : 400px ;
127
+ height : 300px ;
128
+ }
129
+ </ style >
130
+
131
+ < style ui-grid-style >
132
+ {{ css }}
133
+ </ style >
134
+
135
+ < div class ="grid " ui-grid ="gridOptions "> </ div >
120
136
</ div >
121
- </ form >
122
- </ div >
123
- < div class ="span4 ">
124
- < div data-spy ="affix " data-offset-top ="0 ">
125
- < style >
126
- .grid {
127
- width : 400px ;
128
- height : 300px ;
129
- }
130
- </ style >
131
-
132
- < style ui-grid-style >
133
- {{ css }}
134
- </ style >
135
-
136
- < div class ="grid " ui-grid ="gridOptions "> </ div >
137
137
</ div >
138
138
</ div >
139
- </ div >
140
-
141
- < div class =" text-error " > {{ cssErr }} </ div >
142
-
143
- < br >
144
-
145
- < label for =" customLess "> Custom Less </ label >
146
- < textarea class =" span8 " id =" customLess " rows =" 4 " ng-model =" customLess " ng-change =" updateCSS() " ng-init =" customLess = '' " > </ textarea >
147
-
148
- < br >
149
- < br >
139
+
140
+ < div class =" text-error " > {{ cssErr }} </ div >
141
+
142
+ < br >
143
+
144
+ < label for =" customLess " > Custom Less </ label >
145
+ < textarea class =" col-xs-12 " class =" form-control " id =" customLess " rows =" 4 " ng-model =" customLess " ng-change =" updateCSS() " ng-init =" customLess = '' " > </ textarea >
146
+
147
+ < br >
148
+ < br >
149
+ </ div >
150
150
151
151
< div ng-cloak ng-show ="showDownload " class ="modal ">
152
- < div class ="modal-header ">
153
- < button type ="button " class ="close " data-dismiss ="modal " aria-hidden ="true " ng-click ="showDownload = false "> ×</ button >
154
- < h3 > Download</ h3 >
155
- </ div >
156
- < div class ="modal-body ">
157
- < div class ="btn-group " data-toggle ="buttons-radio ">
158
- < button type ="button " class ="btn btn-success " ng-class ="{ 'active' : !compressed } " ng-click ="updateCSS(false) "> Full</ button >
159
- < button type ="button " class ="btn btn-success " ng-class ="{ 'active' : compressed } " ng-click ="updateCSS(true) "> Minified</ button >
152
+ < div class ="modal-dialog ">
153
+ < div class ="modal-content ">
154
+ < div class ="modal-header ">
155
+ < button type ="button " class ="close " data-dismiss ="modal " aria-hidden ="true " ng-click ="showDownload = false "> ×</ button >
156
+ < h3 > Download CSS</ h3 >
157
+ </ div >
158
+ < div class ="modal-body ">
159
+ < button class ="btn btn-success " ng-click ="updateCSS(!compress) "> {{ compress ? "Display Full" : "Display Minified" }}</ button >
160
+
161
+
162
+ < p class ="modal-message ">
163
+ < strong > Size:</ strong > {{ cssSize() }}
164
+ </ p >
165
+
166
+ < textarea hover-select row ="20 " class ="compiled-css col-xs-12 " readonly > {{ css }}</ textarea >
167
+ < p class ="modal-message ">
168
+ Hover then copy and paste the CSS.
169
+ </ p >
170
+ <!-- <button class="btn btn-success" data-clipboard-text="{{ css }}">Copy to Clipboard</button> -->
171
+ </ div >
172
+ < div class ="modal-footer ">
173
+ < a href ="# " class ="btn " ng-click ="showDownload = false "> Close</ a >
174
+ </ div >
160
175
</ div >
161
-
162
-
163
- < strong > Size:</ strong > {{ cssSize() }}
164
-
165
- < br >
166
- < br >
167
-
168
- < textarea hover-select row ="20 " class ="compiled-css span5 " readonly > {{ css }}</ textarea >
169
- < br >
170
- Hover then copy and paste the CSS.
171
- <!-- <button class="btn btn-success" data-clipboard-text="{{ css }}">Copy to Clipboard</button> -->
172
- </ div >
173
- < div class ="modal-footer ">
174
- < a href ="# " class ="btn " ng-click ="showDownload = false "> Close</ a >
175
176
</ div >
176
177
</ div >
177
178
@@ -194,11 +195,11 @@ <h3>Download</h3>
194
195
</script>
195
196
-->
196
197
197
- < script src ="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/js/bootstrap.min.js "> </ script >
198
+ < script src ="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js "> </ script >
199
+ <!-- <script src="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/js/bootstrap.min.js"></script> -->
198
200
< script src ="//ajax.googleapis.com/ajax/libs/angularjs/1.2.9/angular.js "> </ script >
199
201
200
202
< script >
201
- debugger ;
202
203
var s = document . createElement ( 'script' ) ;
203
204
if ( window . location . href . match ( 'ui-grid.info' ) ) {
204
205
s . src = '/release/ui-grid-unstable.js' ;
0 commit comments