mirror of
				https://github.com/mdbootstrap/mdb-ui-kit.git
				synced 2025-11-01 00:17:57 +03:00 
			
		
		
		
	
		
			
				
	
	
		
			155 lines
		
	
	
		
			4.2 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
			
		
		
	
	
			155 lines
		
	
	
		
			4.2 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
| <!DOCTYPE html>
 | |
| <html>
 | |
| 
 | |
| <head>
 | |
|   <title>TEST Material Design for Bootstrap</title>
 | |
|   <meta charset="utf-8">
 | |
|   <meta http-equiv="X-UA-Compatible" content="IE=edge">
 | |
| 
 | |
|   <!-- Mobile support -->
 | |
|   <meta name="viewport" content="width=device-width, initial-scale=1">
 | |
| 
 | |
|   <!-- Twitter Bootstrap -->
 | |
|   <link href="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet">
 | |
| 
 | |
|   <!-- Material Design for Bootstrap -->
 | |
|   <link href="dist/css/roboto.css" rel="stylesheet">
 | |
|   <link href="dist/css/material-fullpalette.css" rel="stylesheet">
 | |
|   <link href="dist/css/ripples.css" rel="stylesheet">
 | |
| 
 | |
|   <!-- Dropdown.js -->
 | |
|   <link href="//cdn.rawgit.com/FezVrasta/dropdown.js/master/jquery.dropdown.css" rel="stylesheet">
 | |
| 
 | |
|   <!-- Page style -->
 | |
|   <link href="index.css" rel="stylesheet">
 | |
| 
 | |
|   <!-- jQuery -->
 | |
|   <script src="//code.jquery.com/jquery-1.10.2.min.js"></script>
 | |
| 
 | |
| </head>
 | |
| <body>
 | |
| 
 | |
| <div class="container-fluid">
 | |
| 
 | |
| 
 | |
|   <!--<div class="form-group">-->
 | |
|   <!--<label for="inputFile" class="col-lg-2 control-label">File</label>-->
 | |
| 
 | |
|   <!--<div class="col-lg-10">-->
 | |
|   <!--<input type="text" readonly class="form-control floating-label" placeholder="Browse...">-->
 | |
|   <!--<input type="file" id="inputFile" multiple>-->
 | |
|   <!--</div>-->
 | |
|   <!--</div>-->
 | |
| 
 | |
|   <!--
 | |
|   <div class="fileinput input-group fileinput-new" data-provides="fileinput">
 | |
|     <div class="form-control" data-trigger="fileinput">
 | |
|       <i class="glyphicon glyphicon-file fileinput-exists"></i>
 | |
|       <span class="fileinput-filename"></span>
 | |
|     </div>
 | |
|     <span class="input-group-addon btn btn-default btn-file">
 | |
|       <span class="fileinput-new">Select file</span>
 | |
|       <span class="fileinput-exists">Change</span>
 | |
|       <input type="hidden" value="" name=""><input type="file" name="">
 | |
|     </span>
 | |
|     <a href="#" class="input-group-addon btn btn-default fileinput-exists" data-dismiss="fileinput">Remove</a>
 | |
|   </div>
 | |
|   -->
 | |
| 
 | |
|   <div class="row">
 | |
|     <div class="form-group">
 | |
|       <label for="inputFile" class="col-lg-2 control-label">Static Label</label>
 | |
| 
 | |
|       <div class="col-lg-10">
 | |
|         <input type="text" readonly class="form-control" placeholder="Browse...">
 | |
|         <input type="file" id="inputFile" multiple>
 | |
|       </div>
 | |
|     </div>
 | |
|   </div>
 | |
| 
 | |
|   <!-- this works
 | |
|   <div class="form-group">
 | |
|     <input type="file" id="inputFile" multiple>
 | |
|     <input type="text" readonly class="form-control" placeholder="Browse...">
 | |
|   </div>
 | |
|   -->
 | |
| 
 | |
|   <!--<h2>File inputs</h2>-->
 | |
|   <!-- http://codepen.io/kybarg/pen/PqaOOg -->
 | |
| 
 | |
|   <div class="form-group">
 | |
|     <label class="control-label" for="inputFile2">Static label</label>
 | |
|     <input type="file" id="inputFile2" multiple>
 | |
|     <input type="text" readonly class="form-control" placeholder="Browse2...">
 | |
|   </div>
 | |
| 
 | |
|   <div class="form-group">
 | |
|     <!--<label class="control-label" for="inputFile3">File</label>-->
 | |
|     <input type="file" id="inputFile3" multiple>
 | |
|     <input type="text" readonly class="form-control" placeholder="Placeholder only...">
 | |
|   </div>
 | |
| 
 | |
|   <div class="form-group">
 | |
|     <input type="file" id="inputFile4" multiple>
 | |
|     <div class="input-group">
 | |
|       <input type="text" readonly class="form-control" placeholder="Placeholder w/input-group...">
 | |
|       <span class="input-group-btn">
 | |
|         <button type="button" class="btn btn-fab btn-fab-mini btn-raised btn-sm">
 | |
|           <i class="mdi-editor-attach-file"></i>
 | |
|         </button>
 | |
|       </span>
 | |
|     </div>
 | |
|   </div>
 | |
| 
 | |
| </div>
 | |
| 
 | |
| <!-- Twitter Bootstrap -->
 | |
| <script src="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.5/js/bootstrap.min.js"></script>
 | |
| 
 | |
| <!-- Material Design for Bootstrap -->
 | |
| <script src="dist/js/material.js"></script>
 | |
| <script src="dist/js/ripples.js"></script>
 | |
| <script>
 | |
|   $.material.init();
 | |
| </script>
 | |
| 
 | |
| 
 | |
| <!-- Sliders -->
 | |
| <!--
 | |
| <script src="//cdnjs.cloudflare.com/ajax/libs/noUiSlider/6.2.0/jquery.nouislider.min.js"></script>
 | |
| <script>
 | |
| $(function () {
 | |
| $.material.init();
 | |
| $(".shor").noUiSlider({
 | |
| start: 40,
 | |
| connect: "lower",
 | |
| range: {
 | |
| min: 0,
 | |
| max: 100
 | |
| }
 | |
| });
 | |
| 
 | |
| $(".svert").noUiSlider({
 | |
| orientation: "vertical",
 | |
| start: 40,
 | |
| connect: "lower",
 | |
| range: {
 | |
| min: 0,
 | |
| max: 100
 | |
| }
 | |
| });
 | |
| });
 | |
| </script>
 | |
| -->
 | |
| 
 | |
| <!-- Dropdown.js -->
 | |
| <!--
 | |
| <script src="https://cdn.rawgit.com/FezVrasta/dropdown.js/master/jquery.dropdown.js"></script>
 | |
| <script>
 | |
| $("#dropdown-menu select").dropdown();
 | |
| </script>
 | |
| -->
 | |
| 
 | |
| </body>
 | |
| </html>
 |