From d91481dc6b367e2cdadd25498688dbb4984c54c9 Mon Sep 17 00:00:00 2001 From: Nathan Angelacos Date: Tue, 27 May 2008 00:59:50 +0000 Subject: snow updated to look better (on firefox, at least) git-svn-id: svn://svn.alpinelinux.org/acf/skins/trunk@1182 ab2d0c66-481e-0410-8bed-d214d4d58bed --- snow/down.png | Bin 0 -> 292 bytes snow/lr.png | Bin 0 -> 14118 bytes snow/nav-ll.png | Bin 0 -> 13829 bytes snow/nav-ul.png | Bin 0 -> 13664 bytes snow/nav-ur.png | Bin 0 -> 13735 bytes snow/snow.css | 278 +++++++++++++++++++++++--------------------------------- snow/ul.png | Bin 0 -> 13110 bytes 7 files changed, 115 insertions(+), 163 deletions(-) create mode 100644 snow/down.png create mode 100644 snow/lr.png create mode 100644 snow/nav-ll.png create mode 100644 snow/nav-ul.png create mode 100644 snow/nav-ur.png create mode 100644 snow/ul.png diff --git a/snow/down.png b/snow/down.png new file mode 100644 index 0000000..7bacc91 Binary files /dev/null and b/snow/down.png differ diff --git a/snow/lr.png b/snow/lr.png new file mode 100644 index 0000000..f99cf17 Binary files /dev/null and b/snow/lr.png differ diff --git a/snow/nav-ll.png b/snow/nav-ll.png new file mode 100644 index 0000000..51f61fa Binary files /dev/null and b/snow/nav-ll.png differ diff --git a/snow/nav-ul.png b/snow/nav-ul.png new file mode 100644 index 0000000..fad7f39 Binary files /dev/null and b/snow/nav-ul.png differ diff --git a/snow/nav-ur.png b/snow/nav-ur.png new file mode 100644 index 0000000..4a9bf01 Binary files /dev/null and b/snow/nav-ur.png differ diff --git a/snow/snow.css b/snow/snow.css index abfc145..48665a5 100644 --- a/snow/snow.css +++ b/snow/snow.css @@ -1,6 +1,5 @@ /* "Snow" - a css for Alpine Configuration Framework - - * N. Angelacos 2007 - GPL2 */ - + * N. Angelacos 2008 - GPL2 */ /* * ----------------------------------------------------------------------- @@ -30,23 +29,19 @@ a:hover { body { - background: url("../static/alpine.jpg") no-repeat; - background-position: top center; - font-family: Arial, "Trebuchet MS",Geneva, Helvetica, sans-serif; - font-size: 90%; + font-family: Georgia, Arial, Geneva, Helvetica, sans-serif; + font-size: 100%; width: 100%; } .leader { float: left; - height: 0; clear: both; } .tailer { float: left; - height: 0; clear: both; } /*--------------------------------------------------------------------------------*/ @@ -57,6 +52,9 @@ body { /*--------------------------------------------------------------------------------*/ #header { width: 100%; + background: url("alpine.jpg") #fff no-repeat 50%; + height: 100px; + font-family: Arial, sans-serif; } @@ -65,7 +63,7 @@ body { float: right; font-size: 80%; margin: 8px 32px 0 0; - font-weight: bold; + font-weight: normal; } #header .leader { @@ -81,252 +79,178 @@ body { /*--------------------------------------------------------------------------------*/ #logo { - float: left; - width: 30%; - display: inline; - margin: .25em; - background: url("logo-190x64.png") no-repeat; + display: none; } #logo .leader { - display: none; - height: 0; } #logo .tailer { - display: none; - height: 0; } #logo h1 { - font-size: 200%; - display: none; } #logo p { - /* position: absolute; */ - display: block; - clear: both; - width: 100%; - left: .25em; - font-size: 100%; - padding-top: 70px; } - -/*--------------------------------------------------------------------------------*/ -/* The .nav class is taken from suckerfish css dropdowns - see http: http://www.alistapart.com/articles/dropdowns */ +/* The Nav bar */ #nav { - float: right; - display: inline; - background: url("g-bottom.png") repeat-x bottom; - width: 100%; - line-height: 1; - border-top: 1px solid #ccc; + float: left; + width: 20%; + margin-top: 2em; + + /* font-family: Arial, sans-serif; */ } #nav ul { - margin-right: 10em; - list-style: none; - float: left; + padding: 0 0 1em 1em; + margin: 1em 0 1em 0; } #nav li { /* all list items */ - float: left; - padding: 0em 2em 2px 2em; - color: #072966; - font-size: 125%; - font-weight: bold; - color: #248; + background: url("nav-ul.png") #eee no-repeat; + margin: 0em 0 01em 0em; + padding: 25px 0 0 1em; } #nav li ul { /* second-level lists - hidden */ - position: absolute; - font-size: 65%; - width: 15em; - left: -999em; + background: url("nav-ll.png") #eee no-repeat left bottom; + padding: 0 0 25px 1em; + margin: 0 0 0 -1em; + } + +#nav .selected { + background: #fff; + color: #888; } #nav li ul ul { /* third-and-above-level lists */ - margin: -1em 0 0 20em; } #nav li ul li { - border: none; - background: transparent; - padding: 0; - color: #248; + margin: 0; + padding: 0; + line-height: 1.5; + border: none; + font-size: 85%; + padding-left: 1em; + background: transparent; } #nav li:hover ul ul { - left: -999em; - } - -#nav li:hover ul { /* lists nested under hovered list items */ - left: auto; - font-size: 65%; - background: url("orange.png"); - border-left: 1px solid #777; - border-top: 1px solid #777; - border-bottom: 1px solid #777; - /* next line is for IE only */ - // margin-top: 1.25em; } #nav a { - display: block; - padding: 2px; - font-size: 75%; - width: 15em; } - -/* End suckerfish */ +#nav .selected a { + color: #442; + text-decoration: none; + } /*--------------------------------------------------------------------------------*/ #main { - clear: both; - position: relative; - display: block; - margin: 0; - border: 0; - width: 100%; + background: url("ul.png") no-repeat -20px -20px; + padding: 1px; } /*--------------------------------------------------------------------------------*/ #postnav { - display: block; - clear: both; - font-size: 75%; - color: #248; - border-top: 1px solid #fff; - margin: 0 0; - } - -#postnav h2 { - font-size: 200%; - margin: 1.5em 10%; - } - -#postnav .tailer { - clear: both; - display: block; + display: none; } - /*--------------------------------------------------------------------------------*/ #subnav { - padding: 0 10%; - font-weight: bold; + width: 60%; + float: left; + margin-top: 2em; + padding: 0; } #subnav a { - /* display: inline; */ - padding: .25em .25em 0 .25em; - border: 1px solid #ccc; - color: #fff; - border-bottom: none; - background: #ccc; - text-decoration: none; + padding: 1em; } -#subnav a:hover { - color: #fff; - background-color: #248; +#subnav a.selected { + background: url("down.png") bottom center no-repeat; } -#subnav .selected { - background: #fff; - color: #248; +#subnav .tailer { + display: block; + height: 1px; + width: 1px; } /*--------------------------------------------------------------------------------*/ #content { - border: 1px solid #ccc; - font-size: 85%; - line-height: 1.5; - width: 80%; - margin-left: 10%; - padding: 2em 2em; + float: left; + line-height: 2; + padding: 2em; + margin: 0; + width: 70%; + border-top: 1px solid #ccc; + } #content p { clear: both; - display: block; + padding: 1em 1em 1em 1em; } #content h1 { - display: block; - font-size: 200%; - background: url("g-top.png") repeat-x top; - border-bottom: 1px dotted #248; - font-weight: bold; - color: #248; - padding: 0 1em; - margin-bottom: .5em; + font-size: 150%; + width: 100%; + clear: both; + color: #446; + text-align: right; + border-top: 1px solid #aa9; + border-bottom: 1px solid #aa9; } #content h2 { - font-size: 150%; - font-weight: bold; - display: block; + background: url("ul.png") no-repeat #666; + font-size: 120%; + color: #ffc; + float: left; + width: 98%; + padding-left: 2%; + margin-top: 1em; clear: both; - padding: 0 1em; - margin-bottom: .5em; - border-top: 1px dotted #ccc; - background: url("g-bottom.png") repeat-x bottom; } + #content h3 { - font-size: 125%; - font-weight: bold; - width: 100%; - display: block; clear: both; - padding: 0 2px; - line-height: 1; - margin-bottom: .25em; - border-bottom: 1px dotted #248; - border-top: 1px dotted #248; } #content dl { - display: block; - width: 100%; - clear: both; - color: #00f; - border: 1px solid green; - height: 1px; + margin: 0; + padding: 1em 0 25px 0; + width: 100%; + float: left; + background: url("lr.png") #eee no-repeat right bottom; + font-size: 80%; } - + #content dt { + padding-left: 1em; margin-top: 1em; - margin-right: 2em; float: left; - clear: left; - width: 30%; - border-top: 1px dashed #ccc; - border-right: 1px dashed #ccc; - display: inline; - border: 1px solid red; + width: 25%; + clear: both; } #content dd { - padding-top: 1em; - margin-bottom: 1em; - background: #ccc; - display: block; - float: left; - border: 1px solid blue; - clear: right; + float: left; + margin-top: 1em; } @@ -342,3 +266,31 @@ body { color: #aaa; } +/*---------------------------------------------------------------------------*/ + +input, select, textarea { + font-family: Georgia, Arial, Geneva, Helvetica, sans-serif; + decoration: none; + color: #226; + padding: 2px; + background: transparent; + } + +input.text, select { + border: none; + border-bottom: 1px dotted #226; + } + +input.textarea { + border: 1px dotted #226; + } + +input.submit { + border: 2px outset #226; + color: #446; + } + +input:hover, input:focus { + background: #57b; + color: #fff; + } diff --git a/snow/ul.png b/snow/ul.png new file mode 100644 index 0000000..29aa7ad Binary files /dev/null and b/snow/ul.png differ -- cgit v1.2.3