Ainsof's Blog

I've always liked the expandable search box. Its minimal and provides a nice animation when hovered over.  In the past I've come across javascript implementations but had not been able to use them.  Recently, I came across a pure CSS implementation that I ported across to Bootstrap.  Inspired by https://codepen.io/studiocaro/pen/ZbKodG this version works with Bootstrap 5. You start with the boiler plate code for nav from bootstrap.  Next I wrapped the form in a div with an id="form". I've also changed to a dark background by switching navbar-light bg-light to navbar-dark bg-dark for better contrast. If you want the search icon then add "entypo-search" class to the search form. The CSS responsible for the animation are: #form {   ...   -webkit-transition: width .55s ease;   -moz-transition: width .55s ease;   -ms-transition: width .55s ease;   -o-transition: width .55s ease;   transition: width .55s ease; } Video Live See the Pen Bootstrap 5 Expan

DRTL – Redirect 403 to User Login We have an internal app where all pages require a log in. By default Drupal shows an Access Denied page which confuses the staff. I had attempted several times to find a module to show a login page and redirect the user once logged in successfully but with no luck. One suggestion was to replace the 403 access denied page with the log in page /admin/config/system/site-information However, when staff logged in the “Access Denied” message remained because they are redirected to the wrong page. Redirect 403 to User Login Finally I found a module for that! Redirect 403 to User Login . Simply install and its good to go. Now users see a “Access Denied” message with a login screen. Once they have logged in they are taken to the page they were trying to access.   Continuous Integration (CI) Tests There was a snag when running my automated tests. It expected 403 errors from certain pages but the module would return 200 ok status. I tweak