diff --git a/app/assets/javascripts/group.js b/app/assets/javascripts/group.js index 14358bf..8cb3f76 100644 --- a/app/assets/javascripts/group.js +++ b/app/assets/javascripts/group.js @@ -24,30 +24,6 @@ doc.querySelector( ".group-post-image-wrap").classList.add( "hide" ); } }, - // Create the tool tip wrap and get the seen counts and then inject them into DOM - createToolTip: function( container, names, cls1, cls2, wrapEl ) { - if( doc.querySelectorAll( names ).length >= 1 ) { - var container = doc.querySelector( container ), - names = doc.querySelectorAll( names ), - span = doc.createElement( "span" ), - wrap = doc.createElement( "div" ), - frag = document.createDocumentFragment(); - - // Get the seen counts and append them - span.className = cls1; - names[ 0 ].parentNode.appendChild( span ); - - // Create the tool tip and save them in the document fragment - wrap.className = cls2 + " tool-tip"; - Array.prototype.slice.call( names ).forEach( function( el ) { - frag.appendChild( el ); - }); - - // Append the final result to DOM - wrap.appendChild( frag ); - container.appendChild( wrap ); - } - }, // Create scroll effect (with css) scrollEffect: function() { if( doc.querySelector( ".group-page") ) { @@ -71,7 +47,6 @@ // When DOM is completely loaded, execute these functions document.addEventListener( "DOMContentLoaded", function( event ) { group.cycleFix(); - group.createToolTip( ".group-post-seen-by", ".group-post-seen-by-name", "group-post-seen-by-count", "group-post-seen-by-names" ); group.scrollEffect(); }); diff --git a/app/assets/javascripts/plugin/jquery.cycle2.video.min.js b/app/assets/javascripts/plugin/jquery.cycle2.video.min.js new file mode 100644 index 0000000..c47c840 --- /dev/null +++ b/app/assets/javascripts/plugin/jquery.cycle2.video.min.js @@ -0,0 +1,2 @@ +/* Plugin for Cycle2; Copyright (c) 2012 M. Alsup; v20141007 */ +!function(a){"use strict";function b(){try{this.playVideo()}catch(a){}}function c(){try{this.pauseVideo()}catch(a){}}var d='
';a.extend(a.fn.cycle.defaults,{youtubeAllowFullScreen:!0,youtubeAutostart:!1,youtubeAutostop:!0}),a(document).on("cycle-bootstrap",function(e,f){f.youtube&&(f.hideNonActive=!1,f.container.find(f.slides).each(function(b){if(void 0!==a(this).attr("href")){var c,e=a(this),g=e.attr("href"),h=f.youtubeAllowFullScreen?"true":"false";g+=(/\?/.test(g)?"&":"?")+"enablejsapi=1",f.youtubeAutostart&&f.startingSlide===b&&(g+="&autoplay=1"),c=f.API.tmpl(d,{url:g,allowFullScreen:h}),e.replaceWith(c)}}),f.slides=f.slides.replace(/(\b>?a\b)/,"div.cycle-youtube"),f.youtubeAutostart&&f.container.on("cycle-initialized cycle-after",function(c,d){var e="cycle-initialized"==c.type?d.currSlide:d.nextSlide;a(d.slides[e]).find("object,embed").each(b)}),f.youtubeAutostop&&f.container.on("cycle-before",function(b,d){a(d.slides[d.currSlide]).find("object,embed").each(c)}))})}(jQuery); \ No newline at end of file diff --git a/app/assets/stylesheets/back_end.css b/app/assets/stylesheets/back_end.css index 96f6f3b..4280267 100644 --- a/app/assets/stylesheets/back_end.css +++ b/app/assets/stylesheets/back_end.css @@ -14,3 +14,8 @@ *= require lib/filter *= require lib/pageslide */ + +/* Hide ckeditor text, it's breaking the layout but we need to keep them for future use */ +.ui-helper-hidden-accessible { + display: none; +} diff --git a/app/assets/stylesheets/basic/orbit_bar.css.erb b/app/assets/stylesheets/basic/orbit_bar.css.erb index 4842867..7ce707a 100644 --- a/app/assets/stylesheets/basic/orbit_bar.css.erb +++ b/app/assets/stylesheets/basic/orbit_bar.css.erb @@ -318,6 +318,12 @@ } } +@media (max-width: 540px) { + #orbit-bar .orbit-bar-search-sign-language #search input[type="search"] { + width: 130px; + } +} + @media (max-width: 430px) { #orbit-bar #search{ display: none; diff --git a/app/assets/stylesheets/group_admin.css.scss b/app/assets/stylesheets/group_admin.css.scss new file mode 100644 index 0000000..4beb145 --- /dev/null +++ b/app/assets/stylesheets/group_admin.css.scss @@ -0,0 +1,107 @@ +@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; +} + +// 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; +} + +// Override select2 styles, I need this evil power +#main-wrap { + .select2-container-multi { + margin-right: 0.9375rem; + min-width: 200px; + .select2-choices { + padding: 8px 0.5rem 6px; + border-radius: $general; + } + .select2-search-choice { + padding: 10px 1.75rem 10px 0.7rem; + border-color: lighten($light-gray, 5%); + background: $white; + > div { + &:before { + content: "\F007"; + font-family: FontAwesome; + display: inline-block; + font-size: 0.9375rem; + color: $blue; + margin: 0 0.5rem 0 0; + } + } + } + .select2-search-choice-close { + right: 15px; + left: auto; + &:before { + content: "\f057"; + font-family: FontAwesome; + position: absolute; + cursor: pointer; + left: 6px; + top: 6px; + font-size: 0.9375rem; + color: $dark-gray; + } + &:hover { + &:before { + color: $red; + } + } + } + } +} + +.wrap-inner { + .upload-status-notice { + position: fixed; + right: 1rem; + top: 4rem; + color: $white; + padding: 16px 1.375rem; + background-color: $blue; + border-radius: $general; + font-size: 0.8125rem; + box-shadow: 0px 0px 16px 3px rgba(0, 0, 0, 0.2); + -webkit-animation-duration: .3s; + animation-duration: .3s; + z-index: 3000; + } +} + +.img-avatar { + width: 50px; + height: 50px; +} \ No newline at end of file diff --git a/app/assets/stylesheets/group_show.css.scss b/app/assets/stylesheets/group_show.css.scss index 7cc7985..dad398e 100644 --- a/app/assets/stylesheets/group_show.css.scss +++ b/app/assets/stylesheets/group_show.css.scss @@ -30,602 +30,736 @@ $general: 0.25rem; // General style body { - background: $gray; + background: $gray; + font-family: $main-font; } *, *:before, *:after { - box-sizing: border-box; + box-sizing: border-box; +} + +h1, h2, h3, h4, h5, h6, label, legend { + font-family: $main-font; } img { - width: 100%; - max-width: 100%; - height: auto; + width: 100%; + max-width: 100%; + height: auto; } a { - text-decoration: none; + text-decoration: none; } a:hover, a:visited { - text-decoration: none; + text-decoration: none; } // General classes .screen-reader { - position: absolute; - top: -9999px; - left: -9999px; + position: absolute; + top: -9999px; + left: -9999px; } // Buttons .button { - padding: 8px .75rem; - color: $black; - border: none; - border-radius: 15rem; - background: $gray; + 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; - } + 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; + color: #fff; + background-color: $green; } .button-primary { - color: $white; - background-color: $blue; - transition: $fast all; - &:hover { color: $white; - background-color: lighten($blue, 5%); - } + 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 { + 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; + } } - } - > .active { - color: $white; - background-color: $blue; - a { - color: $white; - } - } } // Tool Tip .tool-tip-parent { - position: relative; - &:hover { - .tool-tip { - display: block; + 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; - &:after { - border: 5px solid transparent; - border-top-color: rgba($black, 0.85); - content: ""; + padding: 10px 0.75rem; + border-radius: .2rem; + color: $white; + background: rgba($black, 0.85); position: absolute; - left: 10px; - bottom: -10px; - } + 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; + 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; + 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; + 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; + background-color: $black; + text-align: center; } .group-page-view-switch { - position: absolute; - top: 4rem; - right: 2rem; + position: absolute; + top: 4rem; + right: 2rem; } .group-page-banner-image { - width: auto; - max-width: 100%; - height: auto; + width: auto; + max-width: 100%; + height: auto; } .group-page-bar { - padding: 0 2rem 0 6rem; - text-align: center; - background: rgba($group-page-bar-color, 0.95); - width: 100%; - position: absolute; - left: 0; - bottom: 0; + 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-new-post { - float: right; - margin: 18px 0 0 0; + margin-bottom: 12px; + padding: 6px 0; + color: $white; + font-family: $main-font; + font-weight: normal; } .group-page-section { - overflow: hidden; - max-width: 1350px; - margin: auto; - padding: 300px 2rem 30px; + 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; + font-size: .9rem; + padding: 6px 1rem; + display: block; + float: right; + cursor: pointer; } .group-page-description-wrap { - clear: both; + clear: both; } .gorup-page-info-wrap { - margin-bottom: 10px; - text-align: right; + margin-bottom: 10px; + text-align: right; } .group-page-status-wrap { - font-size: .75rem; - float: right; - padding: 2px 0.5rem; - margin-bottom: 10px; + font-size: .75rem; + float: right; + padding: 2px 0.5rem; + margin-bottom: 10px; } .group-page-status-wrap.close-eye { - margin-left: 5px; - background: $red; + 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; + 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; + clear: both; + text-align: justify; } .group-page-post { - clear: both; - overflow: hidden; - 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); + 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; + text-decoration: none; + color: $black; } .group-page-post:hover { - box-shadow: 0 1px 25px 0 rgba(0, 0, 0, 0.2); + box-shadow: 0 1px 25px 0 rgba(0, 0, 0, 0.2); } .group-page-post-link:hover { - text-decoration: none; - color: $black; + text-decoration: none; + color: $black; } .group-page-post-image-wrap { - display: inline-block; - margin-bottom: 12px; + 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; + 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; + 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; + 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; + color: $dark-gray; } .group-page-post-author, -.group-page-post-postdate { - margin-right: .5rem; +.group-page-post-sub-wrap { + margin-right: .5rem; } .group-page-seen-by { - display: inline-block; + 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-banner-image-wrap {} - .group-page-title { - margin-bottom: 0; - font-size: 1.625rem; - line-height: 50px; - } - .group-page-new-post { - margin-top: 9px; - 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 { - margin: 6px .5rem 0 0; - } - .group-page-section { - padding-top: 60px; - } - .group-page-bar {} - .btn { - padding: 2px 5px; - } + 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; + text-decoration: none; } .group-page-switch-btn { - color: $blue; - &:hover { - color: $white; - } + color: $blue; + &:hover { + color: $white; + } } -/* 600px */ +// 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; - } + .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 {} - .group-page-view-switch { - float: right; - } + .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-page-post-content-wrap { + width: 80%; + } } // Group post .group-post { - width: 980px; - margin: auto; + padding: 50px 2rem 30px; + max-width: 1150px; + margin: auto; } .group-post-meta { - margin-bottom: 15px; + margin-bottom: 15px; } .group-post-title { - font-family: $main-font; - float: left; - width: 90%; + font-family: $main-font; + float: left; + width: 90%; + font-weight: normal; + line-height: 1; } .group-post-avatar-wrap { - float: right; - padding: 20px 0.375rem 0 0; + float: right; + padding: 0 0.375rem 0 0; } .group-post-avatar-username-toggle { - display: block; + 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; - &: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; - margin-right: 1rem; - 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: 90%; -} - -.group-post-attachment-icon { - font-size: 1rem; - padding: 6px 4px 0 0; - float: left; -} - -.group-post-attachments { - display: inline-block; - padding-left: 0.5rem; - float: left; - width: 95%; - a { - margin-bottom: 10px; - } -} - -.group-post-seen-by { - float: right; - cursor: pointer; - &:hover { - .group-post-seen-by-names { - display: block; - } - } - .group-post-seen-by-name { - display: block; - color: #fff; - } -} - -.group-post-seen-by-lead { - margin-right: 4px; -} - -.group-post-seen-by-names { - display: none; -} - -.comments { - clear: both; -} - -.group-post-respond-comment { - width: 100%; -} - -.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 $light-gray; -} - -.group-post-comment-avatar { - float: left; - width: 8%; - img { 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; + 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%; -} \ No newline at end of file + 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 \ No newline at end of file diff --git a/app/assets/stylesheets/lib/main-forms.css b/app/assets/stylesheets/lib/main-forms.css index dbff9fb..64316d7 100644 --- a/app/assets/stylesheets/lib/main-forms.css +++ b/app/assets/stylesheets/lib/main-forms.css @@ -1,582 +1,664 @@ .main-forms > h3 { - margin: 5px 0 10px; - color: #333; - text-shadow: 0 1px 0 #ffffff; - font-family: 'Playfair Display SC', sans-serif; + margin: 5px 0 10px; + color: #333; + text-shadow: 0 1px 0 #ffffff; + font-family: 'Playfair Display SC', sans-serif; } + .main-forms fieldset { - background-color: #FFFFFF; - border: 1px solid #EDEDED; - margin-bottom: 20px; - -webkit-border-radius: 5px; - -moz-border-radius: 5px; - border-radius: 5px; + background-color: #FFFFFF; + border: 1px solid #EDEDED; + margin-bottom: 20px; + -webkit-border-radius: 5px; + -moz-border-radius: 5px; + border-radius: 5px; } + .main-forms fieldset .input-area { - padding: 20px 20px 0; + padding: 20px 20px 0; } + .main-forms fieldset .input-area:after { - content: ""; - clear: both; - display: block; - height: 0; - visibility: hidden; + content: ""; + clear: both; + display: block; + height: 0; + visibility: hidden; } + .main-forms fieldset .input-area .nav-name { - float: left; - width: 100px; - padding-top: 5px; - text-align: right; - display: block; - margin-bottom: 5px; - font-size: 14px; - font-weight: normal; - line-height: 20px; + float: left; + width: 100px; + padding-top: 5px; + text-align: right; + display: block; + margin-bottom: 5px; + font-size: 14px; + font-weight: normal; + line-height: 20px; } -/*.main-forms fieldset .input-area .control-label { - width: 100px; -} -.main-forms fieldset .input-area .controls { - margin-left: 120px; -}*/ + .main-forms fieldset .input-area .controls textarea { - max-width: 500px; - max-height: 300px; - min-height: 86px; + max-width: 500px; + max-height: 300px; + min-height: 86px; } + .main-forms fieldset .input-area .controls textarea.cke_source { - max-width: 100%; - max-height: 100%; + max-width: 100%; + max-height: 100%; } + .main-forms fieldset .input-area .controls hr { - margin: 5px 0 10px; + margin: 5px 0 10px; } + .main-forms fieldset .input-area .controls h5 { - margin: 5px 0; + margin: 5px 0; } + .main-forms fieldset .input-area .controls .file-link { - margin-right: 10px; - display: inline-block; - width: 177px; - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; + margin-right: 10px; + display: inline-block; + width: 177px; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; } + .main-forms fieldset .input-area .controls .input-prepend { - margin-bottom: 5px; + margin-bottom: 5px; } + .main-forms fieldset .input-area .controls .input-prepend .btn-group { - padding: 4px 12px; + padding: 4px 12px; } + .main-forms fieldset .input-area .controls .input-prepend .btn-group { - padding: 4px 12px; + padding: 4px 12px; } + .main-forms fieldset .input-area .controls .input-prepend .btn-group .radio input[type="radio"], .main-forms fieldset .input-area .controls .input-prepend .btn-group .checkbox input[type="checkbox"] { - margin: 5px 5px 0 0; + margin: 5px 5px 0 0; } + .main-forms fieldset .input-area .controls .input-prepend .btn-group li { - text-align: left; - padding: 3px 10px; + text-align: left; + padding: 3px 10px; } + .main-forms fieldset .input-area .controls .input-prepend .btn-group li label { - padding-left: 5px; - display: block; + padding-left: 5px; + display: block; } -.main-forms fieldset .input-area .controls .exist .input-prepend .btn-group:hover .dropdown-menu , -.main-forms fieldset .input-area .controls .add-target .input-prepend .btn-group:hover .dropdown-menu { - display: block; + +.main-forms fieldset .input-area .controls .exist .input-prepend .btn-group:hover .dropdown-menu, +.main-forms fieldset .input-area .controls .add-target .input-prepend .btn-group:hover .dropdown-menu { + display: block; } + .main-forms fieldset .input-area .controls .exist .input-prepend, .main-forms fieldset .input-area .controls .add-target .input-prepend { - margin-bottom: 10px; - display: inline-block; + margin-bottom: 10px; + display: inline-block; } + .main-forms fieldset .input-area .controls .exist .fileupload-new { - display: block; + display: block; } + .main-forms fieldset .input-area .controls .exist .fileupload-new .input-prepend { - display: inline-block; + display: inline-block; } + .main-forms fieldset .input-area .controls .input-prepend a { - text-decoration: none; - color: #333333; + text-decoration: none; + color: #333333; } + .main-forms fieldset .input-area .controls .input-prepend .tab-content > .active { - display: inline-block; + display: inline-block; } + .main-forms fieldset .input-area .controls .add-btn { - margin: 3px 0; + margin: 3px 0; } + .main-forms fieldset .input-area .fileupload { - margin-right: 15px; - margin-bottom: 0; + margin-right: 15px; + margin-bottom: 0; } + .main-forms fieldset .input-area .datetimepick { - margin-right: 5px; - margin-bottom: 5px; + margin-right: 5px; + margin-bottom: 5px; } + .main-forms fieldset .input-area .datetimepick .add-on { - line-height: 24px; - cursor: pointer; + line-height: 24px; + cursor: pointer; } + .main-forms fieldset .input-area .language-area .input-content .mceLayout { - width: 100%!important; + width: 100%!important; } + .main-forms fieldset .input-area .module-nav, .main-forms fieldset .input-area .language-nav { - margin: 0 0 20px; - padding: 0 0 15px 120px; - border-bottom: 1px solid #ddd; + margin: 0 0 20px; + padding: 0 0 15px 120px; + border-bottom: 1px solid #ddd; } + .main-forms fieldset .input-area .module-nav li, .main-forms fieldset .input-area .language-nav li { - position: relative; + position: relative; } .main-forms fieldset .input-area .module-nav li.active:before, .main-forms fieldset .input-area .module-nav li.active:after, .main-forms fieldset .input-area .language-nav li.active:before, .main-forms fieldset .input-area .language-nav li.active:after { - display: block; - height: 0px; - width: 0px; - position: absolute; - bottom: -15px; - left: 50%; - margin-left: -5px; - content: ""; - border-style: solid; - border-width: 0 6px 6px 6px; - border-color: transparent transparent #EDEDED transparent; - z-index: 5 + display: block; + height: 0px; + width: 0px; + position: absolute; + bottom: -15px; + left: 50%; + margin-left: -5px; + content: ""; + border-style: solid; + border-width: 0 6px 6px 6px; + border-color: transparent transparent #EDEDED transparent; + z-index: 5 } + .main-forms fieldset .input-area .module-nav li.active:after { - display: none; + display: none; } + .main-forms fieldset .input-area .language-nav li.active:after { - bottom: -16px; - margin-left: -4px; - border-width: 0 5px 5px 5px; - border-color: transparent transparent #FFFFFF transparent; + bottom: -16px; + margin-left: -4px; + border-width: 0 5px 5px 5px; + border-color: transparent transparent #FFFFFF transparent; } + .main-forms fieldset .input-area .module-nav { - margin-bottom: 0; - border-bottom: none; + margin-bottom: 0; + border-bottom: none; } + .main-forms fieldset .input-area .language-area, .main-forms fieldset .input-area .module-area { - overflow: visible; + overflow: visible; } + .main-forms fieldset .input-area .module-area { - padding-top: 20px; - margin-bottom: 40px; - background-color: #EDEDED; - border-radius: 5px; - overflow: hidden; + padding-top: 20px; + margin-bottom: 40px; + background-color: #EDEDED; + border-radius: 5px; + overflow: hidden; } + .main-forms fieldset .form-actions { - /*padding-left: 140px;*/ - padding-left: 200px; - margin: 0px; - -webkit-border-radius: 0 0 4px 4px; - -moz-border-radius: 0 0 4px 4px; - border-radius: 0 0 4px 4px; + /*padding-left: 140px;*/ + + padding-left: 200px; + margin: 0px; + -webkit-border-radius: 0 0 4px 4px; + -moz-border-radius: 0 0 4px 4px; + border-radius: 0 0 4px 4px; } + .main-forms fieldset .input-area .nav-scroll { - margin-left: 120px; - width:800px; - position:relative; - z-index:1; - overflow:hidden; + margin-left: 120px; + width: 800px; + position: relative; + z-index: 1; + overflow: hidden; } + .main-forms fieldset .input-area .nav-scroll .scroller { - width: 1000px; - height:100%; - float:left; - padding:0; + width: 1000px; + height: 100%; + float: left; + padding: 0; } + .main-forms fieldset .input-area .controls[data-toggle^="buttons-"] label { - position: relative; - margin: 0 0 5px; + position: relative; + margin: 0 0 5px; } + .main-forms fieldset .input-area .controls[data-toggle^="buttons-"] input[type="radio"], .main-forms fieldset .input-area .controls[data-toggle^="buttons-"] input[type="checkbox"] { - margin-left: 0; - margin-top: 0; - position: absolute; - left: 0; - top: 0; - width: 100%; - height: 100%; - display: block; - opacity: 0; - filter: alpha(opacity=0); - -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; + margin-left: 0; + margin-top: 0; + position: absolute; + left: 0; + top: 0; + width: 100%; + height: 100%; + display: block; + opacity: 0; + filter: alpha(opacity=0); + -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; } + .main-forms fieldset .input-area .question { - margin-top: 5px; + margin-top: 5px; } - - /* User Role Forms */ + #attributes-area.clickHere { - min-height: 150px; - position: relative; + min-height: 150px; + position: relative; } + #attributes-area.clickHere:before { - font-family: 'entypo'; - content: '\e0be'; - position: absolute; - font-size: 8em; - display: block; - bottom: 50px; - left: 175px; - color: #51a351; - opacity: .4; - filter: alpha(opacity=40); + font-family: 'entypo'; + content: '\e0be'; + position: absolute; + font-size: 8em; + display: block; + bottom: 50px; + left: 175px; + color: #51a351; + opacity: .4; + filter: alpha(opacity=40); } + .main-forms .input-append .tab-content { - display: inline-block; - overflow: inherit; + display: inline-block; + overflow: inherit; } + .main-forms .input-append .tab-content .active { - display: inline-block; - background-color: transparent; + display: inline-block; + background-color: transparent; } + .main-forms .input-append .active { - border-color: #c5c5c5; - border-color: rgba(0, 0, 0, 0.15) rgba(0, 0, 0, 0.15) rgba(0, 0, 0, 0.25); + border-color: #c5c5c5; + border-color: rgba(0, 0, 0, 0.15) rgba(0, 0, 0, 0.15) rgba(0, 0, 0, 0.25); } + .main-forms .input-append > .btn-group > .btn:first-child { - margin-left: -1px; - -webkit-border-bottom-left-radius: 0px; - border-bottom-left-radius: 0px; - -webkit-border-top-left-radius: 0px; - border-top-left-radius: 0px; - -moz-border-radius-bottomleft: 0px; - -moz-border-radius-topleft: 0px; + margin-left: -1px; + -webkit-border-bottom-left-radius: 0px; + border-bottom-left-radius: 0px; + -webkit-border-top-left-radius: 0px; + border-top-left-radius: 0px; + -moz-border-radius-bottomleft: 0px; + -moz-border-radius-topleft: 0px; } + .main-forms .attributes { - padding-bottom: 20px; + padding-bottom: 20px; } + .main-forms .attributes .tab-content { - overflow: inherit; + overflow: inherit; } + .main-forms .attributes.disabled label, .main-forms .attributes.disabled h4 { - color: #e6e6e6; + color: #e6e6e6; } + .main-forms .attributes-header { - border-bottom: 1px solid #ddd; - margin-bottom: 20px; - padding-bottom: 10px; + border-bottom: 1px solid #ddd; + margin-bottom: 20px; + padding-bottom: 10px; } + .main-forms .attributes-header .btn { - margin-left: 5px; + margin-left: 5px; } + .main-forms .attributes-header h4 { - font-family: 'Chivo'; - line-height: 26px; - margin: 0; + font-family: 'Chivo'; + line-height: 26px; + margin: 0; } + .main-forms .attributes-header h4 b { - padding: 0 1px; - border-style: dotted; - border-width: 0 2px; - border-color: #AAA; - margin-right: 5px; - cursor: move; + padding: 0 1px; + border-style: dotted; + border-width: 0 2px; + border-color: #AAA; + margin-right: 5px; + cursor: move; } + .main-forms .attributes-header h4 i { - cursor: pointer; + cursor: pointer; } + .main-forms .field-type { - background-color: #f5f5f5; - border-radius: 5px; - margin-bottom: 20px; - padding: 10px; + background-color: #f5f5f5; + border-radius: 5px; + margin-bottom: 20px; + padding: 10px; } + .main-forms .field-type.fade { - padding: 0px 10px; - -webkit-transition: all 0.15s linear; - -moz-transition: all 0.15s linear; - -o-transition: all 0.15s linear; - transition: all 0.15s linear; + padding: 0px 10px; + -webkit-transition: all 0.15s linear; + -moz-transition: all 0.15s linear; + -o-transition: all 0.15s linear; + transition: all 0.15s linear; } + .main-forms .field-type.in { - padding: 20px 10px; - -webkit-transition: all 0.15s linear; - -moz-transition: all 0.15s linear; - -o-transition: all 0.15s linear; - transition: all 0.15s linear; + padding: 20px 10px; + -webkit-transition: all 0.15s linear; + -moz-transition: all 0.15s linear; + -o-transition: all 0.15s linear; + transition: all 0.15s linear; } + .main-forms .field-type .control-group { - margin-bottom: 20px; - margin-top: 0px; + margin-bottom: 20px; + margin-top: 0px; } + .main-forms .field-type .control-group:last-child { - margin-bottom: 10px; + margin-bottom: 10px; } + #user-forms .control-group .add-target .input-append, .main-forms .field-type .control-group .add-target .input-append { - display: block; - margin-bottom: 10px; + display: block; + margin-bottom: 10px; } + .main-forms .field-type .control-group .add-target .input-append:first-child { - margin-top: 0px; + margin-top: 0px; } + .main-forms .field-type .control-group .add-target .input-append input + input { - border-radius: 0; - margin-left: -1px; + border-radius: 0; + margin-left: -1px; } + .main-forms .field-type .control-group .add-target.single .input-append input.last, .main-forms .control-group .add-target .btn-group .btn.last { - border-radius: 0 4px 4px 0; + border-radius: 0 4px 4px 0; } + .main-forms .parts-none { - width: 100%; - text-align: center; - padding: 50px 0 70px; - font-size: 2em; + width: 100%; + text-align: center; + padding: 50px 0 70px; + font-size: 2em; } + .main-forms .display-mode .typesetting { - margin: 0 0 10px 0; + margin: 0 0 10px 0; } + .main-forms .display-mode table td:last-child { - text-align: right; + text-align: right; } + .main-forms .display-mode .typesetting li { - display: inline-block; - float: left; - width: 120px; - position: relative; - padding: 2px; - text-align: center; + display: inline-block; + float: left; + width: 120px; + position: relative; + padding: 2px; + text-align: center; } + .main-forms .display-mode .typesetting li + li { - margin-left: 10px; + margin-left: 10px; } + .main-forms .display-mode .typesetting li.active { - padding: 0; - width: 124px; + padding: 0; + width: 124px; } + .main-forms .display-mode .typesetting li.active:after { - font-family: FontAwesome; - content: "\f00c"; - font-size: 12px; - text-indent: 15px; - line-height: 18px; - color: #FFF; - position: absolute; - top: 2px; - right: 2px; - width: 0px; - height: 0px; - border-style: solid; - border-width: 0 30px 30px 0; - border-color: transparent #FFA307 transparent transparent; - z-index: 1; + font-family: FontAwesome; + content: "\f00c"; + font-size: 12px; + text-indent: 15px; + line-height: 18px; + color: #FFF; + position: absolute; + top: 2px; + right: 2px; + width: 0px; + height: 0px; + border-style: solid; + border-width: 0 30px 30px 0; + border-color: transparent #FFA307 transparent transparent; + z-index: 1; } + .main-forms .display-mode .typesetting li.active img { - border-radius: 5px; - background-color: #FFA307; - padding: 2px; + border-radius: 5px; + background-color: #FFA307; + padding: 2px; } + .main-forms .display-mode .typesetting img { - width: 120px; - height: 120px; + width: 120px; + height: 120px; } + .main-forms .display-mode .typesetting input[type="radio"] { - -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; - filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0)0; - opacity: 0; - position: absolute; - width: 100%; - height: 100%; - margin: 0; + -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; + filter: progid: DXImageTransform.Microsoft.Alpha(Opacity=0)0; + opacity: 0; + position: absolute; + width: 100%; + height: 100%; + margin: 0; } + .main-forms .display-mode .typesetting .style_description { - display: block; - line-height: 1.2em; - font-size: 12px; - color: #686868; - padding-top: 10px; + display: block; + line-height: 1.2em; + font-size: 12px; + color: #686868; + padding-top: 10px; } #user-forms .control-group .add-target .input-append input.last { - border-radius: 4px; + border-radius: 4px; } .textarea-lang { - display: inline-block; - position: relative; + display: inline-block; + position: relative; } + .textarea-lang .ui-wrapper { - padding-bottom: 0!important; + padding-bottom: 0!important; } + .textarea-lang .ui-resizable-handle { - position: absolute; - font-size: 0.1px; - display: block; + position: absolute; + font-size: 0.1px; + display: block; } + .textarea-lang .ui-resizable-se { - cursor: se-resize; - right: 1px; - bottom: 1px; - width: 0px; - height: 0px; - border-style: solid; - border-width: 0 0 8px 8px; - border-color: transparent transparent #bcbcbc transparent; + cursor: se-resize; + right: 1px; + bottom: 1px; + width: 0px; + height: 0px; + border-style: solid; + border-width: 0 0 8px 8px; + border-color: transparent transparent #bcbcbc transparent; } + .textarea-lang .tab-pane textarea { - border-radius: 0 0 4px 4px; + border-radius: 0 0 4px 4px; } + .textarea-lang .btn-group { - display: table; - width: 100%; + display: table; + width: 100%; } + .textarea-lang .btn-group .btn { - display: table-cell; + display: table-cell; } + .textarea-lang .btn-group > .btn:first-child { - border-radius: 4px 0 0 0; + border-radius: 4px 0 0 0; } + .textarea-lang .btn-group > .btn:last-child { - border-radius: 0 4px 0 0; + border-radius: 0 4px 0 0; } #address-field .control-label { - width: 120px; + width: 120px; } + #address-field .controls { - margin-left: 140px; + margin-left: 140px; } - - #sideset ul.mobile-themes, #sideset ul.orbitbar-themes { - list-style: none; - margin: 0; + list-style: none; + margin: 0; } + #sideset ul.mobile-themes:after { - content: ""; - clear: both; - display: block; - visibility: hidden; + content: ""; + clear: both; + display: block; + visibility: hidden; } + #sideset ul.mobile-themes li, #sideset ul.orbitbar-themes li { - position: relative; - margin-right: 10px; - margin-bottom: 10px; - overflow: hidden; - padding: 5px; - -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)"; - filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70); - opacity: .7; + position: relative; + margin-right: 10px; + margin-bottom: 10px; + overflow: hidden; + padding: 5px; + -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)"; + filter: progid: DXImageTransform.Microsoft.Alpha(Opacity=70); + opacity: .7; } + #sideset ul.mobile-themes li { - float: left; - display: inline-block; - width: 160px; - height: 240px; + float: left; + display: inline-block; + width: 160px; + height: 240px; } + #sideset ul.orbitbar-themes li { - width: 500px; - height: 40px; + width: 500px; + height: 40px; } + #sideset ul.mobile-themes li.active, #sideset ul.orbitbar-themes li.active { - border: 5px solid #0088cc; - border-radius: 5px; - padding: 0px; - -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; - filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100); - opacity: 1; + border: 5px solid #0088cc; + border-radius: 5px; + padding: 0px; + -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; + filter: progid: DXImageTransform.Microsoft.Alpha(Opacity=100); + opacity: 1; } + #sideset ul.mobile-themes li.active:after, #sideset ul.orbitbar-themes li.active:after { - font-family: FontAwesome; - content: "\f00c"; - font-size: 15px; - text-indent: 20px; - line-height: 25px; - color: #FFF; - position: absolute; - top: 0; - right: 0; - width: 0px; - height: 0px; - border-style: solid; - border-width: 0 40px 40px 0; - border-color: transparent #0088cc transparent transparent; - z-index: 1; + font-family: FontAwesome; + content: "\f00c"; + font-size: 15px; + text-indent: 20px; + line-height: 25px; + color: #FFF; + position: absolute; + top: 0; + right: 0; + width: 0px; + height: 0px; + border-style: solid; + border-width: 0 40px 40px 0; + border-color: transparent #0088cc transparent transparent; + z-index: 1; } + #sideset ul.mobile-themes li img { - width: 160px; - height: 240px; + width: 160px; + height: 240px; } + #sideset ul.mobile-themes li input[type="radio"], #sideset ul.orbitbar-themes li input[type="radio"] { - margin-top: 0px; - position: absolute; - -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; - filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); - opacity: 0; - display: block; + margin-top: 0px; + position: absolute; + -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; + filter: progid: DXImageTransform.Microsoft.Alpha(Opacity=0); + opacity: 0; + display: block; } + #sideset ul.mobile-themes li input[type="radio"] { - width: 160px; - height: 240px; + width: 160px; + height: 240px; } + #sideset ul.orbitbar-themes li input[type="radio"] { - width: 500px; - height: 40px; + width: 500px; + height: 40px; } + #sideset blockquote { - margin-bottom: 30px; + margin-bottom: 30px; } -.downloaded_times{ + +.downloaded_times { display: inline-block; font-size: 14px; height: 30px; line-height: 30px; padding-left: 10px; - vertical-align: top; + vertical-align: top; } - /* Responsive */ -@media (min-width: 768px) and (max-width: 979px) { -} @media (max-width: 480px) { - .main-forms fieldset .input-area .nav-name { - float: none; - width: auto; - padding-top: 0; - text-align: left; - } - .main-forms fieldset .input-area .module-area { - padding: 20px; - } - .main-forms fieldset .input-area .module-nav, - .main-forms fieldset .input-area .language-nav { - padding: 0 0 15px 0px; - } - .main-forms fieldset .form-actions { - padding-right: 20px; - padding-left: 20px; - } - .main-forms fieldset .input-area .control-label { - width: auto; - } - .main-forms fieldset .input-area .controls { - margin-left: 0; - } - .main-forms fieldset .form-actions { - padding-left: 20px; - } -} \ No newline at end of file + .main-forms fieldset .input-area .nav-name { + float: none; + width: auto; + padding-top: 0; + text-align: left; + } + .main-forms fieldset .input-area .module-area { + padding: 20px; + } + .main-forms fieldset .input-area .module-nav, + .main-forms fieldset .input-area .language-nav { + padding: 0 0 15px 0px; + } + .main-forms fieldset .form-actions { + padding-right: 20px; + padding-left: 20px; + } + .main-forms fieldset .input-area .control-label { + width: auto; + } + .main-forms fieldset .input-area .controls { + margin-left: 0; + } + .main-forms fieldset .form-actions { + padding-left: 20px; + } +} diff --git a/app/templates/orbit_bootstrap/assets/javascripts/app.js b/app/templates/orbit_bootstrap/assets/javascripts/app.js index 7c20337..15ab1ad 100644 --- a/app/templates/orbit_bootstrap/assets/javascripts/app.js +++ b/app/templates/orbit_bootstrap/assets/javascripts/app.js @@ -1,6 +1,6 @@ (function( $ ) { - "use strict" + "use strict"; function init() { var doc = document, @@ -127,7 +127,7 @@ } } } - } + }; // Specific functions that will be running on homepage if ( pageModule === "home" ) { @@ -136,7 +136,6 @@ // Functions that will be running on every page orbit.sitemenuDropdown(); - orbit.member.equalHeight(); orbit.plugins.bullEye(); } diff --git a/app/templates/orbit_bootstrap/assets/stylesheets/template/base/_global.scss b/app/templates/orbit_bootstrap/assets/stylesheets/template/base/_global.scss index 03b86f8..15b6b42 100644 --- a/app/templates/orbit_bootstrap/assets/stylesheets/template/base/_global.scss +++ b/app/templates/orbit_bootstrap/assets/stylesheets/template/base/_global.scss @@ -8,7 +8,7 @@ html { body { font-family: $sub-font; font-size: inherit; - margin-top: 40px; // needed for Orbit bar + margin-top: 40px; } a:hover, a:focus { diff --git a/app/templates/orbit_bootstrap/assets/stylesheets/template/modules/member.scss b/app/templates/orbit_bootstrap/assets/stylesheets/template/modules/member.scss index 67c9a3f..a35a63c 100644 --- a/app/templates/orbit_bootstrap/assets/stylesheets/template/modules/member.scss +++ b/app/templates/orbit_bootstrap/assets/stylesheets/template/modules/member.scss @@ -1,111 +1,126 @@ @charset "utf-8"; + @import "../initial"; + // // Index // // Member Index // ## Gerneral styles for Index -.i-member-section { - max-width: 500px; - margin: auto; - @media screen and (min-width: $screen-sm) { - max-width: 100%; - } -} - -.i-member-status-title { - @extend .unity-title; -} - -.i-member-item-inner { - background: none; - border-radius: 0.25rem; - padding: 24px 1rem; - margin-bottom: 16px; - @media screen and (min-width: $screen-sm) { - background: $theme-gray-lighter; - } -} - -.i-member-pic-wrap { - height: auto; - margin-bottom: 16px; - - @media screen and (min-width: $screen-sm) { - position: relative; - overflow: hidden; - height: 125px; - } -} - -.i-member-pic { - width: 100%; - - @media screen and (min-width: $screen-sm) { - position: absolute; - top: -100%; - left: 0; - right: 0; - bottom: -100%; - margin: auto; - width: 100%; - } -} - -.i-member-profile-list { - @include list-reset; -} - -.i-member-profile-item { - margin-bottom: 8px; - font-size: $font-13; -} - -.member-data-title-job-title:before, -.member-data-title-name:before, -.member-data-title-email:before, -.member-data-title-office-tel:before { - font-family: "fontAwesome"; - font-size: .75rem; - display: inline-block; - min-width: 15px; - margin-right: .3125rem; - content: "\f007"; - text-align: center; - color: $theme-gray; -} - -.member-data-title-job-title:before { - content: "\f19d"; -} - -.member-data-title-email:before { - content: "\f0e0"; -} - -.member-data-title-office-tel:before { - content: "\f098"; -} - -// Index 3 -.i-member-item:nth-child( even) { - .i-member-item-inner {} -} - -.i-member-pic-wrap { - padding: 0; -} - -// Member show page -.show-member { - font-family: $sub-font; - th, td { - font-size: .8125rem; - } - .member-plugins { - margin-bottom: 20px; - a { - font-size: .8125rem; +// Index 2 +.index-member-2 { + .i-member-section { + max-width: 500px; + margin: auto; + } + .i-member-status-title { + @extend .unity-title; + } + .i-member-item-inner { + background: none; + border-radius: 0.25rem; + padding: 24px 1rem; + margin-bottom: 16px; + } + .i-member-pic-wrap { + height: auto; + margin-bottom: 16px; + } + .i-member-pic { + width: 100%; + } + .i-member-profile-list { + @include list-reset; + } + .i-member-profile-item { + margin-bottom: 8px; + font-size: $font-13; + } + // RWD + @media screen and (min-width: $screen-sm) { + .i-member-section { + max-width: 100%; + } + .i-member-item-inner { + background: $theme-gray-lighter; + } } - } } + +// // Index 3 +.index-member-3 { + .i-member-section { + max-width: 500px; + margin: auto; + } + .i-member-status-title { + @extend .unity-title; + } + .i-member-item-inner { + background: none; + border-radius: 0.25rem; + padding: 24px 1rem; + margin-bottom: 16px; + } + .i-member-pic-wrap { + height: auto; + margin-bottom: 16px; + } + .i-member-pic { + width: 100%; + } + .i-member-profile-list { + @include list-reset; + } + .i-member-profile-item { + margin-bottom: 8px; + font-size: $font-13; + } + .i-member-item:nth-child(odd) { + clear: both; + } + .i-member-item-inner {} + .i-member-pic-wrap { + padding: 0; + } + // RWD + @media screen and (min-width: $screen-sm) { + .i-member-section { + max-width: 100%; + } + .i-member-item-inner { + background: $theme-gray-lighter; + } + + } + @media screen and (min-width: $screen-md) { + .i-member-pic-wrap { + position: relative; + overflow: hidden; + height: 125px; + } + .i-member-pic { + position: absolute; + top: -100%; + left: 0; + right: 0; + bottom: -100%; + margin: auto; + width: 100%; + } + } +} + +// Show page +.show-member { + font-family: $sub-font; + th, td { + font-size: .8125rem; + } + .member-plugins { + margin-bottom: 20px; + a { + font-size: .8125rem; + } + } +} \ No newline at end of file diff --git a/app/templates/orbit_bootstrap/modules/ad_banner/_ad_banner_widget4.html.erb b/app/templates/orbit_bootstrap/modules/ad_banner/_ad_banner_widget4.html.erb new file mode 100644 index 0000000..088cce7 --- /dev/null +++ b/app/templates/orbit_bootstrap/modules/ad_banner/_ad_banner_widget4.html.erb @@ -0,0 +1,15 @@ + + diff --git a/app/templates/orbit_bootstrap/modules/announcement/_admission_widget1.html.erb b/app/templates/orbit_bootstrap/modules/announcement/_admission_widget1.html.erb deleted file mode 100644 index b762ccc..0000000 --- a/app/templates/orbit_bootstrap/modules/announcement/_admission_widget1.html.erb +++ /dev/null @@ -1,24 +0,0 @@ - diff --git a/app/templates/orbit_bootstrap/modules/announcement/_annc_widget13.html.erb b/app/templates/orbit_bootstrap/modules/announcement/_annc_widget13.html.erb new file mode 100644 index 0000000..4408757 --- /dev/null +++ b/app/templates/orbit_bootstrap/modules/announcement/_annc_widget13.html.erb @@ -0,0 +1,24 @@ + \ No newline at end of file diff --git a/app/templates/orbit_bootstrap/modules/announcement/_annc_widget14.html.erb b/app/templates/orbit_bootstrap/modules/announcement/_annc_widget14.html.erb new file mode 100644 index 0000000..e319e1a --- /dev/null +++ b/app/templates/orbit_bootstrap/modules/announcement/_annc_widget14.html.erb @@ -0,0 +1,27 @@ + diff --git a/app/templates/orbit_bootstrap/modules/announcement/annc_index10.html.erb b/app/templates/orbit_bootstrap/modules/announcement/annc_index10.html.erb new file mode 100644 index 0000000..ffce1bf --- /dev/null +++ b/app/templates/orbit_bootstrap/modules/announcement/annc_index10.html.erb @@ -0,0 +1,22 @@ +| {{title-head}} | +{{date-head}} | +
|---|---|
| + + {{status}} + + {{title}} + | +{{postdate}} | +
| {{date-head}} | +{{title-head}} | +
|---|---|
| {{postdate}} | ++ + {{status}} + + {{title}} + | +
| {{date-head}} | +{{title-head}} | +{{view-count-head}} | +
|---|---|---|
| {{postdate}} | ++ + {{status}} + + {{title}} + | +{{view_count}} | +
| {{date-head}} | +{{title-head}} | +{{link-head}} | +{{file-head}} | +
|---|---|---|---|
| {{postdate}} | ++ + {{status}} + + {{title}} + | +
+
|
+
+
|
+
| {{date-head}} | +{{title-head}} | +{{category-head}} | +{{view-count-head}} | +
|---|---|---|---|
| {{postdate}} | ++ + {{status}} + + {{title}} + | +{{category}} | +{{view_count}} | +
{{subtitle}}
+{{subtitle}}
+{{subtitle}}
+{{subtitle}}
+| {{date-head}} | -{{title-head}} | -
|---|---|
| {{title}} | {{value}} |
| {{title}} | -{{value}} | -
|---|
| {{title}} | -{{value}} | -
|---|