forked from saurabh/orbit4-5
joshua commit for groups, sdk and orbit_bar
This commit is contained in:
rulingcom
parent
3772e350ba
commit
017be3eb3d
|
|
@ -7,47 +7,110 @@
|
|||
var group = {
|
||||
// Detect and change the top position of the cycle navs
|
||||
cycleFix: function() {
|
||||
if( doc.querySelectorAll( ".group-post-banner-image").length >= 1 ) {
|
||||
var imgs = doc.querySelectorAll( ".group-post-banner-image" ),
|
||||
cycleNav = doc.querySelectorAll( ".cycle-nav" ),
|
||||
len = cycleNav.length,
|
||||
i = -1;
|
||||
if (doc.querySelectorAll(".group-show-post-banner-image").length >= 1) {
|
||||
var imgs = doc.querySelectorAll(".group-post-banner-image"),
|
||||
cycleNav = doc.querySelectorAll(".cycle-nav"),
|
||||
len = cycleNav.length,
|
||||
i = -1;
|
||||
|
||||
// Hide the navs when there's noly one slide
|
||||
if( imgs.length <= 1 ) {
|
||||
for( i = 0; i < len; i++ ) {
|
||||
cycleNav[ i ].classList.add( "hide" );
|
||||
}
|
||||
}
|
||||
|
||||
} else if ( doc.querySelectorAll( ".group-post-banner-image").length === 0 && doc.querySelector( ".group-post-image-wrap" ) ) {
|
||||
doc.querySelector( ".group-post-image-wrap").classList.add( "hide" );
|
||||
}
|
||||
|
||||
// Hide the navs when there's noly one slide
|
||||
if (imgs.length <= 1) {
|
||||
for (i = 0; i < len; i++) {
|
||||
cycleNav[i].classList.add("hide");
|
||||
}
|
||||
}
|
||||
|
||||
} else if (doc.querySelectorAll(".group-show-post-banner-image").length === 0 && doc.querySelector(".group-show-post-image-wrap")) {
|
||||
doc.querySelector(".group-show-post-image-wrap").classList.add("hide");
|
||||
}
|
||||
},
|
||||
// Create scroll effect (with css)
|
||||
scrollEffect: function() {
|
||||
if( doc.querySelector( ".group-page") ) {
|
||||
var page = doc.querySelector( ".group-page" ),
|
||||
wrap = doc.querySelector( ".group-page-banner-image-wrap" ),
|
||||
scrollClass = "scroll";
|
||||
if (doc.querySelector(".group-post")) {
|
||||
var post = doc.querySelector(".group-post"),
|
||||
wrap = doc.querySelector(".group-post-banner-image-wrap"),
|
||||
scrollClass = "scroll";
|
||||
|
||||
// Use pageYOffset to get the Y positoin and add scroll on it, the animation
|
||||
// is done by css transition
|
||||
window.addEventListener( "scroll", function() {
|
||||
if( window.pageYOffset !== 0 ) {
|
||||
page.classList.add( scrollClass );
|
||||
} else {
|
||||
page.classList.remove( scrollClass );
|
||||
}
|
||||
}, false);
|
||||
}
|
||||
// Use pageYOffset to get the Y positoin and add scroll on it, the animation
|
||||
// is done by css transition
|
||||
window.addEventListener("scroll", function() {
|
||||
if (window.pageYOffset > 0) {
|
||||
post.classList.add(scrollClass);
|
||||
} else {
|
||||
post.classList.remove(scrollClass);
|
||||
}
|
||||
}, false);
|
||||
}
|
||||
},
|
||||
// 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
|
||||
document.addEventListener( "DOMContentLoaded", function( event ) {
|
||||
group.cycleFix();
|
||||
group.scrollEffect();
|
||||
document.addEventListener("DOMContentLoaded", function(event) {
|
||||
|
||||
if (doc.querySelector('.group-post')) {
|
||||
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";
|
||||
|
||||
@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;
|
||||
@import "group-variables";
|
||||
@import "group-classes";
|
||||
@import "group-reset";
|
||||
|
||||
// General style
|
||||
body {
|
||||
|
|
@ -33,6 +10,18 @@ body {
|
|||
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
|
||||
.main-forms fieldset .input-area .controls textarea {
|
||||
max-width: none;
|
||||
|
|
@ -44,8 +33,13 @@ body {
|
|||
margin-right: 0.9375rem;
|
||||
min-width: 200px;
|
||||
.select2-choices {
|
||||
padding: 8px 0.5rem 6px;
|
||||
padding: 0;
|
||||
border-radius: $general;
|
||||
.select2-search-field {
|
||||
input {
|
||||
padding: 10px 5px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.select2-search-choice {
|
||||
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,146 +1,167 @@
|
|||
(function( $ ) {
|
||||
(function($) {
|
||||
|
||||
"use strict";
|
||||
'use strict';
|
||||
|
||||
function init() {
|
||||
var doc = document,
|
||||
lang = doc.documentElement.lang,
|
||||
pageModule = doc.body.getAttribute( "data-module" );
|
||||
function init() {
|
||||
var doc = document,
|
||||
lang = doc.documentElement.lang,
|
||||
pageModule = doc.body.getAttribute('data-module');
|
||||
|
||||
var orbit = {
|
||||
var orbit = {
|
||||
|
||||
helpers : {
|
||||
// Cross-browser class manipulation
|
||||
addClass: function( el, className ) {
|
||||
if ( el.classList ) {
|
||||
el.classList.add( className );
|
||||
} else {
|
||||
el.className += " " + className;
|
||||
}
|
||||
},
|
||||
hasClass: function( el, cls ) {
|
||||
return ( " " + el.className + " " ).indexOf( " " + cls + " " ) > -1;
|
||||
}
|
||||
},
|
||||
|
||||
plugins : {
|
||||
// RWD image resize script
|
||||
bullEye: function() {
|
||||
$( ".bullseye" ).bullseye({
|
||||
fadeEffect: false
|
||||
});
|
||||
}
|
||||
},
|
||||
|
||||
nav : {
|
||||
// Add class name to the menu item when its child items are more than 8 items
|
||||
addMegaDropdownClass: function( els, len, className ) {
|
||||
var els = doc.querySelectorAll( els ),
|
||||
elsLen = els.length,
|
||||
i = -1;
|
||||
|
||||
if( elsLen > 1 ) {
|
||||
for ( i = 0; i < elsLen; i++ ) {
|
||||
if ( els[ i ].children.length > len ) {
|
||||
this.helpers.addClass( els[ i ].parentNode, className || "mega-dropdown" );
|
||||
helpers: {
|
||||
// Cross-browser class manipulation
|
||||
addClass: function(el, className) {
|
||||
if (el.classList) {
|
||||
el.classList.add(className);
|
||||
} else {
|
||||
el.className += ' ' + className;
|
||||
}
|
||||
},
|
||||
hasClass: function(el, cls) {
|
||||
return (' ' + el.className + ' ').indexOf(' ' + cls + ' ') > -1;
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
// Append caret to menu item if it has dropdown
|
||||
addCaret: function() {
|
||||
var els = doc.querySelectorAll( ".page_menu.level_2" ),
|
||||
len = els.length,
|
||||
i = -1;
|
||||
},
|
||||
|
||||
for ( i = 0; i < len; i++ ) {
|
||||
var node = doc.createElement( "span" );
|
||||
node.className = "caret";
|
||||
els[ i ].parentNode.appendChild( node );
|
||||
}
|
||||
}
|
||||
},
|
||||
plugins: {
|
||||
// RWD image resize script
|
||||
bullEye: function() {
|
||||
$('.bullseye').bullseye({
|
||||
fadeEffect: false
|
||||
});
|
||||
}
|
||||
},
|
||||
|
||||
announcement: {
|
||||
// Announcement text truncation
|
||||
truncateAnnouncement: function( els, maxLen ) {
|
||||
var els = doc.querySelectorAll( els ),
|
||||
newTitle = "";
|
||||
i = -1,
|
||||
elsLen = els.length;
|
||||
nav: {
|
||||
// Add class name to the menu item when its child items are more than 8 items
|
||||
addMegaDropdownClass: function(els, len, className) {
|
||||
var els = doc.querySelectorAll(els),
|
||||
elsLen = els.length,
|
||||
i = -1;
|
||||
|
||||
for ( i = 0; i < elsLen; i ++ ) {
|
||||
if ( els[ i ].firstChild !== null ) {
|
||||
if( els[ i ].firstChild.length > maxLen ) {
|
||||
newTitle = els[ i ].firstChild.textContent;
|
||||
els[ i ].textContent = newTitle.substring( 0, maxLen ) + "...";
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
member: {
|
||||
equalHeight: function() {
|
||||
var bigbrother = -1;
|
||||
|
||||
$( ".i-member-item" ).each( function() {
|
||||
bigbrother = bigbrother > $( ".i-member-item" ).height() ? bigbrother : $( ".i-member-item" ).height();
|
||||
});
|
||||
|
||||
$( ".i-member-item" ).each( function() {
|
||||
$( ".i-member-item" ).height( bigbrother );
|
||||
});
|
||||
}
|
||||
},
|
||||
|
||||
// Add link and cursor class name on element that has data-link attribute
|
||||
addLinkOnADBanner: function( els ) {
|
||||
$.each( els, function() {
|
||||
if ( $( this ).data( "link" ) !== "" && !$( this ).hasClass( "youtube" ) ) {
|
||||
$( this ).on( "click", function() {
|
||||
var target = $( this ).data( "target" ),
|
||||
link = $( this ).data( "link" );
|
||||
if ( target === "_blank" ) {
|
||||
window.open( link, target );
|
||||
} else {
|
||||
window.location.href = link;
|
||||
if (elsLen > 1) {
|
||||
for (i = 0; i < elsLen; i++) {
|
||||
if (els[i].children.length > len) {
|
||||
this.helpers.addClass(els[i].parentNode, className || 'mega-dropdown');
|
||||
}
|
||||
}
|
||||
}).addClass( "cursor" );
|
||||
}
|
||||
},
|
||||
// Append caret to menu item if it has dropdown
|
||||
addCaret: function() {
|
||||
var els = doc.querySelectorAll('.page_menu.level_2'),
|
||||
len = els.length,
|
||||
i = -1;
|
||||
|
||||
for (i = 0; i < len; i++) {
|
||||
var node = doc.createElement('span');
|
||||
node.className = 'caret';
|
||||
els[i].parentNode.appendChild(node);
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
// Sitemenu dropdown
|
||||
sitemenuDropdown: function( els ) {
|
||||
var els = doc.querySelectorAll(".sitemenu__list.level-2"),
|
||||
len = els.length,
|
||||
i = -1;
|
||||
for ( i = 0; i < len; i++ ) {
|
||||
if ( els[ i ].children.length ) {
|
||||
var caret = doc.createElement( "span" );
|
||||
caret.className = "sitemenu___dropdown-toggle fa fa-caret-down";
|
||||
caret.setAttribute( "data-toggle", "dropdown" );
|
||||
},
|
||||
|
||||
els[ i ].parentNode.insertBefore( caret, els[ i ] );
|
||||
this.helpers.addClass( els[ i ], "dropdown-menu" );
|
||||
announcement: {
|
||||
// Announcement text truncation
|
||||
truncateAnnouncement: function(els, maxLen) {
|
||||
var els = doc.querySelectorAll(els),
|
||||
newTitle = '';
|
||||
i = -1,
|
||||
elsLen = els.length;
|
||||
|
||||
for (i = 0; i < elsLen; i++) {
|
||||
if (els[i].firstChild !== null) {
|
||||
if (els[i].firstChild.length > maxLen) {
|
||||
newTitle = els[i].firstChild.textContent;
|
||||
els[i].textContent = newTitle.substring(0, maxLen) + '...';
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
member: {
|
||||
equalHeight: function() {
|
||||
var bigbrother = -1;
|
||||
$('.i-member-item').each(function() {
|
||||
bigbrother = bigbrother > $('.i-member-item').height() ? bigbrother : $('.i-member-item').height();
|
||||
});
|
||||
|
||||
$('.i-member-item').each(function() {
|
||||
$('.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
|
||||
addLinkOnADBanner: function(els) {
|
||||
$.each(els, function() {
|
||||
if ($(this).data('link') !== '' && !$(this).hasClass('youtube')) {
|
||||
$(this).on('click', function() {
|
||||
var target = $(this).data('target'),
|
||||
link = $(this).data('link');
|
||||
if (target === '_blank') {
|
||||
window.open(link, target);
|
||||
} else {
|
||||
window.location.href = link;
|
||||
}
|
||||
}).addClass('cursor');
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
// Sitemenu dropdown
|
||||
sitemenuDropdown: function(els) {
|
||||
var els = doc.querySelectorAll('.sitemenu-list.level-2'),
|
||||
len = els.length,
|
||||
i = -1;
|
||||
for (i = 0; i < len; i++) {
|
||||
if (els[i].children.length) {
|
||||
var caret = doc.createElement('span');
|
||||
caret.className = 'sitemenu-dropdown-toggle fa fa-caret-down';
|
||||
caret.setAttribute('data-toggle', 'dropdown');
|
||||
|
||||
els[i].parentNode.insertBefore(caret, els[i]);
|
||||
this.helpers.addClass(els[i], 'dropdown-menu');
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
};
|
||||
// Specific functions that will be running on homepage
|
||||
if (pageModule === 'home') {
|
||||
|
||||
|
||||
}
|
||||
if (pageModule === 'member') {
|
||||
orbit.member.removeEmptyRow();
|
||||
}
|
||||
};
|
||||
|
||||
// Specific functions that will be running on homepage
|
||||
if ( pageModule === "home" ) {
|
||||
|
||||
// Functions that will be running on every page
|
||||
orbit.sitemenuDropdown();
|
||||
orbit.plugins.bullEye();
|
||||
}
|
||||
|
||||
// Functions that will be running on every page
|
||||
orbit.sitemenuDropdown();
|
||||
orbit.plugins.bullEye();
|
||||
}
|
||||
// Run the init function when DOM is ready
|
||||
$(document).ready(function() {
|
||||
init();
|
||||
});
|
||||
|
||||
$( document ).ready(function() {
|
||||
init();
|
||||
});
|
||||
|
||||
}( jQuery ));
|
||||
}(jQuery));
|
||||
|
|
|
|||
|
|
@ -34,4 +34,21 @@ td {
|
|||
.borderless>thead>tr>td,
|
||||
.borderless>thead>tr>th {
|
||||
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;
|
||||
line-height: 1.5;
|
||||
font-family: $main-font;
|
||||
font-size: 1.5rem;
|
||||
.layout-footer & {
|
||||
margin-bottom: 10px;
|
||||
border-bottom: none;
|
||||
|
|
|
|||
|
|
@ -1,124 +1,144 @@
|
|||
@charset "utf-8";
|
||||
@import "../initial";
|
||||
@charset 'utf-8';
|
||||
|
||||
@import '../initial';
|
||||
|
||||
// Gallery MODULES
|
||||
.widget-gallery {
|
||||
.widget-title {
|
||||
@extend .unity-title;
|
||||
}
|
||||
.widget-content {
|
||||
position: relative;
|
||||
}
|
||||
&.widget1 {
|
||||
.widget-content {
|
||||
overflow: hidden;
|
||||
.widget-pic {
|
||||
display: inline-block;
|
||||
padding: 1px;
|
||||
text-align: center;
|
||||
@include size(33.3333%, auto);
|
||||
img {
|
||||
@include size(100%, 100%);
|
||||
}
|
||||
}
|
||||
.widget-title {
|
||||
@extend .unity-title;
|
||||
}
|
||||
}
|
||||
&.widget2 {
|
||||
|
||||
.widget-content {
|
||||
margin-left: -5px;
|
||||
margin-right: -5px;
|
||||
.widget-pic {
|
||||
margin-bottom: 10px;
|
||||
padding-left: 5px;
|
||||
padding-right: 5px;
|
||||
img {
|
||||
@include size(100%, auto);
|
||||
}
|
||||
}
|
||||
position: relative;
|
||||
}
|
||||
|
||||
&.widget1 {
|
||||
.widget-content {
|
||||
overflow: hidden;
|
||||
|
||||
.widget-pic {
|
||||
display: inline-block;
|
||||
padding: 1px;
|
||||
text-align: center;
|
||||
@include size(33.3333%, auto);
|
||||
|
||||
img {
|
||||
@include size(100%, 100%);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.widget2 {
|
||||
.widget-content {
|
||||
margin-left: -5px;
|
||||
margin-right: -5px;
|
||||
|
||||
.widget-pic {
|
||||
margin-bottom: 10px;
|
||||
padding-left: 5px;
|
||||
padding-right: 5px;
|
||||
|
||||
img {
|
||||
@include size(100%, auto);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.index-gallery {
|
||||
.index-title {
|
||||
@extend .unity-title;
|
||||
}
|
||||
&.index1 {
|
||||
.index-content {
|
||||
.index-content-inner {
|
||||
position: relative;
|
||||
}
|
||||
.index-part {
|
||||
position: absolute;
|
||||
top: 4px;
|
||||
right: 4px;
|
||||
bottom: 4px;
|
||||
left: 4px;
|
||||
overflow: hidden;
|
||||
background-color: rgba($theme-color-main, 0.8);
|
||||
@include transition(all 0.5s ease);
|
||||
@include opacity(0);
|
||||
.index-content-title {
|
||||
@include transition(all 0.3s ease);
|
||||
@include transition-delay(0.1s);
|
||||
@include scale(0);
|
||||
}
|
||||
&:hover {
|
||||
@include opacity(1);
|
||||
.index-content-title {
|
||||
@include scale(1);
|
||||
}
|
||||
}
|
||||
}
|
||||
.index-content-title {
|
||||
display: table;
|
||||
margin: 0;
|
||||
@include size(100%, 100%);
|
||||
a {
|
||||
display: table-cell;
|
||||
color: #FFF;
|
||||
text-decoration: none;
|
||||
text-align: center;
|
||||
vertical-align: middle;
|
||||
}
|
||||
}
|
||||
.index-title {
|
||||
@extend .unity-title;
|
||||
}
|
||||
|
||||
&.index1 {
|
||||
.index-content {
|
||||
.index-content-inner {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.index-part {
|
||||
position: absolute;
|
||||
top: 4px;
|
||||
right: 4px;
|
||||
bottom: 4px;
|
||||
left: 4px;
|
||||
overflow: hidden;
|
||||
background-color: rgba($theme-color-main, 0.8);
|
||||
@include transition(all 0.5s ease);
|
||||
@include opacity(0);
|
||||
|
||||
.index-content-title {
|
||||
@include transition(all 0.3s ease);
|
||||
@include transition-delay(0.1s);
|
||||
@include scale(0);
|
||||
}
|
||||
|
||||
&:hover {
|
||||
@include opacity(1);
|
||||
|
||||
.index-content-title {
|
||||
@include scale(1);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.index-content-title {
|
||||
display: table;
|
||||
margin: 0;
|
||||
@include size(100%, 100%);
|
||||
|
||||
a {
|
||||
display: table-cell;
|
||||
color: #FFF;
|
||||
text-decoration: none;
|
||||
text-align: center;
|
||||
vertical-align: middle;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.show-gallery {
|
||||
.show-title {
|
||||
@extend .unity-title;
|
||||
}
|
||||
.show-content {
|
||||
padding-right: 0;
|
||||
padding-left: 0;
|
||||
.img {
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
height: auto;
|
||||
opacity: (0.8);
|
||||
-webkit-filter: grayscale(100%) brightness(1.2);
|
||||
-moz-filter: grayscale(100%) brightness(1.2);
|
||||
filter: grayscale(100%) brightness(1.2);
|
||||
@include transition(all 0.2s ease);
|
||||
.show-title {
|
||||
@extend .unity-title;
|
||||
}
|
||||
.show-content-inner {
|
||||
position: relative;
|
||||
padding: 2px;
|
||||
z-index: 0;
|
||||
@include scale(1);
|
||||
@include transition(all 0.2s ease);
|
||||
&:hover {
|
||||
z-index: 1;
|
||||
@include scale(1.1);
|
||||
|
||||
.show-content {
|
||||
padding-right: 0;
|
||||
padding-left: 0;
|
||||
|
||||
.img {
|
||||
opacity: (1);
|
||||
-webkit-filter: grayscale(0%) brightness(1);
|
||||
-moz-filter: grayscale(0%) brightness(1);
|
||||
filter: grayscale(0%) brightness(1);
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
height: auto;
|
||||
opacity: 0.8;
|
||||
-webkit-filter: grayscale(100%) brightness(1.2);
|
||||
-moz-filter: grayscale(100%) brightness(1.2);
|
||||
filter: grayscale(100%) brightness(1.2);
|
||||
@include transition(all 0.2s ease);
|
||||
}
|
||||
|
||||
.show-content-inner {
|
||||
position: relative;
|
||||
padding: 2px;
|
||||
z-index: 0;
|
||||
@include scale(1);
|
||||
@include transition(all 0.2s ease);
|
||||
|
||||
&:hover {
|
||||
z-index: 1;
|
||||
@include scale(1.1);
|
||||
|
||||
.img {
|
||||
opacity: 1;
|
||||
-webkit-filter: grayscale(0%) brightness(1);
|
||||
-moz-filter: grayscale(0%) brightness(1);
|
||||
filter: grayscale(0%) brightness(1);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -7,6 +7,20 @@
|
|||
//
|
||||
// Member 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-member-2 {
|
||||
.i-member-section {
|
||||
|
|
@ -118,7 +132,7 @@
|
|||
font-size: .8125rem;
|
||||
}
|
||||
.member-plugins {
|
||||
margin-bottom: 20px;
|
||||
margin: 20px 0;
|
||||
a {
|
||||
font-size: .8125rem;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -4,15 +4,15 @@
|
|||
.sitemenu-wrap {
|
||||
padding: 10px 0;
|
||||
@include clearfix;
|
||||
.sitemenu__title {
|
||||
.sitemenu-title {
|
||||
display: none;
|
||||
}
|
||||
.sitemenu__list {
|
||||
.sitemenu-list {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
}
|
||||
.sitemenu__item.level-1 {
|
||||
.sitemenu-item.level-1 {
|
||||
font-size: 0.8125rem;
|
||||
position: relative;
|
||||
float: left;
|
||||
|
|
@ -27,24 +27,24 @@
|
|||
background: darken($theme-color-second, 10%);
|
||||
}
|
||||
}
|
||||
.sitemenu__link.level-1 {
|
||||
.sitemenu-link.level-1 {
|
||||
margin-right: .25rem;
|
||||
color: #fff;
|
||||
}
|
||||
.sitemenu___dropdown-toggle {
|
||||
.sitemenu-dropdown-toggle {
|
||||
font-size: 0.75rem;
|
||||
padding: 2px .3125rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
// sitemenu dropdown
|
||||
.sitemenu__list.dropdown-menu {
|
||||
.sitemenu-list.dropdown-menu {
|
||||
min-width: 100%;
|
||||
margin-top: 4px;
|
||||
border: none;
|
||||
border-radius: .2em;
|
||||
background: $theme-color-main;
|
||||
}
|
||||
.sitemenu__link.level-2 {
|
||||
.sitemenu-link.level-2 {
|
||||
color: #fff;
|
||||
font-size: 0.8125rem;
|
||||
padding: 4px 0.625rem;
|
||||
|
|
|
|||
|
|
@ -21,7 +21,7 @@
|
|||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
</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 class="collapse navbar-collapse modules-menu" id="layout-navigation">
|
||||
<%= render_menu %>
|
||||
|
|
|
|||
|
|
@ -1,27 +1,24 @@
|
|||
<table class="table table-hover table-striped active-index">
|
||||
<caption>
|
||||
<h3>{{page-title}}</h3>
|
||||
</caption>
|
||||
<thead>
|
||||
<tr>
|
||||
<th class="col-md-2">{{th_category}}</th>
|
||||
<th class="col-md-2">{{th_act_time_range}}</th>
|
||||
<th class="col-md-5">{{th_title}}</th>
|
||||
<th class="col-md-2">{{th_sign_up_time_range}}</th>
|
||||
<th class="col-md-2">{{th_sign_up}}</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody data-level="0" data-list="acts">
|
||||
<tr>
|
||||
<td>{{category}}</td>
|
||||
<td>{{act_start_date}} ~
|
||||
<br /> {{act_end_date}}</td>
|
||||
<td>{{title}}</td>
|
||||
<td>{{sign_start_date}} ~
|
||||
<br /> {{sign_end_date}}</td>
|
||||
<td>{{sign_up}}</i>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<caption>
|
||||
<h3>{{page-title}}</h3>
|
||||
</caption>
|
||||
<thead>
|
||||
<tr>
|
||||
<th class="col-md-2">{{th_category}}</th>
|
||||
<th class="col-md-2">{{th_act_time_range}}</th>
|
||||
<th class="col-md-5">{{th_title}}</th>
|
||||
<th class="col-md-2">{{th_sign_up_time_range}}</th>
|
||||
<th class="col-md-2">{{th_sign_up}}</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody data-level="0" data-list="acts">
|
||||
<tr>
|
||||
<td>{{category}}</td>
|
||||
<td>{{act_start_date}} ~ <br /> {{act_end_date}}</td>
|
||||
<td>{{title}}</td>
|
||||
<td>{{sign_start_date}} ~ <br /> {{sign_end_date}}</td>
|
||||
<td>{{sign_up}}</i></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
{{pagination_goes_here}}
|
||||
{{pagination_goes_here}}
|
||||
|
|
@ -14,8 +14,9 @@
|
|||
data-cycle-title="{{title}}"
|
||||
data-cycle-desc="{{context}}"
|
||||
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 class="w-ad-banner__caption"></div>
|
||||
|
|
|
|||
|
|
@ -13,8 +13,9 @@
|
|||
data-cycle-title="{{title}}"
|
||||
data-cycle-desc="{{context}}"
|
||||
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>
|
||||
<ul class="w-ad-banner__pager-3 banner-pager"></ul>
|
||||
|
|
|
|||
|
|
@ -7,8 +7,9 @@
|
|||
>
|
||||
<div class="w-ad-banner__slide {{class}}"
|
||||
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>
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@
|
|||
"zh_tw" : "1. 橫幅輪播 ( 圖片, 圖片說明文字, 導航圖示 )",
|
||||
"en" : "1. Carousel ( image, description, navigation )"
|
||||
},
|
||||
"thumbnail" : "thumbnail-block.png"
|
||||
"thumbnail" : "thumb.png"
|
||||
},
|
||||
{
|
||||
"filename" : "ad_banner_widget2_video",
|
||||
|
|
@ -14,7 +14,7 @@
|
|||
"zh_tw" : "2. 橫幅輪播 + Youtube影片 ( 圖片, Youtube影片, 導航圖示 )",
|
||||
"en" : "2. Carousel ( image, Youtube video, navigation )"
|
||||
},
|
||||
"thumbnail" : "thumbnail-block.png"
|
||||
"thumbnail" : "thumb.png"
|
||||
},
|
||||
{
|
||||
"filename" : "ad_banner_widget3",
|
||||
|
|
@ -22,7 +22,7 @@
|
|||
"zh_tw" : "3. 橫幅輪播 ( 圖片, 導航圖示 )",
|
||||
"en" : "3. Carousel ( image, navigation )"
|
||||
},
|
||||
"thumbnail" : "thumbnail-block.png"
|
||||
"thumbnail" : "thumb.png"
|
||||
},
|
||||
{
|
||||
"filename" : "ad_banner_widget4",
|
||||
|
|
@ -30,7 +30,7 @@
|
|||
"zh_tw" : "4. 廣告輪播 ( 圖片 )",
|
||||
"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 |
|
|
@ -1,16 +1,16 @@
|
|||
<div class="w-annc widget-announcement-10">
|
||||
<div class="w-annc widget-announcement-10">
|
||||
<h3 class="w-annc__widget-title">
|
||||
<span>{{widget-title}}</span>
|
||||
</h3>
|
||||
<ul class="w-annc__list" data-level="0" data-list="announcements">
|
||||
<li class="w-annc__item row">
|
||||
<h4 class="w-annc__entry-title col-sm-9">
|
||||
<h4 class="w-annc__entry-title col-sm-9">
|
||||
<span class="w-annc__status-wrap" data-list="statuses" data-level="1">
|
||||
<span class="w-annc__status label {{status-class}}">{{status}}</span>
|
||||
</span>
|
||||
<a class="w-annc__title" href="{{link_to_show}}">{{title}}</a>
|
||||
</h4>
|
||||
<span class="w-annc__postdate-wrap col-sm-3" date-format="%Y-%m-%d">
|
||||
<span class="w-annc__postdate-wrap col-sm-3" date-format="%Y-%m-%d">
|
||||
<i class="fa fa-calendar-o"></i>
|
||||
<span class="w-annc__postdate">{{postdate}}</span>
|
||||
</span>
|
||||
|
|
|
|||
|
|
@ -1,8 +1,8 @@
|
|||
<div class="w-annc widget-announcement-5">
|
||||
<div class="w-annc widget-announcement-5">
|
||||
<h3 class="w-annc__widget-title">
|
||||
<span>{{widget-title}}</span>
|
||||
</h3>
|
||||
<ul class="w-annc__list row" data-level="0" data-list="announcements">
|
||||
<ul class="w-annc__list row" data-level="0" data-list="announcements">
|
||||
<li class="w-annc__item">
|
||||
<div class="w-annc__content-wrap">
|
||||
<div class="w-annc__meta">
|
||||
|
|
|
|||
|
|
@ -1,20 +1,20 @@
|
|||
<div class="w-annc widget-announcement-6">
|
||||
<div class="w-annc widget-announcement-6">
|
||||
<h3 class="w-annc__widget-title">
|
||||
<span>{{widget-title}}</span>
|
||||
</h3>
|
||||
<ul class="w-annc__list" data-level="0" data-list="announcements">
|
||||
<li class="w-annc__item row">
|
||||
<li class="w-annc__item row">
|
||||
<span class="w-annc__category-wrap col-sm-2">
|
||||
<i class="fa fa-tasks"></i>
|
||||
<span class="w-annc__category">{{category}}</span>
|
||||
</span>
|
||||
<h4 class="w-annc__entry-title col-sm-8">
|
||||
<h4 class="w-annc__entry-title col-sm-8">
|
||||
<span class="w-annc__status-wrap" data-list="statuses" data-level="1">
|
||||
<span class="w-annc__status label {{status-class}}">{{status}}</span>
|
||||
</span>
|
||||
<a class="w-annc__title" href="{{link_to_show}}">{{title}}</a>
|
||||
</h4>
|
||||
<span class="w-annc__postdate-wrap col-sm-2" date-format="%Y-%m-%d">
|
||||
<span class="w-annc__postdate-wrap col-sm-2" date-format="%Y-%m-%d">
|
||||
<i class="fa fa-calendar-o"></i>
|
||||
<span class="w-annc__postdate">{{postdate}}</span>
|
||||
</span>
|
||||
|
|
|
|||
|
|
@ -1,20 +1,20 @@
|
|||
<div class="w-annc widget-announcement-7">
|
||||
<div class="w-annc widget-announcement-7">
|
||||
<h3 class="w-annc__widget-title">
|
||||
<span>{{widget-title}}</span>
|
||||
</h3>
|
||||
<ul class="w-annc__list" data-level="0" data-list="announcements">
|
||||
<li class="w-annc__item row">
|
||||
<span class="w-annc__postdate-wrap col-sm-2" date-format="%Y-%m-%d">
|
||||
<li class="w-annc__item row">
|
||||
<span class="w-annc__postdate-wrap col-sm-2" date-format="%Y-%m-%d">
|
||||
<i class="fa fa-calendar-o"></i>
|
||||
<span class="w-annc__postdate">{{postdate}}</span>
|
||||
</span>
|
||||
<h4 class="w-annc__entry-title col-sm-8">
|
||||
<h4 class="w-annc__entry-title col-sm-8">
|
||||
<span class="w-annc__status-wrap" data-list="statuses" data-level="1">
|
||||
<span class="w-annc__status label {{status-class}}">{{status}}</span>
|
||||
</span>
|
||||
<a class="w-annc__title" href="{{link_to_show}}">{{title}}</a>
|
||||
</h4>
|
||||
<span class="w-annc__category-wrap col-sm-2">
|
||||
<span class="w-annc__category-wrap col-sm-2">
|
||||
<i class="fa fa-tasks"></i>
|
||||
<span class="w-annc__category">{{category}}</span>
|
||||
</span>
|
||||
|
|
|
|||
|
|
@ -1,13 +1,13 @@
|
|||
<div class="w-annc widget-announcement-8">
|
||||
<div class="w-annc widget-announcement-8">
|
||||
<h3 class="w-annc__widget-title">
|
||||
<span>{{widget-title}}</span>
|
||||
</h3>
|
||||
<table class="w-annc__table table">
|
||||
<table class="w-annc__table table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th class="w-annc__th w-annc__th--category">{{category-head}}</th>
|
||||
<th class="w-annc__th w-annc__th--title">{{title-head}}</th>
|
||||
<th class="w-annc__th w-annc__th--date">{{date-head}}</th>
|
||||
<th class="w-annc__th w-annc__th--category">{{category-head}}</th>
|
||||
<th class="w-annc__th w-annc__th--title">{{title-head}}</th>
|
||||
<th class="w-annc__th w-annc__th--date">{{date-head}}</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody data-level="0" data-list="announcements">
|
||||
|
|
@ -15,7 +15,7 @@
|
|||
<td class="w-annc__category">{{category}}</td>
|
||||
<td>
|
||||
<span class="w-annc__status-wrap" data-list="statuses" data-level="1">
|
||||
<span class="w-annc__status label status {{status-class}}">{{status}}</span>
|
||||
<span class="w-annc__status label status {{status-class}}">{{status}}</span>
|
||||
</span>
|
||||
<a class="w-annc__title" href="{{link_to_show}}">{{title}}</a>
|
||||
</td>
|
||||
|
|
|
|||
|
|
@ -1,13 +1,13 @@
|
|||
<div class="w-annc widget-announcement-9">
|
||||
<div class="w-annc widget-announcement-9">
|
||||
<h3 class="w-annc__widget-title">
|
||||
<span>{{widget-title}}</span>
|
||||
</h3>
|
||||
<table class="w-annc__table table">
|
||||
<table class="w-annc__table table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th class="w-annc__th w-annc__th--date">{{date-head}}</th>
|
||||
<th class="w-annc__th w-annc__th--title">{{title-head}}</th>
|
||||
<th class="w-annc__th w-annc__th--category">{{category-head}}</th>
|
||||
<th class="w-annc__th w-annc__th--date">{{date-head}}</th>
|
||||
<th class="w-annc__th w-annc__th--title">{{title-head}}</th>
|
||||
<th class="w-annc__th w-annc__th--category">{{category-head}}</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody data-level="0" data-list="announcements">
|
||||
|
|
@ -15,7 +15,7 @@
|
|||
<td class="w-annc__postdate" date-format="%Y-%m-%d">{{postdate}}</td>
|
||||
<td>
|
||||
<span class="w-annc__status-wrap" data-list="statuses" data-level="1">
|
||||
<span class="w-annc__status label status {{status-class}}">{{status}}</span>
|
||||
<span class="w-annc__status label status {{status-class}}">{{status}}</span>
|
||||
</span>
|
||||
<a class="w-annc__title" href="{{link_to_show}}">{{title}}</a>
|
||||
</td>
|
||||
|
|
|
|||
|
|
@ -12,7 +12,7 @@
|
|||
"filename" : "annc_index2",
|
||||
"name" : {
|
||||
"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"
|
||||
},
|
||||
|
|
@ -28,7 +28,7 @@
|
|||
"filename" : "annc_index4",
|
||||
"name" : {
|
||||
"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"
|
||||
},
|
||||
|
|
@ -116,15 +116,15 @@
|
|||
"filename" : "annc_index15",
|
||||
"name" : {
|
||||
"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"
|
||||
},
|
||||
{
|
||||
"filename" : "annc_index16",
|
||||
"name" : {
|
||||
"zh_tw" : "16. 連結 + 附件表格列表 ( 模組標題, 日期, 狀態, 標題 )",
|
||||
"en" : "16. Table List including Links and attachments (widget-title, postdate, status, title, view-counts)"
|
||||
"zh_tw" : "16. 連結 + 附件表格列表 ( 模組標題, 類別, 狀態, 標題 )",
|
||||
"en" : "16. Table List including Links and attachments (widget-title, category, status, title, view-count)"
|
||||
},
|
||||
"thumbnail" : "annc_index16_thumbs.png"
|
||||
}
|
||||
|
|
@ -238,7 +238,7 @@
|
|||
"filename" : "annc_widget14",
|
||||
"name" : {
|
||||
"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"
|
||||
}
|
||||
|
|
|
|||
|
|
@ -26,7 +26,7 @@
|
|||
<li class="s-annc__related-file">
|
||||
<i class="fa fa-fw fa-paperclip"></i>
|
||||
<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>
|
||||
</li>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,10 +1,10 @@
|
|||
<div class="w-archive widget-archive-1" module="archive" data-ps="">
|
||||
<div class="w-archive widget-archive-1" module="archive" data-ps="">
|
||||
<h3 class="w-archive__widget-title">{{widget-title}}</h3>
|
||||
<ul class="w-archive__list level-1" data-list="categories" data-level="0">
|
||||
<li class="w-archive__item level-1">
|
||||
<ul class="w-archive__list level-1" data-list="categories" data-level="0">
|
||||
<li class="w-archive__item level-1">
|
||||
<h4 class="w-archive__item-heading">{{category-title}}</h4>
|
||||
<ul class="w-archive__list level-2" data-list="archives" data-level="1">
|
||||
<li class="w-archive__item level-2">
|
||||
<ul class="w-archive__list level-2" data-list="archives" data-level="1">
|
||||
<li class="w-archive__item level-2">
|
||||
<a class="w-archive__link" href="{{archive_url}}">{{archive-title}}</a>
|
||||
</li>
|
||||
</ul>
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
<div class="i-archive index-archive-1">
|
||||
<div class="i-archive index-archive-1">
|
||||
<h3 class="i-archive__page-title">{{page-title}}</h3>
|
||||
<ul class="i-archive__list" data-list="categories" data-level="0">
|
||||
<li class="i-archive__item">
|
||||
|
|
@ -8,13 +8,13 @@
|
|||
<dt class="i-archive__category-item">
|
||||
<sapn class="i-archive__archive-title">{{archive-title}}</span>
|
||||
<span class="i-archive__status-wrap" data-list="statuses" data-level="2">
|
||||
<span class="i-archive__status label status {{status-class}}">{{status}}</span>
|
||||
<span class="i-archive__status label status {{status-class}}">{{status}}</span>
|
||||
</span>
|
||||
</dt>
|
||||
<dl class="i-archive__file-list" data-list="files" data-level="2">
|
||||
<dd class="i-archive__file-wrap">
|
||||
<a class="i-archive__file-name" href="{{file-url}}" target="_blank">{{file-name}}</a>
|
||||
<span class="i-archive__file-type label label-primary">{{file-type}}</span>
|
||||
<span class="i-archive__file-type label label-primary">{{file-type}}</span>
|
||||
</dd>
|
||||
</dl>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -12,7 +12,7 @@
|
|||
</a>
|
||||
</h4>
|
||||
</div>
|
||||
<div id="collapse" class="panel-collapse collapse in">
|
||||
<div id="collapse" class="panel-collapse collapse">
|
||||
<div class="panel-body">
|
||||
<dl class="dl-horizontal index-archive-item-group" data-list="archives" data-level="1">
|
||||
<dt class="index-archive-item-list">
|
||||
|
|
@ -21,7 +21,7 @@
|
|||
<span class="label status {{status-class}}">{{status}}</span>
|
||||
</span>
|
||||
</dt>
|
||||
<dl class="index-archives-files-list" data-list="files" data-level="2">
|
||||
<dl class="index-archives-files-list" data-list="files" data-level="2">
|
||||
<dd>
|
||||
<a href="{{file-url}}" class="index-archives-files-item" target="_blank">{{file-name}}</a>
|
||||
<span class="label label-primary">{{file-type}}</span>
|
||||
|
|
|
|||
|
|
@ -3,36 +3,36 @@
|
|||
{
|
||||
"filename" : "archive_index1",
|
||||
"name" : {
|
||||
"zh_tw" : "1. 列表",
|
||||
"en" : "1. List"
|
||||
"zh_tw" : "1. 列表 ( 模組標題, 類別標題, 檔案名稱, 下載連結 )",
|
||||
"en" : "1. List (widget-title, category, filename, download link)"
|
||||
},
|
||||
"thumbnail" : "thumbnail-block-list.png"
|
||||
"thumbnail" : "thumb.png"
|
||||
},
|
||||
{
|
||||
"filename" : "archive_index2",
|
||||
"name" : {
|
||||
"zh_tw" : "2. 互動式列表",
|
||||
"en" : "2. Accordion list"
|
||||
"zh_tw" : "2. 手風琴式列表 ( 模組標題, 類別標題, 檔案名稱, 下載連結 )",
|
||||
"en" : "2. Accordion list (widget-title, category, filename, download link)"
|
||||
},
|
||||
"thumbnail" : "thumbnail-block.png"
|
||||
"thumbnail" : "thumb.png"
|
||||
}
|
||||
],
|
||||
"widgets" : [
|
||||
{
|
||||
"filename" : "archive_widget1",
|
||||
"name" : {
|
||||
"zh_tw" : "1. 列表",
|
||||
"en" : "1. List"
|
||||
"zh_tw" : "1. 列表 ( 模組標題, 類別標題, 下載頁面連結 )",
|
||||
"en" : "1. List (widget-title, category, link of download page)"
|
||||
},
|
||||
"thumbnail" : "thumbnail-block.png"
|
||||
"thumbnail" : "thumb.png"
|
||||
},
|
||||
{
|
||||
"filename" : "archive_widget2",
|
||||
"name" : {
|
||||
"zh_tw" : "2. 互動式列表",
|
||||
"en" : "2. Accordion list"
|
||||
"zh_tw" : "2. 手風琴式列表 ( 模組標題, 類別標題, 下載頁面連結 )",
|
||||
"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">
|
||||
<span>{{widget-title}}</span>
|
||||
</h3>
|
||||
<div class="cycle-slideshow widget-content"
|
||||
data-level="0"
|
||||
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">
|
||||
<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>
|
||||
<%= javascript_include_tag "plugin/jquery.cycle2.carousel.min"%>
|
||||
</div>
|
||||
|
|
@ -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",
|
||||
"name" : {
|
||||
"zh_tw" : "1. 相本排版-1",
|
||||
"en" : "1. Gallery-1"
|
||||
},
|
||||
"thumbnail" : "thumb.png"
|
||||
},
|
||||
{
|
||||
"filename" : "gallery_index2",
|
||||
"name" : {
|
||||
"zh_tw" : "2. 相本排版-2",
|
||||
"en" : "2. Gallery-2"
|
||||
"zh_tw" : "1. 縮圖 ( 相本圖片, 分頁導覽 )",
|
||||
"en" : "1. Thumbnail ( gallery thumbnail, page navigation )"
|
||||
},
|
||||
"thumbnail" : "thumb.png"
|
||||
}
|
||||
|
|
@ -21,24 +13,16 @@
|
|||
{
|
||||
"filename" : "gallery_widget1",
|
||||
"name" : {
|
||||
"zh_tw" : "1. 相本排版-1",
|
||||
"en" : "1. Gallery-1"
|
||||
"zh_tw" : "1. 跑馬燈 ( 模組標題, 圖片 )",
|
||||
"en" : "1. Carousel Effect (widget-title, image)"
|
||||
},
|
||||
"thumbnail" : "thumb.png"
|
||||
},
|
||||
{
|
||||
"filename" : "gallery_widget2",
|
||||
"name" : {
|
||||
"zh_tw" : "2. 相本排版-2",
|
||||
"en" : "2. Gallery-2"
|
||||
},
|
||||
"thumbnail" : "thumb.png"
|
||||
},
|
||||
{
|
||||
"filename" : "gallery_widget3",
|
||||
"name" : {
|
||||
"zh_tw" : "3. 相本排版-3",
|
||||
"en" : "2. Gallery-3"
|
||||
"zh_tw" : "2. 相本排版",
|
||||
"en" : "2. Thumbnail"
|
||||
},
|
||||
"thumbnail" : "thumb.png"
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,28 +1,28 @@
|
|||
{
|
||||
"frontend": [
|
||||
{
|
||||
"filename" : "member_index1",
|
||||
"name" : {
|
||||
"zh_tw" : "1. 表格列表",
|
||||
"en" : "1. Table List"
|
||||
},
|
||||
"thumbnail" : "thumbnail-block-list.png"
|
||||
},
|
||||
{
|
||||
"filename" : "member_index2",
|
||||
"name" : {
|
||||
"zh_tw" : "2. 單欄式 ( 類別標題, 個人照片, 個人資料)",
|
||||
"en" : "2. Single Column (category title, photo, profile)"
|
||||
},
|
||||
"thumbnail" : "member_index2_thumb.png"
|
||||
},
|
||||
{
|
||||
"filename" : "member_index3",
|
||||
"name" : {
|
||||
"zh_tw" : "3. 名片式 ( 類別標題, 個人照片, 個人資料 )",
|
||||
"en" : "3. Two Columns (category title, photo, profile)"
|
||||
},
|
||||
"thumbnail" : "member_index3_thumb.png"
|
||||
}
|
||||
]
|
||||
{
|
||||
"frontend": [
|
||||
{
|
||||
"filename" : "member_index1",
|
||||
"name" : {
|
||||
"zh_tw" : "1. 表格列表 ( 類別標題, 個人資料等自訂欄位 )",
|
||||
"en" : "1. Table List (category title and customized profile data)"
|
||||
},
|
||||
"thumbnail" : "member_index1_thumb.png"
|
||||
},
|
||||
{
|
||||
"filename" : "member_index2",
|
||||
"name" : {
|
||||
"zh_tw" : "2. 單欄式 ( 類別標題, 個人照片, 個人資料等自訂欄位 )",
|
||||
"en" : "2. Single Column (category title, photo and customized profile data)"
|
||||
},
|
||||
"thumbnail" : "member_index2_thumb.png"
|
||||
},
|
||||
{
|
||||
"filename" : "member_index3",
|
||||
"name" : {
|
||||
"zh_tw" : "3. 名片式 ( 類別標題, 個人照片, 個人資料等自訂欄位 )",
|
||||
"en" : "3. Two Columns (category title, photo and customized profile data)"
|
||||
},
|
||||
"thumbnail" : "member_index3_thumb.png"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -4,8 +4,13 @@
|
|||
<h3 class="i-member__status-title">{{status-title}}</h3>
|
||||
<div class="index-member-list" >
|
||||
<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">
|
||||
<tr data-list="profile_data" data-level="3">
|
||||
<tr data-list="profile_data" data-level="3">
|
||||
<td class="{{value_class}}">{{value}}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
|
|
|
|||
Binary file not shown.
|
Before Width: | Height: | Size: 66 KiB After Width: | Height: | Size: 1.8 KiB |
|
|
@ -3,9 +3,8 @@
|
|||
<thead>
|
||||
<tr>
|
||||
<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_author}}</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody data-level="0" data-list="books">
|
||||
|
|
@ -13,7 +12,6 @@
|
|||
<td>{{year}}</td>
|
||||
<td><a href="{{link_to_show}}">{{book_title}}</a></td>
|
||||
<td>{{book_paper_type}}</td>
|
||||
<td>{{author}}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
|
|
|||
|
|
@ -3,15 +3,13 @@
|
|||
<thead>
|
||||
<tr>
|
||||
<th class="col-md-1">{{th_year}}</th>
|
||||
<th class="col-md-9">{{th_title}}</th>
|
||||
<th class="col-md-2">{{th_author}}</th>
|
||||
<th class="col-md-11">{{th_title}}</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody data-level="0" data-list="writing_conferences">
|
||||
<tr>
|
||||
<td>{{year}}</td>
|
||||
<td><a href="{{link_to_show}}">{{paper_title}}</a></td>
|
||||
<td>{{author}}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
|
|
|||
|
|
@ -3,15 +3,13 @@
|
|||
<thead>
|
||||
<tr>
|
||||
<th class="col-md-1">{{th_year}}</th>
|
||||
<th class="col-md-9">{{th_title}}</th>
|
||||
<th class="col-md-2">{{th_author}}</th>
|
||||
<th class="col-md-11">{{th_title}}</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody data-level="0" data-list="journal_papers">
|
||||
<tr>
|
||||
<td>{{year}}</td>
|
||||
<td><a href="{{link_to_show}}">{{paper_title}}</a></td>
|
||||
<td>{{author}}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</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
|
||||
if !current_user_is_group_admin
|
||||
|
|
@ -9,39 +6,39 @@
|
|||
current_user_is_group_member = true
|
||||
end
|
||||
%>
|
||||
<li>
|
||||
<div class="member-avatar">
|
||||
|
||||
<p class="<%= current_user_is_group_admin ? "gender-man" : (current_user_is_group_member ? "gender-woman" : "gender-none") %>"></p>
|
||||
<div class="action">
|
||||
<%= link_to(content_tag(:i, nil, :class => 'icon-edit'),"#",:class=>"edit" ) if current_user_is_group_admin %>
|
||||
<li class="group-card animated bounceInDown">
|
||||
<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>
|
||||
<div class="action">
|
||||
<%= link_to(content_tag(:i, nil, :class => 'icon-edit'),"#",:class=>"edit" ) if current_user_is_group_admin %>
|
||||
</div>
|
||||
<%= image_tag(group.image) %>
|
||||
</div>
|
||||
<%= image_tag(group.image) %>
|
||||
</div>
|
||||
<div class="member-info">
|
||||
<h4 class="member-name"><%= link_to group.title, admin_group_path(group) %></h4>
|
||||
<%
|
||||
author = ""
|
||||
group.admins.each_with_index do |admin,i|
|
||||
user = User.find(admin) rescue nil
|
||||
if !user.nil?
|
||||
author = author + (user.member_profile.name == nil ? user.user_name : user.member_profile.name rescue "")
|
||||
author = author + ", " if i != group.admins.count - 1
|
||||
<div class="group-info">
|
||||
<h4 class="group-name"><%= link_to group.title, admin_group_path(group) %></h4>
|
||||
<%
|
||||
author = ""
|
||||
group.admins.each_with_index do |admin,i|
|
||||
user = User.find(admin) rescue nil
|
||||
if !user.nil?
|
||||
author = author + (user.member_profile.name == nil ? user.user_name : user.member_profile.name rescue "")
|
||||
author = author + ", " if i != group.admins.count - 1
|
||||
end
|
||||
end
|
||||
end
|
||||
%>
|
||||
<div class="member-mail muted">Admin : <%= author %></div>
|
||||
<div class="group-mail">Admin : <%= author %></div>
|
||||
<hr>
|
||||
<ul class="member-roles">
|
||||
<li>
|
||||
<span class="member-staturs muted">Privacy : </i>
|
||||
<span class="label <%= group.privacy == 'closed' ? "label-important" : "label-success" %>"><%= group.privacy %></span>
|
||||
<ul class="group-roles">
|
||||
<li class="group-privacy">
|
||||
<span class="group-staturs">Privacy : </i>
|
||||
<span class="label <%= group.privacy == 'closed' ? "private" : "public" %>"><%= group.privacy %></span>
|
||||
</li>
|
||||
<li>
|
||||
<li class="group-description">
|
||||
<% content = group.description %>
|
||||
<%= content[0..250] %>
|
||||
<%= content[0..150] %>
|
||||
<%= "..." if content.length > 250 %>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
</li>
|
||||
|
|
|
|||
|
|
@ -1,5 +1,6 @@
|
|||
<% @categories.each do |cat| %>
|
||||
<div>
|
||||
<%= cat.title_translations["en"] %> / <%= cat.title_translations["zh_tw"] %>
|
||||
<div class="group-category-item button button-primary">
|
||||
<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>
|
||||
<% end %>
|
||||
|
|
@ -2,7 +2,7 @@
|
|||
<%= stylesheet_link_tag "lib/main-forms" %>
|
||||
<%= stylesheet_link_tag "lib/fileupload" %>
|
||||
<%= stylesheet_link_tag "lib/main-list" %>
|
||||
<%= stylesheet_link_tag "group_admin" %>
|
||||
<%= stylesheet_link_tag "lib/group/group-admin" %>
|
||||
<%= stylesheet_link_tag "select2/select2" %>
|
||||
<% end %>
|
||||
<% content_for :page_specific_javascript do %>
|
||||
|
|
@ -35,6 +35,7 @@
|
|||
<div class="control-group">
|
||||
<label class="control-label muted"><%= t(:image) %></label>
|
||||
<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-new thumbnail pull-left">
|
||||
<% if @group.image.file %>
|
||||
|
|
|
|||
|
|
@ -1,47 +1,49 @@
|
|||
<a href="/admin/posts/<%= post.to_param %>" class="group-page-post-link">
|
||||
<div class="group-page-post clearfix">
|
||||
<div class="group-page-post-image-wrap">
|
||||
<% if !post.group_post_images.blank? %>
|
||||
<img class="group-page-post-image" src="<%= post.group_post_images.first.image.thumb.url %>" alt="<%= post.title %>">
|
||||
<% else %>
|
||||
<img class="group-page-post-image" src="/assets/no-image.jpg" alt="Post image">
|
||||
<% end %>
|
||||
</div>
|
||||
<div class="group-page-post-content-wrap">
|
||||
<h3 class="group-page-post-title">
|
||||
<%= post.title %>
|
||||
</h3>
|
||||
<div class="group-page-post-content">
|
||||
<% content = strip_tags post.content %>
|
||||
<%= content[0..250] %>
|
||||
<%= "..." if content.length > 350 %>
|
||||
</div>
|
||||
<div class="group-page-post-meta-wrap">
|
||||
<span class="group-page-post-author">
|
||||
<%
|
||||
user = User.find(post.author) rescue nil
|
||||
if !user.nil?
|
||||
author = (user.member_profile.name == nil ? user.user_name : user.member_profile.name rescue "")
|
||||
%>
|
||||
<i class="group-page-post-author-icon icon-user"></i> <%= author %>
|
||||
<% end %>
|
||||
</span>
|
||||
<div class="group-page-post-sub-wrap">
|
||||
<span class="group-page-post-postdate">
|
||||
<% date = DateTime.parse(post.created_at.to_s).strftime("%d %B %H:%M") %>
|
||||
<i class="group-page-post-postdate-icon icon-time"></i> <%= date %>
|
||||
</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>
|
||||
</a>
|
||||
<div class="group-post-item card clearfix wow bounceInUp">
|
||||
<a href="/admin/posts/<%= post.to_param %>" class="group-post-link"></a>
|
||||
<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? %>
|
||||
<img class="group-post-image" src="<%= post.group_post_images.first.image.thumb.url %>" alt="<%= post.title %>">
|
||||
<% else %>
|
||||
<img class="group-post-image" src="/assets/no-image.jpg" alt="Post image">
|
||||
<% end %>
|
||||
</div>
|
||||
<div class="group-post-content-wrap">
|
||||
<h3 class="group-post-title">
|
||||
<%= post.title %>
|
||||
</h3>
|
||||
<div class="group-post-content">
|
||||
<% content = strip_tags post.content %>
|
||||
<%= content[0..250] %>
|
||||
<%= "..." if content.length > 350 %>
|
||||
</div>
|
||||
<div class="group-post-meta-wrap">
|
||||
<span class="group-post-author">
|
||||
<%
|
||||
user = User.find(post.author) rescue nil
|
||||
if !user.nil?
|
||||
author = (user.member_profile.name == nil ? user.user_name : user.member_profile.name rescue "")
|
||||
%>
|
||||
<i class="group-post-author-icon icon-user"></i> <%= author %>
|
||||
<% end %>
|
||||
</span>
|
||||
<div class="group-post-sub-wrap">
|
||||
<span class="group-post-postdate">
|
||||
<% date = DateTime.parse(post.created_at.to_s).strftime("%d %B %H:%M") %>
|
||||
<i class="group-post-postdate-icon icon-time"></i> <%= date %>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
<li class="group-post-comment">
|
||||
<div class="group-post-comment-wrap">
|
||||
<div class="group-post-comment-avatar">
|
||||
<li class="group-show-post-comment">
|
||||
<div class="group-show-post-comment-wrap">
|
||||
<div class="group-show-post-comment-avatar">
|
||||
<%
|
||||
user = post_comment.user rescue nil
|
||||
if !user.nil?
|
||||
|
|
@ -10,13 +10,13 @@
|
|||
%>
|
||||
<img src="<%= avatar %> " alt="Avatar image">
|
||||
</div>
|
||||
<div class="group-post-comment-body">
|
||||
<div class="group-post-comment-author-wrap">
|
||||
<div class="group-post-comment-author"><%= author %></div>
|
||||
<div class="group-show-post-comment-body">
|
||||
<div class="group-show-post-comment-author-wrap">
|
||||
<div class="group-show-post-comment-author"><%= author %></div>
|
||||
<% 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 class="group-post-comment-content">
|
||||
<div class="group-show-post-comment-content">
|
||||
<% content_images = parse_for_images(post_comment.comment) %>
|
||||
<%= content_images.first %>
|
||||
<%= content_images.last.html_safe %>
|
||||
|
|
|
|||
|
|
@ -3,8 +3,8 @@
|
|||
<%= stylesheet_link_tag "lib/fileupload" %>
|
||||
<%= stylesheet_link_tag "lib/main-list" %>
|
||||
<%= stylesheet_link_tag "lib/dropzone" %>
|
||||
<%= stylesheet_link_tag "group_show" %>
|
||||
<%= stylesheet_link_tag "group_admin" %>
|
||||
<%= stylesheet_link_tag "lib/group/group-main" %>
|
||||
<%= 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 "//cdnjs.cloudflare.com/ajax/libs/animate.css/3.2.6/animate.min.css" %>
|
||||
<% end %>
|
||||
|
|
|
|||
|
|
@ -1,9 +1,59 @@
|
|||
<div id="group_categories">
|
||||
<%= render :partial => "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" %>
|
||||
</div>
|
||||
<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>
|
||||
<a href="" class="btn btn-primary" data-toggle="modal" data-target="#categoryModal">+</a>
|
||||
|
||||
<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-dialog">
|
||||
<div class="modal-dialog group-category-modal">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
|
||||
|
|
@ -11,12 +61,14 @@
|
|||
</div>
|
||||
<div class="modal-body">
|
||||
<% @site_in_use_locales.each do |locale| %>
|
||||
<form class="form-horizontal">
|
||||
<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">Please enter category title</span>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<% end %>
|
||||
<div class="text-error text-center"><%= t(:category_notice) %></div>
|
||||
|
|
@ -28,6 +80,39 @@
|
|||
</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">
|
||||
$(function(){
|
||||
|
|
@ -40,6 +125,10 @@
|
|||
}
|
||||
});
|
||||
|
||||
$('.open-slide').on('click', function() {
|
||||
setForm($(this).data('form'));
|
||||
});
|
||||
|
||||
$.each($('#categoryModal .input-large'),function(){
|
||||
$(this).blur(function(){
|
||||
if($(this).val()==""){
|
||||
|
|
|
|||
|
|
@ -1,17 +1,17 @@
|
|||
<% content_for :page_specific_css do -%>
|
||||
|
||||
<%= stylesheet_link_tag "lib/wrap-nav" %>
|
||||
<%= stylesheet_link_tag "lib/main-list" %>
|
||||
<%= 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 -%>
|
||||
<% content_for :page_specific_javascript do -%>
|
||||
<%= javascript_include_tag "lib/jquery.lite.image.resize.js" %>
|
||||
<%= javascript_include_tag "lib/member/list-view.js" %>
|
||||
<%= javascript_include_tag "group.js" %>
|
||||
<% end -%>
|
||||
<div id="list-view">
|
||||
<ul id="member-abstract" class="clearfix">
|
||||
<div>
|
||||
<ul class="group-index wrapper clearfix">
|
||||
<%= render :partial=>"group",:collection=> @groups %>
|
||||
</ul>
|
||||
</div>
|
||||
|
|
@ -2,14 +2,17 @@
|
|||
<%= stylesheet_link_tag "lib/wrap-nav" %>
|
||||
<%= stylesheet_link_tag "lib/main-list" %>
|
||||
<%= 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 -%>
|
||||
<% content_for :page_specific_javascript do -%>
|
||||
<%= javascript_include_tag "lib/jquery.lite.image.resize.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 -%>
|
||||
<div id="list-view">
|
||||
<ul id="member-abstract" class="clearfix">
|
||||
<div>
|
||||
<ul class="group-public clearfix">
|
||||
<%= render :partial=>"group",:collection=> @groups %>
|
||||
</ul>
|
||||
</div>
|
||||
|
|
@ -1,60 +1,64 @@
|
|||
<% 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 "//cdnjs.cloudflare.com/ajax/libs/animate.css/3.2.6/animate.min.css" %>
|
||||
<% end -%>
|
||||
<% 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" %>
|
||||
<% end -%>
|
||||
<div class="group-page">
|
||||
<div class="group-page-banner-wrap">
|
||||
<div class="group-page-banner-image-wrap">
|
||||
<img class="group-page-banner-image" src="<%= @group.image.url %>" alt="<%= @group.title %>">
|
||||
<ul class="group-page-view-switch button-group">
|
||||
<li class="group-page-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>
|
||||
<div class="group-post">
|
||||
<div class="group-post-banner-wrap">
|
||||
<div class="group-post-banner-image-wrap">
|
||||
<img class="group-post-banner-image" src="<%= @group.image.url %>" alt="<%= @group.title %>">
|
||||
<ul class="group-post-view-switch button-group">
|
||||
<li class="group-post-feed-view button button-group-common button-default active tool-tip-parent">
|
||||
<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 class="group-page-grid-view button button-group-common button-default">
|
||||
<a class="group-page-switch-btn" href="#" title="Grid"><i class="icon-th"></i></a>
|
||||
<li class="group-post-grid-view button button-group-common button-default tool-tip-parent">
|
||||
<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>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="group-page-bar">
|
||||
<h2 class="group-page-title"><%= @group.title %></h2>
|
||||
<div class="group-post-bar">
|
||||
<h2 class="group-post-page-title"><%= @group.title %></h2>
|
||||
<% 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 %>
|
||||
<ul class="group-page-view-switch-in-bar button-group">
|
||||
<li class="group-page-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>
|
||||
<ul class="group-post-view-switch-in-bar button-group">
|
||||
<li class="group-post-feed-view button button-group-common button-default active">
|
||||
<a class="group-post-switch-btn" href="#" title="Feed"><i class="icon-list-ul"></i></a>
|
||||
</li>
|
||||
<li class="group-page-grid-view button button-group-common button-default">
|
||||
<a class="group-page-switch-btn" href="#" title="Grid"><i class="icon-th"></i></a>
|
||||
<li class="group-post-grid-view button button-group-common button-default">
|
||||
<a class="group-post-switch-btn" href="#" title="Grid"><i class="icon-th"></i></a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="group-page-section">
|
||||
<div class="group-page-detail">
|
||||
<ul class="group-page-pagenation breadcrumb">
|
||||
<div class="group-post-section wrapper">
|
||||
<div class="group-post-detail">
|
||||
<ul class="group-post-pagenation breadcrumb">
|
||||
<li><a href="<%= admin_groups_path %>">My Groups</a> <span class="divider">/</span></li>
|
||||
<li class="active"><%= @group.title %></li>
|
||||
</ul>
|
||||
<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>
|
||||
<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" %>
|
||||
<span class="group-page-status-wrap close-eye button button-activated">
|
||||
<i class="group-page-status icon-eye-open"></i> Closed
|
||||
<span class="group-post-status-wrap close-eye button button-activated">
|
||||
<i class="group-post-status icon-eye-open"></i> Closed
|
||||
</span>
|
||||
<% else %>
|
||||
<span class="group-page-status-wrap open-eye button button-activated">
|
||||
<i class="group-page-status icon-eye-open"></i> Open
|
||||
<span class="group-post-status-wrap open-eye button button-activated">
|
||||
<i class="group-post-status icon-eye-open"></i> Open
|
||||
</span>
|
||||
<% end %>
|
||||
<h4 class="muted">Group Description</h4>
|
||||
<p class="group-page-description"><%= @group.description %></p>
|
||||
<p class="group-post-description"><%= @group.description %></p>
|
||||
</div>
|
||||
</div>
|
||||
<%= render :partial => "post", :collection => @group.group_posts.desc(:created_at) %>
|
||||
|
|
|
|||
|
|
@ -1,26 +1,27 @@
|
|||
<% 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 "//cdnjs.cloudflare.com/ajax/libs/animate.css/3.2.6/animate.min.css" %>
|
||||
<% end -%>
|
||||
<% content_for :page_specific_javascript do -%>
|
||||
<%= 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 "//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" %>
|
||||
<% end -%>
|
||||
|
||||
<article class="group-post">
|
||||
<article class="group-show-post wrapper">
|
||||
<ul class="group-page-pagenation breadcrumb">
|
||||
<li><a href="<%= admin_groups_path %>">My Groups</a> <span class="divider">/</span></li>
|
||||
<li><a href="<%= admin_group_path(@group) %>"><%= @group.title %></a> <span class="divider">/</span></li>
|
||||
<li class="active"><%= @post.title %></li>
|
||||
</ul>
|
||||
<header class="group-post-meta">
|
||||
<div class="group-post-heading-wrap clearfix">
|
||||
<h2 class="group-post-title"><%= @post.title %></h2>
|
||||
<div class="group-post-avatar-wrap">
|
||||
<a class="group-post-avatar-username-toggle tool-tip-parent" href="#">
|
||||
<header class="group-show-post-meta">
|
||||
<div class="group-show-post-heading-wrap clearfix">
|
||||
<h2 class="group-show-post-title"><%= @post.title %></h2>
|
||||
<div class="group-show-post-avatar-wrap">
|
||||
<a class="group-show-post-avatar-username-toggle tool-tip-parent" href="#">
|
||||
<%
|
||||
user = User.find(@post.author) rescue 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")
|
||||
end
|
||||
%>
|
||||
<img class="group-post-avatar" src="<%= avatar %>" alt="">
|
||||
<span class="group-post-username tool-tip"><%= author %></span>
|
||||
<img class="group-show-post-avatar" src="<%= avatar %>" alt="">
|
||||
<span class="group-show-post-username tool-tip"><%= author %></span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="group-post-sub-wrap">
|
||||
<span class="group-post-postdate">
|
||||
<div class="group-show-post-sub-wrap">
|
||||
<span class="group-show-post-postdate">
|
||||
<% date = DateTime.parse(@post.created_at.to_s).strftime("%d %B %H:%M ") %>
|
||||
<i class="group-post-postdate-icon icon-time"></i> <%= date %>
|
||||
<i class="group-show-post-postdate-icon icon-time"></i> <%= date %>
|
||||
</span>
|
||||
<!-- <span class="group-post-time">10:25</span> -->
|
||||
<!-- <span class="group-show-post-time">10:25</span> -->
|
||||
</div>
|
||||
</header>
|
||||
<section class="group-post-image-wrap">
|
||||
<ul class="group-post-image-list cycle-slideshow"
|
||||
<section class="group-show-post-image-wrap">
|
||||
<ul class="group-show-post-image-list cycle-slideshow"
|
||||
data-cycle-slides="li"
|
||||
data-cycle-prev=".group-post-cycle-prev"
|
||||
data-cycle-next=".group-post-cycle-next"
|
||||
data-cycle-prev=".group-show-post-cycle-prev"
|
||||
data-cycle-next=".group-show-post-cycle-next"
|
||||
data-cycle-fx="fade"
|
||||
data-cycle-log="false"
|
||||
data-cycle-center-horz=true
|
||||
data-cycle-center-vert=true
|
||||
>
|
||||
<% @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 %>
|
||||
</ul>
|
||||
<div class="group-post-cycle-prev cycle-nav"><i class="group-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-prev cycle-nav"><i class="group-show-post-cycle-nav-icon icon-chevron-left"></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 class="group-post-content">
|
||||
<section class="group-show-post-content">
|
||||
<%= @post.content.html_safe %>
|
||||
</section>
|
||||
<div class="group-post-attachment-wrap">
|
||||
<div class="group-show-post-attachment-wrap">
|
||||
<% if !@post.group_post_files.blank? %>
|
||||
<span class="group-post-attachments">
|
||||
<span class="group-show-post-attachments">
|
||||
<% @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 %>
|
||||
</span>
|
||||
<% end %>
|
||||
</div>
|
||||
<% 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>
|
||||
<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">
|
||||
<% @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 %>
|
||||
</div>
|
||||
</div>
|
||||
<% end %>
|
||||
<section class="comments">
|
||||
<% 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" >
|
||||
<h3 class="group-post-respond-title">
|
||||
<h3 class="group-show-post-respond-title">
|
||||
Leave a comment
|
||||
</h3>
|
||||
<div class="group-post-respond-wrap">
|
||||
<div class="group-show-post-respond-wrap">
|
||||
<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[user_id]" value="<%= current_user.id.to_s %>" />
|
||||
</div>
|
||||
<div class="group-post-submit-wrap">
|
||||
<input type="submit" name="submit" class="group-post-respond-submit button button-primary" id="submit" value="Submit Comment">
|
||||
<div class="group-show-post-submit-wrap">
|
||||
<input type="submit" name="submit" class="group-show-post-respond-submit button button-primary" id="submit" value="Submit Comment">
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<% else %>
|
||||
<div class="grou-post-respond">
|
||||
<h4 style="text-align:center;">Join the group to comment on this post.</h4>
|
||||
<div class="group-show-post-respond wow bounceInLeft">
|
||||
<h4 class="group-no-permission"><i class="fa fa-exclamation-triangle"></i>Join the group to comment on this post.</h4>
|
||||
</div>
|
||||
<% end %>
|
||||
<h3 class="group-post-comment-title">
|
||||
<h3 class="group-show-post-comment-title bounceIn">
|
||||
Comments
|
||||
</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) %>
|
||||
<% 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 %>
|
||||
</ol>
|
||||
</section>
|
||||
|
|
@ -126,7 +127,7 @@
|
|||
},
|
||||
success : function(comments){
|
||||
$("li#no-comments-li").remove();
|
||||
$("ol#group-post-comment-list").prepend(comments);
|
||||
$("ol#group-show-post-comment-list").prepend(comments);
|
||||
$("#comment-form").resetForm();
|
||||
}
|
||||
})
|
||||
|
|
|
|||
|
|
@ -51,7 +51,7 @@
|
|||
<ul class="orbit-bar-menu">
|
||||
<li>
|
||||
<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>
|
||||
<% if !current_user.nil? %>
|
||||
<ul>
|
||||
|
|
@ -180,4 +180,4 @@
|
|||
$("#user_user_id").focus();
|
||||
}
|
||||
})
|
||||
</script>
|
||||
</script>
|
||||
|
|
|
|||
Loading…
Reference in New Issue