themes/bec/style.css
@@ -4,7 +4,7 @@
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Web App Theme</title>
<link rel="stylesheet" href="stylesheets/base.css" type="text/css" media="screen" />
- <link rel="stylesheet" id="current-theme" href="themes/default/style.css" type="text/css" media="screen" />
+ <link rel="stylesheet" id="current-theme" href="themes/bec/style.css" type="text/css" media="screen" />
<script type="text/javascript" charset="utf-8" src="javascripts/jquery-1.3.min.js"></script>
<script type="text/javascript" charset="utf-8">
var Theme = {
@@ -56,53 +56,51 @@
</ul>
<div class="clear"></div>
</div>
- <h1 class="title">All users</h1>
- <div id="main">
- <p class="first">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
- <hr />
- <h1>Tables</h1>
- <table class="table">
- <tr>
- <th class="first"><a href="#" title="Toggle" class="toggle" onclick="this.up('table').select('input[type=\'checkbox\']').each(function(e){e.checked = !e.checked}); return false;">Toggle</a></th>
- <th>ID</th>
- <th>Login</th>
- <th>Name</th>
- <th class="last">Surname</th>
- </tr>
- <tr>
- <td><input type="checkbox" class="checkbox" name="id" value="1" /></td><td>1</td><td>hulk</td><td>Hulk</td><td>Hogan</td>
- </tr>
- <tr>
- <td><input type="checkbox" class="checkbox" name="id" value="2" /></td><td>2</td><td>ultimate</td><td>Ultimate</td><td>Warrior</td>
- </tr>
- </table>
- <div class="pagination">
- <span class="current">1</span><a href="#">2</a><a href="#">3</a><a href="#">4</a><a href="#">5</a><a href="#">6</a><a href="#">7</a><a href="#">8</a><a href="#">9</a><a href="#">1</a><a href="#">10</a>
- <div class="clear"></div>
+
+ <div class="main-block">
+ <h2 class="title">All users</h2>
+ <div class="main_container">
+ <p class="first">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
+ <span class="hightlight">Excepteur sint occaecat cupidatat non proident</span>, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
+ <p> <span class="small">small text</span></p>
+ <p> <span class="gray">gray text</span></p>
+ <hr />
+ <h1>Tables</h1>
+ <table class="table">
+ <tr>
+ <th class="first"><a href="#" title="Toggle" class="toggle" onclick="this.up('table').select('input[type=\'checkbox\']').each(function(e){e.checked = !e.checked}); return false;">Toggle</a></th>
+ <th>ID</th>
+ <th>Login</th>
+ <th>Name</th>
+ <th class="last">Surname</th>
+ </tr>
+ <tr>
+ <td><input type="checkbox" class="checkbox" name="id" value="1" /></td><td>1</td><td>hulk</td><td>Hulk</td><td>Hogan</td>
+ </tr>
+ <tr>
+ <td><input type="checkbox" class="checkbox" name="id" value="2" /></td><td>2</td><td>ultimate</td><td>Ultimate</td><td>Warrior</td>
+ </tr>
+ </table>
+ <div class="pagination">
+ <span class="current">1</span><a href="#">2</a><a href="#">3</a><a href="#">4</a><a href="#">5</a><a href="#">6</a><a href="#">7</a><a href="#">8</a><a href="#">9</a><a href="#">1</a><a href="#">10</a>
+ <div class="clear"></div>
+ </div>
</div>
+ </div>
- <hr />
-
- <h2>Forms</h2>
- <form action="#" method="get" class="form">
- <div class="group">
- <label class="title">Text field</label>
- <input type="text" class="text" />
+ <div class="main-block">
+ <h2 class="title">Forms</h2>
+ <div class="form-container">
+ <div class="flash-messages error">
+ <p>Error message</p>
</div>
- <div class="group">
- <label class="title">Text area</label>
- <textarea class="textarea" rows="10" cols="80"></textarea>
+ <div class="flash-messages warning">
+ <p>Warning message</p>
</div>
- <div class="group">
- <input type="submit" value="Save →" /> or <a href="#">Cancel</a>
+ <div class="flash-messages notice">
+ <p>Notice message</p>
</div>
- </form>
-
- <hr />
-
- <h2>2 columns forms</h2>
- <form action="#" method="get" class="form">
- <div class="column left">
+ <form action="#" method="get" class="form">
<div class="group">
<label class="title">Text field</label>
<input type="text" class="text" />
@@ -110,101 +108,129 @@
<div class="group">
<label class="title">Text area</label>
<textarea class="textarea" rows="10" cols="80"></textarea>
- </div>
- </div>
- <div class="column right">
- <div class="group">
- <label class="title">Select</label>
- <select><option value="1">Choose...</option></select>
- </div>
- <div class="group">
- <label class="title">Check box</label>
- <div>
- <input type="checkbox" name="checkbox" id="checkbox_1" class="checkbox" value="1" /> <label for="checkbox_1" class="checkbox">Option 1</label>
- </div>
- <div>
- <input type="checkbox" name="checkbox" id="checkbox_2" class="checkbox" value="2" /> <label for="checkbox_2" class="checkbox">Option 2</label>
- </div>
</div>
- <div class="group">
- <label class="title">Radio</label>
- <div>
- <input type="radio" name="radio" id="radio_1" class="checkbox" value="1" /> <label for="radio_1" class="radio">Option 1</label>
- </div>
- <div>
- <input type="radio" name="radio" id="radio_2" class="checkbox" value="2" /> <label for="radio_2" class="radio">Option 2</label>
- </div>
+ <div class="group navform">
+ <input type="submit" value="Save →" /> or <a href="#">Cancel</a>
</div>
- </div>
- <div class="clear"></div>
- <div>
- <input type="submit" value="Save →" /> or <a href="#">Cancel</a>
- </div>
- </form>
+ </form>
+ </div>
+ </div>
- <hr />
- <h2>Activities</h2>
- <ul class="list">
- <li>
- <div class="date left day">
- <span class="day">Thursday</span>
- <span>Jan 15</span>
- </div>
- <div class="item">
- <a href="#"><img class="avatar" src="images/avatar.png" alt="avatar" /></a>
- <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
- </div>
- </li>
- <li>
- <div class="date left hour">
- <span>08:30 PM</span>
- </div>
- <div class="item">
- <a href="#"><img class="avatar" src="images/avatar.png" alt="avatar" /></a>
- <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborumLorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
- </div>
- </li>
- <li>
- <div class="date left hour">
- <span>08:30 PM</span>
+ <div class="main-block">
+ <h2 class="title">2 columns forms</h2>
+ <div class="form-container">
+ <form action="#" method="get" class="form">
+ <div class="column left">
+ <div class="group">
+ <label class="title">Text field</label>
+ <input type="text" class="text" />
+ </div>
+ <div class="group">
+ <label class="title">Text area</label>
+ <textarea class="textarea" rows="10" cols="80"></textarea>
+ </div>
</div>
- <div class="item">
- <a href="#"><img class="avatar" src="images/avatar.png" alt="avatar" /></a>
- <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
+ <div class="column right">
+ <div class="group">
+ <label class="title">Select</label>
+ <select><option value="1">Choose...</option></select>
+ </div>
+ <div class="group">
+ <label class="title">Check box</label>
+ <div>
+ <input type="checkbox" name="checkbox" id="checkbox_1" class="checkbox" value="1" /> <label for="checkbox_1" class="checkbox">Option 1</label>
+ </div>
+ <div>
+ <input type="checkbox" name="checkbox" id="checkbox_2" class="checkbox" value="2" /> <label for="checkbox_2" class="checkbox">Option 2</label>
+ </div>
+ </div>
+ <div class="group">
+ <label class="title">Radio</label>
+ <div>
+ <input type="radio" name="radio" id="radio_1" class="checkbox" value="1" /> <label for="radio_1" class="radio">Option 1</label>
+ </div>
+ <div>
+ <input type="radio" name="radio" id="radio_2" class="checkbox" value="2" /> <label for="radio_2" class="radio">Option 2</label>
+ </div>
+ </div>
</div>
- </li>
- </ul>
+ <div class="clear"></div>
+ <div class="group navform">
+ <input type="submit" value="Save →" /> or <a href="#">Cancel</a>
+ </div>
+ </form>
+ </div>
+ </div>
- <h2>Messages</h2>
- <ul class="list">
- <li>
- <div class="left">
- <a href="#"><img class="avatar" src="images/avatar.png" alt="avatar" /></a>
- </div>
- <div class="item">
- <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
- </div>
- </li>
- <li>
- <div class="left">
- <a href="#"><img class="avatar" src="images/avatar.png" alt="avatar" /></a>
- </div>
- <div class="item">
- <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
- </div>
- </li>
- <li>
- <div class="left">
- <a href="#"><img class="avatar" src="images/avatar.png" alt="avatar" /></a>
- </div>
- <div class="item">
- <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
- </div>
- </li>
- </ul>
+ <div class="main-block">
+ <h2 class="title">Activities</h2>
+ <div class="block-container">
+ <ul class="list">
+ <li>
+ <div class="date left day">
+ <span class="day">Thursday</span>
+ <span>Jan 15</span>
+ </div>
+ <div class="item">
+ <a href="#"><img class="avatar" src="images/avatar.png" alt="avatar" /></a>
+ <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
+ </div>
+ </li>
+ <li>
+ <div class="date left hour">
+ <span>08:30 PM</span>
+ </div>
+ <div class="item">
+ <a href="#"><img class="avatar" src="images/avatar.png" alt="avatar" /></a>
+ <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborumLorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
+ </div>
+ </li>
+ <li>
+ <div class="date left hour">
+ <span>08:30 PM</span>
+ </div>
+ <div class="item">
+ <a href="#"><img class="avatar" src="images/avatar.png" alt="avatar" /></a>
+ <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
+ </div>
+ </li>
+ </ul>
+ </div>
+ </div>
+ <div class="main-block">
+ <h2 class="title">Messages</h2>
+ <div class="block-container">
+ <ul class="list">
+ <li>
+ <div class="left">
+ <a href="#"><img class="avatar" src="images/avatar.png" alt="avatar" /></a>
+ </div>
+ <div class="item">
+ <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
+ </div>
+ </li>
+ <li>
+ <div class="left">
+ <a href="#"><img class="avatar" src="images/avatar.png" alt="avatar" /></a>
+ </div>
+ <div class="item">
+ <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
+ </div>
+ </li>
+ <li>
+ <div class="left">
+ <a href="#"><img class="avatar" src="images/avatar.png" alt="avatar" /></a>
+ </div>
+ <div class="item">
+ <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
+ </div>
+ </li>
+ </ul>
+ </div>
</div>
+
</div>
<div id="sidebar">
<div class="block">
@@ -214,6 +240,7 @@
<li><a href="#" onclick="Theme.activate('green'); return false;">Green</a></li>
<li><a href="#" onclick="Theme.activate('purple'); return false;">Purple</a></li>
<li><a href="#" onclick="Theme.activate('black-grey'); return false;">Black & Grey</a></li>
+ <li class="last"><a href="#" onclick="Theme.activate('bec'); return false;">Bec</a></li>
</ul>
</div>
<div class="block">
@@ -222,9 +249,21 @@
<li><a href="#">Example link 1</a></li>
<li><a href="#">Example link 2</a></li>
<li><a href="#">Example link 3</a></li>
- <li><a href="#">Example link 4</a></li>
+ <li class="last"><a href="#">Example link 4</a></li>
</ul>
</div>
+ <div class="block">
+ <div class="notice">
+ <h4>Notice Title</h4>
+ <p>Morbi posuere urna vitae nunc. Curabitur ultrices, lorem ac aliquam blandit, lectus eros hendrerit eros, at eleifend libero ipsum hendrerit urna. Suspendisse viverra. Morbi ut magna. Praesent id ipsum. Sed feugiat ipsum ut felis. Fusce vitae nibh sed risus commodo pulvinar. Duis ut dolor. Cras ac erat pulvinar tortor porta sodales. Aenean tempor venenatis dolor.</p>
+ </div>
+ </div>
+ <div class="block">
+ <div class="sidebar-block">
+ <h4>Sidebar Inner block Title</h4>
+ <p>Morbi posuere urna vitae nunc. Curabitur ultrices, lorem ac <a href="#">aliquam blandit</a>, lectus eros hendrerit eros, at eleifend libero ipsum hendrerit urna. Suspendisse viverra. Morbi ut magna. Praesent id ipsum. Sed feugiat ipsum ut felis. Fusce vitae nibh sed risus commodo pulvinar. Duis ut dolor. Cras ac erat pulvinar tortor porta sodales. Aenean tempor venenatis dolor.</p>
+ </div>
+ </div>
</div>
<div class="clear"></div>
</div>
index.html
@@ -1,17 +1,18 @@
+
+* {margin:0;padding:0}
.clear { clear: both; }
h1 { margin: 15px 0; font-size: 22px; font-weight: normal; }
h2 { font-size: 22px; margin: 15px 0; font-weight: normal;}
h3 { font-size: 18px; margin: 10px 0; font-weight: normal;}
+h4 { font-size: 16px; margin: 10px 0; font-weight: normal;}
hr {height: 1px; border: 0; }
p { margin: 15px 0;}
a img { border: none; }
body {
- margin: 0;
- padding: 0;
font-size: 12px;
- font-family: helvetica,arial,sans-serif;
+ font-family: sans-serif;
}
#container {
@@ -28,8 +29,7 @@ body {
}
#header h1 {
- margin: 0;
- padding: 20px 0;
+ padding: 10px 0;
font-size: 30px;
}
@@ -42,10 +42,6 @@ body {
float: left;
}
-#content h1.title {
- padding: 0 15px;
-}
-
#content .pagination {
padding: 15px 0;
}
@@ -58,10 +54,7 @@ body {
#sidebar h3 {
padding: 10px 15px;
margin: 0;
- font-weight: normal;
font-size: 13px;
- border-bottom-width: 10px;
- border-bottom-style: solid;
}
#sidebar .block {
@@ -70,22 +63,23 @@ body {
}
#sidebar ul.navigation li a:link, #sidebar ul.navigation li a:visited {
- text-decoration: none;
display: block;
padding: 10px 15px;
- border-bottom-width: 1px;
- border-bottom-style: solid;
+}
+
+#sidebar .block .sidebar-block, #sidebar .notice {
+ padding:10px;
}
#wrapper {
padding-top: 20px;
}
-#main {
+.main-block {
padding: 1px 15px;
}
-#main p.first {
+.main-block p.first {
margin-top: 0;
}
@@ -177,7 +171,6 @@ body {
display: block;
width: 12px;
height: 12px;
- -moz-outline: none;
}
.table th.first {
@@ -186,8 +179,6 @@ body {
}
.table td {
- border-bottom-width: 1px;
- border-bottom-style: solid;
padding: 10px;
}
@@ -221,14 +212,11 @@ input.checkbox {
}
.form input.checkbox, .form input.radio {
- clear: left;
- float: left;
margin-right: 5px;
}
.form label.checkbox, .form label.radio {
line-height: 1.5em;
- display: block;
}
.form label.title {
@@ -253,8 +241,6 @@ ul.list {
ul.list li {
clear: left;
- border-bottom-width: 1px;
- border-bottom-style: solid;
padding-bottom: 5px;
}
@@ -286,40 +272,7 @@ ul.list li .date .day {
ul.list li .item .avatar {
float: left;
margin: 0 5px 5px 0;
- padding: 2px;
- border-width: 1px;
- border-style: solid;
width: 30px;
height: 30px;
}
-/* rounded borders */
-#content, #main-navigation li, #secondary-navigation, #sidebar .block, #sidebar h3, ul.list li .left.date.day {
- -moz-border-radius-topleft: 4px;
- -webkit-border-top-left-radius: 4px;
- -moz-border-radius-topright: 4px;
- -webkit-border-top-right-radius: 4px;
-}
-
-#secondary-navigation ul li.first, .table th.first, .table th.first {
- -moz-border-radius-topleft: 4px;
- -webkit-border-top-left-radius: 4px;
-}
-
-.table th.last {
- -moz-border-radius-topright: 4px;
- -webkit-border-top-right-radius: 4px;
-}
-
-
-#secondary-navigation ul li.first {
- -moz-border-radius-topleft: 4px;
- -webkit-border-top-left-radius: 4px;
-}
-
-#content h1.title, #sidebar, #sidebar .block, #sidebar ul.navigation, ul.list li .date.day {
- -moz-border-radius-bottomleft: 4px;
- -webkit-border-bottom-left-radius: 4px;
- -moz-border-radius-bottomright: 4px;
- -webkit-border-bottom-right-radius: 4px;
-}
\ No newline at end of file
stylesheets/base.css
@@ -3,6 +3,7 @@ a:link, a:visited, a:hover, a:active, h1, h2, h3 { color: #122741; }
body {
color: #222;
background: #f0f0ee;
+ font-family: helvetica, arial, sans-serif;
}
hr {
@@ -29,12 +30,13 @@ hr {
#sidebar h3 {
background: #122741;
color: #FFF;
- border-bottom-color: #364B69;
+ border-bottom: 10px solid #364B69;
}
#sidebar ul li a:link, #sidebar ul li a:visited {
background: #FFF;
- border-bottom-color: #F0F0EE;
+ border-bottom: 1px solid #F0F0EE;
+ text-decoration: none;
}
#sidebar ul li a:hover, #sidebar ul li a:active {
@@ -110,7 +112,7 @@ hr {
}
.table td {
- border-bottom-color: #F0F0EE;
+ border-bottom:1px solid #F0F0EE;
}
/* forms */
@@ -125,6 +127,8 @@ hr {
ul.list li {
border-bottom-color: #F0F0EE;
+ border-bottom-width: 1px;
+ border-bottom-style: solid;
}
ul.list li .left.date {
@@ -138,4 +142,39 @@ ul.list li .date.day {
ul.list li .item .avatar {
border-color: #F0F0EE;
+ border-width: 1px;
+ border-style: solid;
+ padding: 2px;
+}
+
+/* rounded borders */
+
+#content, #main-navigation li, #secondary-navigation, #sidebar .block, #sidebar h3, ul.list li .left.date.day {
+ -moz-border-radius-topleft: 4px;
+ -webkit-border-top-left-radius: 4px;
+ -moz-border-radius-topright: 4px;
+ -webkit-border-top-right-radius: 4px;
+}
+
+#secondary-navigation ul li.first, .table th.first, .table th.first {
+ -moz-border-radius-topleft: 4px;
+ -webkit-border-top-left-radius: 4px;
+}
+
+.table th.last {
+ -moz-border-radius-topright: 4px;
+ -webkit-border-top-right-radius: 4px;
+}
+
+
+#secondary-navigation ul li.first {
+ -moz-border-radius-topleft: 4px;
+ -webkit-border-top-left-radius: 4px;
+}
+
+#sidebar, #sidebar .block, #sidebar ul.navigation, ul.list li .date.day {
+ -moz-border-radius-bottomleft: 4px;
+ -webkit-border-bottom-left-radius: 4px;
+ -moz-border-radius-bottomright: 4px;
+ -webkit-border-bottom-right-radius: 4px;
}
themes/default/style.css
7325124a8e0ee5afc28ae078f014fe750327787c
Giovanni Intini
giovanni@mikamai.com
http://github.com/drogus/web-app-theme/commit/ac4b9f5a9bc3561a8f0d223e81ef3567b894ba30
ac4b9f5a9bc3561a8f0d223e81ef3567b894ba30
2009-01-20T09:33:33-08:00
2009-01-20T09:33:33-08:00
added nelson fernandez contribution
7b6a9b6acccb8ef480078742aa43317445df5398
Giovanni Intini
giovanni@mikamai.com