94 lines
		
	
	
		
			4.3 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
		
		
			
		
	
	
			94 lines
		
	
	
		
			4.3 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
|  | <div class="panel panel-default"> | ||
|  |   <div class="panel-heading pb-0"> | ||
|  |     <ul class="nav nav-tabs" role="tablist"> | ||
|  |       <li role="presentation" class="active"><a href="!#upload" class="quick-create-tab" aria-controls="upload" role="tab" data-toggle="tab"><i class="fa fa-upload" aria-hidden="true"></i> Upload something</a></li> | ||
|  |       <li role="presentation"><a href="!#send" class="quick-create-tab" aria-controls="send" role="tab" data-toggle="tab"><i class="fa fa-comment" aria-hidden="true"></i> Share with person</a></li> | ||
|  |     </ul> | ||
|  |   </div> | ||
|  |   <div class="panel-body"> | ||
|  |     <div class="tab-content"> | ||
|  |       <div role="tabpanel" class="tab-pane active" id="upload"> | ||
|  |         <div class="text-center select-file"> | ||
|  |           <input type="text" class="form-control" placeholder="Start typing to create a post, note, or document"></input> | ||
|  |           or Drag and drop or <button type="button" name="button" class="btn btn-default">Choose a File</button> | ||
|  |         </div> | ||
|  |       </div> | ||
|  |       <div role="tabpanel" class="tab-pane" id="send"> | ||
|  |         <div class="media"> | ||
|  |           <div class="media-left"> | ||
|  |             <div class="image-thing"><i class="fa fa-user fa-3x" aria-hidden="true"></i></div> | ||
|  |           </div> | ||
|  |           <div class="media-body"> | ||
|  |             <div class="form-group"> | ||
|  |               <input type="text" class="form-control" placeholder="Contact name(s) or email(s)"> | ||
|  |             </div> | ||
|  |             <div class="form-group"> | ||
|  |               <label for="">add subject:</label> | ||
|  |               <textarea name="name" class="form-control" rows="8" cols="80" placeholder="Type your message"></textarea> | ||
|  |               <br> | ||
|  |               <div class="pull-right"> | ||
|  |                 <a class=""><i class="fa fa-paperclip fa-2x" aria-hidden="true"></i></a> | ||
|  |                 <button type="button" name="button" class="btn btn-default">Share</button> | ||
|  |               </div> | ||
|  |             </div> | ||
|  |           </div> | ||
|  |         </div> | ||
|  |       </div> | ||
|  |       <div role="tabpanel" class="tab-pane" id="sync"> | ||
|  |         <div class="select-device-container text-center"> | ||
|  |           <div class="btn-group"> | ||
|  |             <button type="button" class="btn btn-default">Choose a device</button> | ||
|  |             <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> | ||
|  |               <span class="caret"></span> | ||
|  |               <span class="sr-only">Toggle Dropdown</span> | ||
|  |             </button> | ||
|  |             <ul class="dropdown-menu"> | ||
|  |               <li><a>My Macbook</a></li> | ||
|  |               <li><a>My Samsung Galaxy</a></li> | ||
|  |               <li><a>John's Macbook</a></li> | ||
|  |             </ul> | ||
|  |           </div> | ||
|  |         </div> | ||
|  |       </div> | ||
|  |     </div> | ||
|  |   </div> | ||
|  |   <div class="panel-footer"> | ||
|  |     <div class="uploaded-info"> | ||
|  |       <p><strong>type:</strong> <span class="badge select-badge"> Document</span><span class="select-badge"> N/A</span></p> | ||
|  |       <p><strong>Location:</strong> Documents > 2017-07-01.txt</p> | ||
|  |       <button type="button" name="button" class="btn btn-default save-btn">Save</button> | ||
|  |     </div> | ||
|  |   </div> | ||
|  | </div> | ||
|  | 
 | ||
|  | <div class="shared-music"> | ||
|  |   <div class="panel panel-default"> | ||
|  |     <div class="panel-body"> | ||
|  |       <div class="media"> | ||
|  |         <h5 class="media-heading">Uploaded a file moments ago</h5> | ||
|  |         <hr> | ||
|  |         <div class="media-left"> | ||
|  |           <div class="image-thing"><i class="fa fa-music fa-3x" aria-hidden="true"></i></div> | ||
|  |         </div> | ||
|  |         <div class="media-body"> | ||
|  |            <h3 class="media-heading">Taylor Swift</h3> | ||
|  |            <h5 class="media-heading">1989</h5> | ||
|  |            <h4 class="media-heading">Teardrops on my guitar</h4> | ||
|  |         </div> | ||
|  |         <div class="media-footer"> | ||
|  |           <div class="media-player"> | ||
|  |             <i class="fa fa-play-circle-o fa-3x" aria-hidden="true"></i> | ||
|  |           </div> | ||
|  |         </div> | ||
|  |       </div> | ||
|  |     </div> | ||
|  |     <div class="panel-footer"> | ||
|  |       <div class="button-group flex-row space-around"> | ||
|  |         <button type="button" name="button" class="btn btn-default"><i class="fa fa-user" aria-hidden="true"></i> Share</button> | ||
|  |         <button type="button" name="button" class="btn btn-default" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false"><i class="fa fa-laptop" aria-hidden="true"></i> Sync to ...</button> | ||
|  |         <button type="button" name="button" class="btn btn-default"><i class="fa fa-globe" aria-hidden="true"></i> Publish</button> | ||
|  |       </div> | ||
|  |     </div> | ||
|  |   </div> | ||
|  | </div> |