Category: Cascading Stylesheets (CSS)

Tip: Put unimportant things in the background

A great feature are the so-called badges, which show the number of records in child tables already in the headers of the tabs. However, the badges with value 0 are colored identically with badges that have a larger value. The eye can’t immediately detect if there are records or not. With a little CSS+Javascript trick I move unimportant information into the background. Problem This is the initial situation: all badges look identical. There is no distinction between 0 and >0: Final Result And this is how it looks with the small change: All badges with value 0 are discreetly moved …

AppGini / AppGini Helper / Cascading Stylesheets (CSS) / Javascript (JS) / Webdevelopment

Quickie: Fix Button-Height-Bug of Lock-Button in Detail View (DV)

Perhaps you have already seen that the height of the “Lock”-button in the Detail View is smaller than the height of the “Save”-button next to it. With a little CSS trick, which I show here, you can fix the display-bug. Problem Reason This is not related to AppGini but to the Bootstrap CSS framework. The reason is that buttons without text are obviously displayed smaller than buttons with text. We can simply check this by adding any text to the button in development tools of our browser. Solution Unfortunately, we cannot simply change the AppGini generated code itself. Maybe BigProf …

AppGini / Bootstrap / Cascading Stylesheets (CSS) / Webdevelopment

Tip: Adding your custom CSS to an AppGini project

Sometimes people ask me where to put CSS rules in AppGini projects. On this page I describe the options and tell you how I usually do it. Option 1: hooks/header-extras.php One way is to insert the CSS code in the already existing hooks/header-extras.php file. Since this is a .php file (not a .css file), however, we have to tell the browser that the inserted code is style information. We do this via the <style>-tag: Option 2: hooks/header-extras.css For larger projects, I got used to writing my CSS specifications in a separate .css file. In addition to the additional .css file …

AppGini / Cascading Stylesheets (CSS) / JQuery / Webdevelopment