I have released the css grid version of my Zen theme for Hugo. This site have been using it for a couple of month. Read more at Layout with CSS grid and flex, it’s really nice. With the resent release of Microsoft Edge 16 there is support for css grid in all the major browsers.
This site is now using CSS grid layout and it’s a real pleasure to work with. This is part of the Zen Hugo theme and you find the code at frjo/hugo-theme-zen at grid. CSS grid is supported in resent versions of Chrome, Firefox and Safari.
I have been working with targeted CSS in Drupal themes for modern mobiles like the iPhone for some time now. xdeb.org has implemented it since early 2009, incidentally at the same time I got my first iPhone. This approach has worked well but now with over a third (34 percent) of the visitors to xdeb.
The drupal.org web site, nice as it is after the redesign, is not a pleasure to access on a mobile device like the iPhone. In issue #951114: Mobile phone support (iPhone / Android) there are some discussions and suggestions how to improve this.
When I got my first iPhone two years back I adapted the theme here on xdeb.org to work better with it. I documented it in my post Make a Drupal theme look better on the iPhone. During the holidays I got to try out the iPad for a few days and found ways to make the xdeb.
The same customer that featured in my last blog wanted a aggregator block turned in to a vertical news ticker/scroller. The block contained a total of 20 items of which three should show. I wanted something lightweight and simpel that I could add to the theme.
The search field is an important part of almost any web site today and it deserve some attention. Especially if you have implemented some really good search like Apache Solr (see How to set up Apache Solr search for Drupal 6 on a Debian GNU/Linux server).
I’m using Safari on my iPhone to browse the web more than I thought I would. Mobil Safari display pages very much like Safari on Mac OS X so it mostly works really well. A web design however rarely works well on both a big computer screen and a small handheld screen, even a high resolution one like on the iPhone.
The PNG format (Portable Network Graphics) was created to be a replacement for the GIF format. It is patent free open standard with a number of advantages over GIF. One of the few problems with PNG images is that it’s difficult, not to say impossible, to match colors in CSS and GIF images with does in a PNG image.