YFTH#71839 icoontjes responsive weergeven

svn path=/Website/trunk/; revision=56686
This commit is contained in:
2022-07-26 13:36:12 +00:00
parent fc97c8f333
commit bc605eea45
2 changed files with 100 additions and 23 deletions

View File

@@ -1853,24 +1853,92 @@ section#searchbody td.label + td,
body:not(#listbody, #planbody) td.label:not(.flexsearch) + td {
width: 70%;
}
/* Correctie voor brede blokken (todo exact berekenen?) */
@media (min-width: 0px) /* Vanaf bootstrap xs (geen Facilitor breakpoint) */
{
.col-lg-6.col-xxl-4 .d-xs-none {
display: none;
}
.col-lg-6.col-xxl-4 .d-xs-initial {
display: initial;
}
}
@media (min-width: 576px) /* Vanaf bootstrap sm (geen Facilitor breakpoint) */
{
.col-lg-6.col-xxl-4 .d-sm-none {
display: none;
}
.col-lg-6.col-xxl-4 .d-sm-initial {
display: initial;
}
}
@media (min-width: 768px) /* Vanaf bootstrap md (geen Facilitor breakpoint) */
{
.col-lg-6.col-xxl-4 .d-md-none {
display: none;
}
.col-lg-6.col-xxl-4 .d-md-initial {
display: initial;
}
}
@media (min-width: 992px) /* Vanaf bootstrap 2-koloms breakpoint (lg) */
{
/* Correctie voor brede blokken (todo exact berekenen?) */
body:not(#listbody, #planbody, .modal) .col-12:not([class*=col-lg]) td.label {
width: 14.313%;
}
body:not(#listbody, #planbody, .modal) .col-12:not([class*=col-lg]) td.label + td {
width: 85.687%;
}
.col-lg-6.col-xxl-4 .d-lg-none {
display: none;
}
.col-lg-6.col-xxl-4 .d-lg-initial {
display: initial;
}
}
@media (min-width: 1200px) /* Vanaf bootstrap xl (geen Facilitor breakpoint) */
{
.col-lg-6.col-xxl-4 .d-xl-none {
display: none;
}
.col-lg-6.col-xxl-4 .d-xl-initial {
display: initial;
}
}
@media (min-width: 1488px) /* Vanaf bootstrap 3-koloms breakpoint (xxl) */
{
/* Correctie voor brede blokken (todo exact berekenen?) */
body:not(#listbody, #planbody, .modal) .col-12:not([class*=col-lg]) td.label {
width: 9.218%;
}
body:not(#listbody, #planbody, .modal) .col-12:not([class*=col-lg]) td.label + td {
width: 90.782%;
}
.col-lg-6.col-xxl-4 .d-xxl-none {
display: none;
}
.col-lg-6.col-xxl-4 .d-xxl-initial {
display: initial;
}
}
@media (min-width: 1792px) /* Vanaf facilitor 3xl (custom -niet bootstrap- breakpoint) */
{
.col-lg-6.col-xxl-4 .d-3xl-none {
display: none;
}
.col-lg-6.col-xxl-4 .d-3xl-initial {
display: initial;
}
}
@media (min-width: 2000px) /* Vanaf facilitor 4xl (custom -niet bootstrap- breakpoint) */
{
.col-lg-6.col-xxl-4 .d-4xl-none {
display: none;
}
.col-lg-6.col-xxl-4 .d-4xl-initial {
display: initial;
}
}
/* dialect table exceptions */

View File

@@ -216,24 +216,28 @@ function BLOCK_END_HTML() {
}
function BLOCK_START(id, title, params) {
if (__blockactive__) ERROR_NESTED_BLOCK_START_DETECTED;
__blockactive__ = true;
if (__blockactive__)
ERROR_NESTED_BLOCK_START_DETECTED;
__blockactive__ = true;
Response.Write(BLOCK_START_HTML(id, title, params));
}
function BLOCK_END() {
if (!__blockactive__) ERROR_BLOCK_END_WITHOUT_BLOCK_START;
if (!__blockactive__)
ERROR_BLOCK_END_WITHOUT_BLOCK_START;
__blockactive__ = false;
Response.Write(BLOCK_END_HTML());
}
function MODAL_BLOCK_START(id, title, params) {
if (__blockactive__) ERROR_NESTED_MODAL_BLOCK_START_DETECTED;
__blockactive__ = true;
if (__blockactive__)
ERROR_NESTED_MODAL_BLOCK_START_DETECTED;
__blockactive__ = true;
params = params || {};
params.wide = true;
Response.Write(BLOCK_START_HTML(id, title, params));
}
function MODAL_BLOCK_END() {
if (!__blockactive__) ERROR_MODAL_BLOCK_END_WITHOUT_MODAL_BLOCK_START;
if (!__blockactive__)
ERROR_MODAL_BLOCK_END_WITHOUT_MODAL_BLOCK_START;
__blockactive__ = false;
Response.Write(BLOCK_END_HTML());
}
@@ -432,14 +436,16 @@ function SEARCH_BLOCK_END_HTML()
function SEARCH_BLOCK_START(params)
{
params = params || {};
if (__blockactive__) ERROR_NESTED_SEARCH_BLOCK_START;
if (__blockactive__)
ERROR_NESTED_SEARCH_BLOCK_START;
__blockactive__ = true;
Response.Write(SEARCH_BLOCK_START_HTML(params));
}
function SEARCH_BLOCK_END()
{
if (!__blockactive__) ERROR_SEARCH_BLOCK_END_WITHOUT_SEARCH_BLOCK_START;
if (!__blockactive__)
ERROR_SEARCH_BLOCK_END_WITHOUT_SEARCH_BLOCK_START;
__blockactive__ = false;
Response.Write(SEARCH_BLOCK_END_HTML());
}
@@ -462,14 +468,16 @@ function SIMPLE_BLOCK_END_HTML()
function SIMPLE_BLOCK_START(params)
{
params = params || {};
if (__blockactive__) ERROR_NESTED_SIMPLE_BLOCK_START;
if (__blockactive__)
ERROR_NESTED_SIMPLE_BLOCK_START;
__blockactive__ = true;
Response.Write(SIMPLE_BLOCK_START_HTML(params));
}
function SIMPLE_BLOCK_END()
{
if (!__blockactive__) ERROR_SIMPLE_BLOCK_END_WITHOUT_SIMPLE_BLOCK_START;
if (!__blockactive__)
ERROR_SIMPLE_BLOCK_END_WITHOUT_SIMPLE_BLOCK_START;
__blockactive__ = false;
Response.Write(SIMPLE_BLOCK_END_HTML());
}
@@ -940,19 +948,20 @@ function RWFIELDTR(pname, pclass, plabel, pvalue, params)
function BB_BUTTONS_HTML(uid, show)
{
var cls = "text-style-button default-clickable-icon";
var result = '<div class="text-styles' + (show ? "" : " closed") + '" aria-controls="' + uid + '">'
+ ' <span class="text-style-button default-clickable-icon" title="' + safe.htmlattr(L("lcl_text_style_hint_bold")) + '" data-style="b">' + I("fa-bold", { "fastyle": "far" }) + '</span>'
+ ' <span class="text-style-button default-clickable-icon" title="' + safe.htmlattr(L("lcl_text_style_hint_italic")) + '" data-style="i">' + I("fa-italic", { "fastyle": "fal" }) + '</span>'
+ ' <span class="text-style-button default-clickable-icon" title="' + safe.htmlattr(L("lcl_text_style_hint_underline")) + '" data-style="u">' + I("fa-underline", { "fastyle": "fal" }) + '</span>'
+ ' <span class="text-style-button default-clickable-icon" title="' + safe.htmlattr(L("lcl_text_style_hint_strikethrough")) + '" data-style="s">' + I("fa-strikethrough", { "fastyle": "fal" }) + '</span>'
+ ' <span class="text-style-button default-clickable-icon" title="' + safe.htmlattr(L("lcl_text_style_hint_header1")) + '" data-style="h1">' + I("fa-h1", { "fastyle": "fal" }) + '</span>'
+ ' <span class="text-style-button default-clickable-icon" title="' + safe.htmlattr(L("lcl_text_style_hint_header2")) + '" data-style="h2">' + I("fa-h2", { "fastyle": "fal" }) + '</span>'
+ ' <span class="text-style-button default-clickable-icon" title="' + safe.htmlattr(L("lcl_text_style_hint_header3")) + '" data-style="h3">' + I("fa-h3", { "fastyle": "fal" }) + '</span>'
+ ' <span class="text-style-button default-clickable-icon" title="' + safe.htmlattr(L("lcl_text_style_hint_url")) + '" data-style="url">' + I("fa-link", { "fastyle": "fal" }) + '</span>'
+ ' <span class="text-style-button default-clickable-icon" title="' + safe.htmlattr(L("lcl_text_style_hint_code")) + '" data-style="code">' + I("fa-code", { "fastyle": "fal" }) + '</span>'
+ ' <span class="text-style-button default-clickable-icon" title="' + safe.htmlattr(L("lcl_text_style_hint_table")) + '" data-style="table">' + I("fa-table", { "fastyle": "fal" }) + '</span>'
+ ' <span class="text-style-button default-clickable-icon" title="' + safe.htmlattr(L("lcl_text_style_hint_image")) + '" data-style="img">' + I("fa-image", { "fastyle": "fal" }) + '</span>'
+ ' <span class="text-style-toggle default-clickable-icon" title="' + safe.htmlattr(L("lcl_text_style_toggle")) + '" data-style="toggle">' + I("fa-font", { "fastyle": "fas" }) + '</span>'
+ ' <span class="' + cls + '" title="' + safe.htmlattr(L("lcl_text_style_hint_bold")) + '" data-style="b">' + I("fa-bold", { "fastyle": "far" }) + '</span>'
+ ' <span class="' + cls + '" title="' + safe.htmlattr(L("lcl_text_style_hint_italic")) + '" data-style="i">' + I("fa-italic", { "fastyle": "fal" }) + '</span>'
+ ' <span class="' + cls + '" title="' + safe.htmlattr(L("lcl_text_style_hint_underline")) + '" data-style="u">' + I("fa-underline", { "fastyle": "fal" }) + '</span>'
+ ' <span class="' + cls + (show ? '' : ' d-xs-none d-md-initial d-lg-none d-3xl-initial') + '" title="' + safe.htmlattr(L("lcl_text_style_hint_strikethrough")) + '" data-style="s">' + I("fa-strikethrough", { "fastyle": "fal" }) + '</span>'
+ ' <span class="' + cls + (show ? '' : ' d-xs-none d-sm-initial') + '" title="' + safe.htmlattr(L("lcl_text_style_hint_header1")) + '" data-style="h1">' + I("fa-h1", { "fastyle": "fal" }) + '</span>'
+ ' <span class="' + cls + (show ? '' : ' d-xs-none d-sm-initial') + '" title="' + safe.htmlattr(L("lcl_text_style_hint_header2")) + '" data-style="h2">' + I("fa-h2", { "fastyle": "fal" }) + '</span>'
+ ' <span class="' + cls + (show ? '' : ' d-xs-none d-sm-initial d-lg-none d-xl-initial') + '" title="' + safe.htmlattr(L("lcl_text_style_hint_header3")) + '" data-style="h3">' + I("fa-h3", { "fastyle": "fal" }) + '</span>'
+ ' <span class="' + cls + (show ? '' : ' d-xs-none d-sm-initial') + '" title="' + safe.htmlattr(L("lcl_text_style_hint_url")) + '" data-style="url">' + I("fa-link", { "fastyle": "fal" }) + '</span>'
+ ' <span class="' + cls + (show ? '' : ' d-xs-none d-sm-initial') + '" title="' + safe.htmlattr(L("lcl_text_style_hint_code")) + '" data-style="code">' + I("fa-code", { "fastyle": "fal" }) + '</span>'
+ ' <span class="' + cls + (show ? '' : ' d-xs-none d-md-initial d-lg-none d-3xl-initial') + '" title="' + safe.htmlattr(L("lcl_text_style_hint_table")) + '" data-style="table">' + I("fa-table", { "fastyle": "fal" }) + '</span>'
+ ' <span class="' + cls + (show ? '' : ' d-xs-none d-sm-initial') + '" title="' + safe.htmlattr(L("lcl_text_style_hint_image")) + '" data-style="img">' + I("fa-image", { "fastyle": "fal" }) + '</span>'
+ ' <span class="text-style-toggle default-clickable-icon' + '" title="' + safe.htmlattr(L("lcl_text_style_toggle")) + '" data-style="toggle">' + I("fa-font", { "fastyle": "fas" }) + '</span>'
+ '</div>';
return result;
}