UI/UX | Mendix | Page 7

UI/UX

Explore design principles, user experience strategies, and interface optimization techniques tailored for Mendix applications.

.elq-form label::after,.mktoForm label::after{content:"Optional";}.mktoRequiredField label::after{content:"Required";}.mxann{--mxann-bg:20,111,244;--color-text:white;--color-link:white;--color-hover:white;transition:.3s;background-color:#000;position:absolute;left:0;top:-40px;width:100%;z-index:1000;overflow:hidden;opacity:0;}.mxann.is-active{transition:none;top:var(--height-wpadminbar);pointer-events:auto;opacity:1;}.mxann.black{--color-text:black;--color-link:black;--color-hover:black;}.mxann__a{background-color:rgba(var(--mxann-bg),1);font-size:.875rem;display:block;line-height:1rem;padding:.75rem .5rem .75rem 1rem;}.mxann__a:focus,.mxann__a:hover{background-color:rgba(var(--mxann-bg),.7);}.mxann__headline{margin-right:.25rem;}.mxann__title{white-space:nowrap;text-decoration:underline;text-underline-offset:.25em;}.mxann__close{top:0;width:40px;bottom:0;right:0;color:var(--color-text);text-align:right;opacity:.7;transition:opacity .3s;}.mxann__close:focus,.mxann__close:hover{opacity:1;}.mxann__close__x{position:absolute;top:50%;transform:translate(0,-50%);right:1rem;}@media screen and (min-width:40rem){.mxann__a{display:flex;flex-wrap:wrap;justify-content:center;}.mxann__headline,.mxann__title{margin:0;padding:0 .5rem;}}.mxann__a{--mxann-bg:20,111,244;}