A New Day in Design

Sunrise by snappED_up.

Photographer.

Today is a new day in design for Beyond Caffeine. I am finally moving on from the old ‘Cleaker’ theme that has run this site for a good while now. I need something fresh and clean, and I found what I was looking for in a new theme called ‘Amazing Grace’ by Vladimir Prelovac. Amazing Grace is now the default theme for the blog.

I was really drawn to the colors of the theme, as well as the design. The colors are (for the most part) from a soothing palette and I am quite happy with it. It has a lovely spot in the top right corner that is used purely to showcase photos I have found. They serve no practical purpose, but are very lovely and reflect the tone of the site. The photo that is shown is chosen at random, so hit ‘reload’ a few times, or click on the photo credits link to see all the photos in the list.

If you are not seeing the new theme, you may have a cookie set for a different theme on this site. You can view the theme by navigating over to the sidebar where you will see a link to the available site themes. This theme switcher is active on ALL the themes I use on this site (and will continue to be there in the foreseeable future). You can easily switch between the new theme or go back to using Cleaker if you would like.

As a side note, in future, if you see any theme that is flagged ‘dev’ in the theme switcher – be warned. That means it is currently something I’m tinkering around with to make work for my site – expect it to be quirky.

I hope you enjoy the new theme as much as I am, and remember that you can always use the theme switcher if you don’t like it.

~Nicole

9 thoughts

  1. Hi,

    It’s really nice Beyond Caffeine can change the style so easy.

    But, there’s still some work to do.

    There are bugs. Actually this textarea
    is partitially below the “Article Topics”, cause the sidebar
    floats above.

    The top navigation has no padding-bottom and the “y” of the “my work item jumps into the title div.

    The subtitle is below the
    “Photo Credits Blogging Code CSS Design Tech News”-Navigation
    which has an incredable padding-top or margin of almost 1em.

    The link of the beautiful foto above is not below, but right next the bottom of the photo and also below the sidebar.

    And where’s the preview of the comments ? All gone ?

    However, the sidebar is everywhere and I can’t rewread my text,
    so I don’t need to apologize for mistakes in the syntax. 🙂

    ie7 on xp2 1024*768

    Hope this will help a bit to keep Beyond Caffeine on the level you want.
    Thanks for the theme switcher.

  2. Yikes… you see all that?

    I tried to reproduce the problems (using the same setup you said you were using) and I just can’t see them. Do you have your text zoom set very high or perhaps a user style-sheet?

    The comment preview, unfortunately, was lost only a couple of days ago when I did a late upgrade to my wordpress software – to my knowledge it’s not currently working on the old theme either.

    I know there are probably some more tweaks this theme needs, and I’m willing to make whatever changes are required. Do you think you can tell me any more about your computer text size setup or anything else you might be able to share that you think would help? I haven’t made any changes to the design, and sometimes a reload of new content makes a difference – you might see if that helps and let me know.

    Thanks again for the input!

    ~Nicole

  3. Hey Nicole, you’ve done well. Now I’ve the same problem with the screen and font size. How did you fix it? Did you set the font-size in the body style to percentage ( body{font:x%;} ) or is there another way ?

    thanks for sharing

    Tümmel

  4. @Tummel,

    I didn’t do anything fancy 🙂 Just made the default font-size percentage a bit smaller so it could handle more text-size increases.

    Thanks a bunch for the screenshots you sent.

  5. @Nicole,

    This works in textareas, too if there are no cols defined. The col size of a textarea is not affected by setting the font size to a percentage and will be displayed larger than the font setting. One workaround is to set the textarea size with css, which works fine. However it’s not valid html to define a textarea without cols. To satisfy the folks of the w3c.com the easiest way is setting the cols to 0.

    This is okay, because it works. For me that does not mean a workaround like this is good. So I’m looking for another way to reset the font size global.

  6. ups, where’s the code ?
    Now there’s only a gray box instead of code.
    I thought the htmlentities where encoded automatically using the code tag.
    However, hope this will work now:
    <textarea style="width:100%" rows="x" cols=0>text</textarea>

  7. @Tummel

    So I’m looking for another way to reset the font size global.

    You mean for a whole site? You can set the body font size.

    body { font-size: 76% }

    I think that’s what you’re asking, if not, let me know.

  8. @Nicole

    Guess my english is too hard to read.
    This does not work for textareas. 😉

    body { font-size: 76% }

    The col size of a textarea is not touched by setting the font size to a percentage and the textarea will be displayed larger than the font setting.

    This works:
    <textarea style="width:100%" rows="9" cols=0>text</textarea>

Leave a Reply