Skip to content
GitLab
Switch branch/tag
Find file Normal viewHistoryPermalink
dropdown.html 4.93 KB
Newer Older
fat's avatar
Adds isolated visual tests for javascript plugins (decoupled from docs). This makes it  
fat committed
1
2
3 
<!DOCTYPE html>
<html>
<head>
Heinrich Fenkart's avatar
Update head of all visual tests to use our basic template    
Heinrich Fenkart committed
4
5
6 
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1">
fat's avatar
Adds isolated visual tests for javascript plugins (decoupled from docs). This makes it  
fat committed
7 
  <title>Dropdown</title>
Heinrich Fenkart's avatar
Update head of all visual tests to use our basic template    
Heinrich Fenkart committed
8 
  <link rel="stylesheet" href="../../../dist/css/bootstrap.min.css">
fat's avatar
remove closureness from plugins    
fat committed
9
10
11
12
13
14
15 

  <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
  <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
  <!--[if lt IE 9]>
    <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
    <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
  <![endif]-->
fat's avatar
Adds isolated visual tests for javascript plugins (decoupled from docs). This makes it  
fat committed
16
17
18
19
20
21
22
23
24 
</head>
<body>

<div class="container">

  <div class="page-header">
    <h1>Dropdown <small>Bootstrap Visual Test</small></h1>
  </div>
Jacob Thornton's avatar
fix dropdown js visual example    
Jacob Thornton committed
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75 
  <nav id="navbar-example" class="navbar navbar-light bg-faded" role="navigation">
    <button class="navbar-toggler hidden-sm-up" type="button" data-toggle="collapse" data-target="#exCollapsingNavbar2">
      &#9776;
    </button>

    <div class="collapse navbar-toggleable-xs" id="exCollapsingNavbar2">

      <ul class="nav navbar-nav pull-left">

        <li class="dropdown nav-item">
          <a id="drop1" href="#" role="button" class="dropdown-toggle nav-link" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
            Dropdown
          </a>
          <div class="dropdown-menu" aria-labelledby="drop1">
            <a class="dropdown-item" href="https://twitter.com/fat">Action</a>
            <a class="dropdown-item" href="https://twitter.com/fat">Another action</a>
            <a class="dropdown-item" href="https://twitter.com/fat">Something else here</a>
            <div class="dropdown-divider"></div>
            <a class="dropdown-item" href="https://twitter.com/fat">Separated link</a>
          </div>
        </li>

        <li class="dropdown nav-item">
          <a href="#" id="drop2" role="button" class="dropdown-toggle nav-link" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
            Dropdown 2
          </a>
          <div class="dropdown-menu" aria-labelledby="drop2">
            <a class="dropdown-item" href="https://twitter.com/fat">Action</a>
            <a class="dropdown-item" href="https://twitter.com/fat">Another action</a>
            <a class="dropdown-item" href="https://twitter.com/fat">Something else here</a>
            <div class="dropdown-divider"></div>
            <a class="dropdown-item" href="https://twitter.com/fat">Separated link</a>
          </div>
        </li>

      </ul>

      <ul class="nav navbar-nav pull-right">
        <li id="fat-menu" class="dropdown nav-item">
          <a href="#" id="drop3" role="button" class="dropdown-toggle nav-link" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
            Dropdown 3
          </a>
          <div class="dropdown-menu" aria-labelledby="drop3">
            <a class="dropdown-item" href="https://twitter.com/fat">Action</a>
            <a class="dropdown-item" href="https://twitter.com/fat">Another action</a>
            <a class="dropdown-item" href="https://twitter.com/fat">Something else here</a>
            <div class="dropdown-divider"></div>
            <a class="dropdown-item" href="https://twitter.com/fat">Separated link</a>
          </div>
        </li>
      </ul>
fat's avatar
Adds isolated visual tests for javascript plugins (decoupled from docs). This makes it  
fat committed
76
77
78 
    </div>
  </nav>
Jacob Thornton's avatar
fix dropdown js visual example    
Jacob Thornton committed
79 
  <ul class="nav nav-pills m-t-lg">
fat's avatar
add dropdown    
fat committed
80
81 
    <li class="active nav-item"><a href="#" class="nav-link">Regular link</a></li>
    <li class="dropdown nav-item">
Mark Otto's avatar
Merge branch 'master' into v4    
Mark Otto committed
82
83
84 
      <a id="drop4" class="nav-link" role="button" data-toggle="dropdown" href="#" aria-haspopup="true" aria-expanded="false">
        Dropdown
      </a>
Heinrich Fenkart's avatar
Docs: Update all dropdowns to new HTML structure    
Heinrich Fenkart committed
85 
      <div id="menu1" class="dropdown-menu" aria-labelledby="drop4">
Jacob Thornton's avatar
fix dropdown js visual example    
Jacob Thornton committed
86
87
88
89
90 
        <a class="dropdown-item" href="https://twitter.com/fat">Action</a>
        <a class="dropdown-item" href="https://twitter.com/fat">Another action</a>
        <a class="dropdown-item" href="https://twitter.com/fat">Something else here</a>
        <div class="dropdown-divider"></div>
        <a class="dropdown-item" href="https://twitter.com/fat">Separated link</a>
Heinrich Fenkart's avatar
Docs: Update all dropdowns to new HTML structure    
Heinrich Fenkart committed
91 
      </div>
fat's avatar
Adds isolated visual tests for javascript plugins (decoupled from docs). This makes it  
fat committed
92 
    </li>
fat's avatar
add dropdown    
fat committed
93 
    <li class="dropdown nav-item">
Mark Otto's avatar
Merge branch 'master' into v4    
Mark Otto committed
94
95
96 
      <a id="drop5" class="nav-link" role="button" data-toggle="dropdown" href="#" aria-haspopup="true" aria-expanded="false">
        Dropdown 2
      </a>
Heinrich Fenkart's avatar
Docs: Update all dropdowns to new HTML structure    
Heinrich Fenkart committed
97 
      <div id="menu2" class="dropdown-menu" aria-labelledby="drop5">
Jacob Thornton's avatar
fix dropdown js visual example    
Jacob Thornton committed
98
99
100
101
102 
        <a class="dropdown-item" href="https://twitter.com/fat">Action</a>
        <a class="dropdown-item" href="https://twitter.com/fat">Another action</a>
        <a class="dropdown-item" href="https://twitter.com/fat">Something else here</a>
        <div class="dropdown-divider"></div>
        <a class="dropdown-item" href="https://twitter.com/fat">Separated link</a>
Heinrich Fenkart's avatar
Docs: Update all dropdowns to new HTML structure    
Heinrich Fenkart committed
103 
      </div>
fat's avatar
Adds isolated visual tests for javascript plugins (decoupled from docs). This makes it  
fat committed
104
105
106
107
108
109
110 
    </li>
  </ul>

</div>

<!-- JavaScript Includes -->
<script src="../vendor/jquery.min.js"></script>
fat's avatar
add dropdown    
fat committed
111
112
113 
<script src="../../dist/util.js"></script>
<script src="../../dist/dropdown.js"></script>
<script src="../../dist/collapse.js"></script>
fat's avatar
Adds isolated visual tests for javascript plugins (decoupled from docs). This makes it  
fat committed
114
115
116 

</body>
</html>