diff options
Diffstat (limited to 'views')
| -rw-r--r-- | views/layouts/layout.hbs | 6 | ||||
| -rw-r--r-- | views/user_profile_alt.hbs | 309 |
2 files changed, 99 insertions, 216 deletions
diff --git a/views/layouts/layout.hbs b/views/layouts/layout.hbs index 42bd09b..8b0d7b3 100644 --- a/views/layouts/layout.hbs +++ b/views/layouts/layout.hbs @@ -14,6 +14,11 @@ <link rel="stylesheet" href="/assets/css/bootstrap.min.css"> <link rel="stylesheet" href="/assets/css/creative.css"> + <!-- Partial Scripts, Order important --> + {{# if userProfile}} + <link href="/assets/css/user_profile.css" rel="stylesheet" type="text/css"> + {{/if}} + <!--Fonts--> <link href='https://fonts.googleapis.com/css?family=Lato:100' rel='stylesheet' type='text/css'> <link href='https://fonts.googleapis.com/css?family=Roboto' rel='stylesheet' type='text/css'> @@ -37,6 +42,7 @@ <script src="/assets/js/home_page.js"></script> {{/if}} + </head> <body> {{# if noHeader}} diff --git a/views/user_profile_alt.hbs b/views/user_profile_alt.hbs index edd5b60..8353be9 100644 --- a/views/user_profile_alt.hbs +++ b/views/user_profile_alt.hbs @@ -3,233 +3,110 @@ <div class="row"> <!-- User Profile details --> -<div class="col-xs-12 col-sm-12 col-md-8 col-md-offset-2 col-xs-offset-0 col-sm-offset-0 toppad prf-details"> - - <!-- User Profile Menu --> - <nav class="navbar navbar-custom"> - <div class="container-fluid"> - <div class="navbar-header"> - <button type="button" class="navbar-toggle" - data-toggle="collapse" data-target="#profile-nav"> - <span class="icon-bar"></span> - <span class="icon-bar"></span> - <span class="icon-bar"></span> - </button> - </div> - <div class="collapse navbar-collapse" id="profile-nav"> - <ul class="nav navbar-nav " > - <li><a href="#" class="prf-page">General</a></li> - <li><a href="#" class="prf-page">Following</a></li> - <li><a href="#" class="prf-page">Send Message</a></li> - <li><a href="#" class="prf-page">Inbox</a></li> - <li><a href="#" class="prf-page">Comments</a></li> - </ul> - </div> - </div> - </nav> +<div class="col-xs-12 col-sm-12 col-md-8 col-md-offset-2 col-xs-offset-0 col-sm-offset-0"> + + <!-- Title --> + <div class="row u-title"> + <h1><i class="fa fa-user" aria-hidden="true"></i> Account</h1> + </div> - <div class="rounded"> - <div class="panel panel-info rounded"> - <div class="panel-heading"> - <h3 class="panel-title">{{ user.f_name }} {{ user.l_name }}</h3> + <!-- Error Message Check/Display --> + {{# if messages.success }} + <section class="alert alert-success"> + <!-- Change those to banners later --> + <h3>{{ messages.success }}</h3> + </section> + {{ else }} + {{# if messages.error }} + <section class="alert alert-danger"> + <h3>{{ messages.error }}</h3> + </section> + {{/if}} + {{/if}} + + <div id="u-main" class="u-main row"> + + <!-- User name Header row --> + <div class="u-name-header col-xs-12"> + <h2>ChrisHopper89</h2> </div> - <div class="panel-body"> - <!--- User-Profile Pages --> - <div class="row" id="profile-general"> - <!-- User Details --> - {{# if messages.success }} - <section class="alert alert-success"> - <!-- Change those to banners later --> - <h3>{{ messages.success }}</h3> - </section> - {{ else }} - {{# if messages.error }} - <section class="alert alert-danger"> - <h3>{{ messages.error }}</h3> - </section> - {{/if}} - {{/if}} - <div> - <table class="table table-user-information"> - <tbody> - <tr> - <td>Email:</td> - <td><a href="{{ user.email }}">{{ user.email }}</a></td> - </tr> - {{# if user.university }} - <tr> - <td>University:</td> - <td>{{ user.university }}</td> - </tr> - {{/if}} - {{# if user.department }} - <tr> - <td>Department:</td> - <td>{{ user.department }}</td> - </tr> - {{/if}} - <tr> - <td>Answered:</td> - <td>{{ user.answered }}</td> - </tr> - <tr> - <tr> - <td>Inbox:</td> - <td>{{ user.messages }}</td> - - </tr> - <tr> - <td>Comments:</td> - <td>{{ user.comments }}</td> - </tr> - {{# if user.phone_num}} - <tr> - <td>Phone Number:</td> - <td>{{ user.phone_num }}</td> - </tr> - {{/if}} - </tbody> - </table> - </div> - </div> - <div class="row" id="profile-follows"> - {{# if user.examfollows }} - <h4>Here are the exams you are following:</h4> - <div class="col-xs-offset-1 col-sm-offset-3 col-xs-10 col-sm-6"> - <table class="table-condensed"> - <tbody> - {{# each user.examfollows}} - <tr> - <th> - <a href="/questions/{{this._id}}">Course Code: {{this.course_code}}</a> - </th> - <th> - <h4>Term: {{this.term}}</h4> - <p>Year: {{this.year}}</p> - <p>Type: {{this.type}}</p> - </th> - - </tr> - {{/each}} - </tbody> - </table> - </div> - {{ else }} - <h3>You are not following any exams.</h3> - {{/if}} - </div> - - <div class="row" id="profile-send-message"> - <h3>Send Message</h3> - - <div class="col-xs-offset-1 col-sm-offset-3 col-xs-10 col-sm-6"> - <form action="/user/user_profile/send_message" method="post"> - <div class="form-group"> - <label for="receiver">Send To:</label> - <input type="text" class="form-control" placeholder="Username" name="receiver_username"> - </div> - <div class="form-group"> - <label for="subject">Subject</label> - <input type="text" class="form-control" placeholder="Subject" name="subject"> - </div> - <div class="form-group"> - <label for="sending-message">Message:</label> - <textarea class="form-control" placeholder="Enter message here..." rows="3" name="message"></textarea> - </div> - <button class="btn btn-primary">Send Message</button> - <input type="hidden" name="_csrf" value="{{ csrfToken }}"> - </form> - </div> - </div> - <div class="row" id="profile-inbox"> - {{# if inbox }} - <h3>Inbox</h3> - <div class="col-sm-10 col-sm-offset-1 prf-tables"> - <div class="table"> - <div class="table-row"> - <div class="table-cell" class="head"><h5>Date</h5></div> - <div class="table-cell" class="head"><h5>Subject</h5></div> - <div class="table-cell" class="head"><h5>Sender</h5></div> - </div> - {{# each inbox }} - <a href="#" class="table-row" data-toggle="modal" data-target=".{{ this.class }}"> - <div class="table-cell">{{ this.date }}</div> - <div class="table-cell">{{ this.subject }}</div> - <div class="table-cell">{{ this.sender }}</div> - </a> - {{/each}} + + <!-- Main Content row --> + <!-- Side Panel --> + <div class="u-aside col-xs-12 col-sm-3" align="center"> + <!-- User Image --> + <img alt="User Pic" src="../assets/images/avatar.png" + class="img-circle img-responsive"> + <h3>Jim Hopper</h3> + <h4>jhop@gmail.com</h4> + + <!-- Side Nav --> + <nav> + <button class="nav-o"> + <div class="nav-o-container"> + <h5><i class="fa fa-home" aria-hidden="true"></i> My Profile</h5> </div> + </button> - {{# each inbox}} - <article class="modal fade {{this.class}}"> - <div class="modal-dialog"> - <div class="modal-content"> - - <section class="modal-header"> - <button type="button" class="close" data-dismiss="modal">×</button> - <h4 class="modal-title"><em>Subject: </em>{{ this.subject }}</h4> - <h5><em>From: </em>{{ this.sender }}</h5> - <em>Date: </em> {{this.date}} - </section> - - <section class="modal-body"> - {{ this.message }} - </section> - - <div class="modal-footer"> - - </div> - - </div> - </div> - </article> - {{/each}} - </div> - {{ else }} - <h3>No Messages.</h3> - {{/if}} - </div> - <div class="row" id="profile-comments"> - - {{# if user.comment_list.length }} - <h3>Comment History</h3> - <div class="col-sm-10 col-sm-offset-1 prf-tables"> - <table class="table"> - <thead> - <tr> - <th>Date</th> - <th>Comment</th> - <th>Exam</th> - </tr> - </thead> - <tbody> - {{# each user.comment_list }} - <tr> - <td>{{ this.date }}</td> - <td>{{ this.comment }}</td> - <td>{{ this.course_code }} > {{ this.term }} - {{ this.year }}</td> - </tr> - {{/each}} - - </table> + <button class="nav-o"> + <div class="nav-o-container"> + <h5><i class="fa fa-comment-o" aria-hidden="true"></i> Comments</h5> + </div> + </button> + <button class="nav-o"> + <div class="nav-o-container"> + <h5><i class="fa fa-list" aria-hidden="true"></i> Follows</h5> + </div> + </button> + <button class="nav-o"> + <div class="nav-o-container"> + <h5><i class="fa fa-envelope" aria-hidden="true"></i> Inbox</h5> </div> - {{else}} - <h3>No Comments.</h3> - {{/if}} + </button> - </div> + <button class="nav-o"> + <div class="nav-o-container"> + <h5><i class="fa fa-sign-out" aria-hidden="true"></i> Log Out</h5> + </div> + </button> - <!-- Date, Edit, Logout (new row) --> - <div class="col-md-12 prf-sign-off"> - <a href="/user/logout">Logout</a> - <br> + </nav> - </div> </div> - </div> + + <!-- Content Pages (On Right) --> + <article class="col-xs-12 col-sm-9 u-pages"> + <section class="u-profile"> + <h4>Profile </h4> + + <hr> + + <h5>Personal Info</h5> + <p>Username: <em>ChiefHopper86</em></p> + <p>Name: <em>Jim Hopper</em></p> + <p>University: <em>University of Toronto</em></p> + + <hr> + <h5>User Stats</h5> + <p>Answered: <em>20</em></p> + <p>Comments: <em>25</em></p> + <p>Score: <em>205</em></p> + + + + </section> + + </article> + + + + + <!-- Pages --> + + + </div> </div> |