Hopefully this little guide will help you along the way. Not to worry though, this task is far from impossible. In addition to the normal stuff like fonts, logos, file types/sizes, legal availability of images, and color selection… you have to worry about a very limited canvas, tricky dimensions, and a number of other unique items. This is mostly because a browser comes with a list of design constraints that are as unique as the application’s use.
Designing a browser theme can be very challenging. If I don't use any custom transition or the script (with the relevant CSS removed), but only the mask with the shadow and border, and open/close the toolbar via the Firefox key shortcut or context menu, the issue also occurs, but only every 7th time or so. If I use the transition and the mask, the bottom border is not being drawn. If I use the transition without the mask, the bottom border shows up fine too. If I use no transition, the bottom border shows up fine. I've kind of narrowed it down to it being a possible issue with a mask I'm using on the toolbar, in combination with any kind of transition.
Here's a screenshot of the issue the red line on top is an inset box-shadow, the blue line at the bottom a border a mask is creating a gradient from the left to the right ( see CSS below ). The problem is, when I close and then re-open that toolbar, the border I've applied to the bottom is not being drawn.
I'm using a script to hide/show the PersonalToolbar it's making the toolbar open and close a bit abruptly - the built in FF animation/transition isn't working in that case - so I added my own transition.
0 kommentar(er)
