Notes
Notes - notes.io |
include_once 'includes/db_connect.php';
include_once 'includes/functions.php';
sec_session_start();
if(login_check($mysqli) == false) {
// Add your protected page content here!
echo "<script>window.location = 'index.php'</script>";
}
$master_pic=$_SESSION['master_pic'];
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title>GeekDOM</title>
<link rel="icon" type="image/png" href="images/favicon.png" />
<link rel="stylesheet" href="styles/bootstrap.min.css" type="text/css" />
<link rel="stylesheet" href="styles/bootstrap.css" type="text/css" />
<script src="js/jquery.min.js"></script>
<script src="js/bootstrap.js" ></script>
<script src="js/bootstrap.min.js" > </script>
<script src="js/bootstrap-filestyle.min.js"> </script>
<script type="text/javascript">
$(document).ready(function(){
$(document).on("click",".morph",function(e){
var $this=$(this);
var decide = $(e.target).attr('idd');
$.ajax({
url: "get_badge.php",
type: 'GET',
data: 'post='+escape(decide),
success: function(data){
// alert(data);
$this.parents('body').find('#bulletin').html('');
$this.parents('body').find('#bulletin').append(data);
}
});
});
});
</script>
<link rel="stylesheet" href="styles/dashboard.css" type="text/css" />
</head>
<body>
<div class="navbar navbar-inverse navbar-fixed-top" role="navigation">
<div class="container">
<div class="navbar-header"> <a class="navbar-brand" href="#">IIT Indore</a> </div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav navbar-right">
<li><a href="wall.php"><span class="glyphicon glyphicon-th-large"></span> Wall </a></li>
<li><a href="profile.php"><span class="glyphicon glyphicon-user"></span>Chamber</a></li>
<li><a href="profile_change.php"><span class="glyphicon glyphicon-cog"></span> Settings</a></li>
<li><a href="logout.php"><span class="glyphicon glyphicon-off"></span> Logout</a></li>
</ul>
</div>
</div>
</div>
<div class="container-fluid">
<div class="col-md-2 sidebar">
<ul class="nav nav-sidebar">
<li>
<img src="<?php echo $master_pic;?>" class="img-profile" />
</li>
<br />
<li><a href="geek_search.php"><span class="glyphicon glyphicon-question-sign"></span> Search Geekness</a></li>
<li><a href="db_search.php"><span class="glyphicon glyphicon-search"></span> Search Database</a></li>
<li><a href="badge.php"><span class="glyphicon glyphicon-tower"></span> GeekDOM</a></li>
<li><a href="project.php"><span class="glyphicon glyphicon-book"></span> Projects</a></li>
<li><a href="faq.php"><span class="glyphicon glyphicon-hand-right"></span> FAQs</a></li>
</ul>
</div>
<style>
.container_1{
margin: auto;
width: 800px;
margin-top: 20px;
text-align: center;
margin-left: 300px;
height: 600px;
padding-top: 20px;
}
.up-image
{
position: absolute;
margin-left: 130px;
margin-top: 30px;
}
.circle {
width: 50%;
height:0;
padding-bottom: 50%;
margin-left: 200px;
-moz-border-radius: 50%;
-webkit-border-radius: 50%;
border-radius: 50%;
background: #4679BD;
margin-top: 50px;
}
.thumb img{
height: 60px;
width: 60px;
}
/*MORPH*/
.morph {
-webkit-transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
-o-transition: all 0.5s ease;
-ms-transition: all 0.5s ease;
transition: all 0.5s ease;
}
.morph:hover {
border-radius: 50%;
-webkit-transform: rotate(360deg);
-moz-transform: rotate(360deg);
-o-transform: rotate(360deg);
-ms-transform: rotate(360deg);
transform: rotate(360deg);
}
/**
* Mixin to put items on a circle
* [1] - Allows children to be absolutely positioned
* [2] - Allows the mixin to be used on a list
* [3] - In case box-sizing: border-box has been enabled
* [4] - Allows any type of direct children to be targeted
*/
.circle-container {
position: relative;
/* [1] */
width: 30em;
height: 30em;
padding: 0;
border-radius: 50%;
list-style: none;
/* [2] */
-moz-box-sizing: content-box;
-webkit-box-sizing: content-box;
box-sizing: content-box;
/* [3] */
margin: 1em auto 0;
}
.circle-container > * {
/* [4] */
display: block;
position: absolute;
top: 50%;
left: 50%;
width: 6em;
height: 6em;
margin: -3em;
}
.circle-container > *:nth-of-type(1) {
-moz-transform: rotate(0deg) translate(10em) rotate(-0deg);
-ms-transform: rotate(0deg) translate(10em) rotate(-0deg);
-webkit-transform: rotate(0deg) translate(10em) rotate(-0deg);
transform: rotate(0deg) translate(10em) rotate(-0deg);
}
.circle-container > *:nth-of-type(2) {
-moz-transform: rotate(30deg) translate(10em) rotate(-30deg);
-ms-transform: rotate(30deg) translate(10em) rotate(-30deg);
-webkit-transform: rotate(30deg) translate(10em) rotate(-30deg);
transform: rotate(30deg) translate(10em) rotate(-30deg);
}
.circle-container > *:nth-of-type(3) {
-moz-transform: rotate(60deg) translate(10em) rotate(-60deg);
-ms-transform: rotate(60deg) translate(10em) rotate(-60deg);
-webkit-transform: rotate(60deg) translate(10em) rotate(-60deg);
transform: rotate(60deg) translate(10em) rotate(-60deg);
}
.circle-container > *:nth-of-type(4) {
-moz-transform: rotate(90deg) translate(10em) rotate(-90deg);
-ms-transform: rotate(90deg) translate(10em) rotate(-90deg);
-webkit-transform: rotate(90deg) translate(10em) rotate(-90deg);
transform: rotate(90deg) translate(10em) rotate(-90deg);
}
.circle-container > *:nth-of-type(5) {
-moz-transform: rotate(120deg) translate(10em) rotate(-120deg);
-ms-transform: rotate(120deg) translate(10em) rotate(-120deg);
-webkit-transform: rotate(120deg) translate(10em) rotate(-120deg);
transform: rotate(120deg) translate(10em) rotate(-120deg);
}
.circle-container > *:nth-of-type(6) {
-moz-transform: rotate(150deg) translate(10em) rotate(-150deg);
-ms-transform: rotate(150deg) translate(10em) rotate(-150deg);
-webkit-transform: rotate(150deg) translate(10em) rotate(-150deg);
transform: rotate(150deg) translate(10em) rotate(-150deg);
}
.circle-container > *:nth-of-type(7) {
-moz-transform: rotate(180deg) translate(10em) rotate(-180deg);
-ms-transform: rotate(180deg) translate(10em) rotate(-180deg);
-webkit-transform: rotate(180deg) translate(10em) rotate(-180deg);
transform: rotate(180deg) translate(10em) rotate(-180deg);
}
.circle-container > *:nth-of-type(8) {
-moz-transform: rotate(210deg) translate(10em) rotate(-210deg);
-ms-transform: rotate(210deg) translate(10em) rotate(-210deg);
-webkit-transform: rotate(210deg) translate(10em) rotate(-210deg);
transform: rotate(210deg) translate(10em) rotate(-210deg);
}
.circle-container > *:nth-of-type(9) {
-moz-transform: rotate(240deg) translate(10em) rotate(-240deg);
-ms-transform: rotate(240deg) translate(10em) rotate(-240deg);
-webkit-transform: rotate(240deg) translate(10em) rotate(-240deg);
transform: rotate(240deg) translate(10em) rotate(-240deg);
}
.circle-container > *:nth-of-type(10) {
-moz-transform: rotate(270deg) translate(10em) rotate(-270deg);
-ms-transform: rotate(270deg) translate(10em) rotate(-270deg);
-webkit-transform: rotate(270deg) translate(10em) rotate(-270deg);
transform: rotate(270deg) translate(10em) rotate(-270deg);
}
.circle-container > *:nth-of-type(11) {
-moz-transform: rotate(300deg) translate(10em) rotate(-300deg);
-ms-transform: rotate(300deg) translate(10em) rotate(-300deg);
-webkit-transform: rotate(300deg) translate(10em) rotate(-300deg);
transform: rotate(300deg) translate(10em) rotate(-300deg);
}
.circle-container > *:nth-of-type(12) {
-moz-transform: rotate(330deg) translate(10em) rotate(-330deg);
-ms-transform: rotate(330deg) translate(10em) rotate(-330deg);
-webkit-transform: rotate(330deg) translate(10em) rotate(-330deg);
transform: rotate(330deg) translate(10em) rotate(-330deg);
}
.circle-container a {
display: block;
border-radius: 50%;
box-shadow: 0 0 0 0px blue;
}
.circle-container img {
display: block;
width: 80%;
border-radius: 50%;
}
.circle-container img:hover {
-webkit-filter: grayscale(0);
filter: grayscale(0);
}
</style>
<div class='container_1'>
<div class="geek_text"><h3 style="font-weight:bold;">Welcome to the GeekDom!<br></h3>
<p style="font-size:15px;color:#003366;font-weight:bold;">A place where geekers are honoured with respect and appreciations</p>
<p style="font-size:20px;font-weight:bold;">Hit the Shields!</p>
</div>
<ul class='circle-container' >
<li><a class='morph pic'><img idd="1" src='images/b1.png'></a></li>
<li><a class='morph pic'><img idd="2" src='images/b2.png'></a></li>
<li><a class='morph pic'><img idd="3" src='images/b3.png'></a></li>
<li><a class='morph pic'><img idd="4" src='images/b1.png'></a></li>
<li><a class='morph pic'><img idd="5" src='images/b2.png'></a></li>
<li><a class='morph pic'><img idd="6" src='images/b3.png'></a></li>
<li><a class='morph pic'><img idd="7" src='images/b1.png'></a></li>
<li><a class='morph pic'><img idd="8" src='images/b2.png'></a></li>
<li><a class='morph pic'><img idd="9" src='images/b3.png'></a></li>
<li><a class='morph pic'><img idd="10" src='images/b1.png'></a></li>
<li><a class='morph pic'><img idd="11" src='images/b2.png'></a></li>
<li><a class='morph pic'><img idd="12" src='images/b3.png'></a></li>
</ul>
<div id="bulletin">
<h2>#Being_a_geek</h2>
<p style="font-size:16px;color:#003366;font-weight:bold;">When you identify yourself as a geek, you are not saying anything about your personality traits or your ability to socialize,what you mean is that you are perpetually passionate about technology and applications,
that you enjoy making robots and writing codes, and that you feel that same giddy rush towards ineventions as some do towards literature.<br><br>
…but that’s different than what it means for you to be a geek, right? Or a nerd, whichever you prefer.
You might not like gaming or sci-fi at all. Maybe you like urban fantasy or mathematics. Maybe you like programming or kitbashing or writing fanfic.<br><br>
We might have some similar interests, you and I, but quite possibly, we may not like any of the same stuff at all. Yet here we are, sharing the same virtual space, feeling kinship in our geekhood.
but what does all geeks have in common?
The thing that all geeks have in common (other than carbon) is not what they are interested in, but how they go about consuming their interests. “Consuming” is the perfect word for it, because geeks are rarely a passive audience.They devour their interests. They are driven to know how things work. It isn’t enough for them just to enjoy something. When something piques their interest or elicits an emotional response from them, they have to know why. They have to dissect it, put it under a microscope, and come to understand it on a molecular level .They enjoy seeing things that were made by like-minded people. They like making things that require them to be meticulous.
They like using their brains, and they like to interact with other people who like using their brains, even if they don’t use their brains for the same things.<br><br>
They are, perhaps, the most enthusiastic people on the planet.<br><br>
That said, being a geek doesn’t require one to be a walking encyclopedia. Being a geek is all about one's own personal level of enthusiasm, not how his level of enthusiasm measures up to others.
If you like something so much that a casual mention of it makes your whole being light up like a halogen lamp, if hearing a stranger fondly mention your favorite book or game is instant grounds for friendship,
if you have ever found yourself bouncing out of your chair because something you learned blew your mind so hard that you physically could not contain yourself— you are a geek and this is the right place for you to show up yourself and take your greek pride and become the biggest geek of all time.!
so all you geekers out there..keep calm and geek on.!<br><br>
</p>
</div>
</body>
</html>
|
|
Notes.io is a web-based application for taking notes. You can take your notes and share with others people. If you like taking long notes, notes.io is designed for you. To date, over 8,000,000,000 notes created and continuing...
With notes.io;
- * You can take a note from anywhere and any device with internet connection.
- * You can share the notes in social platforms (YouTube, Facebook, Twitter, instagram etc.).
- * You can quickly share your contents without website, blog and e-mail.
- * You don't need to create any Account to share a note. As you wish you can use quick, easy and best shortened notes with sms, websites, e-mail, or messaging services (WhatsApp, iMessage, Telegram, Signal).
- * Notes.io has fabulous infrastructure design for a short link and allows you to share the note as an easy and understandable link.
Fast: Notes.io is built for speed and performance. You can take a notes quickly and browse your archive.
Easy: Notes.io doesn’t require installation. Just write and share note!
Short: Notes.io’s url just 8 character. You’ll get shorten link of your note when you want to share. (Ex: notes.io/q )
Free: Notes.io works for 12 years and has been free since the day it was started.
You immediately create your first note and start sharing with the ones you wish. If you want to contact us, you can use the following communication channels;
Email: [email protected]
Twitter: http://twitter.com/notesio
Instagram: http://instagram.com/notes.io
Facebook: http://facebook.com/notesio
Regards;
Notes.io Team
