[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"\u002Fuitleg\u002Fonline-afspraken\u002Fonline-afspraken-voor-de-website-bouwer\u002Fcss-voor-websites-die-geen-bootstrap-gebruiken\u002Fdetail":3},{"id":4,"title":5,"body":6,"description":16,"extension":586,"meta":587,"navigation":588,"page_id":589,"path":590,"position":591,"seo":592,"sitemap":593,"stem":594,"tags":595,"updated":599,"__hash__":600},"pages\u002Fuitleg\u002Fonline-afspraken\u002Fonline-afspraken-voor-de-website-bouwer\u002Fcss-voor-websites-die-geen-bootstrap-gebruiken.md","CSS voor websites die geen bootstrap gebruiken",{"type":7,"value":8,"toc":584},"minimark",[9,13,17,580],[10,11,5],"h1",{"id":12},"css-voor-websites-die-geen-bootstrap-gebruiken",[14,15,16],"p",{},"De Online Afspraken widget is gebaseerd op bootstrap technologie \u002F styling voor weergave van oa. de kalender en velden. Om te zorgen dat de widget in basis goed functioneert op een website die geen bootstrap stylesheet gebruikt, dient de website bouwer onderstaande styling toevoegen aan de website na het laden van de widget. Bij voorkeur aan het einde van de eigen stylesheets.",[18,19,24],"pre",{"className":20,"code":21,"language":22,"meta":23,"style":23},"language-sql shiki shiki-themes github-dark","#autoflex-oa-app {\n    color: white;\n    font-size: 1rem;\n    line-height: 1.2;\n}\n#autoflex-oa-app .container {\n    background-color: black;\n}\n#autoflex-oa-app .jumbotron {\n    background-color: #d33131;\n    padding: 2rem;\n    margin-bottom: 2rem;\n    border-radius: .3rem;\n}\n#autoflex-oa-app .row {\n    display: flex;\n    flex-wrap: wrap;\n    margin-right: -15px;\n    margin-left: -15px;\n}\n#autoflex-oa-app .col {\n    flex-basis: 0;\n    flex-grow: 1;\n    max-width: 100%;\n}\n#autoflex-oa-app .col-form-label {\n    padding-top: calc(.375rem + 1px);\n    padding-bottom: calc(.375rem + 1px);\n    margin-bottom: 0;\n    line-height: 1.5;\n    border: none;\n    color: white;\n}\n#autoflex-oa-app .b-calendar-grid {\n    height: auto;\n    padding: 0;\n    margin: 0;\n    overflow: hidden;\n}\n#autoflex-oa-app .b-calendar .b-calendar-grid .row {\n    flex-wrap: nowrap;\n}\n#autoflex-oa-app .btn {\n    display: inline-block;\n    color: #212529;\n    text-align: center;\n    vertical-align: middle;\n    -webkit-user-select: none;\n    -moz-user-select: none;\n    -ms-user-select: none;\n    user-select: none;\n    background-color: transparent;\n    border: 1px solid transparent;\n    padding: .375rem .75rem;\n}\n#autoflex-oa-app button.btn.btn-danger{\n    color: #fff;\n    background-color: #dc3545;\n    border-color: #dc3545;\n}\n#autoflex-oa-app button.btn.btn-success{\n    color: #fff;\n    background-color: #023a47;\n    border-color: #023a47;\n}\n#autoflex-oa-app .form-control {\n    color: #495057;\n    background-color: #fff;\n    background-clip: padding-box;\n    border: 1px solid #ced4da;\n    border-radius: .25rem;\n    font-size: initial;\n}\n#autoflex-oa-app .custom-select {\n    display: inline-block;\n    width: 100%;\n    color: #495057;\n    vertical-align: middle;\n    border: 1px solid #ced4da;\n    border-radius: .25rem;\n    -webkit-appearance: none;\n    -moz-appearance: none;\n    appearance: none;\n}\n#autoflex-oa-app .custom-control-label {\n    font-size: initial;\n}\n#autoflex-oa-app .text-muted {\n        color: inherit;\n}\n.modal-body p {\n    color: black;\n}\n.modal-title {\n    color: black;\n}\n","sql","",[25,26,27,35,41,47,53,59,65,71,76,82,88,94,100,106,111,117,123,129,135,141,146,152,158,164,170,175,181,187,193,199,205,211,216,221,227,233,239,245,251,256,262,268,273,279,285,291,297,303,309,315,321,327,333,339,345,350,356,362,368,374,379,385,390,396,402,407,413,419,425,431,437,443,449,454,460,465,471,476,481,486,491,497,503,509,514,520,525,530,536,542,547,553,559,564,570,575],"code",{"__ignoreMap":23},[28,29,32],"span",{"class":30,"line":31},"line",1,[28,33,34],{},"#autoflex-oa-app {\n",[28,36,38],{"class":30,"line":37},2,[28,39,40],{},"    color: white;\n",[28,42,44],{"class":30,"line":43},3,[28,45,46],{},"    font-size: 1rem;\n",[28,48,50],{"class":30,"line":49},4,[28,51,52],{},"    line-height: 1.2;\n",[28,54,56],{"class":30,"line":55},5,[28,57,58],{},"}\n",[28,60,62],{"class":30,"line":61},6,[28,63,64],{},"#autoflex-oa-app .container {\n",[28,66,68],{"class":30,"line":67},7,[28,69,70],{},"    background-color: black;\n",[28,72,74],{"class":30,"line":73},8,[28,75,58],{},[28,77,79],{"class":30,"line":78},9,[28,80,81],{},"#autoflex-oa-app .jumbotron {\n",[28,83,85],{"class":30,"line":84},10,[28,86,87],{},"    background-color: #d33131;\n",[28,89,91],{"class":30,"line":90},11,[28,92,93],{},"    padding: 2rem;\n",[28,95,97],{"class":30,"line":96},12,[28,98,99],{},"    margin-bottom: 2rem;\n",[28,101,103],{"class":30,"line":102},13,[28,104,105],{},"    border-radius: .3rem;\n",[28,107,109],{"class":30,"line":108},14,[28,110,58],{},[28,112,114],{"class":30,"line":113},15,[28,115,116],{},"#autoflex-oa-app .row {\n",[28,118,120],{"class":30,"line":119},16,[28,121,122],{},"    display: flex;\n",[28,124,126],{"class":30,"line":125},17,[28,127,128],{},"    flex-wrap: wrap;\n",[28,130,132],{"class":30,"line":131},18,[28,133,134],{},"    margin-right: -15px;\n",[28,136,138],{"class":30,"line":137},19,[28,139,140],{},"    margin-left: -15px;\n",[28,142,144],{"class":30,"line":143},20,[28,145,58],{},[28,147,149],{"class":30,"line":148},21,[28,150,151],{},"#autoflex-oa-app .col {\n",[28,153,155],{"class":30,"line":154},22,[28,156,157],{},"    flex-basis: 0;\n",[28,159,161],{"class":30,"line":160},23,[28,162,163],{},"    flex-grow: 1;\n",[28,165,167],{"class":30,"line":166},24,[28,168,169],{},"    max-width: 100%;\n",[28,171,173],{"class":30,"line":172},25,[28,174,58],{},[28,176,178],{"class":30,"line":177},26,[28,179,180],{},"#autoflex-oa-app .col-form-label {\n",[28,182,184],{"class":30,"line":183},27,[28,185,186],{},"    padding-top: calc(.375rem + 1px);\n",[28,188,190],{"class":30,"line":189},28,[28,191,192],{},"    padding-bottom: calc(.375rem + 1px);\n",[28,194,196],{"class":30,"line":195},29,[28,197,198],{},"    margin-bottom: 0;\n",[28,200,202],{"class":30,"line":201},30,[28,203,204],{},"    line-height: 1.5;\n",[28,206,208],{"class":30,"line":207},31,[28,209,210],{},"    border: none;\n",[28,212,214],{"class":30,"line":213},32,[28,215,40],{},[28,217,219],{"class":30,"line":218},33,[28,220,58],{},[28,222,224],{"class":30,"line":223},34,[28,225,226],{},"#autoflex-oa-app .b-calendar-grid {\n",[28,228,230],{"class":30,"line":229},35,[28,231,232],{},"    height: auto;\n",[28,234,236],{"class":30,"line":235},36,[28,237,238],{},"    padding: 0;\n",[28,240,242],{"class":30,"line":241},37,[28,243,244],{},"    margin: 0;\n",[28,246,248],{"class":30,"line":247},38,[28,249,250],{},"    overflow: hidden;\n",[28,252,254],{"class":30,"line":253},39,[28,255,58],{},[28,257,259],{"class":30,"line":258},40,[28,260,261],{},"#autoflex-oa-app .b-calendar .b-calendar-grid .row {\n",[28,263,265],{"class":30,"line":264},41,[28,266,267],{},"    flex-wrap: nowrap;\n",[28,269,271],{"class":30,"line":270},42,[28,272,58],{},[28,274,276],{"class":30,"line":275},43,[28,277,278],{},"#autoflex-oa-app .btn {\n",[28,280,282],{"class":30,"line":281},44,[28,283,284],{},"    display: inline-block;\n",[28,286,288],{"class":30,"line":287},45,[28,289,290],{},"    color: #212529;\n",[28,292,294],{"class":30,"line":293},46,[28,295,296],{},"    text-align: center;\n",[28,298,300],{"class":30,"line":299},47,[28,301,302],{},"    vertical-align: middle;\n",[28,304,306],{"class":30,"line":305},48,[28,307,308],{},"    -webkit-user-select: none;\n",[28,310,312],{"class":30,"line":311},49,[28,313,314],{},"    -moz-user-select: none;\n",[28,316,318],{"class":30,"line":317},50,[28,319,320],{},"    -ms-user-select: none;\n",[28,322,324],{"class":30,"line":323},51,[28,325,326],{},"    user-select: none;\n",[28,328,330],{"class":30,"line":329},52,[28,331,332],{},"    background-color: transparent;\n",[28,334,336],{"class":30,"line":335},53,[28,337,338],{},"    border: 1px solid transparent;\n",[28,340,342],{"class":30,"line":341},54,[28,343,344],{},"    padding: .375rem .75rem;\n",[28,346,348],{"class":30,"line":347},55,[28,349,58],{},[28,351,353],{"class":30,"line":352},56,[28,354,355],{},"#autoflex-oa-app button.btn.btn-danger{\n",[28,357,359],{"class":30,"line":358},57,[28,360,361],{},"    color: #fff;\n",[28,363,365],{"class":30,"line":364},58,[28,366,367],{},"    background-color: #dc3545;\n",[28,369,371],{"class":30,"line":370},59,[28,372,373],{},"    border-color: #dc3545;\n",[28,375,377],{"class":30,"line":376},60,[28,378,58],{},[28,380,382],{"class":30,"line":381},61,[28,383,384],{},"#autoflex-oa-app button.btn.btn-success{\n",[28,386,388],{"class":30,"line":387},62,[28,389,361],{},[28,391,393],{"class":30,"line":392},63,[28,394,395],{},"    background-color: #023a47;\n",[28,397,399],{"class":30,"line":398},64,[28,400,401],{},"    border-color: #023a47;\n",[28,403,405],{"class":30,"line":404},65,[28,406,58],{},[28,408,410],{"class":30,"line":409},66,[28,411,412],{},"#autoflex-oa-app .form-control {\n",[28,414,416],{"class":30,"line":415},67,[28,417,418],{},"    color: #495057;\n",[28,420,422],{"class":30,"line":421},68,[28,423,424],{},"    background-color: #fff;\n",[28,426,428],{"class":30,"line":427},69,[28,429,430],{},"    background-clip: padding-box;\n",[28,432,434],{"class":30,"line":433},70,[28,435,436],{},"    border: 1px solid #ced4da;\n",[28,438,440],{"class":30,"line":439},71,[28,441,442],{},"    border-radius: .25rem;\n",[28,444,446],{"class":30,"line":445},72,[28,447,448],{},"    font-size: initial;\n",[28,450,452],{"class":30,"line":451},73,[28,453,58],{},[28,455,457],{"class":30,"line":456},74,[28,458,459],{},"#autoflex-oa-app .custom-select {\n",[28,461,463],{"class":30,"line":462},75,[28,464,284],{},[28,466,468],{"class":30,"line":467},76,[28,469,470],{},"    width: 100%;\n",[28,472,474],{"class":30,"line":473},77,[28,475,418],{},[28,477,479],{"class":30,"line":478},78,[28,480,302],{},[28,482,484],{"class":30,"line":483},79,[28,485,436],{},[28,487,489],{"class":30,"line":488},80,[28,490,442],{},[28,492,494],{"class":30,"line":493},81,[28,495,496],{},"    -webkit-appearance: none;\n",[28,498,500],{"class":30,"line":499},82,[28,501,502],{},"    -moz-appearance: none;\n",[28,504,506],{"class":30,"line":505},83,[28,507,508],{},"    appearance: none;\n",[28,510,512],{"class":30,"line":511},84,[28,513,58],{},[28,515,517],{"class":30,"line":516},85,[28,518,519],{},"#autoflex-oa-app .custom-control-label {\n",[28,521,523],{"class":30,"line":522},86,[28,524,448],{},[28,526,528],{"class":30,"line":527},87,[28,529,58],{},[28,531,533],{"class":30,"line":532},88,[28,534,535],{},"#autoflex-oa-app .text-muted {\n",[28,537,539],{"class":30,"line":538},89,[28,540,541],{},"        color: inherit;\n",[28,543,545],{"class":30,"line":544},90,[28,546,58],{},[28,548,550],{"class":30,"line":549},91,[28,551,552],{},".modal-body p {\n",[28,554,556],{"class":30,"line":555},92,[28,557,558],{},"    color: black;\n",[28,560,562],{"class":30,"line":561},93,[28,563,58],{},[28,565,567],{"class":30,"line":566},94,[28,568,569],{},".modal-title {\n",[28,571,573],{"class":30,"line":572},95,[28,574,558],{},[28,576,578],{"class":30,"line":577},96,[28,579,58],{},[581,582,583],"style",{},"html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}",{"title":23,"searchDepth":37,"depth":55,"links":585},[],"md",{},true,4132262022,"\u002Fuitleg\u002Fonline-afspraken\u002Fonline-afspraken-voor-de-website-bouwer\u002Fcss-voor-websites-die-geen-bootstrap-gebruiken",352,{"title":5,"description":16},{"loc":590},"uitleg\u002Fonline-afspraken\u002Fonline-afspraken-voor-de-website-bouwer\u002Fcss-voor-websites-die-geen-bootstrap-gebruiken",[596,597,598],"#online-afspraken","#werkplaats","#autoflex-9","2026-06-05T12:41:44.615Z","eKblISyH3O2YqXyNVGuMSjdLieqDfld39m1m2GKsd_Q"]