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>
							 |