925 lines
20 KiB
C#
925 lines
20 KiB
C#
/*
|
|
* $Revision$
|
|
* $Id$
|
|
*
|
|
* Facilitor default.css, styles for Mobile
|
|
*/
|
|
|
|
/* class overrules */
|
|
div.ui-controlgroup {
|
|
width: 100%;
|
|
}
|
|
.ui-title { /* btn left heeft left: 5px en is zelf 37px breed, plus 5px voor de mooi = 47px */
|
|
margin: 0 47px 0 !important;
|
|
}
|
|
|
|
.ui-content,
|
|
.ui-popup-container,
|
|
.ui-mobile .ui-page {
|
|
background-color: ==mobilebackgroundcolor==;
|
|
color: ==mobiletextcolor==;
|
|
}
|
|
#simpelpage {
|
|
text-align: center;
|
|
}
|
|
.ui-li-count {
|
|
max-width: 30%;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
/* Mobile Grid 3 kolommen: plaatje en tekst centreren */
|
|
.ui-grid-b img {
|
|
display: block;
|
|
height: 85px !important;
|
|
max-width: 100%;
|
|
margin: 0 auto;
|
|
border-radius: 4px;
|
|
font-size: 12px; /* Voor de alt tekst */
|
|
}
|
|
.ui-grid-b .imgCaption {
|
|
width: 100%;
|
|
font-size: 12px;
|
|
text-align: center;
|
|
}
|
|
|
|
.ui-selected {
|
|
background-color: #f1f1f1; /* harde kleur.. */
|
|
border-radius: 60px;
|
|
}
|
|
|
|
.ui-selected:hover {
|
|
background-color: lightGrey; /* harde kleur.. */
|
|
border-radius: 70px;
|
|
}
|
|
|
|
/* Voorzichtig voor bootstrap (op desktop is dit global) */
|
|
.container-fluid,
|
|
.container-fluid * {
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
span.miconimg {
|
|
font-size: 4em;
|
|
color: ==mobileiconcolor== !important;
|
|
text-shadow: 1px 1px #FFF;
|
|
}
|
|
/* als groter (bv landscape) dan groter */
|
|
@media all and (min-width: 480px) {
|
|
.ui-grid-b img {
|
|
height: 100px !important;
|
|
}
|
|
.ui-grid-b .imgCaption {
|
|
font-size: 13px;
|
|
}
|
|
span.miconimg {
|
|
font-size: 5em;
|
|
}
|
|
}
|
|
@media all and (min-width: 640px) {
|
|
.ui-grid-b img {
|
|
height: 120px !important;
|
|
}
|
|
.ui-grid-b .imgCaption {
|
|
font-size: 14px;
|
|
}
|
|
span.miconimg {
|
|
font-size: 6em;
|
|
}
|
|
}
|
|
|
|
@media all and (min-width: 800px) {
|
|
.ui-grid-b img {
|
|
height: 140px !important;
|
|
}
|
|
.ui-grid-b .imgCaption {
|
|
font-size: 15px;
|
|
line-height: 2em;
|
|
}
|
|
span.miconimg {
|
|
font-size: 7em;
|
|
}
|
|
}
|
|
|
|
/* FACILITOR classes */
|
|
.dont-break-out { /* from: https://css-tricks.com/snippets/css/prevent-long-urls-from-breaking-out-of-container/ */
|
|
/* These are technically the same, but use both */
|
|
overflow-wrap: break-word;
|
|
word-wrap: break-word;
|
|
|
|
-ms-word-break: break-all;
|
|
/* This is the dangerous one in WebKit, as it breaks things wherever */
|
|
word-break: break-all;
|
|
/* Instead use this non-standard one: */
|
|
word-break: break-word;
|
|
|
|
/* Adds a hyphen where the word breaks, if supported (No Blink) */
|
|
-ms-hyphens: auto;
|
|
-moz-hyphens: auto;
|
|
-webkit-hyphens: auto;
|
|
hyphens: auto;
|
|
|
|
white-space: normal;
|
|
}
|
|
#loginhtml {
|
|
background-image: none !important;
|
|
}
|
|
#loginfooter {
|
|
position: relative !important;
|
|
margin-top: 24px !important;
|
|
bottom: 0!important;
|
|
}
|
|
|
|
#mod_pass2mail {
|
|
width: 300px !important;
|
|
}
|
|
|
|
.subject {
|
|
line-height: 1.8em;
|
|
font-size: 0.95em;
|
|
}
|
|
div.subheader {
|
|
text-overflow: ellipsis;
|
|
overflow:hidden;
|
|
}
|
|
|
|
.note-hint-m::before {
|
|
content: "*";
|
|
}
|
|
.note-hint-m {
|
|
margin-bottom: 1em;
|
|
font-style: italic;
|
|
}
|
|
|
|
.reply-wrapper-m {
|
|
position: relative;
|
|
display: flex;
|
|
align-items: center;
|
|
height: 4em;
|
|
width: 100%;
|
|
margin: 0;
|
|
margin-bottom: .5em;
|
|
}
|
|
.reply-container-m {
|
|
width: calc(100% - 1.1em);
|
|
max-height: 3.2em;
|
|
border-radius: 8px;
|
|
padding: 0.4em;
|
|
margin: 0;
|
|
background-color: rgba(0, 0, 0, 0.03);
|
|
border-left: 0.3em solid ==notesbackgroundcolor==;
|
|
}
|
|
|
|
.reply-header-m,
|
|
.reply-body-m {
|
|
position: relative;
|
|
text-overflow: ellipsis;
|
|
overflow: hidden;
|
|
white-space: nowrap;
|
|
margin: 4px;
|
|
line-height: 1.3em
|
|
}
|
|
|
|
.reply-header-m {
|
|
font-size: 0.8em;
|
|
font-weight: 600;
|
|
}
|
|
.reply-body-m {
|
|
display: block;
|
|
font-size: small;
|
|
}
|
|
|
|
/* Onderstaande werkt niet in IE11, maar boeie, het gaat alleen om de ellipsis [...] */
|
|
.reply-body-m {
|
|
display: -webkit-box;
|
|
-webkit-box-orient: vertical;
|
|
-webkit-line-clamp: 1;
|
|
max-height: 1.3em; /* Dit is de IE11 fallback, hoogte = 1 line-height */
|
|
}
|
|
|
|
.subheader .listbodykop {
|
|
color: ==mobilelistsubtitlecolor==;
|
|
font-size: 0.7em;
|
|
margin-top: 0px;
|
|
margin-bottom: 4px;
|
|
text-transform: uppercase;
|
|
}
|
|
.subheader .listbodykop i.fa-fw {
|
|
color: ==mobilelistsubtitlecolor== !important;
|
|
}
|
|
.subheader .listbodytext {
|
|
color: ==mobilelisttextcolor==;
|
|
font-weight: normal;
|
|
font-size: small;
|
|
white-space:normal; /* Wordwrap gewenst in listviews */
|
|
}
|
|
.pda_list_icon,
|
|
.ui-listview .ui-li-has-thumb > img:first-child,
|
|
.ui-listview .ui-li-has-thumb > .ui-btn > img:first-child {
|
|
position: absolute;
|
|
top: 50%;
|
|
left: 3.125em;
|
|
transform: translate(-50%, -50%);
|
|
}
|
|
.c1, .n1 {
|
|
color: ==mobilelisttextcolor==;
|
|
font-size: 0.9em !important;
|
|
font-weight: 600 !important;
|
|
}
|
|
.cs1,
|
|
.notegroup {
|
|
color: ==mobilelisttitlecolor==;
|
|
margin-left: 8px;
|
|
font-size: 0.9em;
|
|
}
|
|
.c2, .date, .n2 {
|
|
font-size: 0.7em;
|
|
font-weight: normal;
|
|
}
|
|
.omschr {
|
|
font-size: 0.6em;
|
|
font-weight: normal;
|
|
}
|
|
.f1 {
|
|
font-size: 0.9em;
|
|
}
|
|
.f2 {
|
|
font-size: 0.8em;
|
|
font-style: italic;
|
|
padding-left: 2px;
|
|
}
|
|
|
|
.n2 { white-space: nowrap; }
|
|
|
|
.portaldivider {
|
|
background-color: ==mobileiconcolor==;
|
|
}
|
|
|
|
#newstable li {
|
|
background-color: ==mobilebackgroundcolor==; /* same as menu */
|
|
}
|
|
#newstable .portalnewstext {
|
|
font-size: smaller;
|
|
white-space:normal;
|
|
}
|
|
|
|
/* Conditiescore dcscore1 t/m dcscore6 */
|
|
li.dcscore1, li.dcscore2, li.dcscore1_5, li.dcscore2_5 {
|
|
background-color: #87DD87; /* harde kleur.. ok */
|
|
}
|
|
li.dcscore3, li.dcscore4, li.dcscore3_5, li.dcscore4_5 {
|
|
background-color: #FFC859; /* harde kleur.. ok */
|
|
}
|
|
li.dcscore5, li.dcscore6, li.dcscore5_5 {
|
|
background-color: #FD7878; /* harde kleur.. ok */
|
|
}
|
|
|
|
li.recentlychangedmld a {
|
|
background-color: #FDFF9F !important; /* harde kleur.. ok */
|
|
opacity: 1.0;
|
|
}
|
|
|
|
.ui-listview .ui-li-has-thumb>i:first-child,
|
|
.ui-listview .ui-li-has-thumb>.ui-btn>i:first-child {
|
|
position: absolute;
|
|
left: 0.7em;
|
|
max-height: 5em;
|
|
max-width: 5em;
|
|
}
|
|
|
|
.mldicon {
|
|
left: 0.2em !important;
|
|
top: 0 !important;
|
|
}
|
|
|
|
.moreinfo input {
|
|
font-weight: bold;
|
|
color: #000 !important; /* harde kleur.. */
|
|
}
|
|
|
|
span.details {
|
|
color: #3388cc; /* harde kleur.. */
|
|
font-weight: bold;
|
|
}
|
|
span.details:hover {
|
|
text-decoration: underline;
|
|
}
|
|
|
|
.required {
|
|
border-left: 2px solid ==requiredbordercolor== !important;
|
|
}
|
|
.missing,
|
|
.suggest.missing {
|
|
background-color: #ff5050 !important; /* harde kleur.. ok */
|
|
}
|
|
.attention {
|
|
color: #E63600 !important; /* harde kleur.. ok */
|
|
}
|
|
|
|
.resruimte .ui-page,
|
|
.resruimte .ui-content {
|
|
padding: 0;
|
|
margin: 0;
|
|
}
|
|
.bezet, .vrij {
|
|
font-weight: bold;
|
|
text-align: center;
|
|
text-transform: uppercase;
|
|
}
|
|
.bezet {
|
|
background-color: transparent;
|
|
margin-bottom:6px;
|
|
}
|
|
.vrij {
|
|
background-color: transparent;
|
|
}
|
|
.bezetinfo {
|
|
font-size: 0.9em;
|
|
}
|
|
.resruimte div.dbezet,
|
|
.resruimte div.dvrij {
|
|
padding: 0 10%;
|
|
}
|
|
div.dbezet {
|
|
background-color: #E63600; /* harde kleur.. ok */
|
|
color: white; /* harde kleur.. ok */
|
|
}
|
|
div.pbezet {
|
|
background-color: #E63600 !important; /* harde kleur.. ok */
|
|
color: white; /* harde kleur.. ok */
|
|
}
|
|
div.dbezet .bezetinfo {
|
|
color: white; /* harde kleur.. ok */
|
|
}
|
|
div.dbezet .plantime {
|
|
color: #333; /* harde kleur.. ok */
|
|
}
|
|
.cvrij, .cbezet {
|
|
margin-top: 1em;
|
|
}
|
|
.modhint {
|
|
margin: 15px 0 17px 0;
|
|
}
|
|
.modconfirm {
|
|
margin: 0 0 17px 0;
|
|
color: #d91b1b; /* harde kleur.. */
|
|
}
|
|
.mobile2touch {
|
|
float: right;
|
|
}
|
|
|
|
.mobile2touch a {
|
|
font-weight: 400 !important;
|
|
font-size: 0.8em;
|
|
color: ==mobilefootercolor== !important;
|
|
}
|
|
|
|
.micon {
|
|
padding: 10px 6px 10px 6px !important;
|
|
text-align: center;
|
|
color: ==mobileicontextcolor== !important;
|
|
}
|
|
|
|
.selfie {
|
|
border-radius: 20px;
|
|
max-width: 150px;
|
|
max-height: 200px;
|
|
}
|
|
.footerphoto {
|
|
height: 40px;
|
|
max-width: 40px;
|
|
float: right;
|
|
border-radius: 20px;
|
|
}
|
|
.numspinner {
|
|
height: 40px;
|
|
max-width: 60px;
|
|
float: right;
|
|
border-radius: 20px;
|
|
}
|
|
|
|
.ui-collapsible-heading {
|
|
font-size:16px !important;
|
|
}
|
|
.ui-collapsible.ui-btn {
|
|
background-color: ==flexlabelbackgroundcolor== !important;
|
|
color: ==flexlabelcolor== !important;
|
|
}
|
|
|
|
.bijlagepopup-ext1 {
|
|
width: 100% !important;
|
|
min-width: 400px;
|
|
height: 17em !important;
|
|
}
|
|
|
|
#bijlagepopup {
|
|
width:100%;
|
|
padding:0.4em !important;
|
|
}
|
|
.mfcltmodal {
|
|
width:270px;
|
|
height:160px !important;
|
|
}
|
|
|
|
#mod_bijlagenM {
|
|
width:250px;
|
|
height:140px;
|
|
}
|
|
body.modal .fcltblock {
|
|
background-color: transparent;
|
|
border:0px;
|
|
}
|
|
.fcltblock .inside {
|
|
padding: 1px 3px 2px 3px;
|
|
background-color: transparent;
|
|
}
|
|
/* Bovenop in mobile */
|
|
#ui-datepicker-div {
|
|
z-index: 9999 !important;
|
|
}
|
|
|
|
.suggestautocompleteContainer {
|
|
margin-left: 7px;
|
|
border-radius: 4px;
|
|
border-color: #ccc;
|
|
background-color: #FFFFFF; /* harde kleur.. */
|
|
}
|
|
.suggestsr, span.suggestMore {
|
|
border-bottom: 1px solid #f3f3f3;
|
|
background-color: #FFFFFF; /* harde kleur.. */
|
|
}
|
|
.suggestsrs, .suggestsr, .suggestsrt, .suggestsrc {
|
|
line-height: 2em;
|
|
font-size: 0.95em;
|
|
font-family: inherit;
|
|
}
|
|
|
|
#mobplan {
|
|
text-align: center;
|
|
}
|
|
|
|
#mobplan img {
|
|
border: 1px solid #333;
|
|
}
|
|
|
|
img.kenmerk {
|
|
border: 1px solid #ccc;
|
|
max-height: 100px;
|
|
max-width: 100px;
|
|
display:block;
|
|
}
|
|
|
|
#rsMaxLines {
|
|
color: red; /* harde kleur..ok */
|
|
background-color: white; /* harde kleur.. ok */
|
|
font-weight: bold;
|
|
}
|
|
|
|
/* For internal styling within textarea's */
|
|
.fclthtml {
|
|
line-height: 1.5em;
|
|
}
|
|
.fclthtml table, .fclthtml td, .fclthtml th {
|
|
border-collapse: collapse;
|
|
border: solid 1px #888;
|
|
}
|
|
.fclthtml th {
|
|
background-color: #999; /* harde kleur.. */
|
|
}
|
|
.fclthtml td {
|
|
opacity: 0.8;
|
|
}
|
|
|
|
/* reserveringsinfoschermpje */
|
|
.resruimte {
|
|
text-align: center;
|
|
}
|
|
.resphoto {
|
|
width: 100%;
|
|
padding: 2px 0 1px 0;
|
|
text-align: center;
|
|
}
|
|
table.planbord {
|
|
margin: 5px auto;
|
|
}
|
|
.resphoto img {
|
|
margin: 0;
|
|
max-width: 100%;
|
|
max-height: 300px;
|
|
}
|
|
|
|
@media all and (min-width: 480px) {
|
|
.resphoto img {
|
|
min-width: 400px;
|
|
max-height: 400px;
|
|
}
|
|
}
|
|
|
|
div.plantime {
|
|
font-size: 0.7em;
|
|
}
|
|
.resoms {
|
|
background-color: white; /* harde kleur.. */
|
|
color: #333; /* harde kleur.. */
|
|
line-height: 1.2em;
|
|
padding: 0.5em 1em;
|
|
font-size: 0.95em;
|
|
text-align: center;
|
|
box-shadow: 2px 2px 2px #888888;
|
|
max-width: 100%;
|
|
margin: auto;
|
|
}
|
|
div.dbezet .resoms {
|
|
background: none;
|
|
color: #fff; /* harde kleur.. */
|
|
box-shadow: none;
|
|
}
|
|
|
|
.ins_deleted, .alg_deleted {
|
|
background-color: red; /* harde kleur.. */
|
|
color: white; /* harde kleur.. */
|
|
font-weight: bold;
|
|
text-align: center;
|
|
padding: 4px;
|
|
margin-top: 2px;
|
|
font-variant: small-caps;
|
|
}
|
|
|
|
@media all and (min-width: 720px) {
|
|
.vrij, .bezet,
|
|
.resruimte .ui-btn {
|
|
font-size: 2em;
|
|
}
|
|
.bezetinfo {font-size: 1em;}
|
|
.resoms {
|
|
line-height: 2em;
|
|
font-size: 1.4em;
|
|
}
|
|
.resphoto img {
|
|
width: 100%;
|
|
max-height: 100%;
|
|
}
|
|
.resplan {
|
|
display: none;
|
|
}
|
|
}
|
|
|
|
/* Set de default jQuery mobile font-weight naar normal */
|
|
body,
|
|
input,
|
|
select,
|
|
textarea,
|
|
button,
|
|
.ui-btn {
|
|
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Helvetica Neue", Helvetica, Arial, sans-serif /*{global-font-family}*/ !important;
|
|
}
|
|
|
|
.ui-header {
|
|
font-family: -apple-system-headline, BlinkMacSystemFont, "Segoe UI", "Roboto", "Helvetica Neue", Helvetica, Arial, sans-serif /*{global-font-family}*/ !important;
|
|
border: 0 !important;
|
|
}
|
|
.ui-footer{
|
|
font-family: -apple-system-footnote, BlinkMacSystemFont, "Segoe UI", "Roboto", "Helvetica Neue", Helvetica, Arial, sans-serif /*{global-font-family}*/ !important;
|
|
border: 0 !important;
|
|
}
|
|
|
|
.ui-header {
|
|
color: ==frameheadercolor== !important;
|
|
background-color: ==frameheaderbackgroundcolor== !important;
|
|
}
|
|
|
|
.ui-footer {
|
|
color: ==mobilefootercolor== !important;
|
|
background-color: ==mobilefooterbackgroundcolor== !important;
|
|
}
|
|
.ui-header .ui-title.bigtitle {
|
|
font-size: 1.5em;
|
|
font-weight: 600;
|
|
}
|
|
|
|
#fbanner, #hbanner {
|
|
height: 40px;
|
|
padding: 2px 0 1px 0;
|
|
background-position: center;
|
|
background-color: ==mobilefooterbackgroundcolor==;
|
|
color: ==mobilefootercolor==;
|
|
background-image: url(==mobileheaderimage==);
|
|
background-repeat: no-repeat;
|
|
}
|
|
|
|
input,
|
|
input.suggest,
|
|
textarea {
|
|
font-size: 1em !important;
|
|
color: ==textcolor==;
|
|
background-color: ==inputbackgroundcolor== !important;
|
|
}
|
|
.ui-input-text,
|
|
.ui-input-search {
|
|
background-color: ==inputbackgroundcolor== !important;
|
|
}
|
|
.ui-input-text input,
|
|
.ui-input-search input {
|
|
background-color: transparent !important;
|
|
}
|
|
|
|
input[readonly],
|
|
textarea[readonly] {
|
|
background-color: #f9f9f9 !important;
|
|
}
|
|
textarea {
|
|
height: 49px;
|
|
}
|
|
|
|
.flexlabel {
|
|
color: ==flexlabelcolor==;
|
|
}
|
|
.flexlabelvalue, .fldfinreg1, .fldfinreg2 {
|
|
font-size: 0.9em;
|
|
padding-top: 2px;
|
|
padding-bottom: 2px;
|
|
}
|
|
/* Controlgoup (jQuery 1.12.1 override) */
|
|
.ui-controlgroup {
|
|
display: block;
|
|
}
|
|
/* Form labels (overrides font-weight bold in bars, and mini font-size) */
|
|
.ui-mobile label,
|
|
div.ui-controlgroup-label {
|
|
font-weight: normal !important;
|
|
}
|
|
.ui-mini {
|
|
font-size: 1em !important;
|
|
font-weight: 400 !important;
|
|
}
|
|
|
|
.ui-mobile label {
|
|
font-size: 0.9em !important;
|
|
font-weight: 400 !important;
|
|
}
|
|
|
|
/* Buttons
|
|
-----------------------------------------------------------------------------------------------------------*/
|
|
.ui-btn,
|
|
label.ui-btn {
|
|
font-weight: normal !important;
|
|
color: ==buttoncolor== !important;
|
|
background-color: ==buttonbackgroundcolor== !important;
|
|
}
|
|
|
|
#alg_key.ui-controlgroup a.selected,
|
|
.ui-btn:hover {
|
|
color: ==buttonhovercolor== !important;
|
|
background-color: ==buttonhoverbackgroundcolor== !important;
|
|
}
|
|
|
|
.ui-btn-icon-left::after, .ui-btn-icon-right::after, .ui-btn-icon-top::after, .ui-btn-icon-bottom::after, .ui-btn-icon-notext::after {
|
|
color: ==buttoncolor== !important;
|
|
background-color: ==buttonbackgroundcolor== !important;
|
|
}
|
|
|
|
.ui-listview .ui-btn {
|
|
background-color: ==mobilelistbackgroundcolor== !important;
|
|
color: ==mobilelisttextcolor== !important;
|
|
}
|
|
.ui-listview>li h2 {
|
|
font-weight: normal !important;
|
|
}
|
|
|
|
/* Bar: Toolbars, dividers, slider track */
|
|
.ui-bar-b,
|
|
.ui-bar-inherit {
|
|
font-weight: normal !important;
|
|
}
|
|
|
|
|
|
/* Links */
|
|
.ui-page-theme-b a,
|
|
html .ui-bar-b a,
|
|
html .ui-body-b a,
|
|
html body .ui-group-theme-b a,
|
|
{
|
|
font-weight: normal;
|
|
}
|
|
/* einde font-weight overrule */
|
|
|
|
.ui-panel-wrapper {
|
|
color: ==mobiletextcolor==;
|
|
}
|
|
|
|
label.uploadbutton {
|
|
font-weight: bold !important;
|
|
border: 1px solid #ccc;
|
|
display: inline-block;
|
|
padding: 1px 10px;
|
|
text-align: center;
|
|
}
|
|
.input-icon-wrapper {
|
|
position: relative;
|
|
display: block;
|
|
white-space: nowrap;
|
|
}
|
|
.input-icon-wrapper > .dateklikker,
|
|
.input-icon-wrapper > .timeklikker {
|
|
position: absolute;
|
|
display: flex;
|
|
font-size: 1.2em;
|
|
top: 50%;
|
|
transform: translateY(-50%);
|
|
right: 0.4em;
|
|
}
|
|
|
|
div.suggestklikker {
|
|
display: inline-block;
|
|
width: 0px;
|
|
position: relative;
|
|
left: -26px;
|
|
top: 2px;
|
|
}
|
|
|
|
.ui-input-text input,
|
|
.ui-input-search input {
|
|
display: inline-block!important;
|
|
}
|
|
input[type="file"] {
|
|
display: none !important;
|
|
position: absolute;
|
|
top: -100px;
|
|
}
|
|
|
|
.mlegendatitel {
|
|
margin-bottom: 4px;
|
|
}
|
|
.mlegendaregel {
|
|
font-size: 0.8em;
|
|
line-height: 1.8em;
|
|
padding-left: 8px;
|
|
}
|
|
/* kopie */
|
|
.mldflag0, .resflag0, .opdrflag0, .bezflag0 { color: #b0b0b0; }
|
|
.mldflag1, .resflag1, .opdrflag1, .bezflag1 { color: #4d4d4d; }
|
|
.mldflag2, .resflag2, .opdrflag2, .bezflag2 { color: #f15854; }
|
|
.mldflag3, .resflag3, .opdrflag3, .bezflag3 { color: #ffd600; }
|
|
.mldflag4, .resflag4, .opdrflag4, .bezflag4 { color: #5da5da; }
|
|
.mldflag5, .resflag5, .opdrflag5, .bezflag5 { color: #60bd68; }
|
|
.mldflag6, .resflag6, .opdrflag6, .bezflag6 { color: #673ab7; }
|
|
.mldflag7, .resflag7, .opdrflag7, .bezflag7 { color: #faa43a; }
|
|
.mldflag8, .resflag8, .opdrflag8, .bezflag8 { color: #b276b2; }
|
|
.mldflag9, .resflag9, .opdrflag9, .bezflag9 { color: #b2912f; }
|
|
|
|
.suggest {
|
|
background-color: #FFFFFF !important; /* harde kleur.. */
|
|
}
|
|
/* fix the jQueryMobile default -1ex margin */
|
|
#similarcallstable { margin: 5px; }
|
|
|
|
textarea.ui-disabled, input.ui-disabled {
|
|
opacity: 1 !important;
|
|
}
|
|
|
|
.fldflexl {
|
|
color: ==flexlabelcolor==;
|
|
background-color: ==flexlabelbackgroundcolor==;
|
|
margin-top: 8px;
|
|
margin-bottom: 6px;
|
|
}
|
|
|
|
.fldflexl span, .fldflex label {
|
|
padding-left: 5px;
|
|
padding-right: 2px;
|
|
}
|
|
|
|
.fldflexl span {
|
|
display: block;
|
|
}
|
|
|
|
div[data-role=header] {
|
|
background-color: ==frameheaderbackgroundcolor==;
|
|
}
|
|
|
|
.footerphoto {
|
|
margin-top:10px;
|
|
margin-right: 4px;
|
|
}
|
|
|
|
ul#stdmldtable li h3 {
|
|
margin: .8em 0 .35em;
|
|
}
|
|
|
|
#logintable #buttons ul li {
|
|
display: list-item !important;
|
|
}
|
|
|
|
.has-submenu
|
|
{
|
|
text-decoration: underline;
|
|
}
|
|
.miconimg {
|
|
display: inline-block;
|
|
width: 86%;
|
|
padding: 0;
|
|
background-color: ==mobileiconbackgroundcolor==;
|
|
border-radius: 5px;
|
|
}
|
|
|
|
/* Begin Font awesome icons in jQuery-mobile layout: */
|
|
.ui-header .ui-btn-left,
|
|
.ui-header .ui-btn-right {
|
|
top: 50%;
|
|
transform: translateY(-50%);
|
|
}
|
|
|
|
.ui-header .ui-btn-icon-notext {
|
|
font-size: 1.6em;
|
|
}
|
|
|
|
.ui-icon-fa.ui-btn-icon-notext::before,
|
|
.ui-icon-fa.ui-btn-icon-notext::after,
|
|
.ui-icon-delete.ui-btn-icon-notext::before,
|
|
.ui-icon-delete.ui-btn-icon-notext::after {
|
|
width: 1.6em;
|
|
height: 1.6em;
|
|
}
|
|
|
|
.ui-icon-delete.ui-btn-icon-notext::before,
|
|
.ui-icon-fa.ui-btn-icon-notext::before {
|
|
text-indent: 0px;
|
|
}
|
|
.ui-btn-icon-notext::before,
|
|
.ui-btn-icon-left::before,
|
|
.ui-btn-icon-right::before,
|
|
.ui-btn-icon-notext::after,
|
|
.ui-btn-icon-left::after,
|
|
.ui-btn-icon-right::after {
|
|
top: 50%;
|
|
margin-top: -.8em;
|
|
}
|
|
.ui-btn-icon-notext::before,
|
|
.ui-btn-icon-top::before,
|
|
.ui-btn-icon-bottom::before,
|
|
.ui-btn-icon-notext::after,
|
|
.ui-btn-icon-top::after,
|
|
.ui-btn-icon-bottom::after {
|
|
left: 50%;
|
|
margin-left: -.8em;
|
|
}
|
|
.ui-btn-icon-right::before { right: .5625em; }
|
|
.ui-btn-icon-bottom::before { top: auto; bottom: .5625em; }
|
|
.ui-btn-icon-left::before { left: .5625em; }
|
|
.ui-btn-icon-top::before { top: .5625em; }
|
|
|
|
.ui-mini.ui-btn-icon-left::before,
|
|
.ui-mini .ui-btn-icon-left::before,
|
|
.ui-header .ui-btn-icon-left::before,
|
|
.ui-footer .ui-btn-icon-left::before {
|
|
left: .37em;
|
|
}
|
|
.ui-mini.ui-btn-icon-right::before,
|
|
.ui-mini .ui-btn-icon-right::before,
|
|
.ui-header .ui-btn-icon-right::before,
|
|
.ui-footer .ui-btn-icon-right::before {
|
|
right: .37em;
|
|
}
|
|
.ui-collapsible-heading-toggle::before,
|
|
.ui-icon-delete::before,
|
|
.ui-icon-fa::before
|
|
{
|
|
/* Volstaat voor light, regular en solid stijlen */
|
|
font-family: "Font Awesome 5 Pro";
|
|
|
|
font-weight: 300; /* Default light stijl */
|
|
z-index: 1; /* Bovenop de ::after */
|
|
|
|
/* Zelfde positionering als de icon-layout van jQuery-mobile in het ::after element */
|
|
position: absolute;
|
|
width: 22px;
|
|
height: 22px;
|
|
|
|
/* Netjes gecentreerd */
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
|
|
/* De jQuery-mobile default is wit */
|
|
color: ==buttoncolor==;
|
|
}
|
|
|
|
/* Want deze zijn hardnekkig */
|
|
.ui-input-search::before {
|
|
font-family: "Font Awesome 5 Pro";
|
|
content: "\f002";
|
|
font-weight: 300;
|
|
position: absolute;
|
|
top: 50%;
|
|
transform: translateY(-50%);
|
|
left: .3125em;
|
|
}
|
|
.ui-input-search::after { content: none; }
|
|
.ui-icon-delete::before { content: "\f00d"; }
|
|
.ui-icon-delete::after { background-image: none; }
|
|
|
|
/* font-weight wordt per element overruled, daarom hier specifiek op de ::before om de FA-stijl te regelen */
|
|
.fal:before { font-weight: 300; }
|
|
.far:before { font-weight: 400; }
|
|
.fas:before { font-weight: 900; }
|
|
/* Einde Font awesome icons in jQuery-mobile layout */ |