483 lines
9.9 KiB
CSS
483 lines
9.9 KiB
CSS
/*
|
|
* $Revision$
|
|
* $Id$
|
|
*
|
|
* Facilitor default.css, styles for Mobile
|
|
*/
|
|
|
|
/* class overrules */
|
|
.ui-title {
|
|
margin:0 11% 0 !important;
|
|
}
|
|
|
|
.ui-content,
|
|
.ui-mobile .ui-page {
|
|
background-color: #fff;
|
|
}
|
|
.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;
|
|
margin: 0 auto;
|
|
border-radius: 4px;
|
|
}
|
|
.ui-grid-b .imgCaption {
|
|
width: 100%;
|
|
font-size: 12px;
|
|
text-align: center;
|
|
}
|
|
i.miconimg {
|
|
font-size: 4em;
|
|
}
|
|
/* 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;
|
|
}
|
|
i.miconimg {
|
|
font-size: 5em;
|
|
}
|
|
}
|
|
@media all and (min-width: 640px) {
|
|
.ui-grid-b img {
|
|
height: 120px !important;
|
|
}
|
|
.ui-grid-b .imgCaption {
|
|
font-size: 14px;
|
|
}
|
|
i.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;
|
|
}
|
|
i.miconimg {
|
|
font-size: 7em;
|
|
}
|
|
}
|
|
|
|
/* FACILITOR classes */
|
|
#loginhtml { background-image: none !important; }
|
|
#loginfooter {
|
|
position: relative !important;
|
|
margin-top: 24px !important;
|
|
bottom: 0!important;
|
|
}
|
|
|
|
#mod_pass2mail {width: 300px !important;}
|
|
|
|
.c1, .n1 { color: #111; font-size: 0.9em !important; font-weight: lighter !important;}
|
|
.cs1 {color: #CD2324; 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;}
|
|
|
|
.n2 { white-space: nowrap; }
|
|
.rticon {
|
|
margin: 15px 0 0 2px;
|
|
}
|
|
|
|
.moreinfo input {
|
|
font-weight: bold;
|
|
color: #000 !important;
|
|
}
|
|
.required {
|
|
border: 1px solid #D14B1C!important;
|
|
}
|
|
.missing,
|
|
.suggest.missing {
|
|
background-color: #FFD0D0!important;
|
|
}
|
|
.attention {
|
|
color: #E63600 !important;
|
|
}
|
|
|
|
.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; color: white;}
|
|
div.pbezet {background-color: #E63600 !important; color: white;}
|
|
div.dbezet .bezetinfo {color: white;}
|
|
div.dbezet .plantime {color: #333;}
|
|
.cvrij, .cbezet {
|
|
margin-top: 1em;
|
|
}
|
|
|
|
#fbanner, #hbanner {
|
|
height: 40px;
|
|
padding: 2px 0 1px 0;
|
|
background-position: center;
|
|
background-color: #fff;
|
|
background-image: url(../Pictures/mfbanner.png);
|
|
background-repeat:no-repeat ;
|
|
}
|
|
|
|
.mobile2touch {
|
|
float: right;
|
|
}
|
|
|
|
.mobile2touch a {
|
|
font-weight: 400 !important;
|
|
color: #fff !important;
|
|
font-size: 0.8em;
|
|
}
|
|
|
|
.micon {
|
|
padding: 10px 6px 10px 6px !important;
|
|
text-align: center;
|
|
}
|
|
|
|
.selfie {
|
|
border-radius: 20px;
|
|
}
|
|
.footerphoto {
|
|
height: 40px;
|
|
max-width: 40px;
|
|
float: right;
|
|
border-radius: 20px;
|
|
}
|
|
|
|
.ui-collapsible-heading{
|
|
font-size:16px !important;
|
|
}
|
|
|
|
.m-bijlagepopup-ext1 {
|
|
width: 100% !important;
|
|
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;
|
|
}
|
|
.subject {
|
|
line-height:2em;
|
|
font-size: 0.95em;
|
|
}
|
|
div.subheader {
|
|
text-overflow: ellipsis;
|
|
overflow:hidden;
|
|
}
|
|
.subheader .listbodykop {
|
|
color: #888;
|
|
font-size: 0.7em;
|
|
margin-top: 0px;
|
|
margin-bottom: 4px;
|
|
}
|
|
.subheader .listbodytext {
|
|
font-weight: normal;
|
|
font-size: small;
|
|
white-space:normal; /* Wordwrap gewenst in listviews */
|
|
}
|
|
|
|
.suggest {
|
|
background-color: #FFFFE3 !important;
|
|
}
|
|
|
|
#mobplan {
|
|
text-align: center;
|
|
}
|
|
|
|
#mobplan img {
|
|
border: 1px solid #333;
|
|
}
|
|
|
|
#rsMaxLines {
|
|
color: red;
|
|
background-color: white;
|
|
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;
|
|
}
|
|
.fclthtml td {
|
|
filter: alpha(opacity=80);
|
|
opacity: 0.8;
|
|
}
|
|
|
|
/* reserveringsinfoschermpje */
|
|
.resruimte {
|
|
text-align: center;
|
|
}
|
|
.resphoto {
|
|
width: 100%;
|
|
padding: 2px 0 1px 0;
|
|
text-align: center;
|
|
}
|
|
table.planbord div.click {
|
|
cursor: auto;
|
|
}
|
|
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;
|
|
color: #333;
|
|
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;
|
|
box-shadow: none;
|
|
}
|
|
|
|
@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 lighter */
|
|
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;
|
|
}
|
|
|
|
.ui-footer{
|
|
font-family: -apple-system-footnote, BlinkMacSystemFont, "Segoe UI", "Roboto", "Helvetica Neue", Helvetica, Arial, sans-serif /*{global-font-family}*/ !important;
|
|
}
|
|
|
|
input,
|
|
textarea,
|
|
.fldflex, .fldflexC, .fldflexC50, .fldflexD, .fldflexX, .fldflexL, .fldflexQ, .fldflexF, .fldflexM, .fldflexE, .fldflexS {
|
|
font-size: 0.9em !important;
|
|
color: rgb(116,117,120) !important;
|
|
}
|
|
i.fa {
|
|
color: #bbb;
|
|
}
|
|
|
|
input[readonly] {background-color: #f9f9f9 !important;}
|
|
textarea {
|
|
height: 49px;
|
|
}
|
|
|
|
.flexlabel {
|
|
color: #CD2324;
|
|
}
|
|
.flexlabelvalue, .fldfinreg1, .fldfinreg2 {
|
|
font-size: 0.9em; !important;
|
|
color: #777 !important;
|
|
padding-top: 2px;
|
|
padding-bottom: 2px;
|
|
}
|
|
/* Form labels (overrides font-weight bold in bars, and mini font-size) */
|
|
.ui-mobile label,
|
|
div.ui-controlgroup-label {
|
|
font-weight: lighter !important;
|
|
padding-top: 6px !important;
|
|
}
|
|
.ui-mobile label, .ui-mini {
|
|
font-size: 1em !important;
|
|
font-weight: 400 !important;
|
|
}
|
|
|
|
/* Buttons
|
|
-----------------------------------------------------------------------------------------------------------*/
|
|
.ui-btn,
|
|
label.ui-btn {
|
|
font-weight: lighter !important;
|
|
}
|
|
|
|
.ui-listview>li h2 {
|
|
font-weight: lighter !important;
|
|
}
|
|
|
|
/* Bar: Toolbars, dividers, slider track */
|
|
.ui-bar-a,
|
|
.ui-page-theme-a .ui-bar-inherit,
|
|
html .ui-bar-a .ui-bar-inherit,
|
|
html .ui-body-a .ui-bar-inherit,
|
|
html body .ui-group-theme-a .ui-bar-inherit,
|
|
.ui-bar-c,
|
|
.ui-page-theme-c .ui-bar-inherit,
|
|
html .ui-bar-c .ui-bar-inherit,
|
|
html .ui-body-c .ui-bar-inherit,
|
|
html body .ui-group-theme-c .ui-bar-inherit,
|
|
.ui-bar-d,
|
|
.ui-page-theme-d .ui-bar-inherit,
|
|
html .ui-bar-d .ui-bar-inherit,
|
|
html .ui-body-d .ui-bar-inherit,
|
|
html body .ui-group-theme-d .ui-bar-inherit,
|
|
.ui-bar-e,
|
|
.ui-page-theme-e .ui-bar-inherit,
|
|
html .ui-bar-e .ui-bar-inherit,
|
|
html .ui-body-e .ui-bar-inherit,
|
|
html body .ui-group-theme-e .ui-bar-inherit {
|
|
font-weight: normal !important;
|
|
}
|
|
|
|
.ui-bar-b,
|
|
.ui-page-theme-b .ui-bar-inherit,
|
|
html .ui-bar-b .ui-bar-inherit,
|
|
html .ui-body-b .ui-bar-inherit,
|
|
html body .ui-group-theme-b .ui-bar-inherit {
|
|
font-weight: normal !important;
|
|
}
|
|
|
|
|
|
/* Links */
|
|
.ui-page-theme-a a,
|
|
html .ui-bar-a a,
|
|
html .ui-body-a a,
|
|
html body .ui-group-theme-a a,
|
|
.ui-page-theme-b a,
|
|
html .ui-bar-b a,
|
|
html .ui-body-b a,
|
|
html body .ui-group-theme-b a,
|
|
.ui-page-theme-c a,
|
|
html .ui-bar-c a,
|
|
html .ui-body-c a,
|
|
html body .ui-group-theme-c a,
|
|
.ui-page-theme-d a,
|
|
html .ui-bar-d a,
|
|
html .ui-body-d a,
|
|
html body .ui-group-theme-d a,
|
|
.ui-page-theme-e a,
|
|
html .ui-bar-e a,
|
|
html .ui-body-e a,
|
|
html body .ui-group-theme-e a {
|
|
font-weight: normal;
|
|
}
|
|
/* einde font-weight overrule */
|
|
|
|
.ui-overlay-c,.ui-page-theme-c,.ui-page-theme-c .ui-panel-wrapper{
|
|
color: #555;
|
|
}
|
|
|
|
input[type="file"] {
|
|
display: none !important;
|
|
}
|
|
label.uploadbutton {
|
|
cursor: pointer;
|
|
font-weight: bold !important;
|
|
border: 1px solid #ccc;
|
|
display: inline-block;
|
|
padding: 1px 10px;
|
|
text-align: center;
|
|
}
|
|
div.suggestklikker, i.dateklikker, i.timeklikker {
|
|
display:inline-block;
|
|
width:0px;
|
|
text-align:center;
|
|
position: relative;
|
|
left: -26px;
|
|
}
|
|
.ui-input-text input,
|
|
.ui-input-search input {
|
|
display: inline-block!important;
|
|
}
|
|
input[type="file"] {
|
|
display: none !important;
|
|
}
|
|
|
|
.mlegendatitel {
|
|
margin-bottom: 4px;
|
|
}
|
|
.mlegendaregel {
|
|
font-size: 0.8em;
|
|
line-height: 1.8em;
|
|
padding-left: 8px;
|
|
} |