Sandbox Kubrick

  • Author
    Posts
  • #23753

    andy
    Member

    body {
    background:#d5d6d7 url(‘/wp-content/themes/default/images/kubrickbgcolor.jpg’);
    color:#333;
    font-family:”lucida grande”, verdana, arial, sans-serif;
    font-size:62.5%;
    text-align:center;
    margin:0 0 20px;
    padding:0;
    }

    div#globalnav ul#menu {
    margin:-20px 0 0 30px;
    padding:0;
    }

    * html div#globalnav {
    margin-bottom:20px;
    }

    div#globalnav ul#menu li {
    display:inline;
    margin:0;
    padding:0;
    }

    div#globalnav ul#menu a,div#globalnav ul#menu a:visited {
    display:block;
    float:left;
    height:18px;
    text-decoration:none;
    color:white;
    font-size:1.2em;
    margin:0 5px;
    padding:2px 5px 0;
    }

    div#globalnav ul#menu li a:hover,div#globalnav ul#menu li.current_page_item a,div#globalnav ul#menu li.current_page_item a:visited {
    background:#fff;
    color:#06c;
    }

    div#wrapper {
    background:#dfdfff url(‘/wp-content/themes/default/images/kubrickbg.jpg’) repeat-y top left;
    text-align:left;
    width:760px;
    margin:20px auto;
    padding:0;
    }

    body.single #wrapper {
    background:#fff url(‘/wp-content/themes/default/images/kubrickbgwide.jpg’) repeat-y top left;
    }

    div#header {
    background:#73a0c5 url(‘/wp-content/themes/default/images/kubrickheader.jpg’) no-repeat bottom center;
    height:200px;
    width:760px;
    margin:0;
    padding:0;
    }

    div#container {
    clear:left;
    }

    div#content {
    float:left;
    font-size:1.2em;
    line-height:1.4em;
    width:450px;
    margin:0;
    padding:0 0 20px 45px;
    }

    body.single div#content {
    float:none;
    line-height:1.6em;
    margin:5px 0 0 150px;
    padding:10px 0 20px;
    }

    div.entry-content p {
    line-height:1.4em;
    }

    div.entry-meta {
    clear:left;
    font-size:85%;
    line-height:1.4em;
    padding-top:5px;
    text-align:center;
    }

    body.single .entry-meta {
    text-align:justify;
    margin:30px 0;
    }

    body.archive .entry-meta {
    text-align:left;
    }

    div.comments li.alt,body.single .entry-meta {
    background:#f8f8f8;
    border-bottom:1px solid #ddd;
    border-top:1px solid #ddd;
    margin:0;
    padding:10px;
    }

    div#footer {
    background:#eee url(‘/wp-content/themes/default/images/kubrickfooter.jpg’) no-repeat top;
    border:none;
    clear:both;
    height:63px;
    width:760px;
    margin:0 auto;
    padding:0;
    }

    small,abbr.published {
    border:none;
    color:#777;
    font-family:arial, helvetica, sans-serif;
    font-size:0.9em;
    line-height:1.5em;
    }

    h1,h2,h3 {
    font-family:”trebuchet ms”, “lucida grande”, verdana, sans-serif;
    font-weight:bold;
    }

    h1 {
    font-size:4em;
    padding-top:75px;
    text-align:center;
    margin:0;
    }

    div#blog-description {
    font-size:1.2em;
    text-align:center;
    }

    h2 {
    font-size:1.6em;
    margin:30px 0 0;
    }

    body.page h2.entry-title {
    margin-top:30px;
    text-align:center;
    }

    h3 {
    font-size:1.3em;
    margin:30px 0 0;
    padding:0;
    }

    div.sidebar h3 {
    font-family:”lucida grande”, verdana, arial, sans-serif;
    font-size:1.2em;
    margin:5px 0 0;
    padding:0;
    }

    h1,h1 a,h1 a:hover,h1 a:visited,div#blog-description {
    color:#fff;
    text-decoration:none;
    }

    h2,h2 a,h2 a:visited,h3,h3 a,h3 a:visited {
    color:#333;
    line-height:110%;
    }

    h2,h2 a,h2 a:hover,h2 a:visited,h3,h3 a,h3 a:hover,h3 a:visited,.sidebar h3,#wp-calendar caption,cite {
    text-decoration:none;
    }

    div.entry-content p a:visited {
    color:#b85b5a;
    }

    ol.commentlist li,form#commentform input,form#commentform textarea {
    font:0.9em “lucida grande”, verdana, arial, sans-serif;
    }

    ol.commentlist .comment-author {
    font-weight:bold;
    }

    ol.commentlist li,ol.commentslist li.alt {
    list-style:none;
    margin:0;
    padding:15px 10px 6px;
    }

    ol.commentlist li.bypostauthor {
    background:#dbe8f2;
    margin:0;
    padding:15px 10px 6px;
    }

    ol.commentlist cite,ol.commentlist cite a {
    font-weight:bold;
    font-style:normal;
    font-size:1.1em;
    }

    ol.commentlist p {
    line-height:1.5em;
    text-transform:none;
    margin:10px 5px 10px 0;
    }

    form#commentform p {
    font-family:”lucida grande”, verdana, arial, sans-serif;
    margin:5px 0;
    }

    .comment-metadata {
    display:block;
    font-weight:normal;
    margin:0;
    }

    div.sidebar {
    font:1em “lucida grande”, verdana, arial, sans-serif;
    margin-left:545px;
    width:190px;
    padding:0;
    }

    div#primary {
    margin-top:40px;
    }

    small,div.sidebar ul ul li,div.sidebar ul ol li,.nocomments,.entry-meta,blockquote,strike {
    color:#777;
    }

    code,pre {
    font:1em/140% “courier new”, courier, monospace;
    }

    acronym,abbr,span.caps {
    cursor:help;
    font-size:0.9em;
    letter-spacing:.07em;
    }

    a,h2 a:hover,h3 a:hover {
    color:#06c;
    text-decoration:none;
    }

    a:hover {
    color:#147;
    text-decoration:underline;
    }

    #wp-calendar #prev a {
    font-size:9pt;
    padding-left:10px;
    text-align:left;
    }

    #wp-calendar a {
    text-decoration:none;
    display:block;
    }

    #wp-calendar caption {
    font:bold 1.3em “lucida grande”, verdana, arial, sans-serif;
    text-align:center;
    width:100%;
    }

    #wp-calendar th {
    font-style:normal;
    text-transform:capitalize;
    }

    div.post {
    text-align:justify;
    margin:0 0 40px;
    }

    body.attachment .smallattachment {
    float:left;
    text-align:center;
    width:128px;
    margin:5px 5px 5px 0;
    }

    body.attachment .attachment {
    text-align:center;
    margin:5px 0;
    }

    div#footer p {
    text-align:center;
    margin:0;
    padding:20px 0;
    }

    h3.comment-header {
    margin:40px auto 20px;
    padding:0;
    }

    p img {
    max-width:100%;
    padding:0;
    }

    img.centered {
    display:block;
    margin:0 auto;
    }

    img.alignright {
    display:inline;
    margin:0 0 2px 7px;
    padding:4px;
    }

    img.alignleft {
    display:inline;
    margin:0 7px 2px 0;
    padding:4px;
    }

    html>body div.entry-content ul {
    list-style:none;
    margin-left:0;
    text-indent:-10px;
    padding:0 0 0 10px;
    }

    html>body div.entry-content li {
    margin:7px 0 8px 10px;
    }

    div.entry-content ol {
    margin:0;
    padding:0 0 0 35px;
    }

    div.entry-meta ul,div.entry-meta li {
    display:inline;
    list-style:none;
    }

    div.sidebar ul li {
    list-style:none;
    margin-bottom:15px;
    }

    div.sidebar ul p,div.sidebar ul select {
    margin:5px 0 8px;
    }

    div.sidebar ul ul,div.sidebar ul ol {
    margin:5px 0 0 10px;
    }

    div.sidebar ul ul ul,div.sidebar ul ol {
    margin:0 0 0 10px;
    }

    ol li,div.sidebar ul ol li {
    list-style:decimal outside;
    }

    div.sidebar ul ul li,div.sidebar ul ol li {
    margin:3px 0 0;
    padding:0;
    }

    form#searchform {
    text-align:center;
    margin:0 0 10px;
    padding:5px 3px;
    }

    div.sidebar form#searchform #s {
    width:108px;
    padding:2px;
    }

    div.sidebar form#searchsubmit {
    padding:1px;
    }

    select {
    width:130px;
    }

    form#commentform input {
    width:170px;
    margin:5px 5px 1px 0;
    padding:2px;
    }

    form#commentform textarea {
    width:98%;
    padding:2px;
    }

    form#commentform #submit {
    float:right;
    margin:0;
    }

    ol.commentlist {
    text-align:justify;
    padding:0;
    }

    .nocomments {
    text-align:center;
    margin:0;
    padding:0;
    }

    #wp-calendar {
    empty-cells:show;
    width:155px;
    margin:10px auto 0;
    }

    #wp-calendar #next a {
    padding-right:10px;
    text-align:right;
    }

    #wp-calendar td {
    text-align:center;
    padding:3px 0;
    }

    #wp-calendar td.pad:hover {
    background:#fff;
    }

    acronym,abbr {
    border-bottom:1px dashed #999;
    }

    blockquote {
    border-left:5px solid #ddd;
    padding-left:20px;
    margin:15px 30px 0 10px;
    }

    blockquote cite {
    display:block;
    margin:5px 0 0;
    }

    a img {
    border:none;
    }

    div.navigation {
    display:block;
    text-align:center;
    margin:50px 0 10px;
    }

    body.single div.navigation {
    margin:10px 0 60px;
    }

    body.single .post,div.sidebar form {
    margin:0;
    }

    div.entry-content ol li,div.sidebar ul,div.sidebar ul ol {
    margin:0;
    padding:0;
    }

    div.entry-content form,.center {
    text-align:center;
    }

    div#globalnav ul ul,p.access,body.single div.sidebar,hr {
    display:none;
    }

    div.content-column {
    width:48%;
    }

    #linkcats>li:before {
    content:””;
    }

    div.clearer,body.single h2.entry-title {
    clear:both;
    }

    .alignright,.nav-next,div#archives-by-month {
    float:right;
    }

    .alignleft,.nav-previous,div#archives-by-category {
    float:left;
    }

    div.entry-content ul li:before,div.sidebar ul ul li:before {
    content:”\00BB \0020″;
    }

    span.post-commentlink a:after {
    content:”\0020 \00BB”;
    }

    #23984

    andy
    Member

    To use this, select the Sandbox theme with the No CSS skin. Then paste this code into the CSS Editor and save it.

    #23988

    sdrane
    Member

    Coolness. I’m going to give this a try.

    Earlier, I just selected Kubrick as my theme and posted some minor overides in the CSS editor. But your code might be a better way to customize Kubrick.

    #23989

    wank
    Member

    Can I be the first to ask what the advantages would be in paying $15 and copying and pasting this into the custom CSS box rather than just, um, selecting Kubrick from the presentation panel?

    #23990

    sdrane
    Member

    Wank, the advantages would be that, once you have access to the CSS from Kubrick, you can change it suit your own requirements. For instance, the code that Andy has posted allows for the inclusion of a menubar for the pages, which isn’t part of the original Kubrick. Check out a preliminary version here.

    You could change font sizes, layout, add a sidebar, etc.

    Andy: The template seems to work well. I just need to get the bullets working in the sidebar like the original Kubrick. Then I can go crazy on other things ;).

    #23993

    swallick
    Member

    Actually, the beauty of this is that the Sandbox is flexible enough to be a lot of things, including Kubrick. Why couldn’t it also be Connections, etc? It’s an example of the theme’s flexibility. It also is a terrific example of how to make a stylesheet for the Sandbox.

    #23994

    advantage:

    .category-asides h2 {
    display: none;
    }
    .category-noteworthy h2 {
    background: url(heart.gif) no-repeat top right;
    }

    #23996

    andy
    Member

    sunburntkamel: That’s exactly the kind of thing I was hoping to see :-)

    #24529

    meonlly
    Member

    useless
    thsanks

    #24530

    timethief
    Member

    meonlly
    You haven’t asked a question and you haven’t clarified what you think is “useless”. Do you have a question to ask or a problem that you need to resolve?

    #24531

    brentroos
    Member

    meonlly, wasn’t it useless to leave your useless comment?

    #24576

    writerhoward
    Member

    Is the only way to change the header image to replace what’s between the single quotes below with the link to my image?

    url(‘/wp-content/themes/default/images/kubrickheader.jpg’)

    Would a URL like this work:
    url(‘wh.com/images/myheaderimg.jpg’)

    #24577

    wank
    Member

    Is the only way to change the header image to replace what’s between the single quotes below with the link to my image?

    If you’re using Sandbox, yes, since that theme doesn’t have a separate custom header uploader.

    Would a URL like this work:

    Yes. There’s no reason why you can’t link to an external image if that image is on your own server space (if it’s from a third-party site, however, they may not appreciate you hotlinking and could disable the image.) Most people, though, would upload the image to their wordpress.com account and host it locally.

    #24578

    msommerville
    Member

    I’m using this for my site, but how do i get rid of the huge amount of whitespace between the header and the content?

    http://petsupplies4less.wordpress.com

    #24579

    wank
    Member

    Depends. Do you want to keep the ‘About’ link where it is or move it into the sidebar?

    By the way, I’d advise you to cut down on the number of links to your main site and start posting original material on your blog rather than just reproducing stuff from petsupplies4less. WordPress.com is quite strict about accounts being used purely to boost traffic and PR of external sites, and it would suck to have your blog deleted after having invested in custom CSS.

    #24580

    msommerville
    Member

    I’d rather move it to the sidebar.

    #24581

    wank
    Member

    OK, try

    #access {display:none}
    #container {margin-top:-40px}

    and add a Pages widget to your sidebar so the about link shows up there.

    #24582

    msommerville
    Member

    Works perfectly! Thanks!

    #24583

    ij3n
    Member

    Anyone have some advice for a novice for working with the following qualities in “sand box kubric”?

    While previewing the code I noticed:

    1. The header does not float – I would like it to float, I think… at least for the image to stay centered with the page/body background.

    2. The body text and background image do not stay aligned with each other while changing browser window width: must I get rid of the background image?

    3. The sidebar text is variable width, I’d prefer it to be fixed width.

    4. The body text is fixed width, I’d prefer it to be variable width…

    5. I’d like to add the sidebar to a kubric styleposts template! –the big reason I am investigating this CSS stuff, besides fun…

    Any thoughts would be appreciated,

    WordPress Rocks

    #24584

    ij3n
    Member

    O.k. so like I said I was a novice, I hadn’t switched over to sandbox before adding the css code…

    Now I have other questions. I’ll ask later, if they still exist, aftert some experimenting…

The topic ‘Sandbox Kubrick’ is closed to new replies.