forked from saurabh/orbit4-5
joshua commit for groups, sdk and orbit_bar
This commit is contained in:
rulingcom
parent
3772e350ba
commit
017be3eb3d
|
|
@ -7,12 +7,13 @@
|
||||||
var group = {
|
var group = {
|
||||||
// Detect and change the top position of the cycle navs
|
// Detect and change the top position of the cycle navs
|
||||||
cycleFix: function() {
|
cycleFix: function() {
|
||||||
if( doc.querySelectorAll( ".group-post-banner-image").length >= 1 ) {
|
if (doc.querySelectorAll(".group-show-post-banner-image").length >= 1) {
|
||||||
var imgs = doc.querySelectorAll(".group-post-banner-image"),
|
var imgs = doc.querySelectorAll(".group-post-banner-image"),
|
||||||
cycleNav = doc.querySelectorAll(".cycle-nav"),
|
cycleNav = doc.querySelectorAll(".cycle-nav"),
|
||||||
len = cycleNav.length,
|
len = cycleNav.length,
|
||||||
i = -1;
|
i = -1;
|
||||||
|
|
||||||
|
|
||||||
// Hide the navs when there's noly one slide
|
// Hide the navs when there's noly one slide
|
||||||
if (imgs.length <= 1) {
|
if (imgs.length <= 1) {
|
||||||
for (i = 0; i < len; i++) {
|
for (i = 0; i < len; i++) {
|
||||||
|
|
@ -20,34 +21,96 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
} else if ( doc.querySelectorAll( ".group-post-banner-image").length === 0 && doc.querySelector( ".group-post-image-wrap" ) ) {
|
} else if (doc.querySelectorAll(".group-show-post-banner-image").length === 0 && doc.querySelector(".group-show-post-image-wrap")) {
|
||||||
doc.querySelector( ".group-post-image-wrap").classList.add( "hide" );
|
doc.querySelector(".group-show-post-image-wrap").classList.add("hide");
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
// Create scroll effect (with css)
|
// Create scroll effect (with css)
|
||||||
scrollEffect: function() {
|
scrollEffect: function() {
|
||||||
if( doc.querySelector( ".group-page") ) {
|
if (doc.querySelector(".group-post")) {
|
||||||
var page = doc.querySelector( ".group-page" ),
|
var post = doc.querySelector(".group-post"),
|
||||||
wrap = doc.querySelector( ".group-page-banner-image-wrap" ),
|
wrap = doc.querySelector(".group-post-banner-image-wrap"),
|
||||||
scrollClass = "scroll";
|
scrollClass = "scroll";
|
||||||
|
|
||||||
// Use pageYOffset to get the Y positoin and add scroll on it, the animation
|
// Use pageYOffset to get the Y positoin and add scroll on it, the animation
|
||||||
// is done by css transition
|
// is done by css transition
|
||||||
window.addEventListener("scroll", function() {
|
window.addEventListener("scroll", function() {
|
||||||
if( window.pageYOffset !== 0 ) {
|
if (window.pageYOffset > 0) {
|
||||||
page.classList.add( scrollClass );
|
post.classList.add(scrollClass);
|
||||||
} else {
|
} else {
|
||||||
page.classList.remove( scrollClass );
|
post.classList.remove(scrollClass);
|
||||||
}
|
}
|
||||||
}, false);
|
}, false);
|
||||||
}
|
}
|
||||||
|
},
|
||||||
|
// Equal height for card
|
||||||
|
equalHeight: function() {
|
||||||
|
var bigbrother = -1,
|
||||||
|
$card = $('.group-card-inner');
|
||||||
|
|
||||||
|
$card.each(function() {
|
||||||
|
bigbrother = bigbrother > $(this).height() ? bigbrother : $(this).height();
|
||||||
|
});
|
||||||
|
|
||||||
|
$card.each(function() {
|
||||||
|
$(this).height(bigbrother);
|
||||||
|
});
|
||||||
|
},
|
||||||
|
// We want to place a dropdown in group-post-item, but link cannot be nested, hance this fix
|
||||||
|
makePostClick: function() {
|
||||||
|
var postLink = doc.querySelectorAll('.group-post-link');
|
||||||
|
|
||||||
|
if (postLink) {
|
||||||
|
Array.prototype.forEach.call(postLink, function(item) {
|
||||||
|
item.parentNode.classList.add('clickable');
|
||||||
|
item.parentNode.addEventListener('click', function(e) {
|
||||||
|
window.location.href = item.href;
|
||||||
|
});
|
||||||
|
});
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// Bootstrap dropdown is too much of a hassle, using this instead
|
||||||
|
makeDropdown: function() {
|
||||||
|
var $post = $('.group-post'),
|
||||||
|
$toggle = $('.group-post-dropdown-toggle'),
|
||||||
|
$dropdown = $post.find('.group-post-dropdown'),
|
||||||
|
klass = 'open';
|
||||||
|
$toggle.click(function() {
|
||||||
|
$toggle.removeClass(klass);
|
||||||
|
$dropdown.removeClass(klass);
|
||||||
|
$(this)
|
||||||
|
.addClass(klass)
|
||||||
|
.next('.group-post-dropdown')
|
||||||
|
.toggleClass(klass)
|
||||||
|
return false;
|
||||||
|
});
|
||||||
|
$post.click(function() {
|
||||||
|
$toggle.removeClass(klass)
|
||||||
|
$dropdown.removeClass(klass);
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
// Third-party plugin settings
|
||||||
|
plugins: function() {
|
||||||
|
// WOWjs
|
||||||
|
if (typeof window.WOW !== 'undefined') {
|
||||||
|
new WOW().init();
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// When DOM is completely loaded, execute these functions
|
// When DOM is completely loaded, execute these functions
|
||||||
document.addEventListener("DOMContentLoaded", function(event) {
|
document.addEventListener("DOMContentLoaded", function(event) {
|
||||||
group.cycleFix();
|
|
||||||
|
if (doc.querySelector('.group-post')) {
|
||||||
group.scrollEffect();
|
group.scrollEffect();
|
||||||
|
group.makePostClick();
|
||||||
|
group.makeDropdown();
|
||||||
|
}
|
||||||
|
|
||||||
|
group.cycleFix();
|
||||||
|
group.equalHeight();
|
||||||
|
group.plugins();
|
||||||
});
|
});
|
||||||
|
|
||||||
})();
|
})();
|
||||||
|
|
|
||||||
|
|
@ -1,765 +0,0 @@
|
||||||
@charset "utf-8";
|
|
||||||
|
|
||||||
@import url(http://fonts.googleapis.com/css?family=Maven+Pro);
|
|
||||||
|
|
||||||
@import url(http://fonts.googleapis.com/css?family=Roboto);
|
|
||||||
|
|
||||||
// Font stacks
|
|
||||||
|
|
||||||
$main-font: "Maven Pro", "微軟正黑體" sans-serif;
|
|
||||||
$paragraph-font: "Roboto", "微軟正黑體", sans-serif;
|
|
||||||
$gray: #f3f3f3;
|
|
||||||
$dark-gray: #aaaaaa;
|
|
||||||
$light-gray: #cdcdcd;
|
|
||||||
$white: white;
|
|
||||||
$light-black: #353535;
|
|
||||||
$black: black;
|
|
||||||
$green: #4ad976;
|
|
||||||
$blue: #4171d5;
|
|
||||||
$red: #c71932;
|
|
||||||
$blue-green: #00acee;
|
|
||||||
$group-page-bar-color: #171717;
|
|
||||||
|
|
||||||
// Transition units
|
|
||||||
$fast: 0.3s;
|
|
||||||
$normal: 0.6s;
|
|
||||||
$slow: 1s;
|
|
||||||
|
|
||||||
// Border radius units
|
|
||||||
$general: 0.25rem;
|
|
||||||
|
|
||||||
// General style
|
|
||||||
body {
|
|
||||||
background: $gray;
|
|
||||||
font-family: $main-font;
|
|
||||||
}
|
|
||||||
|
|
||||||
*,
|
|
||||||
*:before,
|
|
||||||
*:after {
|
|
||||||
box-sizing: border-box;
|
|
||||||
}
|
|
||||||
|
|
||||||
h1, h2, h3, h4, h5, h6, label, legend {
|
|
||||||
font-family: $main-font;
|
|
||||||
}
|
|
||||||
|
|
||||||
img {
|
|
||||||
width: 100%;
|
|
||||||
max-width: 100%;
|
|
||||||
height: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
a {
|
|
||||||
text-decoration: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
a:hover, a:visited {
|
|
||||||
text-decoration: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
// General classes
|
|
||||||
|
|
||||||
.screen-reader {
|
|
||||||
position: absolute;
|
|
||||||
top: -9999px;
|
|
||||||
left: -9999px;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Buttons
|
|
||||||
.button {
|
|
||||||
padding: 8px .75rem;
|
|
||||||
color: $black;
|
|
||||||
border: none;
|
|
||||||
border-radius: 15rem;
|
|
||||||
background: $gray;
|
|
||||||
}
|
|
||||||
|
|
||||||
.button-default {
|
|
||||||
color: $blue;
|
|
||||||
background-color: transparent;
|
|
||||||
border: 2px solid $blue;
|
|
||||||
transition: $fast all;
|
|
||||||
&:hover {
|
|
||||||
color: $white;
|
|
||||||
background-color: $blue;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.button-activated {
|
|
||||||
color: #fff;
|
|
||||||
background-color: $green;
|
|
||||||
}
|
|
||||||
|
|
||||||
.button-primary {
|
|
||||||
color: $white;
|
|
||||||
background-color: $blue;
|
|
||||||
transition: $fast all;
|
|
||||||
&:hover {
|
|
||||||
color: $white;
|
|
||||||
background-color: darken($blue, 15%);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// 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;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// Tool Tip
|
|
||||||
.tool-tip-parent {
|
|
||||||
position: relative;
|
|
||||||
&:hover {
|
|
||||||
.tool-tip {
|
|
||||||
display: block;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.tool-tip {
|
|
||||||
padding: 10px 0.75rem;
|
|
||||||
border-radius: .2rem;
|
|
||||||
color: $white;
|
|
||||||
background: rgba($black, 0.85);
|
|
||||||
position: absolute;
|
|
||||||
left: 0;
|
|
||||||
bottom: 100%;
|
|
||||||
z-index: 150;
|
|
||||||
display: none;
|
|
||||||
&:after {
|
|
||||||
border: 5px solid transparent;
|
|
||||||
border-top-color: rgba($black, 0.85);
|
|
||||||
content: "";
|
|
||||||
position: absolute;
|
|
||||||
left: 10px;
|
|
||||||
bottom: -10px;
|
|
||||||
}
|
|
||||||
&.right {
|
|
||||||
left: auto;
|
|
||||||
right: 0;
|
|
||||||
&:after {
|
|
||||||
left: auto;
|
|
||||||
right: 10px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.topnav {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
// breadcrumb
|
|
||||||
.breadcrumb {
|
|
||||||
padding-left: 0;
|
|
||||||
margin: 0;
|
|
||||||
background: none;
|
|
||||||
> li {
|
|
||||||
text-shadow: none;
|
|
||||||
font-size: 13px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// dropzone
|
|
||||||
|
|
||||||
.dropzone-pool {
|
|
||||||
border: 2px dashed $blue;
|
|
||||||
margin-bottom: 16px;
|
|
||||||
font-family: $paragraph-font;
|
|
||||||
font-size: 0.9375rem;
|
|
||||||
color: $dark-gray;
|
|
||||||
margin-right: 1rem;
|
|
||||||
border-radius: $general;
|
|
||||||
}
|
|
||||||
|
|
||||||
// overriding member css
|
|
||||||
#main-wrap {}
|
|
||||||
|
|
||||||
// Group page
|
|
||||||
#main-wrap {
|
|
||||||
padding-top: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.group-page-banner-wrap {
|
|
||||||
height: 280px;
|
|
||||||
overflow: hidden;
|
|
||||||
position: fixed;
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
width: 100%;
|
|
||||||
transition: $fast all;
|
|
||||||
z-index: 500;
|
|
||||||
background: $black;
|
|
||||||
}
|
|
||||||
|
|
||||||
.group-page-banner-image-wrap {
|
|
||||||
background-color: $black;
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
.group-page-view-switch {
|
|
||||||
position: absolute;
|
|
||||||
top: 4rem;
|
|
||||||
right: 2rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
.group-page-banner-image {
|
|
||||||
width: auto;
|
|
||||||
max-width: 100%;
|
|
||||||
height: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.group-page-bar {
|
|
||||||
padding: 0 2rem 20px 6rem;
|
|
||||||
text-align: center;
|
|
||||||
background: rgba($group-page-bar-color, 0.95);
|
|
||||||
width: 100%;
|
|
||||||
position: absolute;
|
|
||||||
left: 0;
|
|
||||||
bottom: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.group-page-view-switch-in-bar {
|
|
||||||
display: none;
|
|
||||||
.button {
|
|
||||||
padding: 3px .75rem;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.group-page-title {
|
|
||||||
margin-bottom: 12px;
|
|
||||||
padding: 6px 0;
|
|
||||||
color: $white;
|
|
||||||
font-family: $main-font;
|
|
||||||
font-weight: normal;
|
|
||||||
}
|
|
||||||
|
|
||||||
.group-page-section {
|
|
||||||
overflow: hidden;
|
|
||||||
max-width: 1150px;
|
|
||||||
margin: auto;
|
|
||||||
padding: 300px 2rem 30px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.gorup-page-info-wrap {
|
|
||||||
font-size: .9rem;
|
|
||||||
padding: 6px 1rem;
|
|
||||||
display: block;
|
|
||||||
float: right;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
.group-page-description-wrap {
|
|
||||||
clear: both;
|
|
||||||
}
|
|
||||||
|
|
||||||
.gorup-page-info-wrap {
|
|
||||||
margin-bottom: 10px;
|
|
||||||
text-align: right;
|
|
||||||
}
|
|
||||||
|
|
||||||
.group-page-status-wrap {
|
|
||||||
font-size: .75rem;
|
|
||||||
float: right;
|
|
||||||
padding: 2px 0.5rem;
|
|
||||||
margin-bottom: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.group-page-status-wrap.close-eye {
|
|
||||||
margin-left: 5px;
|
|
||||||
background: $red;
|
|
||||||
}
|
|
||||||
|
|
||||||
.group-page-description-wrap {
|
|
||||||
margin-bottom: 15px;
|
|
||||||
padding: 16px 1.2rem 16px;
|
|
||||||
border-radius: .2rem;
|
|
||||||
box-shadow: inset 0 0 8px $dark-gray;
|
|
||||||
}
|
|
||||||
|
|
||||||
.group-page-description {
|
|
||||||
clear: both;
|
|
||||||
text-align: justify;
|
|
||||||
}
|
|
||||||
|
|
||||||
.group-page-post {
|
|
||||||
clear: both;
|
|
||||||
margin-bottom: 40px;
|
|
||||||
padding: 28px 1.5rem;
|
|
||||||
text-align: center;
|
|
||||||
border-radius: $general;
|
|
||||||
background: $white;
|
|
||||||
box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.2);
|
|
||||||
transition: $normal box-shadow;
|
|
||||||
}
|
|
||||||
|
|
||||||
.group-page-post-link {
|
|
||||||
text-decoration: none;
|
|
||||||
color: $black;
|
|
||||||
}
|
|
||||||
|
|
||||||
.group-page-post:hover {
|
|
||||||
box-shadow: 0 1px 25px 0 rgba(0, 0, 0, 0.2);
|
|
||||||
}
|
|
||||||
|
|
||||||
.group-page-post-link:hover {
|
|
||||||
text-decoration: none;
|
|
||||||
color: $black;
|
|
||||||
}
|
|
||||||
|
|
||||||
.group-page-post-image-wrap {
|
|
||||||
display: inline-block;
|
|
||||||
margin-bottom: 12px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.group-page-post-image {
|
|
||||||
width: 100%;
|
|
||||||
max-width: 100%;
|
|
||||||
height: auto;
|
|
||||||
margin-top: 12px;
|
|
||||||
border: 2px solid $gray;
|
|
||||||
border-radius: $general;
|
|
||||||
}
|
|
||||||
|
|
||||||
.group-page-post-content {
|
|
||||||
margin-bottom: .5rem;
|
|
||||||
color: $dark-gray;
|
|
||||||
overflow: hidden;
|
|
||||||
}
|
|
||||||
|
|
||||||
.group-page-post-title {
|
|
||||||
font-size: 1.5rem;
|
|
||||||
font-weight: normal;
|
|
||||||
line-height: 1;
|
|
||||||
margin-bottom: 12px;
|
|
||||||
color: $light-black;
|
|
||||||
font-family: $paragraph-font;
|
|
||||||
}
|
|
||||||
|
|
||||||
.group-page-post-sub-wrap {
|
|
||||||
display: inline-block;
|
|
||||||
}
|
|
||||||
|
|
||||||
.group-page-post-meta-wrap {
|
|
||||||
color: $dark-gray;
|
|
||||||
}
|
|
||||||
|
|
||||||
.group-page-post-author,
|
|
||||||
.group-page-post-sub-wrap {
|
|
||||||
margin-right: .5rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
.group-page-seen-by {
|
|
||||||
display: inline-block;
|
|
||||||
}
|
|
||||||
|
|
||||||
.group-page-seen-by-lead {
|
|
||||||
font-style: normal;
|
|
||||||
}
|
|
||||||
|
|
||||||
// scroll view
|
|
||||||
|
|
||||||
.group-page.scroll {
|
|
||||||
padding-top: 7rem;
|
|
||||||
.group-page-banner-wrap {
|
|
||||||
height: 120px;
|
|
||||||
}
|
|
||||||
.group-page-title {
|
|
||||||
margin-bottom: 0;
|
|
||||||
font-size: 1.625rem;
|
|
||||||
line-height: 50px;
|
|
||||||
}
|
|
||||||
.group-page-new-post {
|
|
||||||
margin-top: 18px;
|
|
||||||
padding: 6px 10px;
|
|
||||||
}
|
|
||||||
.group-page-new-post {
|
|
||||||
display: inline-block;
|
|
||||||
vertical-align: top;
|
|
||||||
}
|
|
||||||
.group-page-view-switch {
|
|
||||||
position: static;
|
|
||||||
display: inline-block;
|
|
||||||
margin: 6px .5rem 0 0;
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
.group-page-view-switch-in-bar {
|
|
||||||
display: inline-block;
|
|
||||||
margin-top: 18px;
|
|
||||||
.button {
|
|
||||||
padding: 4px .75rem;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.group-page-section {
|
|
||||||
padding-top: 60px;
|
|
||||||
}
|
|
||||||
.btn {
|
|
||||||
padding: 2px 5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
.group-page li a {
|
|
||||||
text-decoration: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.group-page-switch-btn {
|
|
||||||
color: $blue;
|
|
||||||
&:hover {
|
|
||||||
color: $white;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// 400px
|
|
||||||
@media screen and (min-width: 25rem) {
|
|
||||||
.group-page-new-post {
|
|
||||||
margin: 0 0.625rem 16px;
|
|
||||||
float: none;
|
|
||||||
display: inline-block;
|
|
||||||
}
|
|
||||||
.group-page-view-switch-in-bar {
|
|
||||||
float: none;
|
|
||||||
margin: 0;
|
|
||||||
.button {
|
|
||||||
padding: 6px .75rem;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// 600px
|
|
||||||
|
|
||||||
@media screen and (min-width: 37.5rem) {
|
|
||||||
.group-page-post {
|
|
||||||
margin-bottom: 35px;
|
|
||||||
text-align: left;
|
|
||||||
}
|
|
||||||
.group-page-post-image-wrap {
|
|
||||||
float: left;
|
|
||||||
width: 12%;
|
|
||||||
min-width: 100px;
|
|
||||||
margin-right: 4%;
|
|
||||||
max-height: 140px;
|
|
||||||
overflow: hidden;
|
|
||||||
}
|
|
||||||
.group-page-post-content-wrap {
|
|
||||||
float: left;
|
|
||||||
width: 70%;
|
|
||||||
font-family: $paragraph-font;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
/* 760px */
|
|
||||||
|
|
||||||
@media screen and (min-width: 47.5rem) {
|
|
||||||
.group-page-post-content-wrap {
|
|
||||||
width: 70%;
|
|
||||||
}
|
|
||||||
.group-page-bar {
|
|
||||||
text-align: left;
|
|
||||||
}
|
|
||||||
.group-page-title {
|
|
||||||
display: inline-block;
|
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
|
||||||
line-height: 70px;
|
|
||||||
transition: .6s all;
|
|
||||||
}
|
|
||||||
.group-page-new-post {
|
|
||||||
float: right;
|
|
||||||
margin: 18px 0 0 0;
|
|
||||||
}
|
|
||||||
.group-page-view-switch-in-bar {
|
|
||||||
margin: 18px 8px 0 0;
|
|
||||||
float: right;
|
|
||||||
li {
|
|
||||||
padding: 8px .75rem;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.group-page-view-switch {
|
|
||||||
float: right;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// 900px
|
|
||||||
@media screen and (min-width: 56.25rem) {
|
|
||||||
.group-page-post-content-wrap {
|
|
||||||
width: 80%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// Group post
|
|
||||||
.group-post {
|
|
||||||
padding: 50px 2rem 30px;
|
|
||||||
max-width: 1150px;
|
|
||||||
margin: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.group-post-meta {
|
|
||||||
margin-bottom: 15px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.group-post-title {
|
|
||||||
font-family: $main-font;
|
|
||||||
float: left;
|
|
||||||
width: 90%;
|
|
||||||
font-weight: normal;
|
|
||||||
line-height: 1;
|
|
||||||
}
|
|
||||||
|
|
||||||
.group-post-avatar-wrap {
|
|
||||||
float: right;
|
|
||||||
padding: 0 0.375rem 0 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.group-post-avatar-username-toggle {
|
|
||||||
display: block;
|
|
||||||
}
|
|
||||||
|
|
||||||
.group-post-avatar {
|
|
||||||
width: 60px;
|
|
||||||
height: 60px;
|
|
||||||
border-radius: 50%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.group-post-username {
|
|
||||||
display: none;
|
|
||||||
top: 100%;
|
|
||||||
padding-bottom: 30px;
|
|
||||||
right: 0;
|
|
||||||
left: auto;
|
|
||||||
white-space: nowrap;
|
|
||||||
font-size: 0.75rem;
|
|
||||||
&:after {
|
|
||||||
border-top-color: transparent;
|
|
||||||
border-bottom-color: rgba(0, 0, 0, 0.85);
|
|
||||||
top: -10px;
|
|
||||||
left: auto;
|
|
||||||
right: 20px;
|
|
||||||
bottom: auto;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.group-post-postdate {
|
|
||||||
display: inline-block;
|
|
||||||
clear: both;
|
|
||||||
}
|
|
||||||
|
|
||||||
.group-post-image-wrap {
|
|
||||||
position: relative;
|
|
||||||
background: $black;
|
|
||||||
&:hover {
|
|
||||||
.cycle-nav {
|
|
||||||
opacity: 1;
|
|
||||||
}
|
|
||||||
.group-post-cycle-prev {
|
|
||||||
left: 2rem;
|
|
||||||
}
|
|
||||||
.group-post-cycle-next {
|
|
||||||
right: 2rem;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.group-post-image-list {
|
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
|
||||||
list-style: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.cycle-nav {
|
|
||||||
font-size: 1.2rem;
|
|
||||||
position: absolute;
|
|
||||||
top: 50%;
|
|
||||||
margin-top: -1.25rem;
|
|
||||||
line-height: 1.5rem;
|
|
||||||
color: $white;
|
|
||||||
z-index: 500;
|
|
||||||
width: 2.5rem;
|
|
||||||
height: 2.5rem;
|
|
||||||
cursor: pointer;
|
|
||||||
-webkit-transition: $normal all;
|
|
||||||
transition: $normal all;
|
|
||||||
text-align: center;
|
|
||||||
background-color: rgba($black, 0.8);
|
|
||||||
border-radius: 50%;
|
|
||||||
opacity: 0;
|
|
||||||
&:hover {
|
|
||||||
background-color: $blue;
|
|
||||||
}
|
|
||||||
.group-post-cycle-nav-icon {
|
|
||||||
line-height: 2.6rem;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.group-post-cycle-prev {
|
|
||||||
left: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.group-post-cycle-next {
|
|
||||||
right: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.group-post-content {
|
|
||||||
font-family: $main-font;
|
|
||||||
font-size: .8125rem;
|
|
||||||
margin: 15px 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.group-post-attachment-wrap {
|
|
||||||
float: left;
|
|
||||||
width: 80%;
|
|
||||||
margin: 10px 0 25px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.group-post-attachments {
|
|
||||||
a {
|
|
||||||
margin-bottom: 10px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.group-post-attachment-file-format {
|
|
||||||
margin-right: 8px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.group-post-seen-by {
|
|
||||||
float: right;
|
|
||||||
cursor: pointer;
|
|
||||||
&:hover {
|
|
||||||
.group-post-seen-by-names {
|
|
||||||
display: block;
|
|
||||||
white-space: nowrap;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.group-post-seen-by-name {
|
|
||||||
display: block;
|
|
||||||
color: #fff;
|
|
||||||
white-space: nowrap;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.group-post-seen-by-lead {
|
|
||||||
margin-right: 4px;
|
|
||||||
font-style: normal;
|
|
||||||
}
|
|
||||||
|
|
||||||
.group-post-seen-by-names {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.group-post-seen-by-count {
|
|
||||||
border-radius: 50%;
|
|
||||||
background: $gray;
|
|
||||||
display: inline-block;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Comment section
|
|
||||||
.comments {
|
|
||||||
clear: both;
|
|
||||||
}
|
|
||||||
|
|
||||||
.comments .group-post-respond-comment {
|
|
||||||
width: 100%;
|
|
||||||
height: 60px;
|
|
||||||
padding: 0 1rem;
|
|
||||||
box-shadow: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.group-post-respond-submit {
|
|
||||||
font-size: 0.75rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
.group-post-comment-list {
|
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
|
||||||
list-style: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.group-post-comment-wrap {
|
|
||||||
overflow: hidden;
|
|
||||||
margin-bottom: 25px;
|
|
||||||
padding-bottom: 8px;
|
|
||||||
border-bottom: 1px solid lighten($light-gray, 12%);
|
|
||||||
}
|
|
||||||
|
|
||||||
.group-post-no-comment {
|
|
||||||
font-size: 0.8125rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
.group-post-comment-avatar {
|
|
||||||
float: left;
|
|
||||||
width: 60px;
|
|
||||||
margin-right: 1rem;
|
|
||||||
img {
|
|
||||||
width: 60px;
|
|
||||||
height: 60px;
|
|
||||||
border-radius: 50%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.group-post-comment-author {
|
|
||||||
font-size: .9375rem;
|
|
||||||
float: left;
|
|
||||||
}
|
|
||||||
|
|
||||||
.group-post-comment-time {
|
|
||||||
float: right;
|
|
||||||
}
|
|
||||||
|
|
||||||
.group-post-comment-content {
|
|
||||||
clear: both;
|
|
||||||
}
|
|
||||||
|
|
||||||
.group-post-comment-body {
|
|
||||||
float: left;
|
|
||||||
width: 80%;
|
|
||||||
}
|
|
||||||
|
|
||||||
// 260px
|
|
||||||
@media screen and (min-width: 16.25rem) {
|
|
||||||
.group-post-attachments {
|
|
||||||
a {
|
|
||||||
display: inline-block;
|
|
||||||
text-overflow: ellipsis;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.group-post-attachments-file-name {
|
|
||||||
display: inline-block;
|
|
||||||
text-overflow: ellipsis;
|
|
||||||
overflow: hidden;
|
|
||||||
vertical-align: middle;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@media screen and (min-width: 370px) {
|
|
||||||
.group-post-comment-body {
|
|
||||||
width: 60%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// group new
|
|
||||||
|
|
@ -0,0 +1,109 @@
|
||||||
|
@charset "utf-8";
|
||||||
|
|
||||||
|
// Group category page
|
||||||
|
.group-category {
|
||||||
|
margin-bottom: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-category-tab {
|
||||||
|
.group-category-tab-nav {
|
||||||
|
font-size: 0.8125rem;
|
||||||
|
padding: 10px 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.active {
|
||||||
|
.group-category-tab-nav {
|
||||||
|
background-color: $blue;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
background-color: lighten($blue, 5%);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-category-item {
|
||||||
|
float: left;
|
||||||
|
margin-right: 0.625rem;
|
||||||
|
background-color: $green;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
background-color: lighten($green, 5%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-category-tag-icon {
|
||||||
|
font-size: 1rem;
|
||||||
|
vertical-align: middle;
|
||||||
|
}
|
||||||
|
|
||||||
|
a {
|
||||||
|
font-size: 0.8125rem;
|
||||||
|
font-family: $sub-font;
|
||||||
|
color: $white;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-category-request {
|
||||||
|
.group-category-item {
|
||||||
|
background-color: darken($dark-gray, 25%);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-category-tab-content {
|
||||||
|
border-top: 1px solid #ddd;
|
||||||
|
padding: 16px 0;
|
||||||
|
overflow: visible;
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-category-controls {
|
||||||
|
margin-left: 8px;
|
||||||
|
a {
|
||||||
|
padding: 2px 0.4rem;
|
||||||
|
color: $white;
|
||||||
|
display: inline-block;
|
||||||
|
border-radius: 50%;
|
||||||
|
}
|
||||||
|
.group-category-approve {
|
||||||
|
background-color: $green;
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-category-reject {
|
||||||
|
background-color: $red;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-category-approve-tootip {
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
.card-ownership {
|
||||||
|
border-top: 6px solid darken($gray, 7%);
|
||||||
|
|
||||||
|
&:before {
|
||||||
|
border-top-left-radius: $general;
|
||||||
|
content: "";
|
||||||
|
height: 6px;
|
||||||
|
width: 80%;
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
top: -6px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.card-owner {
|
||||||
|
&:before {
|
||||||
|
background-color: lighten($blue, 10%);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.card-public {
|
||||||
|
&:before {
|
||||||
|
background-color: lighten($green, 10%);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.card-member {
|
||||||
|
&:before {
|
||||||
|
background-color: lighten($red, 20%);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,161 @@
|
||||||
|
@charset "utf-8";
|
||||||
|
|
||||||
|
// Genernal classes and modules
|
||||||
|
.screen-reader {
|
||||||
|
position: absolute;
|
||||||
|
top: -9999px;
|
||||||
|
left: -9999px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.wrapper {
|
||||||
|
margin: auto;
|
||||||
|
max-width: $boundary;
|
||||||
|
}
|
||||||
|
|
||||||
|
.radius {
|
||||||
|
border-radius: $general;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Buttons
|
||||||
|
.button {
|
||||||
|
padding: 8px .75rem;
|
||||||
|
color: $black;
|
||||||
|
border: none;
|
||||||
|
border-radius: 15rem;
|
||||||
|
background: $gray;
|
||||||
|
}
|
||||||
|
|
||||||
|
.button-default {
|
||||||
|
color: $blue;
|
||||||
|
background-color: transparent;
|
||||||
|
border: 2px solid $blue;
|
||||||
|
transition: $fast all;
|
||||||
|
&:hover {
|
||||||
|
color: $white;
|
||||||
|
background-color: $blue;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.button-activated {
|
||||||
|
color: #fff;
|
||||||
|
background-color: $green;
|
||||||
|
}
|
||||||
|
|
||||||
|
.button-primary {
|
||||||
|
color: $white;
|
||||||
|
background-color: $blue;
|
||||||
|
transition: $fast all;
|
||||||
|
&:hover {
|
||||||
|
color: $white;
|
||||||
|
background-color: darken($blue, 15%);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.button-small {
|
||||||
|
padding: 4px 0.625rem;
|
||||||
|
font-size: 0.75rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 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;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Tool Tip
|
||||||
|
.tool-tip-parent {
|
||||||
|
position: relative;
|
||||||
|
&:hover {
|
||||||
|
.tool-tip {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.tool-tip {
|
||||||
|
padding: 10px 0.75rem;
|
||||||
|
border-radius: .2rem;
|
||||||
|
color: $white;
|
||||||
|
background: rgba($black, 0.85);
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
bottom: 100%;
|
||||||
|
z-index: 150;
|
||||||
|
display: none;
|
||||||
|
&:after {
|
||||||
|
border: 5px solid transparent;
|
||||||
|
border-top-color: rgba($black, 0.85);
|
||||||
|
content: "";
|
||||||
|
position: absolute;
|
||||||
|
left: 10px;
|
||||||
|
bottom: -10px;
|
||||||
|
}
|
||||||
|
&.right {
|
||||||
|
left: auto;
|
||||||
|
right: 0;
|
||||||
|
&:after {
|
||||||
|
left: auto;
|
||||||
|
right: 10px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&.bottom {
|
||||||
|
top: 100%;
|
||||||
|
bottom: auto;
|
||||||
|
&:after {
|
||||||
|
top: -10px;
|
||||||
|
bottom: auto;
|
||||||
|
border-top-color: transparent;
|
||||||
|
border-bottom-color: rgba(0, 0, 0, 0.85);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&.nowrap {
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.card {
|
||||||
|
border-radius: $general;
|
||||||
|
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);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// breadcrumb
|
||||||
|
.breadcrumb {
|
||||||
|
padding-left: 0;
|
||||||
|
margin: 0;
|
||||||
|
background: none;
|
||||||
|
> li {
|
||||||
|
text-shadow: none;
|
||||||
|
font-size: 13px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,160 @@
|
||||||
|
@charset "utf-8";
|
||||||
|
|
||||||
|
// Group index and public
|
||||||
|
.group-index {}
|
||||||
|
|
||||||
|
.group-public {
|
||||||
|
margin: auto;
|
||||||
|
max-width: $boundary;
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-card {
|
||||||
|
list-style: none;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-card-inner {
|
||||||
|
padding: 1rem 1.25rem;
|
||||||
|
position: relative;
|
||||||
|
min-height: 280px;
|
||||||
|
hr {
|
||||||
|
margin: 8px 0 10px 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-avatar {
|
||||||
|
position: relative;
|
||||||
|
width: 100%;
|
||||||
|
height: 200px;
|
||||||
|
overflow: hidden;
|
||||||
|
background: $dark-gray;
|
||||||
|
&:hover .action {
|
||||||
|
z-index: 600;
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
img {
|
||||||
|
width: 100%;
|
||||||
|
height: auto;
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
right: 0;
|
||||||
|
bottom: 0;
|
||||||
|
left: 0;
|
||||||
|
z-index: 500;
|
||||||
|
margin: auto;
|
||||||
|
}
|
||||||
|
.action {
|
||||||
|
opacity: 0;
|
||||||
|
background: rgba($blue, 0.9);
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
right: 0;
|
||||||
|
bottom: 0;
|
||||||
|
left: 0;
|
||||||
|
margin: auto;
|
||||||
|
}
|
||||||
|
.edit {
|
||||||
|
color: $white;
|
||||||
|
font-size: 25px;
|
||||||
|
position: absolute;
|
||||||
|
top: 50%;
|
||||||
|
left: 50%;
|
||||||
|
transform: translate(-50%, -50%);
|
||||||
|
margin: auto;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-info {
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-mail {
|
||||||
|
color: $dark-gray;
|
||||||
|
font-family: $sub-font;
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-roles {
|
||||||
|
list-style: none;
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
font-family: $sub-font;
|
||||||
|
.label {
|
||||||
|
font-family: $main-font;
|
||||||
|
text-transform: capitalize;
|
||||||
|
text-shadow: none;
|
||||||
|
}
|
||||||
|
.label.private {
|
||||||
|
background-color: $red;
|
||||||
|
}
|
||||||
|
.label.public {
|
||||||
|
background-color: #74c25d;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-privacy {
|
||||||
|
color: $dark-gray;
|
||||||
|
margin-bottom: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-description {
|
||||||
|
overflow: hidden;
|
||||||
|
max-height: 150px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-name {
|
||||||
|
margin-bottom: 4px;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media screen and (min-width: 370px) {
|
||||||
|
.group-index {
|
||||||
|
margin-top: 50px;
|
||||||
|
width: 90%;
|
||||||
|
}
|
||||||
|
.group-card {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media screen and (min-width: 600px) {
|
||||||
|
.group-index {
|
||||||
|
margin-top: 0;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
.group-card {
|
||||||
|
float: left;
|
||||||
|
padding: 0 0.5rem;
|
||||||
|
width: 50%;
|
||||||
|
&:nth-child(2n+1) {
|
||||||
|
clear: both;
|
||||||
|
padding-left: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media screen and (min-width: 900px) {
|
||||||
|
.group-card {
|
||||||
|
width: 33.3%;
|
||||||
|
&:nth-child(2n+1) {
|
||||||
|
clear: none;
|
||||||
|
padding-left: 0.5rem;
|
||||||
|
}
|
||||||
|
&:nth-child(3n+1) {
|
||||||
|
clear: both;
|
||||||
|
padding-left: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@media screen and (min-width: 1080px) {
|
||||||
|
.group-card {
|
||||||
|
width: 25%;
|
||||||
|
&:nth-child(3n+1) {
|
||||||
|
clear: none;
|
||||||
|
padding-left: 0.5rem;
|
||||||
|
}
|
||||||
|
&:nth-child(4n+1) {
|
||||||
|
clear: both;
|
||||||
|
padding-left: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,400 @@
|
||||||
|
@charset "utf-8";
|
||||||
|
|
||||||
|
// Group page
|
||||||
|
#main-wrap {
|
||||||
|
padding-top: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-post-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-post-banner-image-wrap {
|
||||||
|
background-color: $black;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-post-view-switch {
|
||||||
|
position: absolute;
|
||||||
|
top: 4rem;
|
||||||
|
right: 2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-post-banner-image {
|
||||||
|
width: auto;
|
||||||
|
max-width: 100%;
|
||||||
|
height: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-post-bar {
|
||||||
|
padding: 0 2rem 20px 6rem;
|
||||||
|
text-align: center;
|
||||||
|
background: rgba(25, 27, 29, 0.95);
|
||||||
|
width: 100%;
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
bottom: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-post-view-switch-in-bar {
|
||||||
|
display: none;
|
||||||
|
|
||||||
|
.button {
|
||||||
|
padding: 3px .75rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-post-page-title {
|
||||||
|
margin-bottom: 12px;
|
||||||
|
padding: 6px 0;
|
||||||
|
color: $white;
|
||||||
|
font-family: $main-font;
|
||||||
|
font-weight: normal;
|
||||||
|
max-width: 80%;
|
||||||
|
white-space: nowrap;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-post-section {
|
||||||
|
overflow: hidden;
|
||||||
|
padding: 300px 2rem 30px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.breadcrumb {
|
||||||
|
li {
|
||||||
|
overflow: hidden;
|
||||||
|
max-width: 150px;
|
||||||
|
display: inline-block;
|
||||||
|
vertical-align: middle;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.gorup-page-info-wrap {
|
||||||
|
font-size: .9rem;
|
||||||
|
padding: 6px 1rem;
|
||||||
|
display: block;
|
||||||
|
float: right;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-post-description-wrap {
|
||||||
|
clear: both;
|
||||||
|
}
|
||||||
|
|
||||||
|
.gorup-page-info-wrap {
|
||||||
|
margin-bottom: 10px;
|
||||||
|
text-align: right;
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-post-status-wrap {
|
||||||
|
font-size: .75rem;
|
||||||
|
float: right;
|
||||||
|
padding: 2px 0.5rem;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-post-status-wrap.close-eye {
|
||||||
|
margin-left: 5px;
|
||||||
|
background: $red;
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-post-description-wrap {
|
||||||
|
margin-bottom: 15px;
|
||||||
|
padding: 16px 1.2rem 16px;
|
||||||
|
border-radius: .2rem;
|
||||||
|
box-shadow: inset 0 0 8px $dark-gray;
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-post-description {
|
||||||
|
clear: both;
|
||||||
|
text-align: justify;
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-post-item {
|
||||||
|
position: relative;
|
||||||
|
clear: both;
|
||||||
|
margin-bottom: 40px;
|
||||||
|
padding: 28px 1.5rem;
|
||||||
|
text-align: center;
|
||||||
|
|
||||||
|
&.clickable {
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
.group-post-title {
|
||||||
|
color: $blue;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-post-actions {
|
||||||
|
position: absolute;
|
||||||
|
right: 0;
|
||||||
|
top: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.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, .2);
|
||||||
|
|
||||||
|
a {
|
||||||
|
display: block;
|
||||||
|
padding: 3px 12px;
|
||||||
|
white-space: nowrap;
|
||||||
|
&:hover {
|
||||||
|
color: $white;
|
||||||
|
background-color: $blue;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&.open {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-post-action-hint {
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-post-image-wrap {
|
||||||
|
display: inline-block;
|
||||||
|
margin-bottom: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-post-image {
|
||||||
|
width: 100%;
|
||||||
|
max-width: 100%;
|
||||||
|
height: auto;
|
||||||
|
margin-top: 12px;
|
||||||
|
border: 2px solid $gray;
|
||||||
|
border-radius: $general;
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-post-content {
|
||||||
|
margin-bottom: .5rem;
|
||||||
|
color: $dark-gray;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-post-title {
|
||||||
|
font-size: 1.5rem;
|
||||||
|
font-weight: normal;
|
||||||
|
line-height: 1;
|
||||||
|
margin-bottom: 12px;
|
||||||
|
color: $light-black;
|
||||||
|
font-family: $paragraph-font;
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-post-sub-wrap {
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-post-meta-wrap {
|
||||||
|
color: $dark-gray;
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-post-author,
|
||||||
|
.group-post-sub-wrap {
|
||||||
|
margin-right: .5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-post-seen-by {
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-post-seen-by-lead {
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
// scroll view
|
||||||
|
|
||||||
|
.group-post.scroll {
|
||||||
|
padding-top: 7rem;
|
||||||
|
padding-bottom: 6rem;
|
||||||
|
|
||||||
|
.group-post-banner-wrap {
|
||||||
|
height: 120px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-post-page-title {
|
||||||
|
margin-bottom: 0;
|
||||||
|
font-size: 1.625rem;
|
||||||
|
line-height: 50px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-post-new-post {
|
||||||
|
margin-top: 18px;
|
||||||
|
padding: 6px 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-post-new-post {
|
||||||
|
display: inline-block;
|
||||||
|
vertical-align: top;
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-post-view-switch {
|
||||||
|
position: static;
|
||||||
|
display: inline-block;
|
||||||
|
margin: 6px .5rem 0 0;
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-post-view-switch-in-bar {
|
||||||
|
display: inline-block;
|
||||||
|
margin-top: 18px;
|
||||||
|
|
||||||
|
.button {
|
||||||
|
padding: 4px .75rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-post-section {
|
||||||
|
padding-top: 60px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn {
|
||||||
|
padding: 2px 5px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-post li a {
|
||||||
|
text-decoration: none;
|
||||||
|
text-align: left;
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-post-switch-btn {
|
||||||
|
color: $blue;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
color: $white;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 400px
|
||||||
|
@media screen and (min-width: 25rem) {
|
||||||
|
.group-post-new-post {
|
||||||
|
margin: 0 0.625rem 16px;
|
||||||
|
float: none;
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-post-view-switch-in-bar {
|
||||||
|
float: none;
|
||||||
|
margin: 0;
|
||||||
|
|
||||||
|
.button {
|
||||||
|
padding: 6px .75rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 600px
|
||||||
|
|
||||||
|
@media screen and (min-width: 37.5rem) {
|
||||||
|
.group-post-item {
|
||||||
|
margin-bottom: 35px;
|
||||||
|
text-align: left;
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-post-image-wrap {
|
||||||
|
float: left;
|
||||||
|
width: 12%;
|
||||||
|
min-width: 100px;
|
||||||
|
margin-right: 4%;
|
||||||
|
max-height: 140px;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-post-content-wrap {
|
||||||
|
float: left;
|
||||||
|
width: 70%;
|
||||||
|
font-family: $paragraph-font;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 760px */
|
||||||
|
|
||||||
|
@media screen and (min-width: 47.5rem) {
|
||||||
|
.group-post-content-wrap {
|
||||||
|
width: 70%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-post-bar {
|
||||||
|
text-align: left;
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-post-page-title {
|
||||||
|
display: inline-block;
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
line-height: 70px;
|
||||||
|
transition: .6s all;
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-post-new-post {
|
||||||
|
float: right;
|
||||||
|
margin: 18px 0 0 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-post-view-switch-in-bar {
|
||||||
|
margin: 18px 8px 0 0;
|
||||||
|
float: right;
|
||||||
|
|
||||||
|
li {
|
||||||
|
padding: 8px .75rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-post-view-switch {
|
||||||
|
float: right;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 900px
|
||||||
|
@media screen and (min-width: 56.25rem) {
|
||||||
|
.group-post-content-wrap {
|
||||||
|
width: 80%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,38 @@
|
||||||
|
@charset "utf-8";
|
||||||
|
|
||||||
|
// General style
|
||||||
|
body {
|
||||||
|
background: $gray;
|
||||||
|
font-family: $main-font;
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-show-post-respond-comment,
|
||||||
|
ul, li, div, img {
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
|
||||||
|
h1, h2, h3, h4, h5, h6, label, legend {
|
||||||
|
font-family: $main-font;
|
||||||
|
}
|
||||||
|
|
||||||
|
img {
|
||||||
|
width: 100%;
|
||||||
|
max-width: 100%;
|
||||||
|
height: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
a {
|
||||||
|
color: $blue;
|
||||||
|
text-decoration: none;
|
||||||
|
&:hover {
|
||||||
|
color: lighten($blue, 5%);
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
a, button {
|
||||||
|
&:focus {
|
||||||
|
outline: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
@ -0,0 +1,274 @@
|
||||||
|
@charset "utf-8";
|
||||||
|
|
||||||
|
// Group show post
|
||||||
|
.group-show-post {
|
||||||
|
padding: 0 2rem 30px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-show-post-meta {
|
||||||
|
margin-bottom: 15px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-show-post-title {
|
||||||
|
font-family: $main-font;
|
||||||
|
float: left;
|
||||||
|
width: 90%;
|
||||||
|
font-weight: normal;
|
||||||
|
line-height: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-show-post-avatar-wrap {
|
||||||
|
float: right;
|
||||||
|
padding: 0 0.375rem 0 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-show-post-avatar-username-toggle {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-show-post-avatar {
|
||||||
|
width: 60px;
|
||||||
|
height: 60px;
|
||||||
|
border-radius: 50%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-show-post-username {
|
||||||
|
display: none;
|
||||||
|
top: 100%;
|
||||||
|
padding-bottom: 30px;
|
||||||
|
right: 0;
|
||||||
|
left: auto;
|
||||||
|
white-space: nowrap;
|
||||||
|
font-size: 0.75rem;
|
||||||
|
&:after {
|
||||||
|
border-top-color: transparent;
|
||||||
|
border-bottom-color: rgba(0, 0, 0, 0.85);
|
||||||
|
top: -10px;
|
||||||
|
left: auto;
|
||||||
|
right: 20px;
|
||||||
|
bottom: auto;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-show-post-postdate {
|
||||||
|
display: inline-block;
|
||||||
|
clear: both;
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-show-post-image-wrap {
|
||||||
|
position: relative;
|
||||||
|
background: $black;
|
||||||
|
&:hover {
|
||||||
|
.cycle-nav {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
.group-show-post-cycle-prev {
|
||||||
|
left: 2rem;
|
||||||
|
}
|
||||||
|
.group-show-post-cycle-next {
|
||||||
|
right: 2rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-show-post-image-list {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
list-style: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cycle-nav {
|
||||||
|
font-size: 1.2rem;
|
||||||
|
position: absolute;
|
||||||
|
top: 50%;
|
||||||
|
margin-top: -1.25rem;
|
||||||
|
line-height: 1.5rem;
|
||||||
|
color: $white;
|
||||||
|
z-index: 500;
|
||||||
|
width: 2.5rem;
|
||||||
|
height: 2.5rem;
|
||||||
|
cursor: pointer;
|
||||||
|
-webkit-transition: $normal all;
|
||||||
|
transition: $normal all;
|
||||||
|
text-align: center;
|
||||||
|
background-color: rgba($black, 0.8);
|
||||||
|
border-radius: 50%;
|
||||||
|
opacity: 0;
|
||||||
|
&:hover {
|
||||||
|
background-color: $blue;
|
||||||
|
}
|
||||||
|
.group-show-post-cycle-nav-icon {
|
||||||
|
line-height: 2.6rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-show-post-cycle-prev {
|
||||||
|
left: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-show-post-cycle-next {
|
||||||
|
right: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-show-post-content {
|
||||||
|
font-family: $main-font;
|
||||||
|
font-size: .8125rem;
|
||||||
|
margin: 15px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-show-post-attachment-wrap {
|
||||||
|
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;
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-show-post-seen-by {
|
||||||
|
float: right;
|
||||||
|
cursor: pointer;
|
||||||
|
&:hover {
|
||||||
|
.group-show-post-seen-by-names {
|
||||||
|
display: block;
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.group-show-post-seen-by-name {
|
||||||
|
display: block;
|
||||||
|
color: #fff;
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-show-post-seen-by-lead {
|
||||||
|
margin-right: 4px;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-show-post-seen-by-names {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-show-post-seen-by-count {
|
||||||
|
border-radius: 50%;
|
||||||
|
background: $gray;
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Comment section
|
||||||
|
.comments {
|
||||||
|
clear: both;
|
||||||
|
.group-show-post-respond-comment {
|
||||||
|
width: 100%;
|
||||||
|
height: 60px;
|
||||||
|
padding: 0 1rem;
|
||||||
|
box-shadow: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-no-permission {
|
||||||
|
padding-left: 2rem;
|
||||||
|
background: $red;
|
||||||
|
color: $white;
|
||||||
|
padding: 10px 0.75rem;
|
||||||
|
border-radius: $general;
|
||||||
|
i {
|
||||||
|
margin-right: 8px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-show-post-respond-submit {
|
||||||
|
font-size: 0.75rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-show-post-comment-list {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
list-style: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-show-post-comment-wrap {
|
||||||
|
overflow: hidden;
|
||||||
|
margin-bottom: 25px;
|
||||||
|
padding-bottom: 8px;
|
||||||
|
border-bottom: 1px solid lighten($light-gray, 12%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-show-post-no-comment {
|
||||||
|
font-size: 0.8125rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-show-post-comment-avatar {
|
||||||
|
float: left;
|
||||||
|
width: 60px;
|
||||||
|
margin-right: 1rem;
|
||||||
|
img {
|
||||||
|
width: 60px;
|
||||||
|
height: 60px;
|
||||||
|
border-radius: 50%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-show-post-comment-author {
|
||||||
|
font-size: .9375rem;
|
||||||
|
float: left;
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-show-post-comment-time {
|
||||||
|
float: right;
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-show-post-comment-content {
|
||||||
|
clear: both;
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-show-post-comment-body {
|
||||||
|
float: left;
|
||||||
|
width: 60%;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 260px
|
||||||
|
@media screen and (min-width: 16.25rem) {
|
||||||
|
.group-show-post-attachments {
|
||||||
|
a {
|
||||||
|
display: inline-block;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.group-show-post-attachments-file-name {
|
||||||
|
display: inline-block;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
overflow: hidden;
|
||||||
|
vertical-align: middle;
|
||||||
|
width: 80px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 370px
|
||||||
|
@media screen and (min-width: 23.125rem) {
|
||||||
|
.group-show-post-comment-body {
|
||||||
|
width: 70%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 800px
|
||||||
|
@media screen and (min-width: 50rem) {
|
||||||
|
.group-show-post-comment-body {
|
||||||
|
width: 85%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 960px
|
||||||
|
@media screen and (min-width: 60rem) {
|
||||||
|
.group-show-post-comment-body {
|
||||||
|
width: 90%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,35 @@
|
||||||
|
@charset "utf-8";
|
||||||
|
|
||||||
|
// Google fonts
|
||||||
|
@import url(http://fonts.googleapis.com/css?family=Maven+Pro);
|
||||||
|
|
||||||
|
@import url(http://fonts.googleapis.com/css?family=Roboto);
|
||||||
|
|
||||||
|
// Font stacks
|
||||||
|
$main-font: "Maven Pro", "微軟正黑體" sans-serif;
|
||||||
|
$sub-font: "Roboto", "微軟正黑體", sans-serif;
|
||||||
|
$paragraph-font: "Roboto", "微軟正黑體", sans-serif;
|
||||||
|
|
||||||
|
// Colors
|
||||||
|
$gray: #f3f3f3;
|
||||||
|
$dark-gray: #aaaaaa;
|
||||||
|
$light-gray: #cdcdcd;
|
||||||
|
$white: white;
|
||||||
|
$light-black: #353535;
|
||||||
|
$black: black;
|
||||||
|
$green: #74c25d;
|
||||||
|
$blue: #4171d5;
|
||||||
|
$red: #dd5933;
|
||||||
|
$blue-green: #00acee;
|
||||||
|
$group-page-bar-color: #171717;
|
||||||
|
|
||||||
|
// Transition units
|
||||||
|
$fast: 0.3s;
|
||||||
|
$normal: 0.6s;
|
||||||
|
$slow: 1s;
|
||||||
|
|
||||||
|
// Border radius units
|
||||||
|
$general: 0.25rem;
|
||||||
|
|
||||||
|
// Commonly use units
|
||||||
|
$boundary: 1150px;
|
||||||
|
|
@ -1,31 +1,8 @@
|
||||||
@charset "utf-8";
|
@charset "utf-8";
|
||||||
|
|
||||||
@import url(http://fonts.googleapis.com/css?family=Maven+Pro);
|
@import "group-variables";
|
||||||
|
@import "group-classes";
|
||||||
@import url(http://fonts.googleapis.com/css?family=Roboto);
|
@import "group-reset";
|
||||||
|
|
||||||
// Font stacks
|
|
||||||
$main-font: "Maven Pro", "微軟正黑體" sans-serif;
|
|
||||||
$paragraph-font: "Roboto", "微軟正黑體", sans-serif;
|
|
||||||
$gray: #f3f3f3;
|
|
||||||
$dark-gray: #aaaaaa;
|
|
||||||
$light-gray: #cdcdcd;
|
|
||||||
$white: white;
|
|
||||||
$light-black: #353535;
|
|
||||||
$black: black;
|
|
||||||
$green: #4ad976;
|
|
||||||
$blue: #4171d5;
|
|
||||||
$red: #c71932;
|
|
||||||
$blue-green: #00acee;
|
|
||||||
$group-page-bar-color: #171717;
|
|
||||||
|
|
||||||
// Transition units
|
|
||||||
$fast: 0.3s;
|
|
||||||
$normal: 0.6s;
|
|
||||||
$slow: 1s;
|
|
||||||
|
|
||||||
// Border radius units
|
|
||||||
$general: 0.25rem;
|
|
||||||
|
|
||||||
// General style
|
// General style
|
||||||
body {
|
body {
|
||||||
|
|
@ -33,6 +10,18 @@ body {
|
||||||
font-family: $main-font;
|
font-family: $main-font;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// dropzone
|
||||||
|
|
||||||
|
.dropzone-pool {
|
||||||
|
border: 2px dashed $blue;
|
||||||
|
margin-bottom: 16px;
|
||||||
|
font-family: $paragraph-font;
|
||||||
|
font-size: 0.9375rem;
|
||||||
|
color: $dark-gray;
|
||||||
|
margin-right: 1rem;
|
||||||
|
border-radius: $general;
|
||||||
|
}
|
||||||
|
|
||||||
// Override and resolve the conflict with main-form.css for that I need RWD support for this page
|
// Override and resolve the conflict with main-form.css for that I need RWD support for this page
|
||||||
.main-forms fieldset .input-area .controls textarea {
|
.main-forms fieldset .input-area .controls textarea {
|
||||||
max-width: none;
|
max-width: none;
|
||||||
|
|
@ -44,8 +33,13 @@ body {
|
||||||
margin-right: 0.9375rem;
|
margin-right: 0.9375rem;
|
||||||
min-width: 200px;
|
min-width: 200px;
|
||||||
.select2-choices {
|
.select2-choices {
|
||||||
padding: 8px 0.5rem 6px;
|
padding: 0;
|
||||||
border-radius: $general;
|
border-radius: $general;
|
||||||
|
.select2-search-field {
|
||||||
|
input {
|
||||||
|
padding: 10px 5px;
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
.select2-search-choice {
|
.select2-search-choice {
|
||||||
padding: 10px 1.75rem 10px 0.7rem;
|
padding: 10px 1.75rem 10px 0.7rem;
|
||||||
|
|
@ -0,0 +1,14 @@
|
||||||
|
@charset "utf-8";
|
||||||
|
|
||||||
|
@import "group-variables";
|
||||||
|
@import "group-classes";
|
||||||
|
@import "group-reset";
|
||||||
|
@import "group-index";
|
||||||
|
@import "group-post";
|
||||||
|
@import "group-show-post";
|
||||||
|
@import "group-category";
|
||||||
|
|
||||||
|
|
||||||
|
.topnav {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
@ -1,11 +1,11 @@
|
||||||
(function($) {
|
(function($) {
|
||||||
|
|
||||||
"use strict";
|
'use strict';
|
||||||
|
|
||||||
function init() {
|
function init() {
|
||||||
var doc = document,
|
var doc = document,
|
||||||
lang = doc.documentElement.lang,
|
lang = doc.documentElement.lang,
|
||||||
pageModule = doc.body.getAttribute( "data-module" );
|
pageModule = doc.body.getAttribute('data-module');
|
||||||
|
|
||||||
var orbit = {
|
var orbit = {
|
||||||
|
|
||||||
|
|
@ -15,18 +15,18 @@
|
||||||
if (el.classList) {
|
if (el.classList) {
|
||||||
el.classList.add(className);
|
el.classList.add(className);
|
||||||
} else {
|
} else {
|
||||||
el.className += " " + className;
|
el.className += ' ' + className;
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
hasClass: function(el, cls) {
|
hasClass: function(el, cls) {
|
||||||
return ( " " + el.className + " " ).indexOf( " " + cls + " " ) > -1;
|
return (' ' + el.className + ' ').indexOf(' ' + cls + ' ') > -1;
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
plugins: {
|
plugins: {
|
||||||
// RWD image resize script
|
// RWD image resize script
|
||||||
bullEye: function() {
|
bullEye: function() {
|
||||||
$( ".bullseye" ).bullseye({
|
$('.bullseye').bullseye({
|
||||||
fadeEffect: false
|
fadeEffect: false
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
@ -42,20 +42,20 @@
|
||||||
if (elsLen > 1) {
|
if (elsLen > 1) {
|
||||||
for (i = 0; i < elsLen; i++) {
|
for (i = 0; i < elsLen; i++) {
|
||||||
if (els[i].children.length > len) {
|
if (els[i].children.length > len) {
|
||||||
this.helpers.addClass( els[ i ].parentNode, className || "mega-dropdown" );
|
this.helpers.addClass(els[i].parentNode, className || 'mega-dropdown');
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
// Append caret to menu item if it has dropdown
|
// Append caret to menu item if it has dropdown
|
||||||
addCaret: function() {
|
addCaret: function() {
|
||||||
var els = doc.querySelectorAll( ".page_menu.level_2" ),
|
var els = doc.querySelectorAll('.page_menu.level_2'),
|
||||||
len = els.length,
|
len = els.length,
|
||||||
i = -1;
|
i = -1;
|
||||||
|
|
||||||
for (i = 0; i < len; i++) {
|
for (i = 0; i < len; i++) {
|
||||||
var node = doc.createElement( "span" );
|
var node = doc.createElement('span');
|
||||||
node.className = "caret";
|
node.className = 'caret';
|
||||||
els[i].parentNode.appendChild(node);
|
els[i].parentNode.appendChild(node);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
@ -65,7 +65,7 @@
|
||||||
// Announcement text truncation
|
// Announcement text truncation
|
||||||
truncateAnnouncement: function(els, maxLen) {
|
truncateAnnouncement: function(els, maxLen) {
|
||||||
var els = doc.querySelectorAll(els),
|
var els = doc.querySelectorAll(els),
|
||||||
newTitle = "";
|
newTitle = '';
|
||||||
i = -1,
|
i = -1,
|
||||||
elsLen = els.length;
|
elsLen = els.length;
|
||||||
|
|
||||||
|
|
@ -73,7 +73,7 @@
|
||||||
if (els[i].firstChild !== null) {
|
if (els[i].firstChild !== null) {
|
||||||
if (els[i].firstChild.length > maxLen) {
|
if (els[i].firstChild.length > maxLen) {
|
||||||
newTitle = els[i].firstChild.textContent;
|
newTitle = els[i].firstChild.textContent;
|
||||||
els[ i ].textContent = newTitle.substring( 0, maxLen ) + "...";
|
els[i].textContent = newTitle.substring(0, maxLen) + '...';
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
@ -83,55 +83,75 @@
|
||||||
member: {
|
member: {
|
||||||
equalHeight: function() {
|
equalHeight: function() {
|
||||||
var bigbrother = -1;
|
var bigbrother = -1;
|
||||||
|
$('.i-member-item').each(function() {
|
||||||
$( ".i-member-item" ).each( function() {
|
bigbrother = bigbrother > $('.i-member-item').height() ? bigbrother : $('.i-member-item').height();
|
||||||
bigbrother = bigbrother > $( ".i-member-item" ).height() ? bigbrother : $( ".i-member-item" ).height();
|
|
||||||
});
|
});
|
||||||
|
|
||||||
$( ".i-member-item" ).each( function() {
|
$('.i-member-item').each(function() {
|
||||||
$( ".i-member-item" ).height( bigbrother );
|
$('.i-member-item').height(bigbrother);
|
||||||
});
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
// Remove table row, list item if it only has sigle title or value not in pair
|
||||||
|
removeEmptyRow: function() {
|
||||||
|
// Remove index page empty item
|
||||||
|
$('.i-member-profile-item .i-member-value').each(function() {
|
||||||
|
if ($(this).text().trim() === '' || $(this).text().trim() === ':') {
|
||||||
|
$(this).parent().addClass('hide');
|
||||||
}
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
// Remove empty table cell on show page
|
||||||
|
$('.show-member th, .show-member td').each(function() {
|
||||||
|
if ($(this).text().trim() === '') {
|
||||||
|
$(this).parent('tr').addClass('hide');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
},
|
},
|
||||||
|
|
||||||
// Add link and cursor class name on element that has data-link attribute
|
// Add link and cursor class name on element that has data-link attribute
|
||||||
addLinkOnADBanner: function(els) {
|
addLinkOnADBanner: function(els) {
|
||||||
$.each(els, function() {
|
$.each(els, function() {
|
||||||
if ( $( this ).data( "link" ) !== "" && !$( this ).hasClass( "youtube" ) ) {
|
if ($(this).data('link') !== '' && !$(this).hasClass('youtube')) {
|
||||||
$( this ).on( "click", function() {
|
$(this).on('click', function() {
|
||||||
var target = $( this ).data( "target" ),
|
var target = $(this).data('target'),
|
||||||
link = $( this ).data( "link" );
|
link = $(this).data('link');
|
||||||
if ( target === "_blank" ) {
|
if (target === '_blank') {
|
||||||
window.open(link, target);
|
window.open(link, target);
|
||||||
} else {
|
} else {
|
||||||
window.location.href = link;
|
window.location.href = link;
|
||||||
}
|
}
|
||||||
}).addClass( "cursor" );
|
}).addClass('cursor');
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
|
|
||||||
// Sitemenu dropdown
|
// Sitemenu dropdown
|
||||||
sitemenuDropdown: function(els) {
|
sitemenuDropdown: function(els) {
|
||||||
var els = doc.querySelectorAll(".sitemenu__list.level-2"),
|
var els = doc.querySelectorAll('.sitemenu-list.level-2'),
|
||||||
len = els.length,
|
len = els.length,
|
||||||
i = -1;
|
i = -1;
|
||||||
for (i = 0; i < len; i++) {
|
for (i = 0; i < len; i++) {
|
||||||
if (els[i].children.length) {
|
if (els[i].children.length) {
|
||||||
var caret = doc.createElement( "span" );
|
var caret = doc.createElement('span');
|
||||||
caret.className = "sitemenu___dropdown-toggle fa fa-caret-down";
|
caret.className = 'sitemenu-dropdown-toggle fa fa-caret-down';
|
||||||
caret.setAttribute( "data-toggle", "dropdown" );
|
caret.setAttribute('data-toggle', 'dropdown');
|
||||||
|
|
||||||
els[i].parentNode.insertBefore(caret, els[i]);
|
els[i].parentNode.insertBefore(caret, els[i]);
|
||||||
this.helpers.addClass( els[ i ], "dropdown-menu" );
|
this.helpers.addClass(els[i], 'dropdown-menu');
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
};
|
};
|
||||||
|
|
||||||
// Specific functions that will be running on homepage
|
// Specific functions that will be running on homepage
|
||||||
if ( pageModule === "home" ) {
|
if (pageModule === 'home') {
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
if (pageModule === 'member') {
|
||||||
|
orbit.member.removeEmptyRow();
|
||||||
}
|
}
|
||||||
|
|
||||||
// Functions that will be running on every page
|
// Functions that will be running on every page
|
||||||
|
|
@ -139,6 +159,7 @@
|
||||||
orbit.plugins.bullEye();
|
orbit.plugins.bullEye();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Run the init function when DOM is ready
|
||||||
$(document).ready(function() {
|
$(document).ready(function() {
|
||||||
init();
|
init();
|
||||||
});
|
});
|
||||||
|
|
|
||||||
|
|
@ -35,3 +35,20 @@ td {
|
||||||
.borderless>thead>tr>th {
|
.borderless>thead>tr>th {
|
||||||
border: none !important;
|
border: none !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.page-module-title {
|
||||||
|
@extend .unity-title;
|
||||||
|
margin-bottom: 18px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.view-count {
|
||||||
|
font-size: 0.75rem;
|
||||||
|
}
|
||||||
|
.view_count {
|
||||||
|
> i {
|
||||||
|
font-size: 0.75rem;
|
||||||
|
&:before {
|
||||||
|
margin-right: 8px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -5,6 +5,7 @@
|
||||||
margin: 0.5em 0;
|
margin: 0.5em 0;
|
||||||
line-height: 1.5;
|
line-height: 1.5;
|
||||||
font-family: $main-font;
|
font-family: $main-font;
|
||||||
|
font-size: 1.5rem;
|
||||||
.layout-footer & {
|
.layout-footer & {
|
||||||
margin-bottom: 10px;
|
margin-bottom: 10px;
|
||||||
border-bottom: none;
|
border-bottom: none;
|
||||||
|
|
|
||||||
|
|
@ -1,36 +1,44 @@
|
||||||
@charset "utf-8";
|
@charset 'utf-8';
|
||||||
@import "../initial";
|
|
||||||
|
@import '../initial';
|
||||||
|
|
||||||
// Gallery MODULES
|
// Gallery MODULES
|
||||||
.widget-gallery {
|
.widget-gallery {
|
||||||
.widget-title {
|
.widget-title {
|
||||||
@extend .unity-title;
|
@extend .unity-title;
|
||||||
}
|
}
|
||||||
|
|
||||||
.widget-content {
|
.widget-content {
|
||||||
position: relative;
|
position: relative;
|
||||||
}
|
}
|
||||||
|
|
||||||
&.widget1 {
|
&.widget1 {
|
||||||
.widget-content {
|
.widget-content {
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
|
||||||
.widget-pic {
|
.widget-pic {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
padding: 1px;
|
padding: 1px;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
@include size(33.3333%, auto);
|
@include size(33.3333%, auto);
|
||||||
|
|
||||||
img {
|
img {
|
||||||
@include size(100%, 100%);
|
@include size(100%, 100%);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
&.widget2 {
|
&.widget2 {
|
||||||
.widget-content {
|
.widget-content {
|
||||||
margin-left: -5px;
|
margin-left: -5px;
|
||||||
margin-right: -5px;
|
margin-right: -5px;
|
||||||
|
|
||||||
.widget-pic {
|
.widget-pic {
|
||||||
margin-bottom: 10px;
|
margin-bottom: 10px;
|
||||||
padding-left: 5px;
|
padding-left: 5px;
|
||||||
padding-right: 5px;
|
padding-right: 5px;
|
||||||
|
|
||||||
img {
|
img {
|
||||||
@include size(100%, auto);
|
@include size(100%, auto);
|
||||||
}
|
}
|
||||||
|
|
@ -43,11 +51,13 @@
|
||||||
.index-title {
|
.index-title {
|
||||||
@extend .unity-title;
|
@extend .unity-title;
|
||||||
}
|
}
|
||||||
|
|
||||||
&.index1 {
|
&.index1 {
|
||||||
.index-content {
|
.index-content {
|
||||||
.index-content-inner {
|
.index-content-inner {
|
||||||
position: relative;
|
position: relative;
|
||||||
}
|
}
|
||||||
|
|
||||||
.index-part {
|
.index-part {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 4px;
|
top: 4px;
|
||||||
|
|
@ -58,22 +68,27 @@
|
||||||
background-color: rgba($theme-color-main, 0.8);
|
background-color: rgba($theme-color-main, 0.8);
|
||||||
@include transition(all 0.5s ease);
|
@include transition(all 0.5s ease);
|
||||||
@include opacity(0);
|
@include opacity(0);
|
||||||
|
|
||||||
.index-content-title {
|
.index-content-title {
|
||||||
@include transition(all 0.3s ease);
|
@include transition(all 0.3s ease);
|
||||||
@include transition-delay(0.1s);
|
@include transition-delay(0.1s);
|
||||||
@include scale(0);
|
@include scale(0);
|
||||||
}
|
}
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
@include opacity(1);
|
@include opacity(1);
|
||||||
|
|
||||||
.index-content-title {
|
.index-content-title {
|
||||||
@include scale(1);
|
@include scale(1);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.index-content-title {
|
.index-content-title {
|
||||||
display: table;
|
display: table;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
@include size(100%, 100%);
|
@include size(100%, 100%);
|
||||||
|
|
||||||
a {
|
a {
|
||||||
display: table-cell;
|
display: table-cell;
|
||||||
color: #FFF;
|
color: #FFF;
|
||||||
|
|
@ -90,30 +105,35 @@
|
||||||
.show-title {
|
.show-title {
|
||||||
@extend .unity-title;
|
@extend .unity-title;
|
||||||
}
|
}
|
||||||
|
|
||||||
.show-content {
|
.show-content {
|
||||||
padding-right: 0;
|
padding-right: 0;
|
||||||
padding-left: 0;
|
padding-left: 0;
|
||||||
|
|
||||||
.img {
|
.img {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: auto;
|
height: auto;
|
||||||
opacity: (0.8);
|
opacity: 0.8;
|
||||||
-webkit-filter: grayscale(100%) brightness(1.2);
|
-webkit-filter: grayscale(100%) brightness(1.2);
|
||||||
-moz-filter: grayscale(100%) brightness(1.2);
|
-moz-filter: grayscale(100%) brightness(1.2);
|
||||||
filter: grayscale(100%) brightness(1.2);
|
filter: grayscale(100%) brightness(1.2);
|
||||||
@include transition(all 0.2s ease);
|
@include transition(all 0.2s ease);
|
||||||
}
|
}
|
||||||
|
|
||||||
.show-content-inner {
|
.show-content-inner {
|
||||||
position: relative;
|
position: relative;
|
||||||
padding: 2px;
|
padding: 2px;
|
||||||
z-index: 0;
|
z-index: 0;
|
||||||
@include scale(1);
|
@include scale(1);
|
||||||
@include transition(all 0.2s ease);
|
@include transition(all 0.2s ease);
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
z-index: 1;
|
z-index: 1;
|
||||||
@include scale(1.1);
|
@include scale(1.1);
|
||||||
|
|
||||||
.img {
|
.img {
|
||||||
opacity: (1);
|
opacity: 1;
|
||||||
-webkit-filter: grayscale(0%) brightness(1);
|
-webkit-filter: grayscale(0%) brightness(1);
|
||||||
-moz-filter: grayscale(0%) brightness(1);
|
-moz-filter: grayscale(0%) brightness(1);
|
||||||
filter: grayscale(0%) brightness(1);
|
filter: grayscale(0%) brightness(1);
|
||||||
|
|
|
||||||
|
|
@ -7,6 +7,20 @@
|
||||||
//
|
//
|
||||||
// Member Index
|
// Member Index
|
||||||
// ## Gerneral styles for Index
|
// ## Gerneral styles for Index
|
||||||
|
|
||||||
|
// Index 1
|
||||||
|
.index-member-1 {
|
||||||
|
.i-member-tr-head {
|
||||||
|
&:nth-child(1n+2) {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
th {
|
||||||
|
background: $theme-color-main;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
// Index 2
|
// Index 2
|
||||||
.index-member-2 {
|
.index-member-2 {
|
||||||
.i-member-section {
|
.i-member-section {
|
||||||
|
|
@ -118,7 +132,7 @@
|
||||||
font-size: .8125rem;
|
font-size: .8125rem;
|
||||||
}
|
}
|
||||||
.member-plugins {
|
.member-plugins {
|
||||||
margin-bottom: 20px;
|
margin: 20px 0;
|
||||||
a {
|
a {
|
||||||
font-size: .8125rem;
|
font-size: .8125rem;
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -4,15 +4,15 @@
|
||||||
.sitemenu-wrap {
|
.sitemenu-wrap {
|
||||||
padding: 10px 0;
|
padding: 10px 0;
|
||||||
@include clearfix;
|
@include clearfix;
|
||||||
.sitemenu__title {
|
.sitemenu-title {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
.sitemenu__list {
|
.sitemenu-list {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
list-style: none;
|
list-style: none;
|
||||||
}
|
}
|
||||||
.sitemenu__item.level-1 {
|
.sitemenu-item.level-1 {
|
||||||
font-size: 0.8125rem;
|
font-size: 0.8125rem;
|
||||||
position: relative;
|
position: relative;
|
||||||
float: left;
|
float: left;
|
||||||
|
|
@ -27,24 +27,24 @@
|
||||||
background: darken($theme-color-second, 10%);
|
background: darken($theme-color-second, 10%);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.sitemenu__link.level-1 {
|
.sitemenu-link.level-1 {
|
||||||
margin-right: .25rem;
|
margin-right: .25rem;
|
||||||
color: #fff;
|
color: #fff;
|
||||||
}
|
}
|
||||||
.sitemenu___dropdown-toggle {
|
.sitemenu-dropdown-toggle {
|
||||||
font-size: 0.75rem;
|
font-size: 0.75rem;
|
||||||
padding: 2px .3125rem;
|
padding: 2px .3125rem;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
// sitemenu dropdown
|
// sitemenu dropdown
|
||||||
.sitemenu__list.dropdown-menu {
|
.sitemenu-list.dropdown-menu {
|
||||||
min-width: 100%;
|
min-width: 100%;
|
||||||
margin-top: 4px;
|
margin-top: 4px;
|
||||||
border: none;
|
border: none;
|
||||||
border-radius: .2em;
|
border-radius: .2em;
|
||||||
background: $theme-color-main;
|
background: $theme-color-main;
|
||||||
}
|
}
|
||||||
.sitemenu__link.level-2 {
|
.sitemenu-link.level-2 {
|
||||||
color: #fff;
|
color: #fff;
|
||||||
font-size: 0.8125rem;
|
font-size: 0.8125rem;
|
||||||
padding: 4px 0.625rem;
|
padding: 4px 0.625rem;
|
||||||
|
|
|
||||||
|
|
@ -21,7 +21,7 @@
|
||||||
<span class="icon-bar"></span>
|
<span class="icon-bar"></span>
|
||||||
<span class="icon-bar"></span>
|
<span class="icon-bar"></span>
|
||||||
</button>
|
</button>
|
||||||
<a class="navbar-brand" href="/"><img class="site-logo" src="{{logo_url}}"> {{site_name}}</a>
|
<a class="navbar-brand" href="/"><img class="site-logo" src="{{logo_url}}" alt="Site Logo"> {{site_name}}</a>
|
||||||
</div>
|
</div>
|
||||||
<div class="collapse navbar-collapse modules-menu" id="layout-navigation">
|
<div class="collapse navbar-collapse modules-menu" id="layout-navigation">
|
||||||
<%= render_menu %>
|
<%= render_menu %>
|
||||||
|
|
|
||||||
|
|
@ -14,13 +14,10 @@
|
||||||
<tbody data-level="0" data-list="acts">
|
<tbody data-level="0" data-list="acts">
|
||||||
<tr>
|
<tr>
|
||||||
<td>{{category}}</td>
|
<td>{{category}}</td>
|
||||||
<td>{{act_start_date}} ~
|
<td>{{act_start_date}} ~ <br /> {{act_end_date}}</td>
|
||||||
<br /> {{act_end_date}}</td>
|
|
||||||
<td>{{title}}</td>
|
<td>{{title}}</td>
|
||||||
<td>{{sign_start_date}} ~
|
<td>{{sign_start_date}} ~ <br /> {{sign_end_date}}</td>
|
||||||
<br /> {{sign_end_date}}</td>
|
<td>{{sign_up}}</i></td>
|
||||||
<td>{{sign_up}}</i>
|
|
||||||
</td>
|
|
||||||
</tr>
|
</tr>
|
||||||
</tbody>
|
</tbody>
|
||||||
</table>
|
</table>
|
||||||
|
|
|
||||||
|
|
@ -14,8 +14,9 @@
|
||||||
data-cycle-title="{{title}}"
|
data-cycle-title="{{title}}"
|
||||||
data-cycle-desc="{{context}}"
|
data-cycle-desc="{{context}}"
|
||||||
data-overlay-template="<h2>{{title}}</h2>{{desc}}"
|
data-overlay-template="<h2>{{title}}</h2>{{desc}}"
|
||||||
|
data-target="{{target}}"
|
||||||
>
|
>
|
||||||
<img class="w-ad-banner__image banner-responsive" src="{{image_link}}">
|
<img class="w-ad-banner__image banner-responsive" src="{{image_link}}" alt="{{alt_title}}">
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="w-ad-banner__caption"></div>
|
<div class="w-ad-banner__caption"></div>
|
||||||
|
|
|
||||||
|
|
@ -13,8 +13,9 @@
|
||||||
data-cycle-title="{{title}}"
|
data-cycle-title="{{title}}"
|
||||||
data-cycle-desc="{{context}}"
|
data-cycle-desc="{{context}}"
|
||||||
data-overlay-template="<h2>{{title}}</h2>{{desc}}"
|
data-overlay-template="<h2>{{title}}</h2>{{desc}}"
|
||||||
|
data-target="{{target}}"
|
||||||
>
|
>
|
||||||
<img class="w-ad-banner__image banner-responsive" src="{{image_link}}">
|
<img class="w-ad-banner__image banner-responsive" src="{{image_link}}" alt="{{alt_title}}>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<ul class="w-ad-banner__pager-3 banner-pager"></ul>
|
<ul class="w-ad-banner__pager-3 banner-pager"></ul>
|
||||||
|
|
|
||||||
|
|
@ -7,8 +7,9 @@
|
||||||
>
|
>
|
||||||
<div class="w-ad-banner__slide {{class}}"
|
<div class="w-ad-banner__slide {{class}}"
|
||||||
data-link="{{link}}"
|
data-link="{{link}}"
|
||||||
|
data-target="{{target}}"
|
||||||
>
|
>
|
||||||
<img class="w-ad-banner__image banner-responsive" src="{{image_link}}">
|
<img class="w-ad-banner__image banner-responsive" src="{{image_link}}" alt="{{alt_title}}>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -6,7 +6,7 @@
|
||||||
"zh_tw" : "1. 橫幅輪播 ( 圖片, 圖片說明文字, 導航圖示 )",
|
"zh_tw" : "1. 橫幅輪播 ( 圖片, 圖片說明文字, 導航圖示 )",
|
||||||
"en" : "1. Carousel ( image, description, navigation )"
|
"en" : "1. Carousel ( image, description, navigation )"
|
||||||
},
|
},
|
||||||
"thumbnail" : "thumbnail-block.png"
|
"thumbnail" : "thumb.png"
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"filename" : "ad_banner_widget2_video",
|
"filename" : "ad_banner_widget2_video",
|
||||||
|
|
@ -14,7 +14,7 @@
|
||||||
"zh_tw" : "2. 橫幅輪播 + Youtube影片 ( 圖片, Youtube影片, 導航圖示 )",
|
"zh_tw" : "2. 橫幅輪播 + Youtube影片 ( 圖片, Youtube影片, 導航圖示 )",
|
||||||
"en" : "2. Carousel ( image, Youtube video, navigation )"
|
"en" : "2. Carousel ( image, Youtube video, navigation )"
|
||||||
},
|
},
|
||||||
"thumbnail" : "thumbnail-block.png"
|
"thumbnail" : "thumb.png"
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"filename" : "ad_banner_widget3",
|
"filename" : "ad_banner_widget3",
|
||||||
|
|
@ -22,7 +22,7 @@
|
||||||
"zh_tw" : "3. 橫幅輪播 ( 圖片, 導航圖示 )",
|
"zh_tw" : "3. 橫幅輪播 ( 圖片, 導航圖示 )",
|
||||||
"en" : "3. Carousel ( image, navigation )"
|
"en" : "3. Carousel ( image, navigation )"
|
||||||
},
|
},
|
||||||
"thumbnail" : "thumbnail-block.png"
|
"thumbnail" : "thumb.png"
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"filename" : "ad_banner_widget4",
|
"filename" : "ad_banner_widget4",
|
||||||
|
|
@ -30,7 +30,7 @@
|
||||||
"zh_tw" : "4. 廣告輪播 ( 圖片 )",
|
"zh_tw" : "4. 廣告輪播 ( 圖片 )",
|
||||||
"en" : "4. AD banner ( image )"
|
"en" : "4. AD banner ( image )"
|
||||||
},
|
},
|
||||||
"thumbnail" : "thumbnail-block.png"
|
"thumbnail" : "thumb.png"
|
||||||
}
|
}
|
||||||
|
|
||||||
]
|
]
|
||||||
|
|
|
||||||
Binary file not shown.
|
After Width: | Height: | Size: 4.0 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 67 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 66 KiB |
|
|
@ -12,7 +12,7 @@
|
||||||
"filename" : "annc_index2",
|
"filename" : "annc_index2",
|
||||||
"name" : {
|
"name" : {
|
||||||
"zh_tw" : "2. 標準標題列表-1B ( 模組標題, 類別, 狀態, 標題, 日期, 瀏覽人次 )",
|
"zh_tw" : "2. 標準標題列表-1B ( 模組標題, 類別, 狀態, 標題, 日期, 瀏覽人次 )",
|
||||||
"en" : "2. Standard Title List-1B (widget-title, category, status, title, postdate, view-counts)"
|
"en" : "2. Standard Title List-1B (widget-title, category, status, title, postdate, view-count)"
|
||||||
},
|
},
|
||||||
"thumbnail" : "annc_index2_thumbs.png"
|
"thumbnail" : "annc_index2_thumbs.png"
|
||||||
},
|
},
|
||||||
|
|
@ -28,7 +28,7 @@
|
||||||
"filename" : "annc_index4",
|
"filename" : "annc_index4",
|
||||||
"name" : {
|
"name" : {
|
||||||
"zh_tw" : "4. 標準表格列表-2B ( 模組標題, 日期, 狀態, 標題, 類別, 瀏覽人次 )",
|
"zh_tw" : "4. 標準表格列表-2B ( 模組標題, 日期, 狀態, 標題, 類別, 瀏覽人次 )",
|
||||||
"en" : "4. Standard Table List-2 (widget-title, postdate, status, title, category, view-counts)"
|
"en" : "4. Standard Table List-2 (widget-title, postdate, status, title, category, view-count)"
|
||||||
},
|
},
|
||||||
"thumbnail" : "annc_index4_thumbs.png"
|
"thumbnail" : "annc_index4_thumbs.png"
|
||||||
},
|
},
|
||||||
|
|
@ -116,15 +116,15 @@
|
||||||
"filename" : "annc_index15",
|
"filename" : "annc_index15",
|
||||||
"name" : {
|
"name" : {
|
||||||
"zh_tw" : "15. 精簡表格列表-3 ( 模組標題, 日期, 狀態, 標題, 瀏覽人次 )",
|
"zh_tw" : "15. 精簡表格列表-3 ( 模組標題, 日期, 狀態, 標題, 瀏覽人次 )",
|
||||||
"en" : "15. Simple Table List (widget-title, postdate, status, title, view-counts)"
|
"en" : "15. Simple Table List (widget-title, postdate, status, title, view-count)"
|
||||||
},
|
},
|
||||||
"thumbnail" : "annc_index15_thumbs.png"
|
"thumbnail" : "annc_index15_thumbs.png"
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"filename" : "annc_index16",
|
"filename" : "annc_index16",
|
||||||
"name" : {
|
"name" : {
|
||||||
"zh_tw" : "16. 連結 + 附件表格列表 ( 模組標題, 日期, 狀態, 標題 )",
|
"zh_tw" : "16. 連結 + 附件表格列表 ( 模組標題, 類別, 狀態, 標題 )",
|
||||||
"en" : "16. Table List including Links and attachments (widget-title, postdate, status, title, view-counts)"
|
"en" : "16. Table List including Links and attachments (widget-title, category, status, title, view-count)"
|
||||||
},
|
},
|
||||||
"thumbnail" : "annc_index16_thumbs.png"
|
"thumbnail" : "annc_index16_thumbs.png"
|
||||||
}
|
}
|
||||||
|
|
@ -238,7 +238,7 @@
|
||||||
"filename" : "annc_widget14",
|
"filename" : "annc_widget14",
|
||||||
"name" : {
|
"name" : {
|
||||||
"zh_tw" : "14. 一圖 + 標題列表 ( 模組標題, 圖片, 狀態, 標題, 日期 )",
|
"zh_tw" : "14. 一圖 + 標題列表 ( 模組標題, 圖片, 狀態, 標題, 日期 )",
|
||||||
"en" : "14. 1 Image + Title List (widget-title, status, title, postdate)"
|
"en" : "14. 1 Image + Title List (widget-title, image, status, title, postdate)"
|
||||||
},
|
},
|
||||||
"thumbnail" : "annc_widget14_thumbs.png"
|
"thumbnail" : "annc_widget14_thumbs.png"
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -26,7 +26,7 @@
|
||||||
<li class="s-annc__related-file">
|
<li class="s-annc__related-file">
|
||||||
<i class="fa fa-fw fa-paperclip"></i>
|
<i class="fa fa-fw fa-paperclip"></i>
|
||||||
<div class="s-annc__related-file-list" data-list="bulletin_files" data-level="0">
|
<div class="s-annc__related-file-list" data-list="bulletin_files" data-level="0">
|
||||||
<a class="s-annc__flie-title btn btn-default btn-sm" href="{{file_url}}" target="_blank">{{file_title}}</a>
|
<a class="s-annc__flie-title btn btn-default btn-sm" href="{{file_url}}">{{file_title}}</a>
|
||||||
</div>
|
</div>
|
||||||
</li>
|
</li>
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -12,7 +12,7 @@
|
||||||
</a>
|
</a>
|
||||||
</h4>
|
</h4>
|
||||||
</div>
|
</div>
|
||||||
<div id="collapse" class="panel-collapse collapse in">
|
<div id="collapse" class="panel-collapse collapse">
|
||||||
<div class="panel-body">
|
<div class="panel-body">
|
||||||
<dl class="dl-horizontal index-archive-item-group" data-list="archives" data-level="1">
|
<dl class="dl-horizontal index-archive-item-group" data-list="archives" data-level="1">
|
||||||
<dt class="index-archive-item-list">
|
<dt class="index-archive-item-list">
|
||||||
|
|
|
||||||
|
|
@ -3,36 +3,36 @@
|
||||||
{
|
{
|
||||||
"filename" : "archive_index1",
|
"filename" : "archive_index1",
|
||||||
"name" : {
|
"name" : {
|
||||||
"zh_tw" : "1. 列表",
|
"zh_tw" : "1. 列表 ( 模組標題, 類別標題, 檔案名稱, 下載連結 )",
|
||||||
"en" : "1. List"
|
"en" : "1. List (widget-title, category, filename, download link)"
|
||||||
},
|
},
|
||||||
"thumbnail" : "thumbnail-block-list.png"
|
"thumbnail" : "thumb.png"
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"filename" : "archive_index2",
|
"filename" : "archive_index2",
|
||||||
"name" : {
|
"name" : {
|
||||||
"zh_tw" : "2. 互動式列表",
|
"zh_tw" : "2. 手風琴式列表 ( 模組標題, 類別標題, 檔案名稱, 下載連結 )",
|
||||||
"en" : "2. Accordion list"
|
"en" : "2. Accordion list (widget-title, category, filename, download link)"
|
||||||
},
|
},
|
||||||
"thumbnail" : "thumbnail-block.png"
|
"thumbnail" : "thumb.png"
|
||||||
}
|
}
|
||||||
],
|
],
|
||||||
"widgets" : [
|
"widgets" : [
|
||||||
{
|
{
|
||||||
"filename" : "archive_widget1",
|
"filename" : "archive_widget1",
|
||||||
"name" : {
|
"name" : {
|
||||||
"zh_tw" : "1. 列表",
|
"zh_tw" : "1. 列表 ( 模組標題, 類別標題, 下載頁面連結 )",
|
||||||
"en" : "1. List"
|
"en" : "1. List (widget-title, category, link of download page)"
|
||||||
},
|
},
|
||||||
"thumbnail" : "thumbnail-block.png"
|
"thumbnail" : "thumb.png"
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"filename" : "archive_widget2",
|
"filename" : "archive_widget2",
|
||||||
"name" : {
|
"name" : {
|
||||||
"zh_tw" : "2. 互動式列表",
|
"zh_tw" : "2. 手風琴式列表 ( 模組標題, 類別標題, 下載頁面連結 )",
|
||||||
"en" : "2. Accordion list"
|
"en" : "2. Accordion list (widget-title, category, link of download page)"
|
||||||
},
|
},
|
||||||
"thumbnail" : "thumbnail-block.png"
|
"thumbnail" : "thumb.png"
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
Binary file not shown.
|
After Width: | Height: | Size: 4.0 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 67 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 66 KiB |
|
|
@ -1,16 +0,0 @@
|
||||||
<div class="widget-faqs widget1">
|
|
||||||
<h3 class="widget-title">
|
|
||||||
<span>{{widget-title}}</span>
|
|
||||||
</h3>
|
|
||||||
<ul class="list-unstyled" data-list="faqs" data-level="0">
|
|
||||||
<li class="widget-content">
|
|
||||||
<a class="widget-content-title" href="{{link_to_show}}" target="_blank">{{title}}</a>
|
|
||||||
<span data-list="statuses" data-level="1">
|
|
||||||
<span class="label status {{status-class}}">{{status}}</span>
|
|
||||||
</span>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
<p class="more text-right">
|
|
||||||
<a class="btn btn-sm btn-info" href="{{more_url}}">More</a>
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
|
|
@ -1,16 +0,0 @@
|
||||||
<div class="index-faqs index1">
|
|
||||||
<h3 class="index-title">
|
|
||||||
<span>{{page-title}}</span>
|
|
||||||
</h3>
|
|
||||||
<ul class="list-unstyled" data-list="faqs" data-level="0">
|
|
||||||
<li class="index-content">
|
|
||||||
<h4>
|
|
||||||
<a class="index-content-title" href="{{link_to_show}}">{{question}}</a>
|
|
||||||
<span data-list="statuses" data-level="1">
|
|
||||||
<span class="label status {{status-class}}">{{status}}</span>
|
|
||||||
</span>
|
|
||||||
</h4>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
{{pagination_goes_here}}
|
|
||||||
|
|
@ -0,0 +1,22 @@
|
||||||
|
{
|
||||||
|
"frontend": [
|
||||||
|
{
|
||||||
|
"filename" : "faq_index1",
|
||||||
|
"name" : {
|
||||||
|
"zh_tw" : "1. 列表 ( 模組標題, 問題 )",
|
||||||
|
"en" : "1. Thumbnail ( widget-title, question )"
|
||||||
|
},
|
||||||
|
"thumbnail" : "thumb.png"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"widgets" : [
|
||||||
|
{
|
||||||
|
"filename" : "faq_widget1",
|
||||||
|
"name" : {
|
||||||
|
"zh_tw" : "1. 列表 ( 模組標題, 問題 )",
|
||||||
|
"en" : "1. List (widget-title, question)"
|
||||||
|
},
|
||||||
|
"thumbnail" : "thumb.png"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
Binary file not shown.
|
After Width: | Height: | Size: 4.0 KiB |
|
|
@ -2,19 +2,9 @@
|
||||||
<h3 class="widget-title">
|
<h3 class="widget-title">
|
||||||
<span>{{widget-title}}</span>
|
<span>{{widget-title}}</span>
|
||||||
</h3>
|
</h3>
|
||||||
<div class="cycle-slideshow widget-content"
|
<div class="row widget-content" data-level="0" data-list="images">
|
||||||
data-level="0"
|
<a class="widget-pic col-xs-4" href="{{link_to_show}}" target="_blank">
|
||||||
data-list="images"
|
|
||||||
data-cycle-slides="> a"
|
|
||||||
data-cycle-fx="carousel"
|
|
||||||
data-cycle-timeout="3000"
|
|
||||||
data-cycle-carousel-visible="3"
|
|
||||||
data-cycle-log="false"
|
|
||||||
data-cycle-pause-on-hover="true"
|
|
||||||
data-cycle-carousel-fluid="true">
|
|
||||||
<a class="widget-pic" href="{{link_to_show}}" target="_blank">
|
|
||||||
<img src="{{thumb-src}}" alt="">
|
<img src="{{thumb-src}}" alt="">
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<%= javascript_include_tag "plugin/jquery.cycle2.carousel.min"%>
|
|
||||||
|
|
@ -1,10 +0,0 @@
|
||||||
<div class="widget-gallery widget3">
|
|
||||||
<h3 class="widget-title">
|
|
||||||
<span>{{widget-title}}</span>
|
|
||||||
</h3>
|
|
||||||
<div class="row widget-content" data-level="0" data-list="images">
|
|
||||||
<a class="widget-pic col-xs-4" href="{{link_to_show}}" target="_blank">
|
|
||||||
<img src="{{thumb-src}}" alt="">
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
@ -1,20 +0,0 @@
|
||||||
<div class="index-gallery index1">
|
|
||||||
<h3 class="index-title">
|
|
||||||
<span>{{widget-title}}</span>
|
|
||||||
</h3>
|
|
||||||
<div class="row" data-level="0" data-list="albums">
|
|
||||||
<div class="index-content col-xs-4 col-sm-3">
|
|
||||||
<div class="index-content-inner">
|
|
||||||
<div class="index-pic">
|
|
||||||
<img class="img-thumbnail" src="{{thumb-src}}" alt="">
|
|
||||||
</div>
|
|
||||||
<section class="index-part">
|
|
||||||
<h4 class="index-content-title">
|
|
||||||
<a href="{{link_to_show}}">{{album-name}}</a>
|
|
||||||
</h4>
|
|
||||||
</section>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
{{pagination_goes_here}}
|
|
||||||
|
|
@ -3,16 +3,8 @@
|
||||||
{
|
{
|
||||||
"filename" : "gallery_index1",
|
"filename" : "gallery_index1",
|
||||||
"name" : {
|
"name" : {
|
||||||
"zh_tw" : "1. 相本排版-1",
|
"zh_tw" : "1. 縮圖 ( 相本圖片, 分頁導覽 )",
|
||||||
"en" : "1. Gallery-1"
|
"en" : "1. Thumbnail ( gallery thumbnail, page navigation )"
|
||||||
},
|
|
||||||
"thumbnail" : "thumb.png"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"filename" : "gallery_index2",
|
|
||||||
"name" : {
|
|
||||||
"zh_tw" : "2. 相本排版-2",
|
|
||||||
"en" : "2. Gallery-2"
|
|
||||||
},
|
},
|
||||||
"thumbnail" : "thumb.png"
|
"thumbnail" : "thumb.png"
|
||||||
}
|
}
|
||||||
|
|
@ -21,24 +13,16 @@
|
||||||
{
|
{
|
||||||
"filename" : "gallery_widget1",
|
"filename" : "gallery_widget1",
|
||||||
"name" : {
|
"name" : {
|
||||||
"zh_tw" : "1. 相本排版-1",
|
"zh_tw" : "1. 跑馬燈 ( 模組標題, 圖片 )",
|
||||||
"en" : "1. Gallery-1"
|
"en" : "1. Carousel Effect (widget-title, image)"
|
||||||
},
|
},
|
||||||
"thumbnail" : "thumb.png"
|
"thumbnail" : "thumb.png"
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"filename" : "gallery_widget2",
|
"filename" : "gallery_widget2",
|
||||||
"name" : {
|
"name" : {
|
||||||
"zh_tw" : "2. 相本排版-2",
|
"zh_tw" : "2. 相本排版",
|
||||||
"en" : "2. Gallery-2"
|
"en" : "2. Thumbnail"
|
||||||
},
|
|
||||||
"thumbnail" : "thumb.png"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"filename" : "gallery_widget3",
|
|
||||||
"name" : {
|
|
||||||
"zh_tw" : "3. 相本排版-3",
|
|
||||||
"en" : "2. Gallery-3"
|
|
||||||
},
|
},
|
||||||
"thumbnail" : "thumb.png"
|
"thumbnail" : "thumb.png"
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -3,24 +3,24 @@
|
||||||
{
|
{
|
||||||
"filename" : "member_index1",
|
"filename" : "member_index1",
|
||||||
"name" : {
|
"name" : {
|
||||||
"zh_tw" : "1. 表格列表",
|
"zh_tw" : "1. 表格列表 ( 類別標題, 個人資料等自訂欄位 )",
|
||||||
"en" : "1. Table List"
|
"en" : "1. Table List (category title and customized profile data)"
|
||||||
},
|
},
|
||||||
"thumbnail" : "thumbnail-block-list.png"
|
"thumbnail" : "member_index1_thumb.png"
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"filename" : "member_index2",
|
"filename" : "member_index2",
|
||||||
"name" : {
|
"name" : {
|
||||||
"zh_tw" : "2. 單欄式 ( 類別標題, 個人照片, 個人資料)",
|
"zh_tw" : "2. 單欄式 ( 類別標題, 個人照片, 個人資料等自訂欄位 )",
|
||||||
"en" : "2. Single Column (category title, photo, profile)"
|
"en" : "2. Single Column (category title, photo and customized profile data)"
|
||||||
},
|
},
|
||||||
"thumbnail" : "member_index2_thumb.png"
|
"thumbnail" : "member_index2_thumb.png"
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"filename" : "member_index3",
|
"filename" : "member_index3",
|
||||||
"name" : {
|
"name" : {
|
||||||
"zh_tw" : "3. 名片式 ( 類別標題, 個人照片, 個人資料 )",
|
"zh_tw" : "3. 名片式 ( 類別標題, 個人照片, 個人資料等自訂欄位 )",
|
||||||
"en" : "3. Two Columns (category title, photo, profile)"
|
"en" : "3. Two Columns (category title, photo and customized profile data)"
|
||||||
},
|
},
|
||||||
"thumbnail" : "member_index3_thumb.png"
|
"thumbnail" : "member_index3_thumb.png"
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -4,6 +4,11 @@
|
||||||
<h3 class="i-member__status-title">{{status-title}}</h3>
|
<h3 class="i-member__status-title">{{status-title}}</h3>
|
||||||
<div class="index-member-list" >
|
<div class="index-member-list" >
|
||||||
<table class="i-member__table table table-striped">
|
<table class="i-member__table table table-striped">
|
||||||
|
<thead data-level="2" data-list="members">
|
||||||
|
<tr class="i-member-tr-head" data-list="profile_data" data-level="3">
|
||||||
|
<th>{{key}}</th>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
<tbody data-level="2" data-list="members">
|
<tbody data-level="2" data-list="members">
|
||||||
<tr data-list="profile_data" data-level="3">
|
<tr data-list="profile_data" data-level="3">
|
||||||
<td class="{{value_class}}">{{value}}</td>
|
<td class="{{value_class}}">{{value}}</td>
|
||||||
|
|
|
||||||
Binary file not shown.
|
Before Width: | Height: | Size: 66 KiB After Width: | Height: | Size: 1.8 KiB |
|
|
@ -3,9 +3,8 @@
|
||||||
<thead>
|
<thead>
|
||||||
<tr>
|
<tr>
|
||||||
<th class="col-md-1">{{th_year}}</th>
|
<th class="col-md-1">{{th_year}}</th>
|
||||||
<th class="col-md-7">{{th_title}}</th>
|
<th class="col-md-9">{{th_title}}</th>
|
||||||
<th class="col-md-2">{{th_book_paper_type}}</th>
|
<th class="col-md-2">{{th_book_paper_type}}</th>
|
||||||
<th class="col-md-2">{{th_author}}</th>
|
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody data-level="0" data-list="books">
|
<tbody data-level="0" data-list="books">
|
||||||
|
|
@ -13,7 +12,6 @@
|
||||||
<td>{{year}}</td>
|
<td>{{year}}</td>
|
||||||
<td><a href="{{link_to_show}}">{{book_title}}</a></td>
|
<td><a href="{{link_to_show}}">{{book_title}}</a></td>
|
||||||
<td>{{book_paper_type}}</td>
|
<td>{{book_paper_type}}</td>
|
||||||
<td>{{author}}</td>
|
|
||||||
</tr>
|
</tr>
|
||||||
</tbody>
|
</tbody>
|
||||||
</table>
|
</table>
|
||||||
|
|
|
||||||
|
|
@ -3,15 +3,13 @@
|
||||||
<thead>
|
<thead>
|
||||||
<tr>
|
<tr>
|
||||||
<th class="col-md-1">{{th_year}}</th>
|
<th class="col-md-1">{{th_year}}</th>
|
||||||
<th class="col-md-9">{{th_title}}</th>
|
<th class="col-md-11">{{th_title}}</th>
|
||||||
<th class="col-md-2">{{th_author}}</th>
|
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody data-level="0" data-list="writing_conferences">
|
<tbody data-level="0" data-list="writing_conferences">
|
||||||
<tr>
|
<tr>
|
||||||
<td>{{year}}</td>
|
<td>{{year}}</td>
|
||||||
<td><a href="{{link_to_show}}">{{paper_title}}</a></td>
|
<td><a href="{{link_to_show}}">{{paper_title}}</a></td>
|
||||||
<td>{{author}}</td>
|
|
||||||
</tr>
|
</tr>
|
||||||
</tbody>
|
</tbody>
|
||||||
</table>
|
</table>
|
||||||
|
|
|
||||||
|
|
@ -3,15 +3,13 @@
|
||||||
<thead>
|
<thead>
|
||||||
<tr>
|
<tr>
|
||||||
<th class="col-md-1">{{th_year}}</th>
|
<th class="col-md-1">{{th_year}}</th>
|
||||||
<th class="col-md-9">{{th_title}}</th>
|
<th class="col-md-11">{{th_title}}</th>
|
||||||
<th class="col-md-2">{{th_author}}</th>
|
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody data-level="0" data-list="journal_papers">
|
<tbody data-level="0" data-list="journal_papers">
|
||||||
<tr>
|
<tr>
|
||||||
<td>{{year}}</td>
|
<td>{{year}}</td>
|
||||||
<td><a href="{{link_to_show}}">{{paper_title}}</a></td>
|
<td><a href="{{link_to_show}}">{{paper_title}}</a></td>
|
||||||
<td>{{author}}</td>
|
|
||||||
</tr>
|
</tr>
|
||||||
</tbody>
|
</tbody>
|
||||||
</table>
|
</table>
|
||||||
|
|
|
||||||
|
|
@ -1,13 +0,0 @@
|
||||||
<div class="widget-link widget1">
|
|
||||||
<h3 class="widget-title">
|
|
||||||
<span>{{widget-title}}</span>
|
|
||||||
</h3>
|
|
||||||
<ul class="list-unstyled" data-level="0" data-list="web_link">
|
|
||||||
<li class="widget-content">
|
|
||||||
<a class="widget-content-title" href="{{link_to_show}}" target="_blank">{{title}}</a>
|
|
||||||
<span data-list="statuses" data-level="1">
|
|
||||||
<span class="label status {{status-class}}">{{status}}</span>
|
|
||||||
</span>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
|
|
@ -0,0 +1,22 @@
|
||||||
|
{
|
||||||
|
"frontend": [
|
||||||
|
{
|
||||||
|
"filename" : "web_res_index1",
|
||||||
|
"name" : {
|
||||||
|
"zh_tw" : "1. 列表 ( 模組標題, 連結, 連結說明 )",
|
||||||
|
"en" : "1. List (widget-title, link, link description)"
|
||||||
|
},
|
||||||
|
"thumbnail" : "thumb.png"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"widgets" : [
|
||||||
|
{
|
||||||
|
"filename" : "web_res_widget1",
|
||||||
|
"name" : {
|
||||||
|
"zh_tw" : "1. 列表 ( 模組標題, 連結 )",
|
||||||
|
"en" : "1. List (widget-title, link)"
|
||||||
|
},
|
||||||
|
"thumbnail" : "thumb.png"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
Binary file not shown.
|
After Width: | Height: | Size: 4.0 KiB |
|
|
@ -1,17 +0,0 @@
|
||||||
<div class="index-link index1">
|
|
||||||
<h3 class="index-title">
|
|
||||||
<span>{{page-title}}</span>
|
|
||||||
</h3>
|
|
||||||
<ul class="list-unstyled" data-list="web_link" data-level="0">
|
|
||||||
<li class="index-content">
|
|
||||||
<h4>
|
|
||||||
<a class="index-content-title" href="{{link_to_show}}" target="_blank">{{title}}</a>
|
|
||||||
<span data-list="statuses" data-level="1">
|
|
||||||
<span class="label status {{status-class}}">{{status}}</span>
|
|
||||||
</span>
|
|
||||||
</h4>
|
|
||||||
<small class="index-context">{{context}}</small>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
{{pagination_goes_here}}
|
|
||||||
|
|
@ -0,0 +1,12 @@
|
||||||
|
{
|
||||||
|
"widgets" : [
|
||||||
|
{
|
||||||
|
"filename" : "breadcrumb_widget1",
|
||||||
|
"name" : {
|
||||||
|
"zh_tw" : "1. 標準 ( 模組標題, 麵包屑連結 )",
|
||||||
|
"en" : "1. Standard (widget-title, breadcrumb link)"
|
||||||
|
},
|
||||||
|
"thumbnail" : "thumb.png"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
Binary file not shown.
|
After Width: | Height: | Size: 4.0 KiB |
|
|
@ -0,0 +1,18 @@
|
||||||
|
<div class="sitemenu-wrap">
|
||||||
|
<h3 class="sitemenu-title">{{widget_title}}</h3>
|
||||||
|
<ul data-list="pages" class="sitemenu-list level-1" data-level="0">
|
||||||
|
<li class="sitemenu-item level-1">
|
||||||
|
<a class="sitemenu-link level-1" href="{{url}}" target="{{target}}">{{page_name}}</a>
|
||||||
|
<ul class="sitemenu-list level-2" data-list="children" data-level="1">
|
||||||
|
<li class="sitemenu-item level-2">
|
||||||
|
<a class="sitemenu-link level-2" href="{{url}}" target="{{target}}">{{page_name}}</a>
|
||||||
|
<ul data-list="children" data-level="2">
|
||||||
|
<li>
|
||||||
|
<a href="{{url}}" target="{{target}}">{{page_name}}</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
@ -1,18 +0,0 @@
|
||||||
<div class="sitemenu-wrap">
|
|
||||||
<h3 class="sitemenu__title">{{widget_title}}</h3>
|
|
||||||
<ul data-list="pages" class="sitemenu__list level-1" data-level="0">
|
|
||||||
<li class="sitemenu__item level-1">
|
|
||||||
<a class="sitemenu__link level-1" href="{{url}}" target="{{target}}">{{page_name}}</a>
|
|
||||||
<ul class="sitemenu__list level-2" data-list="children" data-level="1">
|
|
||||||
<li class="sitemenu__item level-2">
|
|
||||||
<a class="sitemenu__link level-2" href="{{url}}" target="{{target}}">{{page_name}}</a>
|
|
||||||
<ul data-list="children" data-level="2">
|
|
||||||
<li>
|
|
||||||
<a href="{{url}}" target="{{target}}">{{page_name}}</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
|
|
@ -0,0 +1,12 @@
|
||||||
|
{
|
||||||
|
"widgets" : [
|
||||||
|
{
|
||||||
|
"filename" : "site_menu_widget1",
|
||||||
|
"name" : {
|
||||||
|
"zh_tw" : "1. 下拉式 ( 模組標題, 網站第二層選單, 網站第三層選單 )",
|
||||||
|
"en" : "1. Dropdown (widget-title, second level dropdown, third level dropdown)"
|
||||||
|
},
|
||||||
|
"thumbnail" : "thumb.png"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
Binary file not shown.
|
After Width: | Height: | Size: 4.0 KiB |
|
|
@ -1,6 +1,3 @@
|
||||||
<% content_for :page_specific_javascript do -%>
|
|
||||||
<%= javascript_include_tag "group.js" %>
|
|
||||||
<% end -%>
|
|
||||||
<%
|
<%
|
||||||
current_user_is_group_admin = group.admins.include?(current_user.id.to_s) ? true : false
|
current_user_is_group_admin = group.admins.include?(current_user.id.to_s) ? true : false
|
||||||
if !current_user_is_group_admin
|
if !current_user_is_group_admin
|
||||||
|
|
@ -9,17 +6,17 @@
|
||||||
current_user_is_group_member = true
|
current_user_is_group_member = true
|
||||||
end
|
end
|
||||||
%>
|
%>
|
||||||
<li>
|
<li class="group-card animated bounceInDown">
|
||||||
<div class="member-avatar">
|
<div class="group-card-inner card-ownership card-owner card">
|
||||||
|
<div class="group-avatar">
|
||||||
<p class="<%= current_user_is_group_admin ? "gender-man" : (current_user_is_group_member ? "gender-woman" : "gender-none") %>"></p>
|
<p class="<%= current_user_is_group_admin ? "gender-man" : (current_user_is_group_member ? "gender-woman" : "gender-none") %>"></p>
|
||||||
<div class="action">
|
<div class="action">
|
||||||
<%= link_to(content_tag(:i, nil, :class => 'icon-edit'),"#",:class=>"edit" ) if current_user_is_group_admin %>
|
<%= link_to(content_tag(:i, nil, :class => 'icon-edit'),"#",:class=>"edit" ) if current_user_is_group_admin %>
|
||||||
</div>
|
</div>
|
||||||
<%= image_tag(group.image) %>
|
<%= image_tag(group.image) %>
|
||||||
</div>
|
</div>
|
||||||
<div class="member-info">
|
<div class="group-info">
|
||||||
<h4 class="member-name"><%= link_to group.title, admin_group_path(group) %></h4>
|
<h4 class="group-name"><%= link_to group.title, admin_group_path(group) %></h4>
|
||||||
<%
|
<%
|
||||||
author = ""
|
author = ""
|
||||||
group.admins.each_with_index do |admin,i|
|
group.admins.each_with_index do |admin,i|
|
||||||
|
|
@ -30,16 +27,16 @@
|
||||||
end
|
end
|
||||||
end
|
end
|
||||||
%>
|
%>
|
||||||
<div class="member-mail muted">Admin : <%= author %></div>
|
<div class="group-mail">Admin : <%= author %></div>
|
||||||
<hr>
|
<hr>
|
||||||
<ul class="member-roles">
|
<ul class="group-roles">
|
||||||
<li>
|
<li class="group-privacy">
|
||||||
<span class="member-staturs muted">Privacy : </i>
|
<span class="group-staturs">Privacy : </i>
|
||||||
<span class="label <%= group.privacy == 'closed' ? "label-important" : "label-success" %>"><%= group.privacy %></span>
|
<span class="label <%= group.privacy == 'closed' ? "private" : "public" %>"><%= group.privacy %></span>
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li class="group-description">
|
||||||
<% content = group.description %>
|
<% content = group.description %>
|
||||||
<%= content[0..250] %>
|
<%= content[0..150] %>
|
||||||
<%= "..." if content.length > 250 %>
|
<%= "..." if content.length > 250 %>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
|
|
|
||||||
|
|
@ -1,5 +1,6 @@
|
||||||
<% @categories.each do |cat| %>
|
<% @categories.each do |cat| %>
|
||||||
<div>
|
<div class="group-category-item button button-primary">
|
||||||
<%= cat.title_translations["en"] %> / <%= cat.title_translations["zh_tw"] %>
|
<i class="group-category-tag-icon fa fa-tag"></i>
|
||||||
|
<a href="#" class="open-slide" data-title="Edit" data-form="<%= cat.title_translations.to_json %>" data-id="<%= cat.id.to_s %>" ><%= cat.title_translations["en"] %> / <%= cat.title_translations["zh_tw"] %></a>
|
||||||
</div>
|
</div>
|
||||||
<% end %>
|
<% end %>
|
||||||
|
|
@ -2,7 +2,7 @@
|
||||||
<%= stylesheet_link_tag "lib/main-forms" %>
|
<%= stylesheet_link_tag "lib/main-forms" %>
|
||||||
<%= stylesheet_link_tag "lib/fileupload" %>
|
<%= stylesheet_link_tag "lib/fileupload" %>
|
||||||
<%= stylesheet_link_tag "lib/main-list" %>
|
<%= stylesheet_link_tag "lib/main-list" %>
|
||||||
<%= stylesheet_link_tag "group_admin" %>
|
<%= stylesheet_link_tag "lib/group/group-admin" %>
|
||||||
<%= stylesheet_link_tag "select2/select2" %>
|
<%= stylesheet_link_tag "select2/select2" %>
|
||||||
<% end %>
|
<% end %>
|
||||||
<% content_for :page_specific_javascript do %>
|
<% content_for :page_specific_javascript do %>
|
||||||
|
|
@ -35,6 +35,7 @@
|
||||||
<div class="control-group">
|
<div class="control-group">
|
||||||
<label class="control-label muted"><%= t(:image) %></label>
|
<label class="control-label muted"><%= t(:image) %></label>
|
||||||
<div class="controls">
|
<div class="controls">
|
||||||
|
<div class="help-block">建議上傳圖片尺寸為 : 1400px * 280px, 如果沒有上傳圖片，預設背景為黑色</div>
|
||||||
<div class="fileupload fileupload-new clearfix <%= 'fileupload-edit' if @group.image.file %>" data-provides="fileupload">
|
<div class="fileupload fileupload-new clearfix <%= 'fileupload-edit' if @group.image.file %>" data-provides="fileupload">
|
||||||
<div class="fileupload-new thumbnail pull-left">
|
<div class="fileupload-new thumbnail pull-left">
|
||||||
<% if @group.image.file %>
|
<% if @group.image.file %>
|
||||||
|
|
|
||||||
|
|
@ -1,47 +1,49 @@
|
||||||
<a href="/admin/posts/<%= post.to_param %>" class="group-page-post-link">
|
<div class="group-post-item card clearfix wow bounceInUp">
|
||||||
<div class="group-page-post clearfix">
|
<a href="/admin/posts/<%= post.to_param %>" class="group-post-link"></a>
|
||||||
<div class="group-page-post-image-wrap">
|
<div class="group-post-actions tool-tip-parent">
|
||||||
|
<div class="group-post-action-hint tool-tip right">
|
||||||
|
<span>Edit this post</span>
|
||||||
|
</div>
|
||||||
|
<button class="group-post-dropdown-toggle">
|
||||||
|
<span class="caret"></span>
|
||||||
|
</button>
|
||||||
|
<ul class="group-post-dropdown">
|
||||||
|
<li><a href="#">Action</a></li>
|
||||||
|
<li><a href="#">Another action</a></li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<div class="group-post-image-wrap">
|
||||||
<% if !post.group_post_images.blank? %>
|
<% if !post.group_post_images.blank? %>
|
||||||
<img class="group-page-post-image" src="<%= post.group_post_images.first.image.thumb.url %>" alt="<%= post.title %>">
|
<img class="group-post-image" src="<%= post.group_post_images.first.image.thumb.url %>" alt="<%= post.title %>">
|
||||||
<% else %>
|
<% else %>
|
||||||
<img class="group-page-post-image" src="/assets/no-image.jpg" alt="Post image">
|
<img class="group-post-image" src="/assets/no-image.jpg" alt="Post image">
|
||||||
<% end %>
|
<% end %>
|
||||||
</div>
|
</div>
|
||||||
<div class="group-page-post-content-wrap">
|
<div class="group-post-content-wrap">
|
||||||
<h3 class="group-page-post-title">
|
<h3 class="group-post-title">
|
||||||
<%= post.title %>
|
<%= post.title %>
|
||||||
</h3>
|
</h3>
|
||||||
<div class="group-page-post-content">
|
<div class="group-post-content">
|
||||||
<% content = strip_tags post.content %>
|
<% content = strip_tags post.content %>
|
||||||
<%= content[0..250] %>
|
<%= content[0..250] %>
|
||||||
<%= "..." if content.length > 350 %>
|
<%= "..." if content.length > 350 %>
|
||||||
</div>
|
</div>
|
||||||
<div class="group-page-post-meta-wrap">
|
<div class="group-post-meta-wrap">
|
||||||
<span class="group-page-post-author">
|
<span class="group-post-author">
|
||||||
<%
|
<%
|
||||||
user = User.find(post.author) rescue nil
|
user = User.find(post.author) rescue nil
|
||||||
if !user.nil?
|
if !user.nil?
|
||||||
author = (user.member_profile.name == nil ? user.user_name : user.member_profile.name rescue "")
|
author = (user.member_profile.name == nil ? user.user_name : user.member_profile.name rescue "")
|
||||||
%>
|
%>
|
||||||
<i class="group-page-post-author-icon icon-user"></i> <%= author %>
|
<i class="group-post-author-icon icon-user"></i> <%= author %>
|
||||||
<% end %>
|
<% end %>
|
||||||
</span>
|
</span>
|
||||||
<div class="group-page-post-sub-wrap">
|
<div class="group-post-sub-wrap">
|
||||||
<span class="group-page-post-postdate">
|
<span class="group-post-postdate">
|
||||||
<% date = DateTime.parse(post.created_at.to_s).strftime("%d %B %H:%M") %>
|
<% date = DateTime.parse(post.created_at.to_s).strftime("%d %B %H:%M") %>
|
||||||
<i class="group-page-post-postdate-icon icon-time"></i> <%= date %>
|
<i class="group-post-postdate-icon icon-time"></i> <%= date %>
|
||||||
</span>
|
</span>
|
||||||
<!-- <span class="group-post-time">10:25</span> -->
|
|
||||||
</div>
|
|
||||||
<!-- <div class="group-page-seen-by tool-tip-parent">
|
|
||||||
<i class="fa fa-eye"></i>
|
|
||||||
<em class="group-page-seen-by-lead">Seen by: </em>
|
|
||||||
<div class="gorup-post-seen-by-names tool-tip right">
|
|
||||||
<span class="group-page-seen-by-name">Harry</span>
|
|
||||||
<span class="group-page-seen-by-name">Ika</span>
|
|
||||||
</div>
|
|
||||||
</div> -->
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</a>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -1,6 +1,6 @@
|
||||||
<li class="group-post-comment">
|
<li class="group-show-post-comment">
|
||||||
<div class="group-post-comment-wrap">
|
<div class="group-show-post-comment-wrap">
|
||||||
<div class="group-post-comment-avatar">
|
<div class="group-show-post-comment-avatar">
|
||||||
<%
|
<%
|
||||||
user = post_comment.user rescue nil
|
user = post_comment.user rescue nil
|
||||||
if !user.nil?
|
if !user.nil?
|
||||||
|
|
@ -10,13 +10,13 @@
|
||||||
%>
|
%>
|
||||||
<img src="<%= avatar %> " alt="Avatar image">
|
<img src="<%= avatar %> " alt="Avatar image">
|
||||||
</div>
|
</div>
|
||||||
<div class="group-post-comment-body">
|
<div class="group-show-post-comment-body">
|
||||||
<div class="group-post-comment-author-wrap">
|
<div class="group-show-post-comment-author-wrap">
|
||||||
<div class="group-post-comment-author"><%= author %></div>
|
<div class="group-show-post-comment-author"><%= author %></div>
|
||||||
<% date = DateTime.parse(post_comment.created_at.to_s).strftime("%d %B") %>
|
<% date = DateTime.parse(post_comment.created_at.to_s).strftime("%d %B") %>
|
||||||
<div class="group-post-comment-time muted"><%= date %></div>
|
<div class="group-show-post-comment-time muted"><%= date %></div>
|
||||||
</div>
|
</div>
|
||||||
<div class="group-post-comment-content">
|
<div class="group-show-post-comment-content">
|
||||||
<% content_images = parse_for_images(post_comment.comment) %>
|
<% content_images = parse_for_images(post_comment.comment) %>
|
||||||
<%= content_images.first %>
|
<%= content_images.first %>
|
||||||
<%= content_images.last.html_safe %>
|
<%= content_images.last.html_safe %>
|
||||||
|
|
|
||||||
|
|
@ -3,8 +3,8 @@
|
||||||
<%= stylesheet_link_tag "lib/fileupload" %>
|
<%= stylesheet_link_tag "lib/fileupload" %>
|
||||||
<%= stylesheet_link_tag "lib/main-list" %>
|
<%= stylesheet_link_tag "lib/main-list" %>
|
||||||
<%= stylesheet_link_tag "lib/dropzone" %>
|
<%= stylesheet_link_tag "lib/dropzone" %>
|
||||||
<%= stylesheet_link_tag "group_show" %>
|
<%= stylesheet_link_tag "lib/group/group-main" %>
|
||||||
<%= stylesheet_link_tag "group_admin" %>
|
<%= stylesheet_link_tag "lib/group/group-admin" %>
|
||||||
<%= stylesheet_link_tag "//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" %>
|
<%= stylesheet_link_tag "//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" %>
|
||||||
<%= stylesheet_link_tag "//cdnjs.cloudflare.com/ajax/libs/animate.css/3.2.6/animate.min.css" %>
|
<%= stylesheet_link_tag "//cdnjs.cloudflare.com/ajax/libs/animate.css/3.2.6/animate.min.css" %>
|
||||||
<% end %>
|
<% end %>
|
||||||
|
|
|
||||||
|
|
@ -1,9 +1,59 @@
|
||||||
<div id="group_categories">
|
<% content_for :page_specific_css do -%>
|
||||||
|
<%= stylesheet_link_tag "lib/group/group-main" %>
|
||||||
|
<%= stylesheet_link_tag "//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" %>
|
||||||
|
<%= stylesheet_link_tag "//cdnjs.cloudflare.com/ajax/libs/animate.css/3.2.6/animate.min.css" %>
|
||||||
|
<% end -%>
|
||||||
|
<% content_for :page_specific_javascript do -%>
|
||||||
|
<%= javascript_include_tag "group.js" %>
|
||||||
|
<% end -%>
|
||||||
|
|
||||||
|
<ul class="group-category-tab nav nav-pills">
|
||||||
|
<li class="active">
|
||||||
|
<a class="group-category-tab-nav" href=".group-category-existing" data-toggle="tab">
|
||||||
|
Existing categories
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a class="group-category-tab-nav" href=".group-category-request" data-toggle="tab">
|
||||||
|
Request categories
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
<div class="group-category-tab-content tab-content">
|
||||||
|
<div class="group-category-existing tab-pane fade in active">
|
||||||
<%= render :partial => "group_categories" %>
|
<%= render :partial => "group_categories" %>
|
||||||
</div>
|
</div>
|
||||||
<a href="" class="btn btn-primary" data-toggle="modal" data-target="#categoryModal">+</a>
|
<div class="group-category-request fade">
|
||||||
|
<div class="group-category-item button button-primary">
|
||||||
|
<i class="group-category-tag-icon fa fa-tag"></i>
|
||||||
|
<a href="#">Request tag one</a>
|
||||||
|
<span class="group-category-controls">
|
||||||
|
<a href="#" class="group-category-approve tool-tip-parent">
|
||||||
|
<i class="fa fa-check"></i>
|
||||||
|
<span class="group-category-approve-tootip tool-tip">
|
||||||
|
Approve
|
||||||
|
</span>
|
||||||
|
</a>
|
||||||
|
<a href="#" class="group-category-reject tool-tip-parent">
|
||||||
|
<i class="fa fa-times"></i>
|
||||||
|
<span class="group-category-approve-tootip tool-tip">
|
||||||
|
Reject
|
||||||
|
</span>
|
||||||
|
</a>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="bottomnav clearfix">
|
||||||
|
<div class="action pull-right">
|
||||||
|
<a href="" class="btn btn-primary" data-toggle="modal" data-target="#categoryModal">Add new category</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
<div class="modal fade" id="categoryModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
|
<div class="modal fade" id="categoryModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
|
||||||
<div class="modal-dialog">
|
<div class="modal-dialog group-category-modal">
|
||||||
<div class="modal-content">
|
<div class="modal-content">
|
||||||
<div class="modal-header">
|
<div class="modal-header">
|
||||||
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
|
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
|
||||||
|
|
@ -11,12 +61,14 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="modal-body">
|
<div class="modal-body">
|
||||||
<% @site_in_use_locales.each do |locale| %>
|
<% @site_in_use_locales.each do |locale| %>
|
||||||
|
<form class="form-horizontal">
|
||||||
<div class="control-group">
|
<div class="control-group">
|
||||||
<label class="control-label"><%= "#{t(:name)} (#{t(locale)})" %></label>
|
<label class="control-label"><%= "#{t(:name)} (#{t(locale)})" %></label>
|
||||||
<div class="controls">
|
<div class="controls">
|
||||||
<input class="input-large" id="<%=locale%>" name="category[title_translations][<%=locale%>]" placeholder="<%=t(:name)%>" type="text">
|
<input class="input-large" id="<%=locale%>" name="category[title_translations][<%=locale%>]" placeholder="<%=t(:name)%>" type="text">
|
||||||
<span class="help-inline hide">Please enter category title</span>
|
<span class="help-inline hide">Please enter category title</span>
|
||||||
</div>
|
</div>
|
||||||
|
</form>
|
||||||
</div>
|
</div>
|
||||||
<% end %>
|
<% end %>
|
||||||
<div class="text-error text-center"><%= t(:category_notice) %></div>
|
<div class="text-error text-center"><%= t(:category_notice) %></div>
|
||||||
|
|
@ -28,6 +80,39 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<div id="pageslide">
|
||||||
|
<div class="page-title clearfix">
|
||||||
|
<a class="pull-right" href="javascript:$.pageslide.close()">
|
||||||
|
<i class="icons-arrow-left-2"></i>
|
||||||
|
</a>
|
||||||
|
<span></span>
|
||||||
|
</div>
|
||||||
|
<div class="view-page">
|
||||||
|
<div class="nano">
|
||||||
|
<div class="content">
|
||||||
|
<%= form_for :category, url: nil, remote: true, :html=>{id: "category_form"} do |f| %>
|
||||||
|
<fieldset>
|
||||||
|
<%= f.fields_for :title_translations do |f| %>
|
||||||
|
<% @site_in_use_locales.each do |locale| %>
|
||||||
|
<div class="control-group">
|
||||||
|
<label class="control-label"><%= "#{t(:name)} (#{t(locale)})" %></label>
|
||||||
|
<div class="controls">
|
||||||
|
<input class="input-large" id="<%=locale%>" name="category[title_translations][<%=locale%>]" placeholder="<%=t(:name)%>" type="text">
|
||||||
|
<span class="help-inline hide"><%= t('front_page.name_field_helper') %></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<% end %>
|
||||||
|
<% end %>
|
||||||
|
<div class="form-actions">
|
||||||
|
<a href="javascript:$.pageslide.close()" class="btn btn-small"><%= t(:cancel) %></a>
|
||||||
|
<%= f.submit t(:submit), class: 'btn btn-primary btn-small', id: "category_submit" %>
|
||||||
|
</div>
|
||||||
|
</fieldset>
|
||||||
|
<% end %>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
$(function(){
|
$(function(){
|
||||||
|
|
@ -40,6 +125,10 @@
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
|
$('.open-slide').on('click', function() {
|
||||||
|
setForm($(this).data('form'));
|
||||||
|
});
|
||||||
|
|
||||||
$.each($('#categoryModal .input-large'),function(){
|
$.each($('#categoryModal .input-large'),function(){
|
||||||
$(this).blur(function(){
|
$(this).blur(function(){
|
||||||
if($(this).val()==""){
|
if($(this).val()==""){
|
||||||
|
|
|
||||||
|
|
@ -1,17 +1,17 @@
|
||||||
<% content_for :page_specific_css do -%>
|
<% content_for :page_specific_css do -%>
|
||||||
|
|
||||||
<%= stylesheet_link_tag "lib/wrap-nav" %>
|
<%= stylesheet_link_tag "lib/wrap-nav" %>
|
||||||
<%= stylesheet_link_tag "lib/main-list" %>
|
<%= stylesheet_link_tag "lib/main-list" %>
|
||||||
<%= stylesheet_link_tag "lib/filter" %>
|
<%= stylesheet_link_tag "lib/filter" %>
|
||||||
<%= stylesheet_link_tag "lib/member" %>
|
<%= stylesheet_link_tag "lib/group/group-main" %>
|
||||||
|
<%= stylesheet_link_tag "//cdnjs.cloudflare.com/ajax/libs/animate.css/3.2.6/animate.min.css" %>
|
||||||
<% end -%>
|
<% end -%>
|
||||||
<% content_for :page_specific_javascript do -%>
|
<% content_for :page_specific_javascript do -%>
|
||||||
<%= javascript_include_tag "lib/jquery.lite.image.resize.js" %>
|
<%= javascript_include_tag "lib/jquery.lite.image.resize.js" %>
|
||||||
<%= javascript_include_tag "lib/member/list-view.js" %>
|
<%= javascript_include_tag "lib/member/list-view.js" %>
|
||||||
|
<%= javascript_include_tag "group.js" %>
|
||||||
<% end -%>
|
<% end -%>
|
||||||
<div id="list-view">
|
<div>
|
||||||
<ul id="member-abstract" class="clearfix">
|
<ul class="group-index wrapper clearfix">
|
||||||
<%= render :partial=>"group",:collection=> @groups %>
|
<%= render :partial=>"group",:collection=> @groups %>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -2,14 +2,17 @@
|
||||||
<%= stylesheet_link_tag "lib/wrap-nav" %>
|
<%= stylesheet_link_tag "lib/wrap-nav" %>
|
||||||
<%= stylesheet_link_tag "lib/main-list" %>
|
<%= stylesheet_link_tag "lib/main-list" %>
|
||||||
<%= stylesheet_link_tag "lib/filter" %>
|
<%= stylesheet_link_tag "lib/filter" %>
|
||||||
<%= stylesheet_link_tag "lib/member" %>
|
<%= stylesheet_link_tag "lib/group/group-main" %>
|
||||||
|
<%= stylesheet_link_tag "//cdnjs.cloudflare.com/ajax/libs/animate.css/3.2.6/animate.min.css" %>
|
||||||
<% end -%>
|
<% end -%>
|
||||||
<% content_for :page_specific_javascript do -%>
|
<% content_for :page_specific_javascript do -%>
|
||||||
<%= javascript_include_tag "lib/jquery.lite.image.resize.js" %>
|
<%= javascript_include_tag "lib/jquery.lite.image.resize.js" %>
|
||||||
<%= javascript_include_tag "lib/member/list-view.js" %>
|
<%= javascript_include_tag "lib/member/list-view.js" %>
|
||||||
|
<%= javascript_include_tag "//cdnjs.cloudflare.com/ajax/libs/wow/1.1.2/wow.min.js" %>
|
||||||
|
<%= javascript_include_tag "group" %>
|
||||||
<% end -%>
|
<% end -%>
|
||||||
<div id="list-view">
|
<div>
|
||||||
<ul id="member-abstract" class="clearfix">
|
<ul class="group-public clearfix">
|
||||||
<%= render :partial=>"group",:collection=> @groups %>
|
<%= render :partial=>"group",:collection=> @groups %>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -1,60 +1,64 @@
|
||||||
<% content_for :page_specific_css do -%>
|
<% content_for :page_specific_css do -%>
|
||||||
<%= stylesheet_link_tag "group_show" %>
|
<%= stylesheet_link_tag "lib/group/group-main" %>
|
||||||
<%= stylesheet_link_tag "//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" %>
|
<%= stylesheet_link_tag "//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" %>
|
||||||
|
<%= stylesheet_link_tag "//cdnjs.cloudflare.com/ajax/libs/animate.css/3.2.6/animate.min.css" %>
|
||||||
<% end -%>
|
<% end -%>
|
||||||
<% content_for :page_specific_javascript do -%>
|
<% content_for :page_specific_javascript do -%>
|
||||||
|
<%= javascript_include_tag "//cdnjs.cloudflare.com/ajax/libs/wow/1.1.2/wow.min.js" %>
|
||||||
<%= javascript_include_tag "group.js" %>
|
<%= javascript_include_tag "group.js" %>
|
||||||
<% end -%>
|
<% end -%>
|
||||||
<div class="group-page">
|
<div class="group-post">
|
||||||
<div class="group-page-banner-wrap">
|
<div class="group-post-banner-wrap">
|
||||||
<div class="group-page-banner-image-wrap">
|
<div class="group-post-banner-image-wrap">
|
||||||
<img class="group-page-banner-image" src="<%= @group.image.url %>" alt="<%= @group.title %>">
|
<img class="group-post-banner-image" src="<%= @group.image.url %>" alt="<%= @group.title %>">
|
||||||
<ul class="group-page-view-switch button-group">
|
<ul class="group-post-view-switch button-group">
|
||||||
<li class="group-page-feed-view button button-group-common button-default active">
|
<li class="group-post-feed-view button button-group-common button-default active tool-tip-parent">
|
||||||
<a class="group-page-switch-btn" href="#" title="Feed"><i class="icon-list-ul"></i></a>
|
<span class="tool-tip bottom nowrap">List view</span>
|
||||||
|
<a class="group-post-switch-btn" href="#" title="Feed"><i class="icon-list-ul"></i></a>
|
||||||
</li>
|
</li>
|
||||||
<li class="group-page-grid-view button button-group-common button-default">
|
<li class="group-post-grid-view button button-group-common button-default tool-tip-parent">
|
||||||
<a class="group-page-switch-btn" href="#" title="Grid"><i class="icon-th"></i></a>
|
<span class="tool-tip bottom nowrap">Grid view</span>
|
||||||
|
<a class="group-post-switch-btn" href="#" title="Grid"><i class="icon-th"></i></a>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
<div class="group-page-bar">
|
<div class="group-post-bar">
|
||||||
<h2 class="group-page-title"><%= @group.title %></h2>
|
<h2 class="group-post-page-title"><%= @group.title %></h2>
|
||||||
<% if user_can_write? %>
|
<% if user_can_write? %>
|
||||||
<a class="group-page-new-post button button-primary" href="<%= admin_group_newpost_path(@group) %>"><i class="icon-plus"></i> New Post</a>
|
<a class="group-post-new-post button button-primary" href="<%= admin_group_newpost_path(@group) %>"><i class="icon-plus"></i> New Post</a>
|
||||||
<% end %>
|
<% end %>
|
||||||
<ul class="group-page-view-switch-in-bar button-group">
|
<ul class="group-post-view-switch-in-bar button-group">
|
||||||
<li class="group-page-feed-view button button-group-common button-default active">
|
<li class="group-post-feed-view button button-group-common button-default active">
|
||||||
<a class="group-page-switch-btn" href="#" title="Feed"><i class="icon-list-ul"></i></a>
|
<a class="group-post-switch-btn" href="#" title="Feed"><i class="icon-list-ul"></i></a>
|
||||||
</li>
|
</li>
|
||||||
<li class="group-page-grid-view button button-group-common button-default">
|
<li class="group-post-grid-view button button-group-common button-default">
|
||||||
<a class="group-page-switch-btn" href="#" title="Grid"><i class="icon-th"></i></a>
|
<a class="group-post-switch-btn" href="#" title="Grid"><i class="icon-th"></i></a>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="group-page-section">
|
<div class="group-post-section wrapper">
|
||||||
<div class="group-page-detail">
|
<div class="group-post-detail">
|
||||||
<ul class="group-page-pagenation breadcrumb">
|
<ul class="group-post-pagenation breadcrumb">
|
||||||
<li><a href="<%= admin_groups_path %>">My Groups</a> <span class="divider">/</span></li>
|
<li><a href="<%= admin_groups_path %>">My Groups</a> <span class="divider">/</span></li>
|
||||||
<li class="active"><%= @group.title %></li>
|
<li class="active"><%= @group.title %></li>
|
||||||
</ul>
|
</ul>
|
||||||
<span class="gorup-page-info-wrap button button-default" id="group_info_button">
|
<span class="gorup-page-info-wrap button button-default" id="group_info_button">
|
||||||
<i class="group-page-info-icon icon-info-sign"></i> <span>Info</span>
|
<i class="group-post-info-icon icon-info-sign"></i> <span>Info</span>
|
||||||
</span>
|
</span>
|
||||||
<div class="group-page-description-wrap" id="group_info_area" style="display:none;">
|
<div class="group-post-description-wrap" id="group_info_area" style="display:none;">
|
||||||
<% if @group.privacy == "closed" %>
|
<% if @group.privacy == "closed" %>
|
||||||
<span class="group-page-status-wrap close-eye button button-activated">
|
<span class="group-post-status-wrap close-eye button button-activated">
|
||||||
<i class="group-page-status icon-eye-open"></i> Closed
|
<i class="group-post-status icon-eye-open"></i> Closed
|
||||||
</span>
|
</span>
|
||||||
<% else %>
|
<% else %>
|
||||||
<span class="group-page-status-wrap open-eye button button-activated">
|
<span class="group-post-status-wrap open-eye button button-activated">
|
||||||
<i class="group-page-status icon-eye-open"></i> Open
|
<i class="group-post-status icon-eye-open"></i> Open
|
||||||
</span>
|
</span>
|
||||||
<% end %>
|
<% end %>
|
||||||
<h4 class="muted">Group Description</h4>
|
<h4 class="muted">Group Description</h4>
|
||||||
<p class="group-page-description"><%= @group.description %></p>
|
<p class="group-post-description"><%= @group.description %></p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<%= render :partial => "post", :collection => @group.group_posts.desc(:created_at) %>
|
<%= render :partial => "post", :collection => @group.group_posts.desc(:created_at) %>
|
||||||
|
|
|
||||||
|
|
@ -1,26 +1,27 @@
|
||||||
<% content_for :page_specific_css do -%>
|
<% content_for :page_specific_css do -%>
|
||||||
<%= stylesheet_link_tag "group_show" %>
|
<%= stylesheet_link_tag "lib/group/group-main" %>
|
||||||
<%= stylesheet_link_tag "//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" %>
|
<%= stylesheet_link_tag "//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" %>
|
||||||
|
<%= stylesheet_link_tag "//cdnjs.cloudflare.com/ajax/libs/animate.css/3.2.6/animate.min.css" %>
|
||||||
<% end -%>
|
<% end -%>
|
||||||
<% content_for :page_specific_javascript do -%>
|
<% content_for :page_specific_javascript do -%>
|
||||||
<%= javascript_include_tag "//cdnjs.cloudflare.com/ajax/libs/jquery.cycle2/20140415/jquery.cycle2.min.js" %>
|
<%= javascript_include_tag "//cdnjs.cloudflare.com/ajax/libs/jquery.cycle2/20140415/jquery.cycle2.min.js" %>
|
||||||
<%= javascript_include_tag "group" %>
|
|
||||||
<%= javascript_include_tag "lib/jquery.form" %>
|
<%= javascript_include_tag "lib/jquery.form" %>
|
||||||
<%= javascript_include_tag "//cdnjs.cloudflare.com/ajax/libs/jquery.cycle2/20140415/jquery.cycle2.center.min.js" %>
|
<%= javascript_include_tag "//cdnjs.cloudflare.com/ajax/libs/jquery.cycle2/20140415/jquery.cycle2.center.min.js" %>
|
||||||
|
<%= javascript_include_tag "//cdnjs.cloudflare.com/ajax/libs/wow/1.1.2/wow.min.js" %>
|
||||||
<%= javascript_include_tag "group.js" %>
|
<%= javascript_include_tag "group.js" %>
|
||||||
<% end -%>
|
<% end -%>
|
||||||
|
|
||||||
<article class="group-post">
|
<article class="group-show-post wrapper">
|
||||||
<ul class="group-page-pagenation breadcrumb">
|
<ul class="group-page-pagenation breadcrumb">
|
||||||
<li><a href="<%= admin_groups_path %>">My Groups</a> <span class="divider">/</span></li>
|
<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><a href="<%= admin_group_path(@group) %>"><%= @group.title %></a> <span class="divider">/</span></li>
|
||||||
<li class="active"><%= @post.title %></li>
|
<li class="active"><%= @post.title %></li>
|
||||||
</ul>
|
</ul>
|
||||||
<header class="group-post-meta">
|
<header class="group-show-post-meta">
|
||||||
<div class="group-post-heading-wrap clearfix">
|
<div class="group-show-post-heading-wrap clearfix">
|
||||||
<h2 class="group-post-title"><%= @post.title %></h2>
|
<h2 class="group-show-post-title"><%= @post.title %></h2>
|
||||||
<div class="group-post-avatar-wrap">
|
<div class="group-show-post-avatar-wrap">
|
||||||
<a class="group-post-avatar-username-toggle tool-tip-parent" href="#">
|
<a class="group-show-post-avatar-username-toggle tool-tip-parent" href="#">
|
||||||
<%
|
<%
|
||||||
user = User.find(@post.author) rescue nil
|
user = User.find(@post.author) rescue nil
|
||||||
if !user.nil?
|
if !user.nil?
|
||||||
|
|
@ -28,90 +29,90 @@
|
||||||
avatar = (!user.member_profile.avatar.nil? ? user.member_profile.avatar.thumb.url : "/assets/member-pic.png" rescue "/assets/member-pic.png")
|
avatar = (!user.member_profile.avatar.nil? ? user.member_profile.avatar.thumb.url : "/assets/member-pic.png" rescue "/assets/member-pic.png")
|
||||||
end
|
end
|
||||||
%>
|
%>
|
||||||
<img class="group-post-avatar" src="<%= avatar %>" alt="">
|
<img class="group-show-post-avatar" src="<%= avatar %>" alt="">
|
||||||
<span class="group-post-username tool-tip"><%= author %></span>
|
<span class="group-show-post-username tool-tip"><%= author %></span>
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="group-post-sub-wrap">
|
<div class="group-show-post-sub-wrap">
|
||||||
<span class="group-post-postdate">
|
<span class="group-show-post-postdate">
|
||||||
<% date = DateTime.parse(@post.created_at.to_s).strftime("%d %B %H:%M ") %>
|
<% date = DateTime.parse(@post.created_at.to_s).strftime("%d %B %H:%M ") %>
|
||||||
<i class="group-post-postdate-icon icon-time"></i> <%= date %>
|
<i class="group-show-post-postdate-icon icon-time"></i> <%= date %>
|
||||||
</span>
|
</span>
|
||||||
<!-- <span class="group-post-time">10:25</span> -->
|
<!-- <span class="group-show-post-time">10:25</span> -->
|
||||||
</div>
|
</div>
|
||||||
</header>
|
</header>
|
||||||
<section class="group-post-image-wrap">
|
<section class="group-show-post-image-wrap">
|
||||||
<ul class="group-post-image-list cycle-slideshow"
|
<ul class="group-show-post-image-list cycle-slideshow"
|
||||||
data-cycle-slides="li"
|
data-cycle-slides="li"
|
||||||
data-cycle-prev=".group-post-cycle-prev"
|
data-cycle-prev=".group-show-post-cycle-prev"
|
||||||
data-cycle-next=".group-post-cycle-next"
|
data-cycle-next=".group-show-post-cycle-next"
|
||||||
data-cycle-fx="fade"
|
data-cycle-fx="fade"
|
||||||
data-cycle-log="false"
|
data-cycle-log="false"
|
||||||
data-cycle-center-horz=true
|
data-cycle-center-horz=true
|
||||||
data-cycle-center-vert=true
|
data-cycle-center-vert=true
|
||||||
>
|
>
|
||||||
<% @post.group_post_images.each do |gpi| %>
|
<% @post.group_post_images.each do |gpi| %>
|
||||||
<li class="group-post-image-item"><img class="group-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 %>
|
<% end %>
|
||||||
</ul>
|
</ul>
|
||||||
<div class="group-post-cycle-prev cycle-nav"><i class="group-post-cycle-nav-icon icon-chevron-left"></i></div>
|
<div class="group-show-post-cycle-prev cycle-nav"><i class="group-show-post-cycle-nav-icon icon-chevron-left"></i></div>
|
||||||
<div class="group-post-cycle-next cycle-nav"><i class="group-post-cycle-nav-icon icon-chevron-right"></i></div>
|
<div class="group-show-post-cycle-next cycle-nav"><i class="group-show-post-cycle-nav-icon icon-chevron-right"></i></div>
|
||||||
</section>
|
</section>
|
||||||
<section class="group-post-content">
|
<section class="group-show-post-content">
|
||||||
<%= @post.content.html_safe %>
|
<%= @post.content.html_safe %>
|
||||||
</section>
|
</section>
|
||||||
<div class="group-post-attachment-wrap">
|
<div class="group-show-post-attachment-wrap">
|
||||||
<% if !@post.group_post_files.blank? %>
|
<% if !@post.group_post_files.blank? %>
|
||||||
<span class="group-post-attachments">
|
<span class="group-show-post-attachments">
|
||||||
<% @post.group_post_files.each do |gpf| %>
|
<% @post.group_post_files.each do |gpf| %>
|
||||||
<a href="/admin/posts/file/<%= gpf.id.to_s %>" class="button button-default"><i class="group-post-attachment-file-format fa fa-file-image-o"></i><span class="group-post-attachments-file-name"><%= File.basename(gpf.file.path) %></span></a>
|
<a href="/admin/posts/file/<%= gpf.id.to_s %>" class="button button-primary button-small"><i class="group-show-post-attachment-file-format fa fa-file-image-o"></i><span class="group-show-post-attachments-file-name"><%= File.basename(gpf.file.path) %></span></a>
|
||||||
<% end %>
|
<% end %>
|
||||||
</span>
|
</span>
|
||||||
<% end %>
|
<% end %>
|
||||||
</div>
|
</div>
|
||||||
<% if !@read_by_names.blank? %>
|
<% if !@read_by_names.blank? %>
|
||||||
<div class="group-post-seen-by tool-tip-parent">
|
<div class="group-show-post-seen-by tool-tip-parent">
|
||||||
<i class="fa fa-eye"></i>
|
<i class="fa fa-eye"></i>
|
||||||
<em class="group-post-seen-by-lead">Seen by: <span class="group-post-seen-by-count"><%= @read_by_names.count %></span></em>
|
<em class="group-show-post-seen-by-lead">Seen by: <span class="group-show-post-seen-by-count"><%= @read_by_names.count %></span></em>
|
||||||
<div class="gorup-post-seen-by-names tool-tip right">
|
<div class="gorup-post-seen-by-names tool-tip right">
|
||||||
<% @read_by_names.each do |name| %>
|
<% @read_by_names.each do |name| %>
|
||||||
<span class="group-post-seen-by-name"><%= name %></span>
|
<span class="group-show-post-seen-by-name"><%= name %></span>
|
||||||
<% end %>
|
<% end %>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<% end %>
|
<% end %>
|
||||||
<section class="comments">
|
<section class="comments">
|
||||||
<% if user_can_write? %>
|
<% if user_can_write? %>
|
||||||
<div class="group-post-respond">
|
<div class="group-show-post-respond">
|
||||||
<form action="/admin/posts/comment" method="post" id="comment-form" >
|
<form action="/admin/posts/comment" method="post" id="comment-form" >
|
||||||
<h3 class="group-post-respond-title">
|
<h3 class="group-show-post-respond-title">
|
||||||
Leave a comment
|
Leave a comment
|
||||||
</h3>
|
</h3>
|
||||||
<div class="group-post-respond-wrap">
|
<div class="group-show-post-respond-wrap">
|
||||||
<label for="comment" class="screen-reader">Comment</label>
|
<label for="comment" class="screen-reader">Comment</label>
|
||||||
<input type="text" name="group_post_comment[comment]" id="group_post_comment" class="group-post-respond-comment" placeholder="Your comment here.">
|
<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[group_post_id]" value="<%= @post.id.to_s %>" />
|
||||||
<input type="hidden" name="group_post_comment[user_id]" value="<%= current_user.id.to_s %>" />
|
<input type="hidden" name="group_post_comment[user_id]" value="<%= current_user.id.to_s %>" />
|
||||||
</div>
|
</div>
|
||||||
<div class="group-post-submit-wrap">
|
<div class="group-show-post-submit-wrap">
|
||||||
<input type="submit" name="submit" class="group-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" id="submit" value="Submit Comment">
|
||||||
</div>
|
</div>
|
||||||
</form>
|
</form>
|
||||||
</div>
|
</div>
|
||||||
<% else %>
|
<% else %>
|
||||||
<div class="grou-post-respond">
|
<div class="group-show-post-respond wow bounceInLeft">
|
||||||
<h4 style="text-align:center;">Join the group to comment on this post.</h4>
|
<h4 class="group-no-permission"><i class="fa fa-exclamation-triangle"></i>Join the group to comment on this post.</h4>
|
||||||
</div>
|
</div>
|
||||||
<% end %>
|
<% end %>
|
||||||
<h3 class="group-post-comment-title">
|
<h3 class="group-show-post-comment-title bounceIn">
|
||||||
Comments
|
Comments
|
||||||
</h3>
|
</h3>
|
||||||
<ol class="group-post-comment-list" id="group-post-comment-list" >
|
<ol class="group-show-post-comment-list" id="group-show-post-comment-list" >
|
||||||
<%= render :partial => "post_comment", :collection => @post.group_post_comments.desc(:created_at) %>
|
<%= render :partial => "post_comment", :collection => @post.group_post_comments.desc(:created_at) %>
|
||||||
<% if @post.group_post_comments.length == 0 %>
|
<% if @post.group_post_comments.length == 0 %>
|
||||||
<li id="no-comments-li" class="group-post-no-comment"> No comments yet. <%= (user_can_write? ? "Be the first one!" : "") %> </li>
|
<li id="no-comments-li" class="group-show-post-no-comment"> No comments yet. <%= (user_can_write? ? "Be the first one!" : "") %> </li>
|
||||||
<% end %>
|
<% end %>
|
||||||
</ol>
|
</ol>
|
||||||
</section>
|
</section>
|
||||||
|
|
@ -126,7 +127,7 @@
|
||||||
},
|
},
|
||||||
success : function(comments){
|
success : function(comments){
|
||||||
$("li#no-comments-li").remove();
|
$("li#no-comments-li").remove();
|
||||||
$("ol#group-post-comment-list").prepend(comments);
|
$("ol#group-show-post-comment-list").prepend(comments);
|
||||||
$("#comment-form").resetForm();
|
$("#comment-form").resetForm();
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
|
||||||
|
|
@ -51,7 +51,7 @@
|
||||||
<ul class="orbit-bar-menu">
|
<ul class="orbit-bar-menu">
|
||||||
<li>
|
<li>
|
||||||
<span class="orbit-bar-logo">
|
<span class="orbit-bar-logo">
|
||||||
<img src="<%= current_site.default_image.url.nil? ? '/assets/orbit-logo.png' : current_site.default_image.url %>" />
|
<img src="<%= current_site.default_image.url.nil? ? '/assets/orbit-logo.png' : current_site.default_image.url %>" alt="Orbit Bar Logo" />
|
||||||
</span>
|
</span>
|
||||||
<% if !current_user.nil? %>
|
<% if !current_user.nil? %>
|
||||||
<ul>
|
<ul>
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue