Skip to content
GitLab
Switch branch/tag
Find file Normal viewHistoryPermalink
index.html 7.01 KB
Newer Older
Nicole's avatar
Update remaining templates to match starter template  
Nicole committed
1
2
3
4 
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
Julian Thilo's avatar
Disable IE Compatibility Mode in docs, examples    
Julian Thilo committed
5 
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
Zlatan Vasović's avatar
Improve <meta> tags    
Zlatan Vasović committed
6 
    <meta name="viewport" content="width=device-width, initial-scale=1">
Kevin Kirsche's avatar
Fix issue #15601 — Position of X-UA-Compatible    
Kevin Kirsche committed
7 
    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
Nicole's avatar
Update remaining templates to match starter template  
Nicole committed
8
9 
    <meta name="description" content="">
    <meta name="author" content="">
XhmikosR's avatar
Move apple-touch-icon-precomposed.png and favicon.ico in docs root.    
XhmikosR committed
10 
    <link rel="icon" href="../../favicon.ico">
Nicole's avatar
Update remaining templates to match starter template  
Nicole committed
11
Nicole's avatar
change file names to example names    
Nicole committed
12 
    <title>Off Canvas Template for Bootstrap</title>
Nicole's avatar
Update remaining templates to match starter template  
Nicole committed
13
14 

    <!-- Bootstrap core CSS -->
Mark Otto's avatar
hella examples fixing, mostly navbars and lots of work on grids example    
Mark Otto committed
15 
    <link href="../../dist/css/bootstrap.min.css" rel="stylesheet">
Nicole's avatar
Update remaining templates to match starter template  
Nicole committed
16
17 

    <!-- Custom styles for this template -->
Nicole's avatar
add git ignore    
Nicole committed
18 
    <link href="offcanvas.css" rel="stylesheet">
saiwang's avatar
add IE's Conditional comments for respondjs and html5shiv    
saiwang committed
19
Chris Rebert's avatar
add ie-emulation-modes-warning.js to docs & examples    
Chris Rebert committed
20 
    <!-- Just for debugging purposes. Don't actually copy these 2 lines! -->
wangsai's avatar
fix assets links in all examples    
wangsai committed
21 
    <!--[if lt IE 9]><script src="../../assets/js/ie8-responsive-file-warning.js"></script><![endif]-->
Chris Rebert's avatar
add ie-emulation-modes-warning.js to docs & examples    
Chris Rebert committed
22 
    <script src="../../assets/js/ie-emulation-modes-warning.js"></script>
Chris Rebert's avatar
Warn about IE8 + Respond.js + file:// problem in examples; fix #11019    
Chris Rebert committed
23
XhmikosR's avatar
Fix a small typo in comment.    
XhmikosR committed
24 
    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
saiwang's avatar
add IE's Conditional comments for respondjs and html5shiv    
saiwang committed
25 
    <!--[if lt IE 9]>
XhmikosR's avatar
Update html5shiv to 3.7.2.    
XhmikosR committed
26 
      <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
XhmikosR's avatar
Use the new respond.js URL.    
XhmikosR committed
27 
      <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
saiwang's avatar
add IE's Conditional comments for respondjs and html5shiv    
saiwang committed
28 
    <![endif]-->
Nicole's avatar
Update remaining templates to match starter template  
Nicole committed
29
30
31 
  </head>

  <body>
Patrick H. Lauke's avatar
Redundant role="navigation" on <nav>s    
Patrick H. Lauke committed
32 
    <nav class="navbar navbar-fixed-top navbar-inverse">
Nicole's avatar
Update remaining templates to match starter template  
Nicole committed
33 
      <div class="container">
Mark Otto's avatar
hella examples fixing, mostly navbars and lots of work on grids example    
Mark Otto committed
34 
        <div class="navbar-header">
Patrick H. Lauke's avatar
ARIA support for collapse    
Patrick H. Lauke committed
35 
          <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
Thanos Lefteris's avatar
Add toogle nav for screen readers in examples    
Thanos Lefteris committed
36 
            <span class="sr-only">Toggle navigation</span>
Mark Otto's avatar
hella examples fixing, mostly navbars and lots of work on grids example    
Mark Otto committed
37
38
39
40
41
42 
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </button>
          <a class="navbar-brand" href="#">Project name</a>
        </div>
Patrick H. Lauke's avatar
ARIA support for collapse    
Patrick H. Lauke committed
43 
        <div id="navbar" class="collapse navbar-collapse">
Nicole's avatar
Update remaining templates to match starter template  
Nicole committed
44
45
46
47
48 
          <ul class="nav navbar-nav">
            <li class="active"><a href="#">Home</a></li>
            <li><a href="#about">About</a></li>
            <li><a href="#contact">Contact</a></li>
          </ul>
ggam's avatar
Simplified Off Canvas example:    
ggam committed
49
50 
        </div><!-- /.nav-collapse -->
      </div><!-- /.container -->
Chris Rebert's avatar
consistently use <nav> instead of <div> for .navbar in docs    
Chris Rebert committed
51 
    </nav><!-- /.navbar -->
Nicole's avatar
Update remaining templates to match starter template  
Nicole committed
52
53
54
55 

    <div class="container">

      <div class="row row-offcanvas row-offcanvas-right">
Mark Otto's avatar
fixes alignment and nav list in offcanvas example    
Mark Otto committed
56
Mark Otto's avatar
hella examples fixing, mostly navbars and lots of work on grids example    
Mark Otto committed
57
58 
        <div class="col-xs-12 col-sm-9">
          <p class="pull-right visible-xs">
ggam's avatar
Simplified Off Canvas example:    
ggam committed
59 
            <button type="button" class="btn btn-primary btn-xs" data-toggle="offcanvas">Toggle nav</button>
Nicole's avatar
Update remaining templates to match starter template  
Nicole committed
60
61
62
63
64
65 
          </p>
          <div class="jumbotron">
            <h1>Hello, world!</h1>
            <p>This is an example to show the potential of an offcanvas layout pattern in Bootstrap. Try some responsive-range viewport sizes to see it in action.</p>
          </div>
          <div class="row">
thr3-arendt's avatar
Replace nonexistent .col-6 classes in offcanvas example with .col-xs-6    
thr3-arendt committed
66 
            <div class="col-xs-6 col-lg-4">
Nicole's avatar
Update remaining templates to match starter template  
Nicole committed
67
68 
              <h2>Heading</h2>
              <p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
Kevin Suttle's avatar
Add even more role="button" attributes    
Kevin Suttle committed
69 
              <p><a class="btn btn-default" href="#" role="button">View details &raquo;</a></p>
Chris Rebert's avatar
Fix #14856    
Chris Rebert committed
70 
            </div><!--/.col-xs-6.col-lg-4-->
thr3-arendt's avatar
Replace nonexistent .col-6 classes in offcanvas example with .col-xs-6    
thr3-arendt committed
71 
            <div class="col-xs-6 col-lg-4">
Nicole's avatar
Update remaining templates to match starter template  
Nicole committed
72
73 
              <h2>Heading</h2>
              <p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
Kevin Suttle's avatar
Add even more role="button" attributes    
Kevin Suttle committed
74 
              <p><a class="btn btn-default" href="#" role="button">View details &raquo;</a></p>
Chris Rebert's avatar
Fix #14856    
Chris Rebert committed
75 
            </div><!--/.col-xs-6.col-lg-4-->
thr3-arendt's avatar
Replace nonexistent .col-6 classes in offcanvas example with .col-xs-6    
thr3-arendt committed
76 
            <div class="col-xs-6 col-lg-4">
Nicole's avatar
Update remaining templates to match starter template  
Nicole committed
77
78 
              <h2>Heading</h2>
              <p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
Kevin Suttle's avatar
Add even more role="button" attributes    
Kevin Suttle committed
79 
              <p><a class="btn btn-default" href="#" role="button">View details &raquo;</a></p>
Chris Rebert's avatar
Fix #14856    
Chris Rebert committed
80 
            </div><!--/.col-xs-6.col-lg-4-->
thr3-arendt's avatar
Replace nonexistent .col-6 classes in offcanvas example with .col-xs-6    
thr3-arendt committed
81 
            <div class="col-xs-6 col-lg-4">
Nicole's avatar
Update remaining templates to match starter template  
Nicole committed
82
83 
              <h2>Heading</h2>
              <p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
Kevin Suttle's avatar
Add even more role="button" attributes    
Kevin Suttle committed
84 
              <p><a class="btn btn-default" href="#" role="button">View details &raquo;</a></p>
Chris Rebert's avatar
Fix #14856    
Chris Rebert committed
85 
            </div><!--/.col-xs-6.col-lg-4-->
thr3-arendt's avatar
Replace nonexistent .col-6 classes in offcanvas example with .col-xs-6    
thr3-arendt committed
86 
            <div class="col-xs-6 col-lg-4">
Nicole's avatar
Update remaining templates to match starter template  
Nicole committed
87
88 
              <h2>Heading</h2>
              <p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
Kevin Suttle's avatar
Add even more role="button" attributes    
Kevin Suttle committed
89 
              <p><a class="btn btn-default" href="#" role="button">View details &raquo;</a></p>
Chris Rebert's avatar
Fix #14856    
Chris Rebert committed
90 
            </div><!--/.col-xs-6.col-lg-4-->
thr3-arendt's avatar
Replace nonexistent .col-6 classes in offcanvas example with .col-xs-6    
thr3-arendt committed
91 
            <div class="col-xs-6 col-lg-4">
Nicole's avatar
Update remaining templates to match starter template  
Nicole committed
92
93 
              <h2>Heading</h2>
              <p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
Kevin Suttle's avatar
Add even more role="button" attributes    
Kevin Suttle committed
94 
              <p><a class="btn btn-default" href="#" role="button">View details &raquo;</a></p>
Chris Rebert's avatar
Fix #14856    
Chris Rebert committed
95 
            </div><!--/.col-xs-6.col-lg-4-->
Nicole's avatar
Update remaining templates to match starter template  
Nicole committed
96 
          </div><!--/row-->
Chris Rebert's avatar
Fix #14856    
Chris Rebert committed
97 
        </div><!--/.col-xs-12.col-sm-9-->
Mark Otto's avatar
hella examples fixing, mostly navbars and lots of work on grids example    
Mark Otto committed
98
Patrick H. Lauke's avatar
Redundant role="navigation" on <nav>s    
Patrick H. Lauke committed
99 
        <div class="col-xs-6 col-sm-3 sidebar-offcanvas" id="sidebar">
Mark Otto's avatar
fixes alignment and nav list in offcanvas example    
Mark Otto committed
100
101
102
103
104
105
106
107
108
109
110
111 
          <div class="list-group">
            <a href="#" class="list-group-item active">Link</a>
            <a href="#" class="list-group-item">Link</a>
            <a href="#" class="list-group-item">Link</a>
            <a href="#" class="list-group-item">Link</a>
            <a href="#" class="list-group-item">Link</a>
            <a href="#" class="list-group-item">Link</a>
            <a href="#" class="list-group-item">Link</a>
            <a href="#" class="list-group-item">Link</a>
            <a href="#" class="list-group-item">Link</a>
            <a href="#" class="list-group-item">Link</a>
          </div>
Chris Rebert's avatar
Fix #14856    
Chris Rebert committed
112 
        </div><!--/.sidebar-offcanvas-->
Nicole's avatar
Update remaining templates to match starter template  
Nicole committed
113
114
115
116
117 
      </div><!--/row-->

      <hr>

      <footer>
Julian Thilo's avatar
Update copyright notices in all places    
Julian Thilo committed
118 
        <p>&copy; Company 2014</p>
Nicole's avatar
Update remaining templates to match starter template  
Nicole committed
119
120
121
122 
      </footer>

    </div><!--/.container-->
Mark Otto's avatar
add respond.js to all examples (fixes #9731)    
Mark Otto committed
123
124
125
126 

    <!-- Bootstrap core JavaScript
    ================================================== -->
    <!-- Placed at the end of the document so the pages load faster -->
XhmikosR's avatar
Update jQuery to v1.11.3.    
XhmikosR committed
127 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
XhmikosR's avatar
Add a local jQuery fallback.    
XhmikosR committed
128 
    <script>window.jQuery || document.write('<script src="../../assets/js/vendor/jquery.min.js"><\/script>')</script>
Mark Otto's avatar
hella examples fixing, mostly navbars and lots of work on grids example    
Mark Otto committed
129 
    <script src="../../dist/js/bootstrap.min.js"></script>
Chris Rebert's avatar
Fix #14164: move Windows Phone 8 IE10 viewport bug workaround script to footer of pages    
Chris Rebert committed
130
131 
    <!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
    <script src="../../assets/js/ie10-viewport-bug-workaround.js"></script>
Nicole's avatar
add git ignore    
Nicole committed
132 
    <script src="offcanvas.js"></script>
Nicole's avatar
Update remaining templates to match starter template  
Nicole committed
133 
  </body>
Mark Otto's avatar
add respond.js to all examples (fixes #9731)    
Mark Otto committed
134 
</html>