/** * Ussrbasicleft * * Based on duepuntozero Friendica style * Originally by Fabio Comuni */ /* generals */ html { font-size: $font_size; } body { font-size: 0.9rem; background-color: $bgcolour; background-image: url('$background_image'); background-attachment: fixed; background-size: cover; color: $font_colour; margin: 0px; } aside#region_1 { border-right: 1px solid transparent; width: $left_aside_widthrem; min-width: $left_aside_widthrem; max-width: $left_aside_widthrem; } aside#region_3 { width: $right_aside_widthrem; min-width: $left_aside_widthrem; max-width: $right_aside_widthrem; } aside#left_aside_wrapper, aside#right_aside_wrapper { margin-bottom: 10px; } main { margin-left: auto; margin-right: auto; max-width: $main_widthrem; } #overlay { position: fixed; top: 0; left: $left_aside_widthrem; width: 100vw; height: 100vh; background: rgba(0, 0, 0, .3); cursor: pointer; } h1, .h1 { font-size: 2rem; } h2, .h2 { font-size: 1.6rem; } h3, .h3 { font-size: 1.2rem; } h4, .h4 { font-size: 1.05rem; } h5, .h5 { font-size: 0.9rem; } h6, .h6 { font-size: 0.75rem; } #banner { color: $banner_colour; font-weight: bold; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } #banner img { max-height: 1.35rem; width: auto; } .jslider { font-family: sans-serif, arial, freesans; } abbr { border-bottom: none; } /* icons */ a, .fakelink { color: $link_colour; } a:hover, a:focus, .fakelink:hover, .fakelink:focus { color: $link_colour; } .fakelink, .cursor-pointer { cursor: pointer; } input, optgroup, select, textarea { font-size: 0.9rem !important; } input[type=text], textarea { resize: vertical; background-color: $comment_item_colour; color: $font_colour; } .selected-doco-nav { font-weight: bold; text-shadow: 2px 2px 3px lightgray; } #doco-content img { width: 100%; } #help-content pre code { overflow-x: auto; white-space: pre; } pre code { border: none; padding: 1em 1.5em; } code { background: #ccc; color: #000; } pre { background: #F5F5F5; color: #333; border:1px solid #ccc; border-radius: $radius; } .heart { color: #FF0000; } nav { opacity: $nav_float_min_opacity; filter:alpha(opacity=$nav_percent_min_opacity); } #powered-by { font-size: 0.5rem; position: absolute; top: 50px; left: 16px; } #powered-by img { margin-top: -2px; height: 10px; width: 10px; } .error-message { color: #FF0000; font-size: 1.1em; border: 1px solid #FF8888; background-color: #FFEEEE; padding: 10px; } .nav-channel-select { margin-left: 8px; } /* contextual help */ .contextual-help-content { display: none; } .contextual-help-content-open { display: block; position: fixed; top: 3.35rem; left: 0px; width: 100%; max-height: 50%; background: $comment_item_colour; padding: 1rem; border-bottom: #ccc 1px solid; overflow: auto; -moz-box-shadow: 0px 3px 3px rgba(0,0,0,0.2); -webkit-box-shadow: 0px 3px 3px rgba(0,0,0,0.2); box-shadow: 0px 3px 3px rgba(0,0,0,0.2); } .contextual-help-content dd { margin-bottom: 1em; } .contextual-help-tool { padding: 7px; filter: alpha(opacity=20); opacity: .5; } .contextual-help-tool:hover { filter: alpha(opacity=50); opacity: 1; text-decoration: none; } .contextual-help-tool i { color: $font_colour; font-size: 1.05rem; } /* contextual help end */ /* spinner */ .spinner-wrapper { display: none; } .spinner.s { height: 1rem; width: 1rem; } .spinner.m { height: 2rem; width: 2rem; } .spinner.l { height: 3rem; width: 3rem; } .spinner.s, .spinner.m, .spinner.l { margin: 0 auto; position: relative; -webkit-animation: rotation 1s infinite linear; -moz-animation: rotation 1s infinite linear; -o-animation: rotation 1s infinite linear; animation: rotation 1s infinite linear; border-left: .2rem solid rgba(77, 77, 77, .15); border-right: .2rem solid rgba(77, 77, 77, .15); border-bottom: .2rem solid rgba(77, 77, 77, .15); border-top: .2rem solid rgba(77, 77, 77, .5); border-radius: 100%; } @-webkit-keyframes rotation { from { -webkit-transform: rotate(0deg); } to { -webkit-transform: rotate(359deg); } } @-moz-keyframes rotation { from { -moz-transform: rotate(0deg); } to { -moz-transform: rotate(359deg); } } @-o-keyframes rotation { from { -o-transform: rotate(0deg); } to { -o-transform: rotate(359deg); } } @keyframes rotation { from { transform: rotate(0deg); } to { transform: rotate(359deg); } } /* spinner end */ /* jumping dots */ .jumping-dots span { position: relative; bottom: 0px; transition-timing-function: ease-in-out; -webkit-animation: jump 1s infinite; animation: jump 1s infinite; } .jumping-dots .dot-1 { -webkit-animation-delay: 200ms; animation-delay: 200ms; } .jumping-dots .dot-2 { -webkit-animation-delay: 400ms; animation-delay: 400ms; } .jumping-dots .dot-3 { -webkit-animation-delay: 600ms; animation-delay: 600ms; } @-webkit-keyframes jump { 0% { bottom: 0px; } 20% { bottom: 3px; } 40% { bottom: 0px; } } @keyframes jump { 0% {bottom: 0px;} 20% {bottom: 3px;} 40% {bottom: 0px;} } /* jumping dots end */ /* footer */ footer { position:fixed; bottom:1px; text-align: right; padding-bottom: 1em; padding-right: 3em; } .birthday-today, .event-today { font-weight: bold; } .warning-text { font-size: 1.2em; font-weight: bold; color: #ff0000; } #noperm-msg { margin-top: 15px; } .preview-indicator { } #theme-preview { margin: 15px 0px; } #cropimage-wrapper, #cropimage-preview-wrapper { margin-bottom: 10px; } .fn { font-weight: bold; font-size: 1rem; color: #444444; } .vcard-card { background-color: rgba(254,254,254,0.5); } .vcard { word-wrap: break-word; } .profile-edit-side-link { opacity: 0; filter:alpha(opacity=0); } .card:hover .profile-edit-side-link { opacity: 1; filter:alpha(opacity=100); } #profile-photo-wrapper img { width: 100%; height: 100%; } #hide-friends-yes-label, #hide-friends-no-label { margin-left: 125px; float: left; width: 50px; } #fsuggest-desc, #fsuggest-submit-wrapper { margin-top: 15px; margin-bottom: 15px; } .app-name { overflow: none; } .app-container img { margin-left: auto; margin-right: auto; width: 80px; height: 80px; display: block; } .pager { padding: 10px; text-align: center; font-size: 1.0em; } .pager_first, .pager_last, .pager_prev, .pager_next, .pager-prev, .pager-next, .pager_n { border: 1px solid #ccc; background: transparent; padding: 4px; } .pager_current { border: 1px solid transparent; background: transparent; padding: 4px; } .photo, .contact-block-img { border-radius: $radius; box-shadow: $shadowpx $shadowpx $shadowpx 0 #444444; } #side-bar-photos-albums { margin-top: 15px; } #side-bar-photos-albums ul { list-style: none; } .profile-match-photo img, .directory-photo-img { border-radius: $radius; box-shadow: $shadowpx $shadowpx $shadowpx 0 #444444; } .profile-match-photo img { width: $top_photo !important; height: $top_photo !important; } #photo-view-wrapper { background-color: $item_colour; } .pmenu.horizontal { padding: 0 0 0 0; border-bottom: none; } .pmenu.horizontal .pmenu-title { display: none; } .pmenu.horizontal ul { -moz-padding-start: 0; } .pmenu.horizontal li { margin-left: 0; display: inline; padding-right: 15px; } .group-delete-wrapper { float: right; } #pause { position: fixed; bottom: 5px; right: 5px; } #contact-block { width: 100%; } #contact-block-numcontacts { font-weight: bold; margin-bottom:10px; } .contact-block-div { display: inline; } .contact-block-textdiv { width: 150px; height: 34px; } .contact-block-img { width: 2.95rem; height: 2.95rem; margin-bottom: 3px; } #tag-remove { margin-bottom: 15px; } #tagrm li { margin-bottom: 10px; } #tagrm-submit, #tagrm-cancel { margin-top: 25px; } #tagrm-cancel { margin-left: 15px; } .wall-item-conv { background-color: $comment_item_colour; } #nav-notifications-template, #nav-notifications-forums-template { display: none; } #nav-search-spinner { float: right; margin-top: -1.4rem; margin-right: 1rem; } #nav-search-text { width: 280px; padding: .15rem .5rem; } nav .acpopup { top: 46px !important; margin-left: -35px; width: 290px; } .clear { clear: both; } .descriptive-text { color: #888; } #plugin-settings-link, #account-settings-link { margin-bottom: 10px; } #uexport-link { margin-bottom: 20px; } #network-new-link { margin-top: 15px; margin-bottom: 15px; } #cboxOverlay { z-index: 1050; } #colorbox { z-index: 1051; } #cboxContent { padding: 3px; border: 0px solid #fff; border-radius: $radius; background-color: #fff; z-index: 1052; } .app-title { margin: 10px; } .profile-match-photo { float: left; } .profile-match-name { width: 120px; height: 1.5em; overflow: hidden !important; } .profile-match-note { text-align: center; } .profile-match-connect { text-align: center; font-weight: bold; } .profile-match-wrapper { float: left; width: 120px; height: 150px; padding: 10px; margin: 8px 10px 0 0; border-top: 1px solid #eee; border-left: 2px solid #eee; } .profile-match-ignore { float: right; } .side-link { margin-bottom: 15px; } #prof-members { margin-top: 20px; padding: 10px; height: 250px; overflow: auto; border: 1px solid #ddd; } #prof-separator { margin-top: 10px; margin-bottom: 10px; } #prof-all-contacts { padding: 10px; height: 450px; overflow: auto; border: 1px solid #ddd; } #prof-edit-desc { margin-top: 15px; } .required { color: #ff0000; } .notif-image { height: 80px; width: 80px; margin-right: 15px; } /** * OAuth */ .oauthapp { height: auto; overflow: auto; border-bottom: 2px solid #cccccc; padding-bottom: 1em; margin-bottom: 1em; } .oauthapp img { float: left; width: 48px; height: 48px; margin: 10px; } .oauthapp .icon { margin-right: 20px; } .oauthapp img.noicon { background-image: url("../../../../images/icons/48/plugin.png"); background-position: center center; background-repeat: no-repeat; } .oauthapp a { float: left; } .body-attach { margin-top: 10px; } .acpopup li div.taggable { color:#cc0000; } /* popup notifications */ div.jGrowl div.notice { background: #511919 url("../../../../images/icons/48/notice.png") no-repeat 5px center; color: #ffffff; padding-left: 58px; } div.jGrowl div.info { background: #364e59 url("../../../../images/icons/48/info.png") no-repeat 5px center; color: #ffffff; padding-left: 58px; } #jGrowl.top-right { top: 4.5rem; right: .25rem; } div.jGrowl div.jGrowl-notification { min-height: 60px; } .jslider .jslider-scale ins { color: #333; font-size: 0.9rem; width: 100px; text-align: center; } .conv-participants { color: $font_colour; } .contactname { display: block; overflow: hidden; text-overflow: ellipsis; } .dropdown-notification, .notification, .member-item { line-height: 1.2em; font-size: 0.75rem; overflow: hidden; text-overflow: ellipsis; display: block; white-space: nowrap; } .notification.notification-forum { font-size: 0.9rem; color: $font_colour; } #acl-search::-webkit-input-placeholder { /* non-fontawesome fonts set a fallback for text parts of the placeholder*/ font-family: ForkAwesome, sans-serif, arial, freesans; } #acl-search::-moz-placeholder { /* non-fontawesome fonts set a fallback for text parts of the placeholder*/ font-family: ForkAwesome, sans-serif, arial, freesans; } .acl-item-header { width: 100%; } .acl-list-item.grouphide { border: 1px solid red; z-index: 2; } .acl-list-item.groupshow { border: 1px solid green; z-index: 2; } .acl-list-item.taggable { background-color: #ddddff; } .acl-button-show, .acl-button-hide { float: right; margin-left: 5px; } .contact-block-content { margin-top: 10px; } .contact-block-img.archived, .app-deleted, .dim { opacity: 0.3; filter:alpha(opacity=30); } .profile-match-connect { margin-top: 5px; } .reshared-content { margin-left: 20px; } .shared_header img { border-radius: $radius; margin-right: 10px; } .tag1 { font-size : 0.9em !important; } .tag2 { font-size : 1.0em !important; } .tag3 { font-size : 1.1em !important; } .tag4 { font-size : 1.2em !important; } .tag5 { font-size : 1.3em !important; } .tag6 { font-size : 1.4em !important; } .tag7 { font-size : 1.5em !important; } .tag8 { font-size : 1.6em !important; } .tag9 { font-size : 1.7em !important; } .tag10 { font-size : 1.8em !important; } div#write-pages { display: block; background: silver; width: 100%; } div#write-pages a { color: #000; margin-right: 50px; } .pmenu ul { list-style-type: none; } .generic-icons, a .generic-icons { font-size: 1rem; margin-right: 0.5rem; color: $font_colour; } .generic-icons-right { font-size: 1rem; margin-left: 0.5rem; color: $font_colour; } .generic-icons:hover, a .generic-icons:hover, .generic-icons-right:hover, a .generic-icons-right:hover { color: $font_colour; } .generic-icons-nav { font-size: 1rem; margin-right: 7px; } .admin-icons { font-size: 1.2em; margin-right: 7px; } .drop-icons, a .drop-icons { font-size: 1rem; color: $font_colour; text-decoration: none; cursor: pointer; } .drop-icons:hover, a .drop-icons:hover { color: #FF0000; } .lockview, .sys-apps-toggle { cursor: pointer; } .permission-inherited { float: left; margin-right: 10px; color: #FF0000; } .perm-inherited { color: #FF0000; } #menulist { list-style-type: none; } #adminpage table tr:hover { background-color: #BBC7D7; } table { border-spacing: 2px; max-width: 100%; } th,td { padding: 3px; } #channels > tbody > tr > td, #users > tbody > tr > td { max-width: 19.4em; overflow: hidden; } /* mail */ img.mail-conv-sender-photo { border-radius: $radius; } /* jot */ .jothidden { font-weight: bold; } .jothidden input::-webkit-input-placeholder { font-weight: bold; } .jothidden input::-moz-placeholder { font-weight: bold; } #profile-jot-wrapper { background-color: rgba(254, 254, 254, 1); border: 1px solid rgba(0, 0, 0, .2); border-radius: $radius; } #jot-title, #jot-pagetitle, #profile-jot-text { border-radius: $radius; } #profile-jot-text::-webkit-input-placeholder { font-size: 1.2rem; } #profile-jot-text::-moz-placeholder { font-size: 1.2rem; } #profile-jot-text:focus::-webkit-input-placeholder { color: transparent; } #profile-jot-text:focus::-moz-placeholder { color: transparent; } #profile-jot-text-loading { color: #777; display: none; } .jot-icons.jot-lock-warn { color: darkorange; } /* conversation */ .top-radius { border-top-right-radius: $radius; border-top-left-radius: $radius; } .wall-event-item { padding: 10px; color: #fff; background-color: #3A87AD; /* should reflect calendar color */ border-top-left-radius: $radius; border-top-right-radius: $radius; } .wall-photo-item img { max-width: 100% !important; border-top-right-radius: $radius; border-top-left-radius: $radius; } .wall-item-footer { font-size: 0.75rem; margin-top: 2em; } .wall-item-content-wrapper { background-color: $item_colour; border-top-right-radius: $radius; border-top-left-radius: $radius; } .wall-item-content-wrapper.comment { background-color: $comment_item_colour; border-top-right-radius: 0px; border-top-left-radius: 0px; } .hide-comments-outer { background-color: $comment_item_colour; border-top-color: #ccc; border-style: solid; border-top-style: dashed; border-width: 1px 0px 0px 0px; text-align: center; border-radius: 0px; } .hide-comments-outer:hover { border-top: 1px dashed #adadad; } .wall-item-comment-wrapper { padding: 7px 10px; background-color: $item_colour; border-radius: 0px; border-bottom-right-radius: $radius; border-bottom-left-radius: $radius; border-top: 3px solid $comment_item_colour; } .wall-item-comment-wrapper-wc { border-top: 0px solid $comment_item_colour; } .wall-item-photo { width: $top_photo; height: $top_photo; border: none; border-radius: $radius; box-shadow: $shadowpx $shadowpx $shadowpx 0 #444444; } .comment .wall-item-photo { width: $reply_photo; height: $reply_photo; } .wall-item-ago, .dropdown-sub-text { color: #777; } .wall-item-content, .mail-conv-body, .page-body, .chat-item-text, .chat-item-text-self { font-size: 1rem; } .comment-edit-text { border: 1px solid #ccc; border-radius: $radius; } .divgrow-showmore { display: block; border-top: 1px dashed #ccc; text-align: center; } .divgrow-showmore:hover { border-top: 1px dashed #adadad; } .directory-item .divgrow-showmore { background-color: $comment_item_colour; } /* widgets */ .widget { background-color: rgba(254,254,254,.5); border-radius: $radius; } .widget h3 { font-size: 0.9rem; text-transform: uppercase; } #note-text { border-radius: $radius; } .fileas-ul { list-style-type: none; } #datebrowse-sidebar select { border: 1px solid #ccc; border-radius: $radius; } .thing-show img { margin: 10px; } .abook-self { background-color: #ffdddd; } .abook-pending-contact, .abook-permschange { background: orange; } .online-now { color: red; cursor: pointer; } .chat-item-photo, .chat-item-photo-self { border-radius: $radius; } .chat-item-title, .chat-item-title-self { border-radius: $radius; background-color: $item_colour; } #chatMembers img { border-radius: $radius; } .menu-img-3 { width: 3.3em; height: 3.3em; margin-right: 5px; border-radius: $radius; float: left; } .menu-img-2 { height: 2.2em; width: 2.2em; margin-right: 5px; border-radius: $radius; float: left; } .menu-img-1 { height: 1.28571429em; width: 1.28571429em; border-radius: $radius; } .usermenu { width: 3.75rem; } #avatar { width: 2.35rem; height: 2.35rem; border-radius: $radius; } #nav-app-link-wrapper.has_location .nav-link { padding: 0 !important; line-height: 1.175; white-space: nowrap; } .page-title { margin: 7px 0px; } .generic-content-wrapper-styled { background-color: $bgcolour; padding: 10px; border-radius: $radius; } .generic-content-wrapper { border: 1px solid rgba(0, 0, 0, .2); border-radius: $radius; margin-bottom: 1.5rem; } .section-title-wrapper { padding: 7px 10px; background-color: $item_colour; border-top-left-radius: $radius; border-top-right-radius: $radius; border-bottom: 3px solid $comment_item_colour; } .section-title-wrapper h2, .section-subtitle-wrapper h3 { margin-top: 0px; margin-bottom: 0px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .section-subtitle-wrapper h3 { padding: 3px; } .section-subtitle-wrapper { padding: 4px 10px; background-color: $item_colour; border-bottom: 3px solid $comment_item_colour; } .section-content-tools-wrapper { padding: 7px 10px; background-color: $comment_item_colour; border-bottom: 3px solid $comment_item_colour; } .section-content-success-wrapper { padding: 21px 10px; color: #155724; background-color: #d4edda; border-bottom: 3px solid $comment_item_colour; text-align: center; } .section-content-info-wrapper { padding: 21px 10px; color: #0c5460; background-color: #d1ecf1; border-bottom: 3px solid $comment_item_colour; text-align: center; } .section-content-warning-wrapper { padding: 21px 10px; color: #856404; background-color: #fff3cd; border-bottom: 3px solid $comment_item_colour; text-align: center; } .section-content-danger-wrapper { padding: 21px 10px; color: #721c24; background-color: #f8d7da; border-bottom: 3px solid $comment_item_colour; text-align: center; } .section-content-tools-wrapper .section-content-success-wrapper, .section-content-wrapper .section-content-success-wrapper, .section-content-tools-wrapper .section-content-info-wrapper, .section-content-wrapper .section-content-info-wrapper, .section-content-tools-wrapper .section-content-warning-wrapper, .section-content-wrapper .section-content-warning-wrapper, .section-content-tools-wrapper .section-content-danger-wrapper, .section-content-wrapper .section-content-danger-wrapper { margin-bottom: 10px; border-bottom: none; border-radius: $radius; } .section-content-wrapper { padding: 7px 10px; background-color: $comment_item_colour; border-bottom-left-radius: $radius; border-bottom-right-radius: $radius; word-wrap: break-word; } .section-content-wrapper-np { background-color: $comment_item_colour; border-bottom-left-radius: $radius; border-bottom-right-radius: $radius; word-wrap: break-word; } main.fullscreen { left: 0px; width: 100%; height: 100vh; max-width: none; } main.fullscreen .generic-content-wrapper { position: absolute; width: 100%; top: 0px; left: 0px; border-radius: 0px; border-width: 0px; } main.fullscreen .section-title-wrapper { border-radius: 0px; position: sticky; top: 0; z-index: 1020; } main.fullscreen .section-content-wrapper, main.fullscreen .section-content-wrapper-np { border-radius: 0px; } #inline-btn { display: none; } .atoken-index-row:hover td, .chatroom-index-row:hover td, .group-index-row:hover td, .wikis-index-row:hover td, .locs-index-row:hover td, [id^="cloud-index-"]:hover td, .cloud-index-active { background-color: $item_colour; } [id^="webpage-list-item-"]:hover td, [id^="block-list-item-"]:hover td, [id^="layout-list-item-"]:hover td, [id^="menu-list-item-"]:hover td, [id^="mitem-list-item-"]:hover td { background-color: $item_colour; } #perms-tool-table .highlight:hover { background-color: $item_colour; } .notify-seen { background-color: $item_colour; } /* bootstrap overrides */ .btn, .form-control, .nav-pills .nav-link, .nav-tabs .nav-link { border-radius: $radius; } .rounded-top { border-top-left-radius: $radius !important; border-top-right-radius: $radius !important; } blockquote { font-size: 1rem; font-style: italic; border-left: 3px solid #ccc; padding: 1em 0px 1em 1.5em; margin: 0px; } .dropdown-menu { color: $font_colour; border-radius: $radius; } .dropdown-item { color: $font_colour; } .dropdown-item:active, .dropdown-item:focus, .dropdown-item:hover, .textcomplete-item:focus .dropdown-item, .textcomplete-item:hover .dropdown-item, .textcomplete-item.active .dropdown-item, .textcomplete-item:active .dropdown-item { color: $font_colour; background-color: $item_colour; } .textcomplete-dropdown { max-height: 300px; max-width: 250px; overflow: auto; } .dropdown-item.active { color: #fff; background-color: #007bff; } .bg-dark { background-color: $nav_bg !important; } .navbar { z-index:1030; } .navbar-dark .navbar-nav .nav-link, .usermenu i { color: $nav_icon_colour; } .navbar-dark .navbar-nav .nav-link:focus, .navbar-dark .navbar-nav .nav-link:hover, .usermenu:focus i, .usermenu:hover i { color: $nav_active_icon_colour; } @media screen and (max-width: 992px) { aside#region_1 { border-right: 1px solid $nav_bd; } main { left: -$left_aside_widthrem; width: calc( 100% + $left_aside_widthrem ); } main.region_1-on { left: 0px; } #nav-app-link-wrapper { min-width: 0; } #nav-app-link-wrapper { margin-right: 0.5rem; } #navbar-collapse-2 .navbar-app i { font-size: 1rem; margin-right: 0.5rem; } } .shareable_element_text { height: 300px; width: 300px; } .bb_observer { color: red; } .bb_observer img { border: 3px solid red !important; } .bb_rm-logo { height: 1.3em; width: auto; margin-top:-3px; } dl.bb-dl > dt { /* overriding the default dl style from bootstrap, as bootstrap's style of a bold unindented line followed by a plain unindented line is already acheivable in bbcode without dl */ font-weight: normal; } dl.dl-terms-monospace > dt { font-family: monospace; } dl.dl-terms-bold > dt { font-weight: bold; } dl.dl-terms-italic > dt { font-style: italic; } dl.dl-terms-underline > dt { text-decoration: underline; } dl.dl-terms-large > dt { font-size: 120%; } dl.bb-dl:not(.dl-horizontal) > dd { display: block; margin-left: 2em; } dl.bb-dl > dd > li { /* adding some indent so bullet-list items will line up better with dl descriptions if someone wants to be impure and combine them */ margin-left: 1em; } .bootstrap-tagsinput .tag:before { /* Copied from fa-asterisk, is there a better way to do it? */ font-family: ForkAwesome; font-weight: normal; font-style: normal; text-decoration: inherit; content:"\f069 "; } /* Modified original CSS to match input in Ussrbasicleft */ .jothidden .bootstrap-tagsinput { border: 0px solid transparent; margin-bottom: 0px; box-shadow: none; display: inline-block; border-radius: $radius; cursor: text; padding: 0px 10px; width: 100%; } .bootstrap-tagsinput .label { font-size: 100%; } .bootstrap-tagsinput input { height: 2.5rem; } /* Abusing theme-green is less work than makeing a new new one */ .theme-green .back-bar .selected-bar { background-color: #000000; background-image: none !important; } /* Turn checkboxes into switches */ .onoffswitch.checkbox > div { position: relative; width: 60px; -webkit-user-select:none; -moz-user-select:none; -ms-user-select: none; display:inline-block; } .onoffswitch.checkbox input { display: none; } .onoffswitch.checkbox > div label { display: block; overflow: hidden; cursor: pointer; border: 1px solid #ccc; border-radius: 12px; margin:0px; -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s; -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s; transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s; font-weight: normal; } .onoffswitch.checkbox:hover label { color: $link_colour; } .onoffswitch.checkbox:hover > div label { border-color: $link_colour; } .onoffswitch-inner { display: block; width: 200%; margin-left: -100%; -moz-transition: margin 0.3s ease-in 0s; -webkit-transition: margin 0.3s ease-in 0s; -o-transition: margin 0.3s ease-in 0s; transition: margin 0.3s ease-in 0s; } .onoffswitch-inner:before, .onoffswitch-inner:after { display: block; float: left; width: 50%; height: 20px; padding: 0; line-height:20px; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; } .onoffswitch-inner:before { content: attr(data-on); padding-right: 21px; background-color: $item_colour; color: $font_colour; text-align: right; } .onoffswitch-inner:after { content: attr(data-off); padding-left: 21px; background-color: $item_colour; color: #ccc; text-align: left; } .onoffswitch-switch { display: block; width: 15px; margin:4px; background: #ccc; border-radius: 10px; position: absolute; top: 0; bottom: 0; right: 36px; -moz-transition: all 0.3s ease-in 0s; -webkit-transition: all 0.3s ease-in 0s; -o-transition: all 0.3s ease-in 0s; transition: all 0.3s ease-in 0s; } .onoffswitch.checkbox > div > input:checked + label .onoffswitch-inner { margin-left: 0px; } .onoffswitch.checkbox > div > input:checked + label .onoffswitch-switch { right: 0px; background-color: #0275d8; } .onoffswitch.checkbox > div > input:disabled + label .onoffswitch-switch { background-color: red; opacity: 0.3; filter:alpha(opacity=30); } .help-searchlist { list-style-type: none; } .help-searchlist a { font-size: 130%; } .embed-photo-selected-photo { border-color: blue; border-style: solid; border-width: 5px; } #wiki-preview img { max-width: 100%; } #ace-editor, #editor { border-bottom-left-radius: $radius; border-bottom-right-radius: $radius; } .sub-menu-wrapper { padding-left: 1rem; display: none; } .sub-menu { width: 100%; margin-top: 0.5rem; padding-left: 1rem; border-left: 0.2rem solid #eee; } .app-icon i { color: #777; font-size: 80px; text-shadow: 3px 3px 3px lightgrey; } .app-detail { text-align: center; } #login-main, .rmagic-button { max-width: 400px; margin-top: 20px; margin-left: auto; margin-right: auto; } #permcat-index { margin: 10px; } .cloud-container { float: left; width: 100px; height: 110px; margin: 5px; } .cloud-icon-container { width: 64px; height: 64px; border: 1px solid #eee; border-radius: $radius; } .cloud-icon i { font-size: 42px; color: #888; margin-top: 8px; margin-left: 6px; } .cloud-icon img { max-width: 64px; max-height: 64px; border-radius: $radius; } .cloud-title { width: 98px; height: 36px; overflow: hidden; } .caption-visible { max-height: 75%; } .oneway-overlay { position: absolute; text-shadow: -2px 0 1px #fff, 0 2px 1px#fff, 2px 0 1px #fff, 0 -2px 1px #fff; } .cover-photo-review { margin-bottom: 10px; } .hover-fx-hide { opacity: 0; } .hover-fx-show:hover .hover-fx-hide { opacity: 1; } /* default highlighted text if not specified by schema: */ span.default-highlight { background-color: yellow; } .bootstrap-tagsinput { width: 100%; } #region_3 { display: none !important; }