// -------------- debshots --------------------------- $page-background: #f2f2f2; $footer-background: #333333; $footer-text-color: #b3b3b3; body { background-color: $page-background; } #teaser { // Leave some space between topbar and teaser on the home page padding-top: 20px; h1 { // Larger "We have screenshots!" teaser title font-weight: 700; } } .top-bar .name { // Display the site name in a larger font font-size: 26px; padding: 8px 5px 3px 0; color: #babdb6; // Extra space around the Linux distribution's logo img { padding: 0 5px; } } header { // Draw a colored line below the navigation topbar border-bottom: 5px solid $debian_color; } // ------- Footer - format as table cell to allow vertical centering /*@import "compass/layout/sticky-footer";*/ /*@include sticky-footer(40px, "#wholepage");*/ html, body { height: 100%; } // Wrapper that makes the page 100% high so the start page looks entirely filled #wholepage { height: 100%; } #footer { background-color: $footer-background; display: table; width: 100%; p { display: table-cell; padding: 0 20px; color: $footer-text-color; vertical-align: middle; text-align: center; font-size: 80%; } a { color: $footer-text-color; font-weight: bolder; } } // Leave some room after the topbar #content { padding-top: 5px; } // Screenshot thumbnail image with name and description .thumbnail { padding-top: 5px !important; padding-bottom: 5px !important; border-radius: 10px; margin-bottom: 10px; text-align: center; line-height: 120%; &:hover { background-color: #d0d0d0; } .pkgname { font-weight: 700; } .pkgdescription { font-size: 80%; } } // Vertical icon bar in package view #sidebar { text-align: center; // Text over a group of icons .caption { padding-bottom: 5px; color: black; } // An icon .item { padding-bottom: 10px; } // Leave space after the last icon in a group .space { padding-bottom: 20px; } } // List view .row .listview { // Leave vertical space and draw a line between package rows border-bottom: 2px solid #d0d0d0; padding-bottom: 20px; margin-bottom: 20px; img.screenshot { width: 100%; } } .row .gridview { img.screenshot { width: 100%; } } .pkgname { font-size: 130%; font-weight: 700; padding-bottom: 5px; line-height: 120%; } /*.pkgdetails { .description { font-size: 150%; color: #808080; padding-bottom: 10px; } .longdescription { font-size: 90%; line-height: 120%; padding-bottom: 5px; } .rating { padding-top: 5px; vertical-align: bottom; } .commentcount { padding-left: 20px; } } */ .grid-thumbnail { height: 125px; } // Avoid painting links to detail packages in the primary color a.black { color: black; } .gray { color: #808080; } .packagepage { h1 { margin-bottom: 0; } .subtitle { font-size: 120%; color: #808080; } .imgcaption { text-align: center; } .bigpanel { background-color: white; border-radius: 10px; padding: 1em 1em 0.1em 1em; margin-bottom: 1em; } .comment { font-size: 90%; .summary { font-weight: 700; } .author { text-align: right; color: #808080; font-style: italic; } } form.comment { border: 2px solid #a0a0a0; background-color: white; border-radius: 10px; padding: 10px; margin-bottom: 10px; .summary input,textarea { margin-bottom: 0; } // Hide most elements in a comment input form. // They get shown once the summary field is typed into. .content,.author,.submit { display: none; } } } .ratingbar { background-color: $progress-bar-color; width: 10em; display: inline-block; padding: 2px; text-align: left; color: white; text-transform: uppercase; font-size: 0.8em; font-weight: bolder; .meter { background-color: $primary-color; padding: 2px; padding-left: 0.4em; text-shadow: 0 0 2px black; } } /* Properties of a screenshot - shown in details view */ .property-title { font-weight: bolder; font-size: 120%; color: #808080; } .property { margin-left: 2em; margin-bottom: 0.5em; }