Visnu First Commit

homepage/admin.py

@@ -0,0 +1,3 @@
+from django.contrib import admin
+
+# Register your models here.

homepage/models.py

@@ -0,0 +1,3 @@
+from django.db import models
+
+# Create your models here.

homepage/static/homepage/css/homecss.css

@@ -0,0 +1,285 @@
+body
+{
+	 background-color: #FFFF00;
+	 background-image: url("../images/img3.jpg");
+	 background-repeat: no-repeat;
+   background-attachment: fixed;
+	 background-size:  cover;
+   height: 200px;
+   width: 100%;
+   margin: 0;
+   padding: 0;
+   font-size: 50px;
+}
+.Intro
+{
+	position: relative;
+	font-size: 50px;
+	text-align: center;	
+}
+#calmenu
+{
+  float: right;
+
+}
+{
+	display: inline-block;
+  float:left;
+}
+.Intro h1
+{
+  padding: 20%;
+	text-align: center;
+  vertical-align: middle;
+}
+.Recent
+{
+  width:45%;
+  margin-right: 2%;
+  margin: 3%;
+  background-color: blue;
+  display:inline-block;
+}
+@import url(https://fonts.googleapis.com/css?family=Averia+Sans+Libre:700|Merriweather);
+body {
+  font-family: 'Merriweather', serif;
+  font-size: 16px;
+  line-height: 1.8;
+  /*color: SlateGrey;*/
+}
+
+h1 {
+  /*font-family: 'Averia Sans Libre', cursive;*/
+  font-size: 64px;
+}
+
+header {
+  /*padding: 100px 0;*/
+  position: relative;
+  background: CadetBlue;
+  color: Bisque;
+}
+
+article {
+  padding: 50px 0;
+}
+
+footer {
+  padding: 20px 0;
+  background: CadetBlue;
+  text-align: center;
+}
+footer a, footer a:hover, footer a:focus, footer a:active {
+  color: Wheat;
+  -webkit-transition: all 0.2s ease;
+  -moz-transition: all 0.2s ease;
+  -ms-transition: all 0.2s ease;
+  transition: all 0.2s ease;
+}
+footer a:hover, footer a:hover:hover, footer a:focus:hover, footer a:active:hover {
+  color: WhiteSmoke;
+  text-decoration: none;
+  letter-spacing: 2px;
+}
+
+.hamburger {
+  position: fixed;
+  top: 20px;
+  left: 0;
+  cursor: pointer;
+  z-index: 1000;
+  padding: 10px 15px 5px;
+}
+.hamburger span {
+  vertical-align: middle;
+}
+.hamburger .bars {
+  display: block;
+  position: relative;
+  width: 35px;
+  height: 5px;
+  background-color: rgba(18, 59, 61, 0.7);
+  -webkit-transition: all 0.2s ease;
+  -moz-transition: all 0.2s ease;
+  -ms-transition: all 0.2s ease;
+  transition: all 0.2s ease;
+}
+.hamburger .bars:before, .hamburger .bars:after {
+  position: absolute;
+  content: " ";
+  width: 100%;
+  height: 5px;
+  background-color: rgba(18, 59, 61, 0.7);
+  -webkit-transition: all 0.2s ease;
+  -moz-transition: all 0.2s ease;
+  -ms-transition: all 0.2s ease;
+  transition: all 0.2s ease;
+}
+.hamburger .bars:before {
+  top: 10px;
+}
+.hamburger .bars:after {
+  bottom: 10px;
+}
+
+.open .hamburger .bars {
+  background-color: transparent;
+  -webkit-transition: all 0.2s ease;
+  -moz-transition: all 0.2s ease;
+  -ms-transition: all 0.2s ease;
+  transition: all 0.2s ease;
+}
+.open .hamburger .bars::before {
+  top: 0;
+  -webkit-transform: rotate(-45deg);
+  -moz-transform: rotate(-45deg);
+  -ms-transform: rotate(-45deg);
+  transform: rotate(-45deg);
+}
+.open .hamburger .bars::after {
+  bottom: 0;
+  -webkit-transform: rotate(45deg);
+  -moz-transform: rotate(45deg);
+  -ms-transform: rotate(45deg);
+  transform: rotate(45deg);
+}
+
+.menu {
+  width: 250px;
+  height: 100%;
+  padding: 75px 20px 0;
+  background-color: rgba(0,0,0,1.0);
+  /*background-image: url("../images/sky.jpg");*/
+  background-repeat: no-repeat;
+  background-size: cover;
+  box-shadow: 0 0 5px rgba(0, 0, 0, 0.7);
+  position: fixed;
+  left: -100%;
+  top: 0;
+  opacity: 0;
+  z-index: 999;
+  margin-top: 0;
+  -webkit-transition: all 0.2s ease;
+  -moz-transition: all 0.2s ease;
+  -ms-transition: all 0.2s ease;
+  transition: all 0.2s ease;
+}
+.menu a {
+  color: WhiteSmoke;
+  padding-bottom: 15%;
+}
+.menu a:hover {
+  color: white;
+}
+
+.open .menu {
+  left: 0;
+  opacity: 1;
+  -webkit-transition: all 0.2s ease;
+  -moz-transition: all 0.2s ease;
+  -ms-transition: all 0.2s ease;
+  transition: all 0.2s ease;
+}
+
+.menu:hover {
+  overflow-y: auto;
+}
+
+.menu {
+
+}
+.about-div{
+  display: inline-block;
+  width: 30%;
+  padding-right: 2%; 
+  height:100%;
+  border-style: solid;
+  border-radius: 5%;
+  border-width: 2px;
+  text-align: center;
+  margin-bottom: 5%;
+}
+.about-head{
+  text-align: center;
+}
+.about-head h3{
+  background-color: rgba(135,206,250,0.5);
+}
+.whole{
+  border-bottom: 30%;
+  padding-left: 3%;
+  margin-bottom: 30%;
+}
+.about-club{
+  font
+}
+li{
+  padding: 30%;
+  border-width: 2px;
+}
+p{
+  padding-left: 10%;
+  padding-right: 10%;
+}
+a img{
+  width: 35px;
+  height: 35px;
+}
+.social a{
+  padding: 10%;
+}
+/*body{background-color:#000; overflow:hidden;}
+
+html body [data-ca3_iconfont="ETmodules"]::before {
+    font-family: "ETmodules";
+}
+[data-ca3_icon]::before {
+    font-weight: normal;
+    content: attr(data-ca3_icon);
+}
+
+.ca3-scroll-down-arrow {
+  background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48IURPQ1RZUEUgc3ZnIFBVQkxJQyAiLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4iICJodHRwOi8vd3d3LnczLm9yZy9HcmFwaGljcy9TVkcvMS4xL0RURC9zdmcxMS5kdGQiPjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0iQ2hldnJvbl90aGluX2Rvd24iIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IiB2aWV3Qm94PSIwIDAgMjAgMjAiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDIwIDIwIiBmaWxsPSJ3aGl0ZSIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+PHBhdGggZD0iTTE3LjQxOCw2LjEwOWMwLjI3Mi0wLjI2OCwwLjcwOS0wLjI2OCwwLjk3OSwwYzAuMjcsMC4yNjgsMC4yNzEsMC43MDEsMCwwLjk2OWwtNy45MDgsNy44M2MtMC4yNywwLjI2OC0wLjcwNywwLjI2OC0wLjk3OSwwbC03LjkwOC03LjgzYy0wLjI3LTAuMjY4LTAuMjctMC43MDEsMC0wLjk2OWMwLjI3MS0wLjI2OCwwLjcwOS0wLjI2OCwwLjk3OSwwTDEwLDEzLjI1TDE3LjQxOCw2LjEwOXoiLz48L3N2Zz4=);
+  background-size: contain;
+  background-repeat: no-repeat;
+}
+
+.ca3-scroll-down-link {
+  cursor:pointer;
+  height: 60px;
+  width: 80px;
+  margin: 0px 0 0 -40px;
+  line-height: 60px;
+  position: absolute;
+  left: 50%;
+  bottom: 0px;
+  color: #FFF;
+  text-align: center;
+  font-size: 70px;
+  z-index: 100;
+  text-decoration: none;
+  text-shadow: 0px 0px 3px rgba(0, 0, 0, 0.4);
+
+  -webkit-animation: ca3_fade_move_down 2s ease-in-out infinite;
+  -moz-animation:    ca3_fade_move_down 2s ease-in-out infinite;
+  animation:         ca3_fade_move_down 2s ease-in-out infinite;
+}
+
+
+/*animated scroll arrow animation
+@-webkit-keyframes ca3_fade_move_down {
+  0%   { -webkit-transform:translate(0,-20px); opacity: 0;  }
+  50%  { opacity: 1;  }
+  100% { -webkit-transform:translate(0,20px); opacity: 0; }
+}
+@-moz-keyframes ca3_fade_move_down {
+  0%   { -moz-transform:translate(0,-20px); opacity: 0;  }
+  50%  { opacity: 1;  }
+  100% { -moz-transform:translate(0,20px); opacity: 0; }
+}
+@keyframes ca3_fade_move_down {
+  0%   { transform:translate(0,-20px); opacity: 0;  }
+  50%  { opacity: 1;  }
+  100% { transform:translate(0,20px); opacity: 0; }
+}
+*/

homepage/templates/homepage/homepage.html

@@ -0,0 +1,101 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+	<meta charset="UTF-8">
+	<title>NJACK</title>
+	<link rel="stylesheet" href="css/homecss.css">
+	<script src = "js/homejs.js"></script>
+	<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
+	<script>
+    $(document).ready(function(){
+    $(".hamburger").click(function()
+    {
+        $(".navigation").toggleClass("open");
+    });
+  });
+	</script>
+</head>
+<body>
+
+
+<header class="header-main">
+  <!--<h1 class="text-center">Slide Menu</h1>-->
+  <nav class="navigation">
+    <div class="hamburger">
+      <span class="bars"></span>
+    </div>
+    <div class="menu">
+    <ul>
+      <!--<li><a href="">Link</a></li>
+      <li class="sub-menu"><a href="">Link</a></li>-->
+      <li><a href="">Events</a></li>
+      <li><a href="">Resources</a></li>
+      <li><a href="">Contact Us</a></li>
+    </ul>
+
+    </div>
+  </nav>
+</header>
+
+
+<div class = "Intro">
+		<h1> NJACK </h1>
+	</div>
+
+	 <!-- <a class="ca3-scroll-down-link ca3-scroll-down-arrow" data-ca3_iconfont="ETmodules" data-ca3_icon=""></a>-->
+
+	<div class = "About"></div>
+	<!--<iframe src="https://calendar.google.com/calendar/embed?showTitle=0&amp;showPrint=0&amp;showTabs=0&amp;height=250&amp;wkst=1&amp;bgcolor=%23003333&amp;src=6vishnu.pk%40gmail.com&amp;color=%2329527A&amp;ctz=Asia%2FCalcutta" style="border:solid 1px #777" width="250" height="250" frameborder="0" scrolling="no"></iframe>-->
+
+        <!-- Page Content -->
+         <div class="whole" id="about" style="background-color:#F2f2f2">
+            <div class="abt" style="color: white; background-color: 003366; font: 50px calibri; font-weight: 900; padding-top: 10px; padding-bottom: 15px;">
+            </div>
+            <div class="container" role="document" style="margin-top:1%;">
+              <h2 class="about-head">Njack</h2>
+                <p class = "about-club"> NJACK - Not Just Another Computer science Klub ! The Computer Science Club of IIT Patna ! Founded in August 2011.</p>
+            </div>
+            <!-- /.container -->
+        </div>
+
+        <div class="whole" id="about" style="background-color:#F2f2f2">
+            <div class="abt" style="color: white; background-color: 003366; font: 50px calibri; font-weight: 900; padding-top: 10px; padding-bottom: 15px;">
+            </div>
+            <div class="container" role="document" style="margin-top:1%;">
+              <h2 class="about-head">RECENT</h2>
+               <!-- <hr> -->
+                <div class="container-inner about-us-main" id="about-us">
+                    <div class="about-div">
+                      <h3>Hackathon</h3>
+                       <p>Open government data Hackathon</p>
+                    </div>
+                    <div class="about-div">
+                      <h3>Hackathon</h3>
+                       <p>Open government data Hackathon </p>
+                    </div>
+                    <div class="about-div">
+                      <h3>Hackathon</h3>
+                       <p>Open government data Hackathon</p>
+                    </div>
+                </div>
+                <!--<hr>-->
+            </div>
+            <!-- /.container -->
+        </div>
+
+        <div class="whole" id="about" style="background-color:#F2f2f2">
+            <div class="abt" style="color: white; background-color: 003366; font: 50px calibri; font-weight: 900; padding-top: 10px; padding-bottom: 15px;">
+            </div>
+            <div class="container" role="document" style="margin-top:1%;">
+              <h2 class="about-head">Follow Us</h2>
+
+            </div>
+            <div class="social">
+             <a href="https://www.facebook.com/njack.iitp/"><img src="../images/facebook.png" alt="Facebook"></a>
+             <a href=""><img src="" alt= "Twitter"></a>
+             <a href=""><img src="" alt= "Google"></a>
+             </div>
+            <!-- /.container -->
+        </div>
+</body>
+</html>