Curvature

Click to preview

Name: Curvature

Author: James Kanjo
License: Creative Commons Attribution-ShareAlike 3.0 License
Tags: blue sidebar simple topbar

Supports top bar menu *: yes
Supports side bar menu *: yes
* depends on tags: topbar and sidebar

Description:

Just a simple wiki theme with rounded curves and edges.

How to install

• go to: your wiki admin panel » appearance » themes
• choose External CSS theme
• supply the following URL as the CSS location

http://themes.wdfiles.com/local--code/curvature

Code

+ show the code

a {    text-decoration: none;}
a:hover {
    background-color: transparent;
    text-decoration: underline;
}
#container {    min-width: 700px;}
#header {    margin: 0 0 2em;}
#header h1, #header h1 a, #header h1 a:hover {
    font-size: 215%;
    font-family: Lucida Calligraphy, Edwardian Script ITC, Georgia;
    font-style: italic;
    text-decoration: none;
    margin-left: 5px;
}
#header h2 {
    font-size: 150%;
    margin-left: 5px;
    margin-top: -11px;
}
#header-extra-div-1 {
    position: absolute;
    top: 0px;
    left: -4px;
    height: 7em;
    border: 4px solid;
    border-top: none;
    border-left: none;
    -moz-border-radius-bottomright: 45px;
    -webkit-border-bottom-right-radius: 45px;
    width: 50%;
    z-index: -3;
}
#header-extra-div-2 {
    position: absolute;
    top: 0px; left: 50%;
    width: 7em; height: 3em;
    z-index: -2;
}
#header-extra-div-3 {
    position: absolute;
    top: 0px;
    right: 0px;
    height: 3.5em;
    border: 4px solid;
    border-bottom: none;
    border-right: none;
    -moz-border-radius-topleft: 45px;
    -webkit-border-top-left-radius: 45px;
    width: 50%;
    z-index: -1;
}
 
#top-bar {
    position: absolute;
    top: 7.5em; right: 0em;
    height: 21px;
    z-index: 1;
    border: 1px solid;
    border-right: none;
    -moz-border-radius: 10px 0 0 10px;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-bottom-left-radius: 10px;
}
#top-bar li {    width: 12em;}
#top-bar a:hover {    text-decoration: none;}
#top-bar a, #top-bar li ul li a {    background-color: transparent;}
#top-bar li ul {
    border: 1px solid;
    -moz-border-radius: 0 0 8px 8px;
    -webkit-border-bottom-left-radius: 8px;
    -webkit-border-bottom-right-radius: 8px;
}
#side-bar {
    float: left;
    width: 13em;
    padding: 0 .5em;
    margin: 1em 0 0;
    border: 4px solid;
    border-left: none;
    -moz-border-radius-topright: 45px;
    -webkit-border-top-right-radius: 45px;
}
#main-content{    margin: 0 0 0 15em;}
#page-content {    }
#footer {
    width: 95%;
    margin: 0 auto;
    height: 16px;
    border: 1px solid;
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
}
 
#header-extra-div-1, #header-extra-div-2, #footer {    background-color: #347;}
#header-extra-div-1, #header-extra-div-3, #side-bar, #footer {    border-color: #347;}
a {    color: #347;}
a.newpage, #header h1 span {    color: #8AF;}
#top-bar, #top-bar li ul {    background-color: #8AF;}
#top-bar, #top-bar li ul {    border-color: #8AF;}
body, #login-status a, #top-bar a, #side-bar a, #footer a {    color: #000;}
#container, #header-extra-div-3, #top-bar a:hover {    background-color: #FFF;}

Notes

If you want to mirror the header elements, then just use the following URL as the CSS location:

@import url(http://themes.wdfiles.com/local--code/curvature);
 
#header h1 {
    text-align: right;
    margin-right: 10px;
}
#header h2 {
    text-align: right;
    margin-right: 20px;
}
#login-status, #search-top-box {
    left: 10px;
    right: auto;
}

http://themes.wdfiles.com/local--code/curvature/2

Click to preview

The rounded elements of this theme are only compatible in Safari and Firefox. In other browsers not using the webkit/moz css elements, the rounded elements are squared off instead.

Similar themes Basalt Theme Author: Iopk123451 Rating: 1, Comments: 0 Tags: css3 sidebar topbar Sigma9(Only Search Bottom) Author: Iopk123451 Rating: 0, Comments: 0 Tags: modern sidebar topbar

Browse themes by tag 2.0 3d 3d-buttons 610nm and and/or ardeol articles band base beige black blog bloo blue bmc border boring brown business camo cat chocholate christian christmas city clan claret claus clay clean coffe coke colorful company contest contest-win corperate corporate corporation creative crimson cross css3 css3-buttons curved d14 dark dashed deep

Comments

pieterh 15 Jun 2009 10:36

It's a nice theme but when I try to use it, I get the "Curvature" graphic, which is a bit unfortunate. Ideally the site name would go somewhere in the header.

---

Portfolio

Re:

GoVegan 19 Jul 2009 01:01

Fixed!

Side Bar

yaroslav_tenzer 24 Feb 2010 17:16

"depends on tags: topbar and sidebar"

sorry, how do I use the tags for the side bar ? I am trying to use the theme but without the side bar.

thank you,
ya

Re: Side Bar

rhombus p 24 Feb 2010 19:54

thats for this site only. theres two ways to disable it for your site. you can either add the code #sidebar{display: none} to the end of the css code, or you can go to your admin panel -> appearance -> navagational elements and delete the link to the sidebar. (should look like "nav:side")

---

Re: Side Bar

yaroslav_tenzer 24 Feb 2010 21:56

yep, worked out ! thank you !