AthensFramework/core

View on GitHub
assets/css/web.css

Summary

Maintainability
Test Coverage
h1.header {
    float:left;
    margin:0;
}

h2.subheader {
    margin-top:-15px;
    float:left;
    clear:left
}

.section-label {
    background-color: #646464;
    color: white;
    margin-left:-30px;
    margin-bottom:8px;
    margin-top:20px;
    padding-left:30px;
    padding-bottom:5px;

    font-family: "Encode Sans Compressed",sans-serif;
    font-weight: 600;
}

div.form-group[data-field-type-for="section-label"] label {
    display:none;
}

.cd-panel-container td {
    padding:5px !important;
}

input {
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;

}

div.search-icon {
    background: url("../images/search-icon.svg") no-repeat;
    margin:6px 12px;
    width:19px;
    height:20px;
    float:right;
    cursor: pointer;
}

div.loading-gif {
    background: url("../images/ajax-loader.gif") no-repeat;
    margin:20% auto 0 auto;
    width:55px;
    height:55px;
    opacity:.6;
}

div.loading-gif.hidden {
    position:fixed;
    z-index:-1
}

div.loading-gif.class-loader {
    position:absolute;
    z-index:100000;
    top:0;
    left:50%
}

div.search-icon:hover, div.search-icon:focus {
    background-image:url("../images/search-icon-gold.svg");
}

#mask-screen {
    position:fixed;
    width:100%;
    height:0;
    z-index:500;

    background-color:rgba(255, 255, 255, 0.4);

    opacity:0;

    transition: opacity .25s ease-in-out;
}

.search-div {
    z-index:600;
    position:fixed;

    min-height:20%;
    width:620px;

    margin-top:20%;
    margin-left:auto;
    margin-right:auto;
    background-color:white;
    border-radius:3px;
    border:1px solid lightgrey;

    left:0;
    right:0;
    display:none;

    transition: opacity .25s ease-in-out;
}

.search-div table {
    margin:5px;
    width:100%
}

.search-div input[type="submit"] {
    float:right;
    margin-right:25px;
}

.search-div td.fieldname select {
    max-width:320px;
}

.search-div .section-label {
    margin-top:0;
    margin-left:0;
    padding:5px 0 7px 15px;
    border-top-left-radius:3px;
    border-top-right-radius:3px;
}

div.notification {
    border-radius:5px;
    color:black;
    padding-left:5px;
    opacity:0;
    margin:3px;

    transition: opacity .4s ease-in-out;
}

div.notification.success {
    background-color:#347C17;
}

div.notification.failure {
    background-color:#DC381F;
}

.chosen-single {
    height:35px !important;
    border-radius:3px !important;
    line-height:35px !important;
    font-size:16px !important;
}

span.field-errors {
    color:red;
}

.form-errors, .pickaform-errors {
    color:red;
}

form>tbody>tr:last-child {
    margin-bottom:40px !important;
}

br + span.field-errors {
    display:block;
    margin-top:-40px !important;
    margin-bottom:40px;
}

.section-label a {
    color:white;
}

.section-label a:hover, a:focus {
    color:#B6A379;
}

div.ajax-loaded-section {
    transition: opacity .2s ease-in-out;
}

table {
    border-collapse: separate;
    border-spacing: 0 5px;
    margin-bottom:10px;
    width:95%
}
td.label {
    min-width:25%;
}
td:first-child {
    padding-left:3px;
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
}
td:last-child {
    border-bottom-right-radius: 5px;
    border-top-right-radius: 5px;
}

.clickable, th.clickable {
    cursor: pointer;
    transition: background-color .3s ease-in-out;
}

tr.highlighted {
    background-color: #dcdcdc;
    border-radius:3px;
}

.clickable:hover {
    background-color: #dcdcdc;
    border-radius:3px;
}

.clickable:active {
    background-color: white;
}

th.clickable:hover {
    background-color: #DDD;
    border-radius:3px;
}

th.sorted.ascending::after {
    content: "\0000a0\21e3";
}

th.sorted.descending::after {
    content: "\0000a0\21e1";
}

p.filter-feedback {
    text-align:center;
    font-size:.8em;
    font-weight:800;
}

div.filter-controls {
    display:none;
}

th {
    padding-left:3px;
    padding-right:20px;
}

td {
    padding-left:3px;
}

input[type=checkbox] {
    margin-left:35%;
}

span.multiple-choice-field input[type=checkbox] {
    margin-left: 2px;
}

textarea {
    margin-bottom:5px;
}

textarea.disabled, input.disabled {
    background-color:#ccc;
    color:#999;
}

span.disabled {
    opacity:.5;
}

table.statement {
    width:90%;
    border:none;
    margin-bottom:0 !important;
}

select.oversized {
    float:right;
    margin-right:-100px;
    margin-bottom:30px;
}

#top-filters select {
    margin-right:3px;
}

div.pagination-container {
    float:right;
    margin-right:30px;
    margin-top:-5px;
    font-size:20px
}

a.pagination-arrow {
    cursor:pointer;
}

a.pagination-arrow.hidden {
    opacity:0;
    pointer-events: none;
    cursor:default
}

select.pagination-filter {
    font-size:13px;
    border-radius:3px;
    background-color: #646464
}

span.pagination-arrow-container {
    min-width:40px;
}

button:disabled {
    color:#aaa;
}

div.link-section {
    width:100%;
    text-align:right;
    margin-bottom:-20px;
}

div.select-a-section-container {
    width:110%;
    overflow:hidden;
    border-color:#E7E7E7;
    border-style:solid;
    border-width:1px 0 0 0;
    margin-left:-20%;
}

div.select-a-section-container div.left {
    float:right;
    width:20%;
    text-align:center;
}

div.select-a-section-container div.right {
    float:right;
    border-right:1px;
    border-top:0;
    border-bottom:1px;
    border-left:0;
    border-color:#E7E7E7;
    border-style:solid;
    width:80%;
    min-height:500px;
}

div.select-a-section-container div.option {
    border:1px solid #E7E7E7;
    border-width:0 1px 1px 1px;
    height:40px;
    line-height:40px;
    background-color: #DDD;
    color:#AAA;
    cursor:pointer;
    transition: all .3s ease-in-out;
    white-space: nowrap;
}

div.select-a-section-container div.option.selected {
    background-color: white;
    color: black;
    border-right-color:white;
}

div.select-a-section-container div.option:not(.selected):not(.header):hover {
    background-color: #EAEAEA;
    color: #555;
    border-right-color:#EEE;
}

div.select-a-section-container div.option.header {
    background-color: #dcdcdc;
    color: black;
    cursor:auto;
}

div.select-a-section-container div.filler {
    border:1px solid #E7E7E7;
    border-width:0 1px 0 0;
    padding-bottom:50000px;
    margin-bottom:-50000px;
}

div.select-a-section-container div.control-container {
    float: left;
    line-height: 40px;
    height: 40px;
    padding-left: 10px;
    min-width:20px;
}

div.select-a-section-container div.label-container {
    margin-left:-30px;
    width:100%;
}

div.select-a-section-container div.section-label {
    color: #646464;
    background-color:white;
    margin-left:5px;
    font-family: 'Open Sans', sans-serif;
    padding-left:0;
    margin-bottom:0;
}

div.select-a-section-container table {
    border: none;
}

div.select-a-section-container div.selection {
    display: none;
}

div.select-a-section-container div.selection.default {
    display: block;
    margin:7px;
    margin-left:12px;
    color:#656565;
}

div.select-a-section-container p.form-errors {
    display:none;
}

div.select-a-section-container table {
    margin-left:5px;
}

table.multi-adder tr.prototypical {
    display: none;
}

tr.form-row td[class*="remove"] {
    cursor:pointer;
    text-align:center;
    font-weight:bold;
    font-size:2em;
    color: #950000;
}

div.code {
    width:95%;
    border-radius:5px;
    border: 1px solid black;
    white-space:pre-wrap;
    padding:5px;
    margin-left:auto;
    margin-right:auto;
    font-family:monospace;
    font-size:.9em;
}

span.code {
    font-family:monospace;
    background-color: #ffdfc9;
    border: 1px solid #ff8f7b;
    border-radius:3px;
    padding: 0 3px;
}

p.field-label {
    font-weight:700;
    font-size:17px;
}

div.uw-container-inner {
    min-height:73%;
}

.page-width {
    width:100%;
}

#page-content {
    min-width:500px;
    margin:auto
}

#loadItHere #page-content {
    width:100%;
}

br.footer-break {
    line-height:90px
}

#top-filters {
    float:right;
    margin-top:8px
}

#notification-area {
    position:fixed;
    width:600px;
    top:30px;
    right:20px;
    z-index:100000
}

br.page-content-head {
    line-height:70px;
    clear:both
}

p.important-task {
    background-color: #b3ffa0;
    padding:10px;
    border-radius: 5px;
    border:1px solid darkgreen;
}

li > p {
    margin-top:10px;
}

tr button {
    line-height:19px;
}

tr a button {
    color: rgb(89, 89, 89);
}

button.form-action, input.form-action {
    margin-right:60px;
}

div.breadcrumbs-container {
    min-width:500px;
    position:relative;
    margin:10px auto 0px;
}

tr.highlightable:hover {
    background-color: #f0f0f0;
}

tr.highlightable.highlighted:hover {
    background-color: #dcdcdc;
}

tr.highlightable {
    cursor: pointer;
}

label.field-label:not(.empty)::after {
    content: ":";
}

label.field-label.required::after {
    content: ":*";
}

form.inline label.field-label {
    display:inline;
}

#object-manager-table td {
    max-width: 400px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

#page-content-body {
    clear:left;
    padding-top:10px;
}

div.select-container {
    display: inline-block;
}

.chosen-container .chosen-results li.active-result {
    font-size:17px;
}

label.radio-label, .inline-fields label.radio-label {
    width:initial;
    font-weight:normal;
}