Skip to content

Instantly share code, notes, and snippets.

@shivasurya

shivasurya/index.html

Last active August 29, 2015 14:04
Show Gist options
  • Save shivasurya/01780d36e957e6988f96 to your computer and use it in GitHub Desktop.
Save shivasurya/01780d36e957e6988f96 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
index.html
<!DOCTYPE html>
<html>
<head>
<!-- Latest compiled and minified CSS -->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
</head>
<body>
</div>
</div>
<div class="jumbotron" style="background:transparent;">
<div class="row">
<div class="container">
<div class="col-md-6" style="padding:10px;">
<ul id="myTab" class="nav nav-tabs" style="color:white;background-color:black">
<li class="active">
<a href="#home" data-toggle="tab">
Status Update
</a>
</li>
<li><a href="#link" data-toggle="tab">Link Share</a></li>
<li class="dropdown">
<a href="#" id="myTabDrop1" class="dropdown-toggle"
data-toggle="dropdown">Others
<b class="caret"></b>
</a>
<ul class="dropdown-menu" role="menu" aria-labelledby="myTabDrop1">
<li><a href="#photo" tabindex="-1" data-toggle="tab">Photo</a></li>
<li><a href="#media" tabindex="-1" data-toggle="tab">Media Updates</a></li>
</ul>
</li>
</ul><div id="myTabContent" class="tab-content" style="opacity:1;">
<div class="tab-pane fade in active" id="home">
<!-- status update tab --><p><h3>Status Update : </h3></p>
<form class="form-horizontal" role="form">
<div class="form-group">
<div class="col-sm-12">
<textarea class="form-control" id="statusupdates"
placeholder="Share plain text update..." rows="3"></textarea>
</div>
</div>
<div class="form-group">
<div class="col-sm-12">
<button name="status" class="btn btn-sm btn-primary"><span class="glyphicon glyphicon-pencil"></span>&nbsp;Post Update</button>
<button name="status" class="btn btn-sm btn-warning"><span class="glyphicon glyphicon-calendar"></span>&nbsp;Draft Update</button>
<button name="status" class="btn btn-sm btn-danger"><span class="glyphicon glyphicon-remove-circle"></span>&nbsp;Cancel</button>
</div>
</div></form>
</div>
<div class="tab-pane fade" id="link">
<p><h3>Share a link : </h3></p>
<form class="form-horizontal" role="form">
<div class="form-group">
<div class="col-sm-12">
<input type="text" class="form-control" id="linkurl"
placeholder="Paste a url here..." />
</div>
</div>
<div class="form-group">
<div class="col-sm-12">
<input type="text" class="form-control" id="imgurl"
placeholder="Paste a image url here.." />
</div>
</div>
<div class="form-group">
<div class="col-sm-12">
<textarea class="form-control" id="desc"
placeholder="Paste Your Title Here..." rows="3" ></textarea>
</div>
</div>
<div class="form-group">
<div class="col-sm-12">
<textarea class="form-control" id="desc"
placeholder="Paste Your message Here..." rows="2" ></textarea>
</div>
</div>
<div class="form-group">
<div class="col-sm-12">
<textarea class="form-control" id="desc"
placeholder="Paste a description here..." rows="3" ></textarea>
</div>
</div>
<div class="form-group">
<div class="col-sm-12">
<button name="status" class="btn btn-sm btn-primary"><span class="glyphicon glyphicon-pencil"></span>&nbsp;Post Update</button>
<button name="status" class="btn btn-sm btn-warning"><span class="glyphicon glyphicon-calendar"></span>&nbsp;Draft Update</button>
<button name="status" class="btn btn-sm btn-danger"><span class="glyphicon glyphicon-remove-circle"></span>&nbsp;Cancel</button>
</div>
</div></form>
</div>
<div class="tab-pane fade" id="photo">
<!-- status photo tab -->
</div>
<div class="tab-pane fade" id="media">
<!-- media update tab -->
</div>
</div>
<div> facebook | Linkedin | twitter </div>
</div>
</div>
</div>
</div>
<footer style="">
<div class="container" style="margin:0px;padding:0px;width:100%;color:white;">
<hr>
<p>&copy; s.shivasurya | i-visionblog.com - 2014 - Home - Privacy Policy - Terms and Conditions - Cookies</p></div>
</footer>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment