Skip to content

Ui #1

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

Open
Gidraf wants to merge 24 commits into
base: master
Choose a base branch
from
Open

Ui #1

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
24 commits
Select commit Hold shift + click to select a range
d596ba5
[finishes #159573416] create user signup page
orenjaa Aug 7, 2018
5492460
[Finishes #159575071] style signup page
orenjaa Aug 7, 2018
d21e698
[finishes #159575327] create signin page
orenjaa Aug 8, 2018
2a6cc46
[finishes #159575353] style signin page
orenjaa Aug 8, 2018
697ed93
[finishes #159576067 ] create forum page where users will be able to …
orenjaa Aug 8, 2018
3174bdd
[finishes #159576261] style forum page and updating style.css making …
orenjaa Aug 8, 2018
1eebb3d
[update #159573416] add link to forum page and signup page
orenjaa Aug 9, 2018
1f41f64
[update #159575327] add link to signup page
orenjaa Aug 9, 2018
d23e3e2
[feature #159576067] use of lorem instead of for testiong
orenjaa Aug 9, 2018
8b3405b
[feature #159576067] fixes title
orenjaa Aug 9, 2018
40022f6
[feature #159575327] fixes label place holder repetition, add forget …
orenjaa Aug 9, 2018
c842c02
[finishes #159576277] style question details page and makes style.css…
orenjaa Aug 9, 2018
9053a6d
[finishes #159576240] create question and page
orenjaa Aug 9, 2018
4197219
UI images
orenjaa Aug 9, 2018
51abe1e
[feature ##159576240] update the forum link
orenjaa Aug 9, 2018
3f4017f
[feature #159576067] update the account link
orenjaa Aug 9, 2018
1dcf92f
[finishes #159576702] create user account page
orenjaa Aug 9, 2018
770a3b8
[finishe #159576757] style user account page
orenjaa Aug 9, 2018
cc35276
[finises #159576542] create ask/past questin UI
orenjaa Aug 10, 2018
b136476
[finishes #159576542] create ask/past questin UI
orenjaa Aug 10, 2018
98b0cd5
Merge branch 'UI' of https://github.com/Gidraf/Stackoverflow-lite int…
orenjaa Aug 10, 2018
17372f3
[finishes #159658897] create landing
orenjaa Aug 10, 2018
244763b
[finishes #159671671] style landing page
orenjaa Aug 10, 2018
39d802c
[feature #159576067] add more test data
orenjaa Aug 10, 2018
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
48 changes: 48 additions & 0 deletions UI/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,48 @@
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Stackoverflow-Lite|Signup</title>
<link rel="stylesheet" type="text/css" href="static/css/style.css">
</head>
<body>
<!--Navigation bar-->
<header class="nav_header" >
<div class="logo">
<a href="#">
<img src="static/css/img/hamburger_icon.png" alt="">
</a>
<a href="#"><span>Stackoverflow-Lite</span></a>
<!--implement this on forum page -->
<!--
<div class="search_form">
<form action="index.html" method="post">
<input type="search" name="search" placeholder="Search" value="">
<input id="search_btn" type="image" name="search" src="static/css/img/search_image.png" value="">
</form>
</div>
-->
<div class="right_bar">
<a href="forum.html"><span>Forum</span></a>
<a href="signup.html"> <span>Signup</span></a>
</div>
</div>
</header>
<!--signup form-->

<div class="home_content">
<h1> Welcome to Stackoverflow-Lite</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do
eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim
ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip
ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate
velit esse cillum dolore eu fugiat nulla pariatur. Excepteur
sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<a href="signup.html">
<button type="button" name="button">Gettting Started</button>
</a>
</div>

</body>
</html>
312 changes: 312 additions & 0 deletions UI/profile.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,312 @@
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<title>Stackoverflow-Lite|Forum</title>
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<link rel="stylesheet" type="text/css" href="static/css/style.css">
</head>
<body>
<!--Navigation bar-->
<header class="nav_header" >
<div class="logo">
<a href="#">
<img src="static/css/img/hamburger_icon.png" alt="">
</a>
<a href="#"><span>Stackoverflow-Lite</span></a>

<div class="right_bar">
<!--this forum button will act as refresh inside forum -->
<a href="forum.html"><span>Forum</span></a>

<a href="signin.html"> <span >Signout</span>

</a>
</div>



</div>
<div class="clear">

</div>
</header>
<div class="">
<a href="#">
<button id="ask_question" onclick="open_model()" type="button" name="ask_questin">Ask Question</button>
</a>

<!-- search bar field-->
<div class="search_form">
<form action="index.html" method="post">
<input type="search" name="search" placeholder="Search" value="">
<input id="search_btn" type="image" name="search" src="static/css/img/search_image.png" value="">
</form>
</div>
</div>

<div class="clear">
</div>
<!--signup form-->
<div class="side_navbar">
<div class="user_info">
<img id="user_account_image" src="static/css/img/avatar.png" alt="">
<div class="clear">
</div>
<div class="user_names">
<span>Username</span>
<br>
<span>0 questions</span>
<br>
<span>0 answers</span>
</div>
<form class="" action="index.html" method="post">
<select id="sort_by" class="" name="" onchange="call javascript method for sorting">
<option class= value="">All Questions</option>
<option value="">Recently Asked</option>
<option value="">Most Answered</option>
</select>
</form>
</div>

</div>
<div class="container">


<!--this part will sort the questins received from the data--->
</div>
<div class="forum_content">
<div class="question_holder">
<div class="user_image">
<img src="static/css/img/avatar.png" alt="">
</div>
<span class="username">username</span>
<br>
<span class="question_numbers">0 Answers</span>
<br>
<span class="time">2/2/2018 @ 11:00 am</span>
<div class="clear">

</div>
<a href="question.html"><h3 class="question_header">sed do eiusmod tempor inckjvkfjlv sfdjdkjsflsdn djfguifr jfdjfkwd Lorem ipsum dolor sit amet, consectetur adipisicing ollit anim id est laborum.</h3>
</a>

</div>
<div class="clear">

</div>
<div class="question_holder">
<div class="user_image">
<img src="static/css/img/avatar.png" alt="">
</div>
<span class="username">username</span>
<br>
<span class="question_numbers">0 Answers</span>
<br>
<span class="time">2/2/2018 @ 11:00 am</span>
<div class="clear">

</div>
<a href="question.html"><h3 class="question_header">sed do eiusmod tempor inckjvkfjlv sfdjdkjsflsdn djfguifr jfdjfkwd Lorem ipsum dolor sit amet, consectetur adipisicing ollit anim id est laborum.</h3>
</a>

</div>
<div class="clear">

</div>
<div class="question_holder">
<div class="user_image">
<img src="static/css/img/avatar.png" alt="">
</div>
<span class="username">username</span>
<br>
<span class="question_numbers">0 Answers</span>
<br>
<span class="time">2/2/2018 @ 11:00 am</span>
<div class="clear">

</div>
<a href="question.html"><h3 class="question_header">sed do eiusmod tempor inckjvkfjlv sfdjdkjsflsdn djfguifr jfdjfkwd Lorem ipsum dolor sit amet, consectetur adipisicing ollit anim id est laborum.</h3>
</a>

</div>
<div class="clear">

</div>
<div class="question_holder">
<div class="user_image">
<img src="static/css/img/avatar.png" alt="">
</div>
<span class="username">username</span>
<br>
<span class="question_numbers">0 Answers</span>
<br>
<span class="time">2/2/2018 @ 11:00 am</span>
<div class="clear">

</div>
<a href="question.html"><h3 class="question_header">sed do eiusmod tempor inckjvkfjlv sfdjdkjsflsdn djfguifr jfdjfkwd Lorem ipsum dolor sit amet, consectetur adipisicing ollit anim id est laborum.</h3>
</a>

</div>
<div class="clear">

</div>
<div class="question_holder">
<div class="user_image">
<img src="static/css/img/avatar.png" alt="">
</div>
<span class="username">username</span>
<br>
<span class="question_numbers">0 Answers</span>
<br>
<span class="time">2/2/2018 @ 11:00 am</span>
<div class="clear">

</div>
<a href="question.html"><h3 class="question_header">sed do eiusmod tempor inckjvkfjlv sfdjdkjsflsdn djfguifr jfdjfkwd Lorem ipsum dolor sit amet, consectetur adipisicing ollit anim id est laborum.</h3>
</a>

</div>
<div class="clear">

</div>
<div class="question_holder">
<div class="user_image">
<img src="static/css/img/avatar.png" alt="">
</div>
<span class="username">username</span>
<br>
<span class="question_numbers">0 Answers</span>
<br>
<span class="time">2/2/2018 @ 11:00 am</span>
<div class="clear">

</div>
<a href="question.html"><h3 class="question_header">sed do eiusmod tempor inckjvkfjlv sfdjdkjsflsdn djfguifr jfdjfkwd Lorem ipsum dolor sit amet, consectetur adipisicing ollit anim id est laborum.</h3>
</a>

</div>
<div class="clear">

</div>

</div>
<!--impliment this to question details page-->
<!--
<p>question description this is a place where
user will describe his or her quaestion as they wait to be answered </p>
-->

</div>
<div class="">
<div class="right_sidebar">

<div class="users">
<div class="user_holder">
<img src="static/css/img/avatar.png" alt="">
<a href="#">Username</a>
<span>0 questions</span>
<span>0 answers</span>
</div>
<div class="clear">
</div>
<div class="user_holder">
<img src="static/css/img/avatar.png" alt="">
<a href="#">Username</a>
<span>0 questions</span>
<span>0 answers</span>
</div>
<div class="clear">
</div>
<div class="user_holder">
<img src="static/css/img/avatar.png" alt="">
<a href="#">Username</a>
<span>0 questions</span>
<span>0 answers</span>
</div>
<div class="clear">
</div>
<div class="user_holder">
<img src="static/css/img/avatar.png" alt="">
<a href="#">Username</a>
<span>0 questions</span>
<span>0 answers</span>
</div>
<div class="clear">
</div>
<div class="user_holder">
<img src="static/css/img/avatar.png" alt="">
<a href="#">Username</a>
<span>0 questions</span>
<span>0 answers</span>
</div>
<div class="clear">
</div>
<div class="user_holder">
<img src="static/css/img/avatar.png" alt="">
<a href="#">Username</a>
<span>0 questions</span>
<span>0 answers</span>
</div>
<div class="clear">
</div>
<div class="user_holder">
<img src="static/css/img/avatar.png" alt="">
<a href="#">Username</a>
<span>0 questions</span>
<span>0 answers</span>
</div>
<div class="clear">
</div>
<div class="user_holder">
<img src="static/css/img/avatar.png" alt="">
<a href="#">Username</a>
<span>0 questions</span>
<span>0 answers</span>
</div>
<div class="clear">
</div>
<div class="user_holder">
<img src="static/css/img/avatar.png" alt="">
<a href="#">Username</a>
<span>0 questions</span>
<span>0 answers</span>
</div>
<div class="clear">
</div>
<div class="user_holder">
<img src="static/css/img/avatar.png" alt="">
<a href="#">Username</a>
<span>0 questions</span>
<span>0 answers</span>
</div>
<div class="clear">
</div>
<div class="user_holder">
<img src="static/css/img/avatar.png" alt="">
<a href="#">Username</a>
<span>0 questions</span>
<span>0 answers</span>
</div>
<div class="clear">
</div>
</div>
</div>
</div>
<div id="question_modal" class="hide">
<form class="" action="index.html" method="post">
<fieldset>
<legend>Ask Question</legend>
<input type="text" name="title" placeholder="Questin title" value="">
<br>
<textarea name="name" rows="10" placeholder="Question description" cols="80"></textarea>
</fieldset>
<button id="ask" type="button" name="button">Ask</button>
<button id="cancel" onclick="close_modal()" type="button" name="button">Cancel</button>
</form>
</div>
<script type="text/javascript" src="static/js/script.js">
</script>
</body>
</html>
Loading