Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

home layout #2

Open
wants to merge 1 commit into
base: develop
Choose a base branch
from
Open

home layout #2

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
7 changes: 7 additions & 0 deletions images/leftnavbutton.svg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file removed images/patt1.png
View file
Open in desktop
Binary file not shown.
Binary file removed images/patt2.png
View file
Open in desktop
Binary file not shown.
Binary file removed images/patt3.png
View file
Open in desktop
Binary file not shown.
0 images/patt4.jpg → images/register-background.jpg
View file
Open in desktop
File renamed without changes
6 changes: 6 additions & 0 deletions images/rightnavbutton.svg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file removed images/science.png
View file
Open in desktop
Binary file not shown.
Binary file removed images/signup-background.png
View file
Open in desktop
Binary file not shown.
150 changes: 150 additions & 0 deletions index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,150 @@
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta charset="utf-8" >

<title>أنابيش</title>

<link rel="icon" href="images/icon.png">

<link rel="stylesheet" href="styles/bootstrap.min.css">
<link rel="stylesheet" href="styles/font-awesome.min.css">
<link rel="stylesheet" href="styles/normalize.css">
<link rel="stylesheet" href="styles/owl.carousel.min.css">
<link rel="stylesheet" href="styles/main.css">

<script src="scripts/jquery-3.1.1.min.js"></script>
<script src="scripts/bootstrap.min.js"></script>


</head>
<body dir="rtl">

<nav class="navbar navbar-default">
<div class="container">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">أنابيش</a>

<form>
<div class="input-group">
<span class="input-group-btn">
<button class="btn btn-default" type="submit"><i class="fa fa-search" aria-hidden="true"></i></button>
</span>
<input type="text" class="form-control" placeholder="بحث...">
</div><!-- /input-group -->
</form><!-- /.col-lg-6 -->
<div class="overlay"></div>
</div>

<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">



<ul class="nav navbar-nav navbar-right">

<li><a href="#">دخول</a></li>
<li><a href="#">تسجيل</a></li>
</ul>


</div><!-- /.navbar-collapse -->
</div><!-- /.container-fluid -->
</nav>

<div class="container">
<div class="row">
<header class="col-lg-12 header">
<div class="intro">
<h1>أنابيش</h1>
<p>وسوء الأهداف بعد, التي أراض الأثناء، عدد مع. فكانت الساحة دون ان, تسمّى السبب الجنوب أم أخر. بـ ومضى المتساقطة، جعل, عل كلا تاريخ مدينة فرنسا. ومن جيوب ليتسنّى </p>
<a href="#">تسجيل</a>
<a href="#">دخول</a>
<div class="clearfix"></div>
</div>
</header>
<aside class="col-md-2 col-xs-12 rightSideBars pull-right">
<div class="sidebar">
<h4><i class="fa fa-rss" aria-hidden="true"></i> آخر الأخبار</h4>
<ul>
<li><a href="#">الأكثر سؤالاً</a></li>
<li><a href="#">الاسألة المحفوظة</a></li>
<li><a href="#">Computer Science</a></li>
<li><a href="#">JavaScript</a></li>
</ul>
</div>
<div class="sidebar">
<h4><i class="fa fa-bolt" aria-hidden="true"></i> شائع الآن</h4>
<ul>
<li><a href="#">Top Asked</a></li>
<li><a href="#">Booked Questions</a></li>
<li><a href="#">Computer Science</a></li>
<li><a href="#">JavaScript</a></li>
</ul>
</div>
</aside>

<aside class="col-md-2 col-xs-12 leftSideBars">
<div class="leaderBoard" dir="ltr">
<h4>الأكثر تفاعلاً</h4>

<div class="owl-carousel">
<div class="leaderInfo">
<img src="images/person-icon.png">
<h5>أحمد الألفي</h5>
<h6>Front-end Developer</h6>
<h5>EGYPT</h5>
</div>
<div class="leaderInfo">
<img src="images/person-icon.png">
<h5>أحمد الألفي</h5>
<h6>Front-end Developer</h6>
<h5>EGYPT</h5>
</div>
<div class="leaderInfo">
<img src="images/person-icon.png">
<h5>أحمد الألفي</h5>
<h6>Front-end Developer</h6>
<h5>EGYPT</h5>
</div>
<div class="leaderInfo">
<img src="images/person-icon.png">
<h5>أحمد الألفي</h5>
<h6>Front-end Developer</h6>
<h5>EGYPT</h5>
</div>
</div>


</div>
<div class="improve">
<img src="images/person-icon.png">
<h5>تحسين الصفحة الرئيسية</h5>
<progress max="100" value="80"></progress>
</div>
</aside>
<div class="clearfix hidden-md hidden-lg"></div>
<main class="col-lg-8 col-md-8 mainContent">
<div class="postCard"></div>
<div class="postCard"></div>
<div class="postCard"></div>
<div class="postCard"></div>
<div class="postCard"></div>
<div class="postCard"></div>
<div class="postCard"></div>
</main>
</div>
</div>

<script src="scripts/owl.carousel.min.js"></script>
<script src="scripts/main.js"></script>
</body>
</html>
21 changes: 21 additions & 0 deletions scripts/main.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,21 @@
$(document).ready(function(){

$(".owl-carousel").owlCarousel({
items: 1,
center: true,
nav: true,
navText: ["<img src='images/leftnavbutton.svg'>","<img src='images/rightnavbutton.svg'>"],
loop: true,
autoplay: true,
autoplayTimeout: 4000,

});

$(".form-control" ).focus(function() {
$(".overlay").fadeIn(500);
});
$( ".overlay" ).click(function() {
$(".overlay").fadeOut(500);
});

});
7 changes: 7 additions & 0 deletions scripts/owl.carousel.min.js
View file
Open in desktop

Large diffs are not rendered by default.

Loading