alex
/
orbit4-5
forked from saurabh/orbit4-5
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

joshua commit for groups and orbit bar again

This commit is contained in:
rulingcom 2015-05-28 14:27:27 +08:00
parent e8b727af01
commit 98ec676197
19 changed files with 507 additions and 112 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

54
app/assets/javascripts/group.js
View File

@ -15,7 +15,6 @@
// Hide the navs when there's noly one slide
console.log(imgs.length)
if (imgs.length <= 1) {
for (i = 0; i < len; i++) {
cycleNav[i].classList.add("hide");
@ -27,22 +26,21 @@
}
},
// Create scroll effect (with css)
scrollEffect: function() {
if (doc.querySelector(".group-post")) {
var post = doc.querySelector(".group-post"),
wrap = doc.querySelector(".group-post-banner-image-wrap"),
scrollEffect: function(el) {
var wrap = doc.querySelector(el),
scrollClass = "scroll";
// Use pageYOffset to get the Y positoin and add scroll on it, the animation
// is done by css transition
window.addEventListener("scroll", function() {
if (window.pageYOffset > 0) {
post.classList.add(scrollClass);
} else {
post.classList.remove(scrollClass);
}
}, false);
}
if (el) {
window.addEventListener("scroll", function() {
if (window.pageYOffset > 0) {
wrap.classList.add(scrollClass);
} else {
wrap.classList.remove(scrollClass);
}
}, false);
}
},
// Equal height for card
equalHeight: function() {
@ -77,24 +75,25 @@
$dropdown = $container.find(dropdown),
klass = 'open';
$toggle.click(function(e) {
$container.on('click', '.toggle', function(e) {
if ($(this).hasClass(klass)) {
$toggle.removeClass(klass);
$dropdown.removeClass(klass);
$(toggle).removeClass(klass);
$(dropdown).removeClass(klass);
} else {
$toggle.removeClass(klass);
$dropdown.removeClass(klass);
$(toggle).removeClass(klass);
$(dropdown).removeClass(klass);
$(this)
.addClass(klass)
.next(dropdown)
.addClass(klass)
}
return false;
});
$(document.body).click(function() {
$toggle.removeClass(klass)
$dropdown.removeClass(klass);
});
$(document.body).on('click', function() {
$(toggle).removeClass(klass)
$(dropdown).removeClass(klass);
});
},
@ -111,8 +110,7 @@
document.addEventListener("DOMContentLoaded", function(event) {
if (doc.querySelector('.group-post')) {
group.scrollEffect();
group.makePostClick();
group.scrollEffect('.group-post');
group.makeDropdown('.group-post', '.group-post-dropdown-toggle', '.group-post-dropdown');
}
@ -124,6 +122,14 @@
group.makeDropdown('.group-index', '.group-card-dropdown-toggle', '.group-card-dropdown');
}
if (doc.querySelector('.group-show-post')) {
group.makeDropdown('.group-show-post', '.group-show-post-dropdown-toggle', '.group-show-post-dropdown');
}
if (doc.querySelector('.group-member')) {
group.scrollEffect('.group-member');
}
group.cycleFix();
group.equalHeight();
group.plugins();

2
app/assets/stylesheets/basic/orbit_bar.css.erb
View File

@ -3,7 +3,7 @@
left: -10px;
right: -10px;
height: 40px;
z-index: 1041;
z-index: 1040;
position: fixed;
margin-bottom: 0;
}

50
app/assets/stylesheets/lib/group/_group-classes.scss
View File

@ -7,6 +7,12 @@
left: -9999px;
}
.img-reponsive {
max-width: 100%;
width: 100%;
height: auto;
}
.wrapper {
margin: auto;
max-width: $boundary;
@ -30,6 +36,7 @@
background-color: transparent;
border: 2px solid $blue;
transition: $fast all;
&:hover {
color: $white;
background-color: $blue;
@ -45,6 +52,7 @@
color: $white;
background-color: $blue;
transition: $fast all;
&:hover {
color: $white;
background-color: darken($blue, 15%);
@ -56,32 +64,43 @@
font-size: 0.75rem;
}
.button-large {
padding: 14px 1.3rem;
}
// Button group
.button-group {
display: inline-block;
list-style: none;
> .button-group-common {
display: inline-block;
}
> .button:first-child {
border-radius: 15rem 0 0 15rem;
margin-right: -4px;
}
> .button:last-child {
border-radius: 0 15rem 15rem 0;
}
li {
color: $blue;
background-color: rgba($white, 0.2);
&:hover {
a {
color: $white;
}
}
}
> .active {
color: $white;
background-color: $blue;
a {
color: $white;
}
@ -91,6 +110,7 @@
// Tool Tip
.tool-tip-parent {
position: relative;
&:hover {
.tool-tip {
display: block;
@ -108,6 +128,7 @@
bottom: 100%;
z-index: 150;
display: none;
&:after {
border: 5px solid transparent;
border-top-color: rgba($black, 0.85);
@ -116,17 +137,21 @@
left: 10px;
bottom: -10px;
}
&.right {
left: auto;
right: 0;
&:after {
left: auto;
right: 10px;
}
}
&.bottom {
top: 100%;
bottom: auto;
&:after {
top: -10px;
bottom: auto;
@ -134,14 +159,15 @@
border-bottom-color: rgba(0, 0, 0, 0.85);
}
}
&.nowrap {
white-space: nowrap;
}
}
.action {
position: relative;
.toggle {
border: none;
border-left: 1px solid darken($gray, 6%);
@ -149,22 +175,31 @@
background: none;
padding: 2px 8px;
transition: $fast all;
&:hover, &.open {
border-color: $blue;
background: $blue;
.caret {
border-top-color: $white;
}
}
}
&:hover, &.open {
border-top-right-radius: $general;
border-radius: $general;
background: $blue;
.caret {
border-top-color: $white;
}
}
.caret {
border-top-color: darken($gray, 30%);
vertical-align: middle;
}
.action-dropdown {
display: none;
position: absolute;
@ -200,16 +235,25 @@
background: $white;
box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.2);
transition: $normal box-shadow;
&:hover {
box-shadow: 0 1px 25px 0 rgba(0, 0, 0, 0.2);
}
}
// avatar
.admin-avatar {
width: 60px;
height: 60px;
border-radius: $round;
}
// breadcrumb
.breadcrumb {
padding-left: 0;
margin: 0;
background: none;
> li {
text-shadow: none;
font-size: 13px;

138
app/assets/stylesheets/lib/group/_group-members.scss Normal file
View File

@ -0,0 +1,138 @@
// Group page
#main-wrap {
padding-top: 0;
.wrap-inner {
// padding: 0;
}
}
.group-member-banner-wrap {
height: 280px;
overflow: hidden;
position: fixed;
top: 0;
left: 0;
width: 100%;
transition: $fast all;
z-index: 500;
background: lighten($black, 25%);
}
.group-member-bar {
padding: 0 2rem 0 6rem;
background: rgba(25, 27, 29, 0.95);
width: 100%;
position: absolute;
left: 0;
bottom: 0;
}
.group-member-page-title {
margin-bottom: 12px;
padding: 6px 0;
color: $white;
font-family: $main-font;
font-weight: normal;
max-width: 100%;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
}
.group-member-dropdown {
margin: 12px 0;
> button {
padding: 8px 0.75rem;
}
.badge {
margin-left: 4px;
}
}
.group-member-section {
overflow: hidden;
padding: 220px 2rem 30px;
}
.group-member-list {
padding: 0;
margin: 0;
}
.group-member-item {
list-style: none;
padding: 8px 0.75rem;
margin: 8px 0 12px 0;
}
.group-member-photo-wrap {
display: inline-block;
vertical-align: top;
margin-right: 0.5rem;
}
.group-member-meta-wrap {
display: inline-block;
vertical-align: top;
}
.group-member-name {
font-size: 0.8125rem;
}
.group-member-photo {
width: 60px;
height: 60px;
border-radius: $round;
}
// scroll view
.group-member.scroll {
padding-top: 2rem;
padding-bottom: 9rem;
.group-member-page-title {
margin-top: 0;
margin-bottom: 0;
font-size: 1.625rem;
line-height: 50px;
}
.group-member-banner-wrap {
height: 120px;
}
.group-member-page-title {
margin-bottom: 0;
font-size: 1.625rem;
line-height: 50px;
}
.group-member-section {
padding-top: 60px;
}
}
// 480px
@media screen and (min-width: 30rem) {
.group-member-item {
float: left;
margin-right: 1rem;
}
}
// 760px
@media screen and (min-width: 47.5rem) {
.group-member-content-wrap {
width: 70%;
}
.group-member-page-title {
display: inline-block;
margin: 0;
padding: 0;
line-height: 70px;
transition: .6s all;
}
}

53
app/assets/stylesheets/lib/group/_group-post.scss
View File

@ -121,6 +121,17 @@
text-align: justify;
}
.group-post-member-count {
background: $blue;
color: $white;
padding: 6px 0.625rem;
border-radius: $general;
&:hover {
background: darken($blue, 10%);
color: $white;
}
}
.group-post-item {
position: relative;
clear: both;
@ -146,54 +157,22 @@
}
.group-post-dropdown-toggle {
border: none;
border-left: 1px solid darken($gray, 6%);
border-bottom: 1px solid darken($gray, 6%);
background: none;
padding: 2px 8px;
transition: $fast all;
&:hover, &.open {
border-top-right-radius: $general;
background: $blue;
.caret {
border-top-color: $white;
}
}
.caret {
border-top-color: darken($gray, 30%);
vertical-align: middle;
}
}
.group-post-dropdown {
display: none;
position: absolute;
right: 0;
top: 102%;
list-style: none;
margin: 0;
padding: 0;
background: $white;
border: 1px solid darken($gray, 6%);
border-radius: $general;
box-shadow: 0 1px 3px 0 rgba($black, 0.2);
a {
display: block;
padding: 3px 12px;
white-space: nowrap;
&:hover {
color: $white;
background-color: $blue;
}
}
&.open {
display: block;
}
}
@ -267,7 +246,8 @@
line-height: 50px;
}
.group-post-new-post {
.group-post-new-post,
.group-post-join {
margin-top: 12px;
padding: 6px 10px;
}
@ -317,7 +297,8 @@
// 400px
@media screen and (min-width: 25rem) {
.group-post-new-post {
.group-post-new-post,
.group-post-join {
margin: 0 0.625rem 16px;
float: none;
display: inline-block;
@ -374,9 +355,11 @@
padding: 0;
line-height: 70px;
transition: .6s all;
max-width: 80%;
}
.group-post-new-post {
.group-post-new-post,
.group-post-join {
float: right;
margin: 18px 0 0 0;
}

1
app/assets/stylesheets/lib/group/_group-reset.scss
View File

@ -16,7 +16,6 @@ h1, h2, h3, h4, h5, h6, label, legend {
}
img {
width: 100%;
max-width: 100%;
height: auto;
}

67
app/assets/stylesheets/lib/group/_group-show-post.scss
View File

@ -88,8 +88,8 @@
width: 2.5rem;
height: 2.5rem;
cursor: pointer;
-webkit-transition: $normal all;
transition: $normal all;
-webkit-transition: $fast all;
transition: $fast all;
text-align: center;
background-color: rgba($black, 0.8);
border-radius: 50%;
@ -120,18 +120,13 @@
float: left;
width: 80%;
margin: 10px 0 25px;
}
.group-show-post-attachments {
a {
margin-bottom: 10px;
.group-show-post-attachment-file-format {
margin-right: 8px;
vertical-align: middle;
font-size: 1rem;
}
}
.group-show-post-attachment-file-format {
margin-right: 8px;
}
.group-show-post-seen-by {
float: right;
cursor: pointer;
@ -171,7 +166,18 @@
height: 60px;
padding: 0 1rem;
box-shadow: none;
width: 100%;
}
.group-show-post-avatar {
display: none;
}
}
.group-show-post-actions {
position: absolute;
right: 0;
top: 0;
}
.group-no-permission {
@ -184,9 +190,11 @@
margin-right: 8px;
}
}
.group-show-post-respond-wrap {
margin-bottom: 16px;
}
.group-show-post-respond-submit {
font-size: 0.75rem;
font-size: 0.875rem;
}
.group-show-post-comment-list {
@ -194,18 +202,25 @@
padding: 0;
list-style: none;
}
.group-show-post-comment {
position: relative;
border-radius: 0;
box-shadow: none;
border-bottom: 2px solid $gray;
&:hover {
box-shadow: none;
}
}
.group-show-post-comment-wrap {
overflow: hidden;
margin-bottom: 25px;
padding-bottom: 8px;
border-bottom: 1px solid lighten($light-gray, 12%);
padding: 16px 1.25rem;
}
.group-show-post-no-comment {
font-size: 0.8125rem;
}
.group-show-post-comment-avatar {
float: left;
width: 60px;
@ -220,10 +235,11 @@
.group-show-post-comment-author {
font-size: .9375rem;
float: left;
margin-right: 0.5rem;
}
.group-show-post-comment-time {
float: right;
float: left;
}
.group-show-post-comment-content {
@ -265,6 +281,21 @@
.group-show-post-comment-body {
width: 85%;
}
.comments {
.group-show-post-avatar {
float: left;
width: 10%;
max-width: 60px;
min-width: 60px;
display: block;
}
.group-show-post-respond-comment {
float: left;
width: 89%;
margin-left: 1%;
}
}
}
// 960px

1
app/assets/stylesheets/lib/group/_group-variables.scss
View File

@ -30,6 +30,7 @@ $slow: 1s;
// Border radius units
$general: 0.25rem;
$round: 50%;
// Commonly use units
$boundary: 1150px;

20
app/assets/stylesheets/lib/group/group-admin.scss
View File

@ -27,6 +27,11 @@ body {
max-width: none;
}
// Override Bootstrap modal
.modal.fade {
top: -65%;
}
// Override select2 styles, I need this evil power
#main-wrap {
.select2-container-multi {
@ -105,7 +110,22 @@ body {
height: auto;
}
}
.img-avatar {
width: 50px;
height: 50px;
}
// members page
.group-edit-button {
box-sizing: border-box;
vertical-align: top;
line-height: 40px;
width: 60px;
height: 60px;
display: inline-block;
text-align: center;
font-size: 0.8125rem;
}

1
app/assets/stylesheets/lib/group/group-main.scss
View File

@ -7,6 +7,7 @@
@import "group-post";
@import "group-show-post";
@import "group-category";
@import "group-members";
.topnav {

2
app/assets/stylesheets/lib/orbit_bar/orbit-bar.scss.erb
View File

@ -66,7 +66,7 @@ $orbit-bar-bgc-lighter: lighten($orbit-bar-bgc, 20%) !default;
left: 0;
font-family: 'Chivo';
font-size: 16px;
z-index: 1060;
z-index: 1040;
-webkit-box-sizing: initial;
-moz-box-sizing: initial;
box-sizing: initial;

9
app/views/admin/groups/_group_existing_member.html.erb
View File

@ -4,7 +4,7 @@
<div class="controls" id="existing-member-avatar-holder">
<% @existing_members.each_with_index do |em,i| %>
<% if em["id"] != current_user.id.to_s %>
<img data-member-id="<%= em["id"] %>" class="existing-phone-avatar" src="<%= em["avatar"] %>" style="width:75px;height:75px;" />
<img data-member-id="<%= em["id"] %>" class="existing-phone-avatar admin-avatar" src="<%= em["avatar"] %>" />
<% end %>
<% if i == existing_members_limit %>
<span class="existing-member-count"> &hellip; <%= (@existing_members.count - existing_members_limit).to_s %> more.</span>
@ -12,8 +12,11 @@
end %>
<% end %>
<% if @existing_members.count > 1 %>
<a href="#existing_members_dialog" data-toggle="modal"> Edit members</a>
<a class="group-edit-button button button-default" href="#existing_members_dialog" data-toggle="modal">
<!-- <i class="fa fa-pencil"></i> -->
Edit
</a>
<% else %>
No members.
<% end %>
</div>
</div>

30
app/views/admin/groups/_post.html.erb
View File

@ -38,6 +38,7 @@
<% end %>
</div>
<div class="group-post-content-wrap">
<<<<<<< Updated upstream
<h3 class="group-post-title">
<%= post.title %>
</h3>
@ -63,5 +64,34 @@
</span>
</div>
</div>
=======
<h3 class="group-post-title">
<a href="/admin/posts/<%= post.to_param %>" class="group-post-link">
<%= post.title %>
</a>
</h3>
<div class="group-post-content">
<% content = strip_tags post.content %>
<%= content[0..250] %>
<%= "..." if content.length > 350 %>
</div>
<div class="group-post-meta-wrap">
<span class="group-post-author">
<%
user = User.find(post.author) rescue nil
if !user.nil?
author = (user.member_profile.name == nil ? user.user_name : user.member_profile.name rescue "")
%>
<i class="group-post-author-icon icon-user"></i> <%= author %>
<% end %>
</span>
<div class="group-post-sub-wrap">
<span class="group-post-postdate">
<% date = DateTime.parse(post.created_at.to_s).strftime("%d %B %H:%M") %>
<i class="group-post-postdate-icon icon-time"></i> <%= date %>
</span>
</div>
</div>
>>>>>>> Stashed changes
</div>
</div>

21
app/views/admin/groups/_post_comment.html.erb
View File

@ -1,4 +1,23 @@
<li class="group-show-post-comment">
<li class="group-show-post-comment card">
<div class="group-show-post-actions action tool-tip-parent">
<button class="group-show-post-dropdown-toggle toggle">
<span class="caret"></span>
</button>
<ul class="group-show-post-dropdown action-dropdown">
<li class="group-show-post-dropdown-item">
<a href="#">
<i class="fa fa-flag-o"></i>
Flag inappropriate</a>
</a>
</li>
<li class="group-show-post-dropdown-item">
<a href="#" class="delete-post-btn">
<i class="fa fa-trash-o"></i>
Delete this post
</a>
</li>
</ul>
</div>
<div class="group-show-post-comment-wrap">
<div class="group-show-post-comment-avatar">
<%

1
app/views/admin/groups/_post_form.html.erb
View File

@ -15,7 +15,6 @@
<%= javascript_include_tag "lib/dropzone" %>
<% end %>
<div class="input-area">
<div class="upload-status-notice hide">
<i class="fa fa-refresh fa-spin"></i>
<span class="upload-text">Uploading...</span>

8
app/views/admin/groups/edit.html.erb
View File

@ -1,3 +1,7 @@
<% content_for :page_specific_css do -%>
<%= stylesheet_link_tag "//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" %>
<% end -%>
<%= form_for @group, :url => admin_group_path(@group.id), :html => { :multipart => true , :class=>"form-horizontal main-forms"} do |f| %>
<fieldset>
<%= render :partial => "group_form", locals: {f: f} %>
@ -15,11 +19,11 @@
<table>
<% @existing_members.each do |em| %>
<tr>
<td><img src="<%= em["avatar"] %>" style="width:75px;height:75px;" /></td>
<td><img class="group-edit-avatar" src="<%= em["avatar"] %>" /></td>
<td width="70%" <%= em["id"] != current_user.id.to_s ? "" : "colspan='3'" %>><h5><%= em["name"][I18n.locale.to_s] %></h5></td>
<% if em["id"] != current_user.id.to_s %>
<td><input type="checkbox" class="make-admin-checkbox" value="<%= em["id"] %>" <%= em["admin"] ? "checked='checked'" : ""%> /> Admin</td>
<td><a href="#" style="font-size:25px;" class="member-delete-btn" data-member="<%= em.to_json %>"><i class="icon-trash"></i></a></td>
<td><a href="#" class="member-delete-btn" data-member="<%= em.to_json %>"><i class="icon-trash"></i></a></td>
<% end %>
</tr>
<% end %>

131
app/views/admin/groups/members.html.erb
View File

@ -7,22 +7,125 @@
<%= javascript_include_tag "//cdnjs.cloudflare.com/ajax/libs/wow/1.1.2/wow.min.js" %>
<%= javascript_include_tag "group.js" %>
<% end -%>
<div class="group-post">
<div class="group-post-banner-wrap">
<div class="group-post-banner-image-wrap">
<img class="group-post-banner-image" src="<%= @group.image.url %>" alt="<%= @group.title %>">
<div class="group-member">
<div class="group-member-banner-wrap">
<div class="group-member-banner-image-wrap">
<img class="group-member-banner-image" src="<%= @group.image.url %>" alt="<%= @group.title %>">
</div>
<div class="group-post-bar">
<h2 class="group-post-page-title"><%= @group.title %> - Members</h2>
<div class="group-member-bar">
<h2 class="group-member-page-title"><%= @group.title %> - Members</h2>
</div>
</div>
</div>
<div class="group-post-section wrapper">
<div class="group-post-detail">
<ul class="group-post-pagenation breadcrumb">
<li><a href="<%= admin_groups_path %>">My Groups</a> <span class="divider">/</span></li>
<li><a href="<%= admin_group_path(@group) %>"><%= @group.title %></a><span class="divider">/</span></li>
<li class="active">Members</li>
</ul>
<div class="group-member-section wrapper">
<div class="group-member-detail">
<ul class="group-member-pagenation breadcrumb">
<li><a href="<%= admin_groups_path %>">My Groups</a> <span class="divider">/</span></li>
<li><a href="<%= admin_group_path(@group) %>"><%= @group.title %></a><span class="divider">/</span></li>
<li class="active">Members</li>
</ul>
</div>
<div class="group-member-dropdown btn-group">
<button class="btn">All members <span class="badge">20</span></button>
<button class="btn dropdown-toggle" data-toggle="dropdown">
<span class="caret"></span>
</button>
<ul class="dropdown-menu">
<li><a href="#">All members <span class="badge">20</span></a></li>
<li><a href="#">Admins <span class="badge">8</span></a></li>
<li><a href="#">members <span class="badge">12</span></a></li>
</ul>
</div>
<ul class="group-member-list clearfix">
<li class="group-member-item card">
<div class="group-member-photo-wrap">
<img class="group-member-photo" src="http://lorempixel.com/100/100" alt="Member Photo">
</div>
<div class="group-member-meta-wrap">
<div class="group-member-name">
<a href="#">Joshua Lin</a>
</div>
</div>
</li>
<li class="group-member-item card">
<div class="group-member-photo-wrap">
<img class="group-member-photo" src="http://lorempixel.com/100/100" alt="Member Photo">
</div>
<div class="group-member-meta-wrap">
<div class="group-member-name">
<a href="#">Joshua Lin</a>
</div>
</div>
</li>
<li class="group-member-item card">
<div class="group-member-photo-wrap">
<img class="group-member-photo" src="http://lorempixel.com/100/100" alt="Member Photo">
</div>
<div class="group-member-meta-wrap">
<div class="group-member-name">
<a href="#">Joshua Lin</a>
</div>
</div>
</li>
<li class="group-member-item card">
<div class="group-member-photo-wrap">
<img class="group-member-photo" src="http://lorempixel.com/100/100" alt="Member Photo">
</div>
<div class="group-member-meta-wrap">
<div class="group-member-name">
<a href="#">Joshua Lin</a>
</div>
</div>
</li>
<li class="group-member-item card">
<div class="group-member-photo-wrap">
<img class="group-member-photo" src="http://lorempixel.com/100/100" alt="Member Photo">
</div>
<div class="group-member-meta-wrap">
<div class="group-member-name">
<a href="#">Joshua Lin</a>
</div>
</div>
</li>
<li class="group-member-item card">
<div class="group-member-photo-wrap">
<img class="group-member-photo" src="http://lorempixel.com/100/100" alt="Member Photo">
</div>
<div class="group-member-meta-wrap">
<div class="group-member-name">
<a href="#">Joshua Lin</a>
</div>
</div>
</li>
<li class="group-member-item card">
<div class="group-member-photo-wrap">
<img class="group-member-photo" src="http://lorempixel.com/100/100" alt="Member Photo">
</div>
<div class="group-member-meta-wrap">
<div class="group-member-name">
<a href="#">Joshua Lin</a>
</div>
</div>
</li>
<li class="group-member-item card">
<div class="group-member-photo-wrap">
<img class="group-member-photo" src="http://lorempixel.com/100/100" alt="Member Photo">
</div>
<div class="group-member-meta-wrap">
<div class="group-member-name">
<a href="#">Joshua Lin</a>
</div>
</div>
</li>
<li class="group-member-item card">
<div class="group-member-photo-wrap">
<img class="group-member-photo" src="http://lorempixel.com/100/100" alt="Member Photo">
</div>
<div class="group-member-meta-wrap">
<div class="group-member-name">
<a href="#">Joshua Lin</a>
</div>
</div>
</li>
</ul>
</div>
</div>

14
app/views/admin/groups/show.html.erb
View File

@ -24,6 +24,10 @@
</div>
<div class="group-post-bar">
<h2 class="group-post-page-title"><%= @group.title %></h2>
<a class="group-post-join button button-primary" href="#">
<i class="fa fa-user-plus"></i>
Join this group
</a>
<% if user_can_write? %>
<a class="group-post-new-post button button-primary" href="<%= admin_group_newpost_path(@group) %>"><i class="icon-plus"></i> New Post</a>
<% end %>
@ -64,9 +68,15 @@
<p>
<% number_of_members = @group.users.count %>
<% if number_of_members > 0 %>
<a href="<%= admin_group_members_path(@group) %>"><%= number_of_members.to_s %> member<%= number_of_members > 1 ? "s" : "" %></a>
<a class="group-post-member-count"> href="<%= admin_group_members_path(@group) %>">
<i class="fa fa-user"></i>
<%= number_of_members.to_s %> member<%= number_of_members > 1 ? "s" : "" %>
</a>
<% else %>
No members
<span class="group-post-no-member">
<i class="fa fa-user"></i>
No members
</span>
<% end %>
</p>
</div>

16
app/views/admin/groups/showpost.html.erb
View File

@ -29,7 +29,7 @@
avatar = (!user.member_profile.avatar.nil? ? user.member_profile.avatar.thumb.url : "/assets/member-pic.png" rescue "/assets/member-pic.png")
end
%>
<img class="group-show-post-avatar" src="<%= avatar %>" alt="">
<img class="group-show-post-avatar" src="<%= avatar %>" alt="Post Avatar">
<span class="group-show-post-username tool-tip"><%= author %></span>
</a>
</div>
@ -40,7 +40,6 @@
<% date = DateTime.parse(@post.created_at.to_s).strftime("%d %B %H:%M ") %>
<i class="group-show-post-postdate-icon icon-time"></i> <%= date %>
</span>
<!-- <span class="group-show-post-time">10:25</span> -->
</div>
</header>
<section class="group-show-post-image-wrap">
@ -54,7 +53,9 @@
data-cycle-center-vert=true
>
<% @post.group_post_images.each do |gpi| %>
<li class="group-show-post-image-item"><img class="group-show-post-banner-image" src="<%= gpi.image.url %>" alt="<%= @post.title %>"></li>
<li class="group-show-post-image-item">
<img class="group-show-post-banner-image" src="<%= gpi.image.url %>" alt="<%= @post.title %>">
</li>
<% end %>
</ul>
<div class="group-show-post-cycle-prev cycle-nav"><i class="group-show-post-cycle-nav-icon icon-chevron-left"></i></div>
@ -87,7 +88,7 @@
css_class = "fa-file-zip-o"
end
%>
<a href="/admin/posts/file/<%= gpf.id.to_s %>" class="button button-primary button-small"><i class="group-show-post-attachment-file-format fa <%= css_class %>"></i><span class="group-show-post-attachments-file-name"><%= File.basename(gpf.file.path) %></span></a>
<a href="/admin/posts/file/<%= gpf.id.to_s %>" class="button button-primary"><i class="group-show-post-attachment-file-format fa <%= css_class %>"></i><span class="group-show-post-attachments-file-name"><%= File.basename(gpf.file.path) %></span></a>
<% end %>
</span>
<% end %>
@ -110,14 +111,17 @@
<h3 class="group-show-post-respond-title">
Leave a comment
</h3>
<div class="group-show-post-respond-wrap">
<div class="group-show-post-respond-wrap clearfix">
<label for="comment" class="screen-reader">Comment</label>
<div class="group-show-post-avatar">
<img src="http://lorempixel.com/60/60" alt="User Avatar">
</div>
<input type="text" name="group_post_comment[comment]" id="group_post_comment" class="group-show-post-respond-comment" placeholder="Your comment here.">
<input type="hidden" name="group_post_comment[group_post_id]" value="<%= @post.id.to_s %>" />
<input type="hidden" name="group_post_comment[user_id]" value="<%= current_user.id.to_s %>" />
</div>
<div class="group-show-post-submit-wrap">
<input type="submit" name="submit" class="group-show-post-respond-submit button button-primary" id="submit" value="Submit Comment">
<input type="submit" name="submit" class="group-show-post-respond-submit button button-primary button-large" id="submit" value="Submit Comment">
</div>
</form>
</div>