Last active
August 2, 2017 14:33
-
-
Save cmellwig/403ecc040e0c981bf8020cd088ab59a6 to your computer and use it in GitHub Desktop.
Admidio Clean
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /****************************************************************************** | |
| * Cascading-Style-Sheets file for Admidio | |
| * | |
| * Copyright : (c) 2004 - 2017 The Admidio Team | |
| * Homepage : https://www.admidio.org/ | |
| * License : GNU Public License 2 https://www.gnu.org/licenses/gpl-2.0.html | |
| * | |
| * Here you can edit the look and feel of Admidio | |
| * | |
| *****************************************************************************/ | |
| /**************************************************/ | |
| /* Basic Admidio layout classes */ | |
| /**************************************************/ | |
| :root { | |
| --back-bg-color: #99CC33; | |
| --front-bg-color: #349aaa; | |
| --title-font-color: #fff; | |
| --content-bg-color: #fff; | |
| --font-color: #263340; | |
| --dropdown-bg-color: #99CC33; | |
| --dropdown-font-color: #263340; | |
| --dropdown-font-color-hover: #000; | |
| --dropdown-bg-color-hover: #b4e84e; | |
| --navbar-font-color: #99CC33; | |
| --navbar-bg-color: #263340; | |
| --btn-font-color: #fff; | |
| --btn-hover-bg : #b4e84e; | |
| --btn-bg-color: #99CC33; | |
| --heading-bg-color: #99CC33; | |
| --heading-font-color: #fff; | |
| --inner-bg-color: #F6F6F6; | |
| --tabs-a-bg-color: #4E5F71; | |
| --tabs-a-font-color: #fff; | |
| --tabs-bg-color: #263340; | |
| --tabs-font-color: #fff; | |
| --separator-color: #263340; | |
| --table-hover: #E5F8C0; | |
| --table-even-color: #F7FFE6; | |
| --table-highlight: #99CC33; | |
| --table-highlight-light: #D0EE95; | |
| --table-highlight-font: #fff; | |
| --table-highlight-light-font: #263340; | |
| --link-color: #263340; | |
| } | |
| body { | |
| color: var(--font-color); | |
| margin: auto; | |
| text-align: center; | |
| } | |
| /*Copyright bottom*/ | |
| #copyright { | |
| color: var(--font-color); | |
| padding-top: 20px; | |
| text-align: center; | |
| /*filter: brightness(1000%);*/ | |
| } | |
| /*page background*/ | |
| #page { | |
| text-align: center; | |
| margin: 0 auto; | |
| padding: 72px 3% 3% 3%; | |
| z-index: -10; | |
| background-color: var(--front-bg-color); | |
| /* Colorwheel | |
| -webkit-filter: | |
| brightness(50%) sepia(1) hue-rotate(132deg) saturate(103.2%) brightness(91.2%); | |
| filter: | |
| brightness(90%) sepia(0) hue-rotate(89deg) saturate(103.2%) brightness(100.2%); | |
| */ | |
| /*position: relative;*/ | |
| box-shadow: 0 10px 40px -6px rgba(0, 0, 0, 0.5);; | |
| } | |
| #page-h1-membership { | |
| display: none !important; | |
| } | |
| /*site title font*/ | |
| #page-h1-orga { | |
| color: cvar(--title-font-color); | |
| font-weight: bold; | |
| } | |
| /*content container*/ | |
| .admidio-container { | |
| text-align: left; | |
| background-color: var(--content-bg-color); | |
| margin-bottom: 25px; | |
| } | |
| body > .admContent { | |
| background-color: #ffffff; | |
| padding: 15px; | |
| } | |
| /* Layout adjustments for devices > 7" */ | |
| @media (min-width: 768px) { | |
| body { | |
| background-color: var(--back-bg-color); | |
| } | |
| #header-block { | |
| padding: 10px; | |
| background-color: var(--front-bg-color); | |
| margin-left: 50px; | |
| } | |
| #page-h1-membership { | |
| display: none !important; | |
| } | |
| #page-h1-orga { | |
| display: none !important; | |
| } | |
| .admidio-container { | |
| border-radius: 7px; | |
| background-color: var(--content-bg-color); | |
| padding: 15px; | |
| position: relative; | |
| /*z-index: 1;*/ | |
| box-shadow: 0px 1px 19px 0px rgba(50, 50, 50, 0.5); | |
| } | |
| /* .admidio-container:before, .admidio-container:after | |
| { | |
| z-index: -10; | |
| position: absolute; | |
| content: ""; | |
| bottom: 15px; | |
| left: 10px; | |
| width: 50%; | |
| top: 80%; | |
| max-width:300px; | |
| background: #777; | |
| box-shadow: 0 15px 10px rgba(0, 0, 0, 0.5); | |
| transform: rotate(-2deg); | |
| } | |
| .admidio-container:after | |
| { | |
| transform: rotate(2deg); | |
| right: 10px; | |
| left: auto; | |
| position: absolute; | |
| z-index: -10; | |
| }*/ | |
| #admidio-logo { | |
| top: -50px; | |
| left: -50px; | |
| position: absolute; | |
| visibility: inherit; | |
| } | |
| } | |
| @media (min-width: 992px) { | |
| .admidio-default-menu-item { | |
| display: none !important; | |
| } | |
| } | |
| /* Layout adjustments for small devices */ | |
| @media (max-width: 767px) { | |
| #header-block { | |
| display: none !important; | |
| } | |
| .navbar-menu{ | |
| border-radius: 0px !important; | |
| margin: 0px !important; | |
| font-weight: bold; | |
| } | |
| #page { | |
| background-color: #fff; | |
| padding: 0 !important; | |
| } | |
| #page-h1-orga { | |
| display: none !important; | |
| } | |
| #copyright{ | |
| display: none !important; | |
| } | |
| } | |
| @media (max-width: 991px) { | |
| #adm_menu_item_login, | |
| #adm_menu_item_registration, | |
| #adm_menu_item_my_profile, | |
| #adm_menu_item_logout, | |
| #plugin_login_form, | |
| #plugin_menu { | |
| display: none !important; | |
| } | |
| } | |
| /**************************************************/ | |
| /* Headlines */ | |
| /**************************************************/ | |
| h1, | |
| h2, | |
| h3, | |
| h4, | |
| h5 { | |
| color: #333333; | |
| font-weight: bold; | |
| margin: 20px 0 15px 0; | |
| } | |
| h2 { | |
| font-size: 130%; | |
| border-bottom: 2px solid var(--separator-color); | |
| } | |
| h3 { | |
| font-size: 110%; | |
| } | |
| h4 { | |
| font-size: 100%; | |
| } | |
| @media (min-width: 768px) { | |
| h1 { | |
| font-size: 140%; | |
| /*letter-spacing: 0.2em;*/ | |
| border-bottom: 2px solid var(--separator-color); | |
| } | |
| } | |
| @media (min-width: 992px) { | |
| h1 { | |
| font-size: 170%; | |
| /*letter-spacing: 0.2em;*/ | |
| border-bottom: 2px solid var(--separator-color); | |
| } | |
| } | |
| @media (max-width: 767px) { | |
| h1, | |
| h3 { | |
| padding: 15px 5px; | |
| border: 1px solid var(--separator-color); | |
| border-left: 0; | |
| border-right: 0; | |
| background-color: #fff; | |
| } | |
| h1 { | |
| font-size: 18px; | |
| font-weight: normal; | |
| margin: 0 -15px 15px -15px; | |
| } | |
| h3 { | |
| padding: 10px 5px; | |
| margin: 15px -15px; | |
| } | |
| } | |
| /**************************************************/ | |
| /* Other styles */ | |
| /**************************************************/ | |
| hr { | |
| border: 1px solid #bad8e2; | |
| width: 100%; | |
| margin-bottom: 15px; | |
| } | |
| .ekko-lightbox-nav-overlay a:link, | |
| .ekko-lightbox-nav-overlay a:visited, | |
| .ekko-lightbox-nav-overlay a:hover, | |
| .ekko-lightbox-nav-overlay a:active { | |
| color: #ffffff; | |
| text-decoration: none; | |
| } | |
| .badge { | |
| margin-left: 4px; | |
| } | |
| .lead { | |
| font-size: 12pt; | |
| } | |
| .popover { | |
| min-width: 270px; | |
| } | |
| .modal-footer { | |
| text-align: left; | |
| } | |
| .alert { | |
| color: #AA3455; | |
| background-color: #F1D5DD; | |
| border-color: #F1BCCB; | |
| } | |
| .alert-info { | |
| color: #349AAA; | |
| background-color: #D5EEF1; | |
| border-color: #bce8f1; | |
| } | |
| .alert-small { | |
| margin-top: 5px; | |
| padding: 5px; | |
| } | |
| .caret, | |
| .caret-right { | |
| margin-right: 3px; | |
| } | |
| .caret-right { | |
| border-bottom: 4px solid transparent; | |
| border-top: 4px solid transparent; | |
| border-left: 4px solid; | |
| display: inline-block; | |
| height: 0; | |
| vertical-align: middle; | |
| width: 0; | |
| } | |
| .navbar-default .navbar-toggle .icon-bar { | |
| background-color: #fff; | |
| } | |
| /**************************************************/ | |
| /* Links */ | |
| /**************************************************/ | |
| a:link, | |
| a:visited { | |
| color: var(--link-color); | |
| } | |
| a:hover, | |
| a:active, | |
| .nav li a:hover, | |
| .nav li a:active, | |
| a.btn:hover, | |
| a.btn:active { | |
| text-decoration: underline; | |
| color: var(--link-color) !important; | |
| } | |
| a.btn { | |
| padding-top: 0; | |
| padding-left: 0; | |
| text-align: left !important; | |
| } | |
| /**************************/ | |
| /* Settings for all icons */ | |
| /**************************/ | |
| .admidio-icon-link img, | |
| .admidio-icon-info, | |
| .media-object, | |
| .admidio-icon-help, | |
| .btn img, | |
| .navbar-link img, | |
| .dropdown-toggle span.glyphicon { | |
| border: none; | |
| vertical-align: text-top; | |
| margin-left: 3px; | |
| filter:grayscale(50%); | |
| /*display: none !important;*/ | |
| /*height: 24px;*/ | |
| } | |
| .dropdown-menu { | |
| background-color: var(--dropdown-bg-color) !important; | |
| } | |
| /*dropdown link color*/ | |
| .navbar-link { | |
| color: var(--dropdown-font-color) !important; | |
| } | |
| .dropdown-menu > li > a:hover{ | |
| background-color: var(--dropdown-bg-color-hover) !important; | |
| color: var(--dropdown-font-color-hover) !important; | |
| } | |
| .navbar-link img, | |
| .btn img, | |
| .alert .glyphicon, | |
| .btn, | |
| .dropdown-toggle span.glyphicon { | |
| margin-right: 5px; | |
| } | |
| .admidio-icon-info, | |
| .admidio-icon-help { | |
| cursor: help; | |
| margin-right: 2px; | |
| } | |
| .pagination img { | |
| margin: 0 5px; | |
| } | |
| /*******************************/ | |
| /* Settings for navigationbars */ | |
| /*******************************/ | |
| .navbar { | |
| min-height: 0; | |
| margin-left: 5px; | |
| vertical-align: middle; | |
| margin-right: 5px; | |
| border-radius: 5px; | |
| border: 0px; | |
| background-color: var(--navbar-bg-color); | |
| color: var(--navbar-font-color) !important; | |
| } | |
| .nav > li > a { | |
| padding-top: 10px; | |
| padding-bottom: 10px; | |
| color: var(--navbar-font-color) !important; | |
| } | |
| .nav> li > a:hover{ | |
| color: var(--navbar-font-color) !important; | |
| } | |
| /*fix dropdown background*/ | |
| .open > a { | |
| background-color: var(--navbar-bg-color) !important; | |
| } | |
| .navbar .form-control, | |
| .navbar .btn { | |
| height: 28px; | |
| padding: 3px 8px; | |
| } | |
| .navbar-brand { | |
| color: #474b4c !important; | |
| padding: 10px 15px 10px 15px; | |
| line-height: inherit; | |
| } | |
| .navbar-toggle { | |
| margin-right: 5px; | |
| } | |
| .navbar .checkbox { | |
| padding-top: 2px; | |
| margin-bottom: 0; | |
| } | |
| .navbar .checkbox input { | |
| margin-right: 5px; | |
| } | |
| @media (min-width: 768px) { | |
| .navbar-collapse { | |
| padding-left: 0; | |
| padding-right: 0; | |
| height: 2px; | |
| } | |
| .navbar-nav > li:first-child > a { | |
| padding-left: 0; | |
| } | |
| } | |
| /* Style for tabs */ | |
| #tabs_nav_modules a, #tabs_nav_common a { | |
| font-weight: bold; | |
| border:0px !important; | |
| text-decoration: none !important; | |
| background-color: var(--tabs-bg-color); | |
| color: var(--tabs-font-color); | |
| } | |
| .nav-tabs > .active > a:link, | |
| .nav-tabs > .active > a:visited, | |
| .nav-tabs > .active > a:hover, | |
| .nav-tabs > .active > a:active { | |
| font-weight: bold; | |
| text-decoration: none !important; | |
| background-color: var(--tabs-a-bg-color) !important; | |
| color: var(--tabs-a-font-color) !important; | |
| } | |
| /* Customize css for module menu */ | |
| .navbar-brand:link, | |
| .navbar-brand:visited, | |
| .navbar-brand:hover, | |
| .navbar-brand:active { | |
| text-decoration: none !important; | |
| color: var(--navbar-font-color) !important; | |
| } | |
| .admidio-menu { | |
| margin: 0; | |
| } | |
| .admidio-menu img { | |
| vertical-align: bottom; | |
| } | |
| .admidio-media-menu p { | |
| margin: 0; | |
| } | |
| .admidio-media-submenu > li { | |
| padding-right: 0; | |
| } | |
| .admidio-media-submenu > li + li:before { | |
| content: ' | '; | |
| } | |
| .admidio-media-submenu > li:first-child:before { | |
| content: '[ '; | |
| } | |
| .admidio-media-submenu > li:last-child:after { | |
| content: ' ]'; | |
| } | |
| /**************************************************/ | |
| /* Customized layout for forms and their elements */ | |
| /**************************************************/ | |
| .form-horizontal .control-label { | |
| text-align: left; | |
| } | |
| .admidio-form-vertical .form-control-static { | |
| padding-top: 0; | |
| } | |
| .form-control-static { | |
| padding-bottom: 0; | |
| min-height: 0; | |
| } | |
| .admidio-form-vertical label { | |
| margin-bottom: 0; | |
| } | |
| .form-group, | |
| input[type="file"] { | |
| margin-bottom: 10px; | |
| padding-top: 0; | |
| } | |
| .navbar-form .form-group { | |
| margin-left: 0; | |
| margin-right: 10px; | |
| margin-top: -5px; | |
| } | |
| .navbar-form label { | |
| margin-right: 5px; | |
| } | |
| @media (min-width: 768px) { | |
| .col-sm-offset-3.btn { | |
| margin-left: 26%; | |
| } | |
| .form-control-small { | |
| width: 50%; | |
| } | |
| } | |
| /*.form-control:focus, | |
| .select2-container--focus .select2-selection, | |
| .select2-results__options { | |
| border-color: #263340 !important; | |
| color: #fff; | |
| background-color: #99CC33 !important; | |
| box-shadow: none !important; | |
| } | |
| */ | |
| select.form-control { | |
| width: auto; | |
| } | |
| .select2 { | |
| min-width: 100%; | |
| } | |
| .select2-results { | |
| text-align: left; | |
| } | |
| input[data-provide*="datepicker"], | |
| input[type="number"], | |
| input[type="time"] { | |
| width: 130px !important; | |
| } | |
| .datetime-date-control { | |
| display: inline; | |
| } | |
| .datetime-time-control { | |
| width: 100px !important; | |
| margin-left: 20px; | |
| } | |
| .form-horizontal .form-group-editor { | |
| margin-left: 0; | |
| margin-right: 0; | |
| } | |
| .btn-group .btn { | |
| margin-right: 0; | |
| } | |
| .btn-primary { | |
| background-color: var(--btn-bg-color); | |
| border:0; | |
| color: var(--btn-font-color); | |
| } | |
| .btn-primary:hover, | |
| .btn-primary:focus { | |
| background-color: var(--btn-hover-bg); | |
| } | |
| .btn.disabled { | |
| background-color: #aaaaaa !important; | |
| border-color: #aaaaaa !important; | |
| color: #ffffff; | |
| } | |
| .admidio-form-group-required label:after, | |
| .admidio-form-required-notice span:after { | |
| content: url('../icons/bullet_red.png'); | |
| white-space: nowrap; | |
| vertical-align: top; | |
| } | |
| .admidio-form-required-notice { | |
| font-size: 9pt; | |
| margin-top: 5px; | |
| margin-bottom: -10px; | |
| text-align: right; | |
| width: 100%; | |
| display: inline-block; | |
| } | |
| /********************************************************************************/ | |
| /* A simple groupbox/panel to group some elements. This is often used in forms. */ | |
| /********************************************************************************/ | |
| .panel-default { | |
| border: 0px; | |
| background-color: var(--inner-bg-color); | |
| } | |
| .panel-default > .panel-heading { | |
| color: var(--heading-font-color); | |
| font-weight: bold; | |
| background-color: var(--heading-bg-color); | |
| } | |
| .tab-pane > .panel-group > .panel-default > .panel-heading { | |
| border-bottom-left-radius: 5px; | |
| border-bottom-right-radius: 5px; | |
| background-color: var(--heading-bg-color); | |
| } | |
| .panel-heading { | |
| display: inline-block; | |
| width: 100%; | |
| } | |
| .panel-heading a:link, | |
| .panel-heading a:visited { | |
| color: #222222; | |
| font-weight: bold; | |
| text-decoration: none; | |
| } | |
| .panel-group .panel, | |
| .panel-default { | |
| } | |
| /* Panel which includes the ckeditor in a nice way without separate borders */ | |
| .admidio-panel-editor .panel-body { | |
| padding: 0; | |
| } | |
| .admidio-panel-editor .panel-body .form-group { | |
| margin-bottom: 0; | |
| } | |
| .admidio-panel-editor .panel-body .cke_chrome { | |
| border-width: 0; | |
| } | |
| .admidio-panel-editor .panel-body .cke_bottom, | |
| .admidio-panel-editor .panel-body .cke_inner { | |
| } | |
| /* Information block with user and timestamp who created and edited the data */ | |
| .admidio-info-created-edited { | |
| font-size: 8pt; | |
| margin-top: 8px; | |
| } | |
| .admidio-info-created { | |
| display: block; | |
| } | |
| /* Layout for some boxes that is used in announcements or events module */ | |
| .panel-primary { | |
| background-color: transparent; | |
| border-color: transparent; | |
| box-shadow: none; | |
| margin-bottom: 30px; | |
| } | |
| .panel-primary > .panel-heading { | |
| color: #333333; | |
| font-size: 12pt; | |
| font-weight: bold; | |
| background-color: transparent; | |
| padding: 3px 0; | |
| } | |
| .panel-primary > .panel-body { | |
| padding: 10px 0; | |
| } | |
| .panel-primary > .panel-footer { | |
| padding: 5px 0 0 0; | |
| background-color: white; | |
| font-size: 8pt; | |
| } | |
| .admidio-panel-heading-icon { | |
| margin-right: 8px; | |
| vertical-align: sub; | |
| border-width: 0; | |
| } | |
| .admidio-panel-comment { | |
| overflow: hidden; | |
| margin: 10px 20px; | |
| } | |
| /*******************************************************************/ | |
| /* Layout for tables that will be used in lists or download module */ | |
| /*******************************************************************/ | |
| @-moz-document url-prefix() { | |
| fieldset { | |
| display: table-cell; | |
| } | |
| } | |
| .table thead > tr > th { | |
| color: var(--table-highlight-font); | |
| background-color: var(--table-highlight); | |
| padding: 5px !important; | |
| border-bottom: 2px solid var(--separator-color); | |
| } | |
| .admidio-group-heading td { | |
| color: var(--table-highlight-light-font); | |
| background-color: var(--table-highlight-light); | |
| font-weight: bold; | |
| border-bottom: 2px solid var(--separator-color); | |
| } | |
| .admidio-group-heading { | |
| cursor: pointer; | |
| } | |
| .table tbody > tr > td { | |
| word-wrap: break-word; | |
| } | |
| .table tbody > tr:nth-child(even){ | |
| background-color: var(--table-even-color); | |
| } | |
| .table-hover > tbody > tr:hover > td { | |
| background-color: var(--table-hover); | |
| } | |
| .dataTable { | |
| border-bottom: 2px solid var(--separator-color); | |
| } | |
| .dt-bootstrap { | |
| margin-bottom: 20px; | |
| } | |
| /**************************************************/ | |
| /* Module specific css layout */ | |
| /**************************************************/ | |
| #login_registration_link, | |
| #login_admidio_link { | |
| margin-top: 15px; | |
| } | |
| /* Profile */ | |
| @media (min-width: 768px) { | |
| #div_profile_photo { | |
| text-align: right; | |
| } | |
| #div_profile_photo a.btn { | |
| padding-right: 0; | |
| text-align: right !important; | |
| } | |
| } | |
| @media (max-width: 767px) { | |
| #div_profile_photo { | |
| text-align: left; | |
| } | |
| } | |
| #profile_photo { | |
| display: inline; | |
| } | |
| /*.admidio-list-roles-assign li, | |
| .admidio-list-roles-assign-pos li { | |
| border-width: 0; | |
| } | |
| .admidio-list-roles-assign li { | |
| padding: 0 0 15px 0; | |
| } | |
| .admidio-list-roles-assign, | |
| .admidio-list-roles-assign-pos { | |
| margin-bottom: -5px; | |
| } | |
| .admidio-list-roles-assign-pos li { | |
| padding: 0 0 5px 0; | |
| }*/ | |
| #admidio-password-strength { | |
| margin-top: 10px; | |
| } | |
| #admidio-password-strength-minimum { | |
| position: absolute; | |
| border: 9px solid transparent; | |
| border-left-color: #555555; | |
| border-right-width: 0; | |
| margin-top: 1px; | |
| } | |
| /* Fullscreen mode for lists */ | |
| body > .admidio-content { | |
| background-color: #ffffff; | |
| padding: 15px; | |
| } | |
| /* Photos */ | |
| .admidio-img-presenter { | |
| margin-bottom: 10px; | |
| } | |
| .admidio-album-thumbnail { | |
| height: 200px; | |
| } | |
| @media (min-width: 992px) and (max-width: 1100px) { | |
| .admidio-album-card-description { | |
| padding-left: 30px; | |
| } | |
| } | |
| .thumbnail:hover { | |
| border: 1px solid #ff9c00; | |
| } | |
| .thumbnail { | |
| margin-bottom: 5px; | |
| } | |
| /* Needed to remove dotted border around images in firefox */ | |
| .ekko-lightbox-nav-overlay a { | |
| outline: none; | |
| } | |
| /* Weblinks */ | |
| .admidio-weblink-item { | |
| padding-top: 15px; | |
| } | |
| .admidio-weblink-description { | |
| padding: 5px 0; | |
| } | |
| /* Events */ | |
| tr.admidio-event-highlight, | |
| .admidio-event-highlight .panel-heading { | |
| font-weight: bold; | |
| color: #ff9c00; | |
| } | |
| .panel-primary.admidio-event-highlight > .panel-heading { | |
| border-bottom: 2px solid #ff9c00; | |
| } | |
| /* Plugin area */ | |
| .admidio-plugin-content > div > a { | |
| white-space: normal; | |
| } | |
| /*checkbox fix*/ | |
| input#mem_show_all { | |
| top:3px; | |
| } | |
| #navbar_filter_form, #sel_change_view_group, #cat_id_group { | |
| padding-top:5px; | |
| } | |
| #header-block{ | |
| box-shadow: 0px 2px 9px 0px rgba(50, 50, 50, 0); | |
| } |
Author
cmellwig
commented
Jul 30, 2017
•
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment