redid the homepage style and layout

srikanthlogic · Apr 8, 2012 · d737e15 · d737e15
1 parent 244e49b
commit d737e15
Show file tree

Hide file tree

Showing 9 changed files with 74 additions and 49 deletions.
diff --git a/.gitignore b/.gitignore
@@ -1,3 +1,3 @@
 *.pyc
-
+*.*~
 
diff --git a/content/images/cd_icon.png b/content/images/cd_icon.png
diff --git a/content/images/pictures.png b/content/images/pictures.png
diff --git a/content/images/snippet.png b/content/images/snippet.png
diff --git a/content/images/software.png b/content/images/software.png
diff --git a/content/images/tutorial.png b/content/images/tutorial.png
diff --git a/content/images/video.png b/content/images/video.png
diff --git a/content/styles/landing.css b/content/styles/landing.css
@@ -17,17 +17,22 @@ h1, h2, h3, h4{
 	text-align: center;
 	font-size: 140%;	
 	}
-h1 span{
-	font-size: 150%;
-	}
 #text button{
 
 	}
 #header{
 	padding: 20px 0px 10px 0px;
 	}
 #footer{
-	padding: 10px 0px 20px 0px;
+	margin-top: 10px;
+	position: absolute;
+	bottom: 0px;
+	text-align: center;
+	width: 100%;
+	left: 0;
+	}
+#footer p{
+	font-size: 80%;
 	}
 
 ul{
@@ -38,36 +43,51 @@ ul{
 	}
 #circle a{
 	text-decoration: none;
-	font-size: 80%;
-	color: #002797;
+	font-size: 100%;
+	color: #222222;
 	}
 #circle a:hover{
 	color: #ff0000;
 	}
 .spin{
 	position: absolute;
 	}
+.spin img{
+	width: 50%;
+	height: 50%;
+}
+
 .disc-1{
-	top: 40%;
-	left: 20%;
+	top: 65%;
+	left: 23%;
 	}
 .disc-2{
-	top: 12%;
-	left: 22%;
+	top: 38%;
+	left: 20%;
 	}
 .disc-3{
-	top: 12%;
-	left: 60%;
+	top: 10%;
+	left: 25%;
 	}
 .disc-4{
-	top: 40%;
+	top: 10%;
 	left: 65%;
 	}
+.disc-5{
+	top: 38%;
+	left: 70%;
+}
+.disc-6{
+	top: 65%;
+	left: 67%;
+}
 button#read{
-	width: 20%;
-	height: 40px;
+	width: 25%;
+	height: 35px;
 	border: 1px solid #ccc;
 	background-color: #ffd545;
-	font-size: 110%;
 	cursor: pointer;
-	}
+	position: absolute;
+	left: 37.5%;
+	bottom: 8%;
+}
diff --git a/index.html b/index.html
@@ -22,52 +22,57 @@
 </head>
 <body>
 <div id="container">
-<div id="header">
-<h1><span>வி</span>க்கிப்பீடி<span>யா</span></h1>
-<div id="logo">
-<img src="content/images/Wikipedia-logo.png" alt="Wikipedia Logo" />
-</div>
-<h2>கட்டற்ற கலைக்களஞ்சியம்</h2>
-</div>
+	<div id="header">
+		<h1>விக்கிப்பீடியா</h1>
+		<div id="logo">
+			<img src="content/images/Wikipedia-logo.png" alt="Wikipedia Logo" />
+		</div>
+		<h2>கட்டற்ற கலைக்களஞ்சியம்</h2>
+	</div>
 <div id="circle">
 <ul>
 	<li class="spin disc-1">
-	<h3>விக்கிப்பீடியா குறுந்தட்டு</h3>
-	<ul>
-		<li><a href="" >இந்த குறுந்தட்டைப் பற்றி</a></li>
-		<li><a href="" >நன்றிகள்</li>
-		<li><a href="" >விக்கிப்பீடியா - வினாவிடை</a></li>
-	</ul>
+	<a href="#">
+		<img src="content/images/cd_icon.png" alt="CD ICON" />
+		<h3>குறுந்தட்டு</h3>
+	</a>
 	</li>
 	<li class="spin disc-2">
-	<h3>தமிழ் கணிமை மென்பொருட்கள்</h3>
-	<ul>
-		<li><a href="" > சுரதா</a></li>
-		<li><a href="" >என்.எச்.எம் ரைட்டர்</a></li>
-		<li><a href="" >எழுத்துருக்கள்</a></li>
-	</ul>		
+	<a href="#">
+		<img src="content/images/video.png" alt="" />
+		<h3>Videos</h3>
+	</a>
 	</li>
 	<li class="spin disc-3">
-	<h3>பிற விக்கித்திட்டங்கள்</h3>
-	<ul>
-		<li><a href="" >விக்கிப்பீடியா</a></li>
-		<li><a href="" >விக்கிமூலம்</a></li>
-		<li><a href="" >விக்சனரி</a></li>
-		<li><a href="" >விக்கி நூல்கள்</a></li>	
-	</ul> 	
+	<a href="#">
+		<img src="content/images/pictures.png" alt="" />
+		<h3>Pictures</h3> 
+	</a>
 	</li>
 	<li class="spin disc-4">
-		<h3>வெளி இணைப்புகள்</h3>
-		<ul>
-			<li><a href="" >ஆங்கில விக்கிப்பீடியா</a></li>		
-		</ul>
+	<a href="#">
+		<img src="content/images/tutorial.png" alt="" />
+		<h3>Tutorials</h3>
+	</a>
+	</li>
+	<li class="spin disc-5">
+	<a href="#">
+		<img src="content/images/software.png" alt="" />
+		<h3>Software</h3>
+	</a>
+	</li>
+	<li class="spin disc-6">
+	<a href="#">
+		<img src="content/images/snippet.png" alt="" />
+		<h3>DYK Snippets</h3>
+	</a>
 	</li>
 </ul>
 
 </div>
 
 <div id="text">
-<button id="read">கட்டுரைத் தொகுப்பு</button>
+	<button id="read">கட்டுரைத் தொகுப்பு</button>
 </div>
 <div id="footer">
 <p>--------- Credit (or) &copy; Copyright here ----------</p>