Commit e836f368 authored by T(A)ILS developers's avatar T(A)ILS developers
Browse files

Wiki: redesign the sidebar

parent bc77d13a
......@@ -14,6 +14,9 @@ form{overflow:auto}legend{padding-bottom:18px}label{width:100%;position:relative
/*
------------------- T(A)ILS-specific styles ---------------------------------------------
Some text sizing use ems with decimals to calculate round pixel numbers by
default, when the user does not resize the text.
See: http://www.alistapart.com/articles/howtosizetextincss/
*/
body {
......@@ -101,17 +104,75 @@ body {
float: right;
}
.sidebar {
margin-left: 2em;
}
.sidebar .links {
padding: 0 2ex;
border:1px solid #DDDDDD;
-moz-box-shadow: 1px 1px 2px rgba(5, 5, 5, 0.2);
-webkit-box-shadow: 1px 1px 2px rgba(5, 5, 5, 0.2);
box-shadow: 1px 1px 2px rgba(5, 5, 5, 0.2);
background: #eee;
-moz-box-shadow: 1px 1px 5px rgba(5, 5, 5, 0.2);
-webkit-box-shadow: 1px 1px 5px rgba(5, 5, 5, 0.2);
box-shadow: 1px 1px 5px rgba(5, 5, 5, 0.2);
-moz-border-radius: 0.5em;
-webkit-border-radius: 0.5em;
max-width: 25ex;
width: auto;
/* width: 22ex; */
width: 220px;
}
.sidebar .download a {
width: 100%;
display: block;
background: #999 url('lib/download-arrow.png') no-repeat scroll 92% 25%;
-moz-box-shadow: 1px 1px 5px rgba(5, 5, 5, 0.2);
-webkit-box-shadow: 1px 1px 5px rgba(5, 5, 5, 0.2);
box-shadow: 1px 1px 5px rgba(5, 5, 5, 0.2);
-moz-border-radius: 0.5em;
-webkit-border-radius: 0.5em;
text-decoration: none;
margin-bottom: 1em;
}
.sidebar .download a span {
display: block;
}
.sidebar .download .tails {
font-size: 1.385em; /* 13×1.385=18px */
padding-left: 0.889em; /* 18×0.889=16px */
padding-top: 0.5em;
color: white;
}
.sidebar .download .release, .sidebar .download .date {
color: #333;
padding-left: 1.231em; /* 13×1.231=16px */
line-height: 1em;
}
.sidebar .download .date {
font-style: italic;
padding-bottom: 0.769em; /* 13×0.769=10px */
}
.sidebar .links ul {
list-style: none;
margin: 0;
padding-bottom: 0.769em; /* 13×0.769=10px */
}
.sidebar .links li a, .sidebar .links li .selflink {
font-size: 1.230em; /* 13×1.230=16px */
display: block;
padding: 0.5em 1em; /* 8px 16px */
border-top: 1px #ddd solid;
text-decoration: none;
}
.sidebar .links li a:hover {
background: #f5f5f5;
}
.sidebar .links li:first-child a, .sidebar .links li:first-child .selflink {
border: none;
}
.sidebar .logo {
......@@ -122,15 +183,10 @@ body {
div.sidebar {
position: relative;
z-index: 10;
margin-top: 18px;
border: 0;
padding: 0;
width: auto;
max-width: 25ex;
}
.sidebar ul {
margin-top: 5px;
max-width: 35ex;
}
a {
......
<div class="download">
[[<span class="tails">Download T(A)ILS</span>
<span class="release">Latest release: 0.6</span>
<span class="date">October 22, 2010</span>|Download]]
</div>
<div class="links">
<ul>
<li>Latest release:<br />0.6 (October 22, 2010)</li>
<li>[[Download T(A)ILS|Download]]</li>
<li>[[About]]</li>
<li>[[Support]]</li>
<li>[[Found a problem?|found a problem]]</li>
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment