Sky

Sky is fixed or fluid width with one, two, or three columns and Suckerfish style drop down menus. Download Sky from drupal.org/project/sky. This version is 6.x-3.9 from 2009-Aug-23, a 329.96 KB download.

Configuration

Sky has a few settings you can change in Administer > Site building > Themes > Sky > Configure. This page is using the default configuration.

• You can change the separator character for the breadcrumbs line or switch it off completely.
• Change the width of the theme.
  • Fixed - 960px: A standard size for targeting: 1024 x 768 resolution. You can see that the menu on this page does not fit the default width.
  • Fluid - 98%: Will automatically size to fit the 98% the screen width, leaving room for the background image.
  • Fluid - 100%: Will automatically size to fit the 100% the screen width.
  • Set your own layout width. Be sure to specify units (px, em, %, etc).
• The alignment of the header navigation bar can be set to left, right, center, and defaults to center.
• The dropdown menu second level width is 15em and can be changed.
• The header height defaults to 95px and can be changed to anything valid in CSS.
• You can set the colour for the background, the header background, and links.
• You can set the font size with a default of 12px.
• The default font family is Lucida Grande, Lucida Sans Unicode and you can change it.
• The heading has a separate changeable font family with a defailt of Lucida Grande, Lucida Sans Unicode.

Regions

The available regions are Left sidebar, Right sidebar, Content top, Content bottom, and Content footer.

Validation

The W3C validates this theme as XHTML 1.0 Strict. The precise Total Validator test detects errors.

There should not be any white space at the start or end of an attribute's value:

<div id="block-user-0" class="block block-user block-odd region-odd clearfix style-menu ">

There are improperly nested headings.

<h3 class="title">User login</h3>

Validation as CSS 3 produces the following errors. Most of the CSS errors are elements that create curved corners in specific browsers and the theme developer says that will not change. Validation as CSS 2.1 produces a similar long list.

URI : http://d-theme.com/sites/all/themes/sky/css/layout.css?f
120 .container Property zoom doesn't exist : 1
151 * html .clearfix, * html .clear-block, * html .layout-region Property zoom doesn't exist : 1
URI : http://d-theme.com/sites/all/themes/sky/style.css?f
22 #wrapper Property -webkit-box-shadow doesn't exist : 1em 1em 1em rgba(0,0,0,0.5)
705 .pager-inner Property -webkit-border-raduis doesn't exist : 0.333em
706 .pager-inner Property -moz-border-raduis doesn't exist : 0.333em
959 .block h3.title Property -moz-border-radius-topleft doesn't exist : 0.333em
960 .block h3.title Property -webkit-border-top-left-radius doesn't exist : 0.333em
961 .block h3.title Property -moz-border-radius-topright doesn't exist : 0.333em
962 .block h3.title Property -webkit-border-top-right-radius doesn't exist : 0.333em
1061 .node-teaser .meta, .with-photo .meta Property -webkit-border-radius doesn't exist : 0.333em
1062 .node-teaser .meta, .with-photo .meta Property -moz-border-radius doesn't exist : 0.333em
1076 .node .meta .picture Property -webkit-box-shadow doesn't exist : 5px 5px 5px
1189 .node .links li Property -webkit-border-radius doesn't exist : 0.333em
1190 .node .links li Property -moz-border-radius doesn't exist : 0.333em
1333 .feed-source Property -moz-border-radius doesn't exist : 0.333em
1334 .feed-source Property -webkit-border-radius doesn't exist : 0.333em
1392 fieldset.collapsible:not(.collapsed), fieldset:not(.collapsible) Property -webkit-border-radius doesn't exist : 0.5em
1393 fieldset.collapsible:not(.collapsed), fieldset:not(.collapsible) Property -moz-border-radius doesn't exist : 0.5em
1394 fieldset.collapsible:not(.collapsed), fieldset:not(.collapsible) Property -webkit-box-shadow doesn't exist : 3px 3px 3px rgba(0,0,0,0.1)
1646 div.messages Property -webkit-border-radius doesn't exist : 0.333em
1647 div.messages Property -moz-border-radius doesn't exist : 0.333em
1679 div.password-description Property -webkit-border-radius doesn't exist : 0.333em
1680 div.password-description Property -moz-border-radius doesn't exist : 0.333em

Cynthia Says the theme is US 508 and WAI compliant as far as a computer can check. Wave did not detect accessibility errors. TV will pass the theme when the HTML error is fixed.

Example HTML

Here are example HTML elements to see how they are formatted by this theme.

<a href="?x=1234">link</a>: link This is a test of a link you have not visited. See how links are highlighted.

<a href="">link</a>: link visited This is a test of a link you have visited to see if it is a different colour.

<abbr title="abbreviation">abbr</abbr>: abbreviation

<acronym title="Cyclic Redundancy Checksum">CRC</acronym>: CRC

<blockquote>blockquote</blockquote>:

blockquote

<cite>cite</cite>:

cite

<code>code</code>:

code

<form> and <input>: The the comments form at the end of this page (if you are logged in).

<em>em</em>:

em

<h1>h1</h1> is usually the top heading in the page. Repeating h1 in this test would break heading nesting.

lt;h2>h2</h2>:

h2

<h3>h3</h3>:

h3

<h4>h4</h4>:

h4

<h5>h5</h5>:

h5

<h6>h6</h6>:

h6

<hr />:

---

<ol><li>li</li></ol>:

1. li

<p>paragraph</p>:

paragraph

<q>quote</q>:

quote

<span>span</span>:

span

<strong>strong</strong>:

strong

<table><thead><tr><td>th1</td><td>th2</td></tr></thead>
<tbody>
<tr><td>td1</td><td>td2</td></tr>
<tr><td>td3</td><td>td4</td></tr>
</tbody>
</table>:

th1	th2
td1	td2
td3	td4

<ul><li>li</li><li>li</li></ul>:

• li
• li