/dumbhippo/branches/linux-client-1-1-32-bugfix/server/web/css3/site-positions.css
CSS | 758 lines | 571 code | 141 blank | 46 comment | 0 complexity | 79e6200dcd03408a08f9fa063773b400 MD5 | raw file
- @CHARSET "UTF-8";
-
- body {
- margin-top: 0px;
- margin-bottom: 0px;
- margin-left: 10px;
- margin-right: 10px;
- padding: 0px;
- text-align: center; /* center the page for IE */
- }
- #dhPageOuter {
- position: relative;
- /* Override the text-align on body */
- text-align: left;
- /* Set the bounds on the page size for firefox, ignored by IE; the 640 isn't scientific,
- * it's just a heuristic for when things start looking hosed at a particular font size */
- min-width: 640px;
- max-width: 1000px;
- /* And for IE, ignored by firefox */
- width:expression(document.body.clientWidth < 660 ? 640 : document.body.clientWidth > 1020 ? 1000 : document.body.clientWidth - 20);
- /* Center the page for firefox */
- margin-left: auto;
- margin-right: auto;
-
- }
-
- /* browsers have default margins on forms it seems */
- form {
- margin: 0px;
- }
-
- /* post descriptions have <p> tags, avoid extra space from them */
- .dh-blurb p {
- margin-top: 1px;
- margin-bottom: 1px;
- }
-
- #dhPage {
- position: relative;
- margin-top: 0px;
- width: 100%;
- }
- /* specific only to input entries and not textarea's which have specified rows */
- input.dh-text-input {
- height: 23px;
- }
- .dh-page-title {
- }
-
- .dh-page-title-link {
- margin-left: 5px;
- }
- .dh-page-title-container {
- width: 100%;
- position: relative;
- margin-bottom: 8px;
- margin-top: 8px;
- }
-
- .dh-page-options-container {
- position: absolute;
- right: 0;
- top: 0;
- text-align: right;
- width: 50%;
- }
-
- .dh-page-options-tip-area {
- position: relative;
- display: block;
- float: right;
- clear: both;
- top: -13px;
- }
-
- .dh-page-options-options-area {
- position: relative;
- display: block;
- float: right;
- clear: right;
- top: -10px;
- right: 0px;
- }
-
- .dh-page-options-sub-options-area {
- width: 100%;
- position: relative;
- top: -4px;
- margin-bottom: 4px;
- }
- #dhPageFooter {
- clear: both;
- margin-top: 10px;
- }
-
- #dhWebServices {
- text-align: center;
- }
-
- .dh-amazon-attribution, .dh-yahoo-attribution {
- margin: 15px; /* Yahoo! request */
- }
-
- .dh-compact-item {
- margin-top: 10px;
- }
-
- .dh-compact-item .dh-image {
- width: 60px;
- height: 60px;
- background-color: white; /* debug */
-
- /* without this IE will grow the box a bit apparently */
- overflow: hidden;
- }
-
- .dh-compact-item .dh-next-to-image {
- width: 110px;
- margin-left: 10px;
- overflow: hidden;
- }
-
- .dh-compact-item .dh-next-to-image .dh-name {
- /* on the page this is 10px, not sure where the extra px come from */
- margin-bottom: 3px;
- }
-
- .dh-compact-item .dh-next-to-image .dh-action-link, .dh-compact-item .dh-next-to-image .dh-presence {
- margin-top: 2px;
- }
-
- #dhPageFooter {
- clear: both;
- margin-top: 10px;
- text-align: right;
- }
-
- .dh-nowplaying {
- width: 440px;
- /* when the badge has a label, this is wrong. */
- /* height: 120px; */
- }
-
- .dh-grow-div-around-floats {
- clear: both;
- }
-
- .dh-song-with-art {
- position: relative;
- }
-
- .dh-song-image {
- float: left;
- width: 75px;
- text-align: center;
- }
-
- .dh-song-with-art .dh-song-info {
- float: left;
- margin-left: 8px;
- width: 147px;
- }
-
- .dh-one-line-song div {
- display: inline;
- }
-
- .dh-one-line-song {
- width: 100%;
- }
-
- .dh-invisible {
- display: none;
- }
-
- .dh-option-list-option {
- margin-left: 5px;
- margin-right: 5px;
- }
-
- /* Position this so the stock photo popup is relative to it */
- #dhChooseStockLinkContainer {
- position: relative;
- }
-
- div.dh-notification {
- padding: 4px;
- width: 468px;
- }
-
- .dh-popup {
- position: absolute;
- }
-
- /* For the nested div onion creating the borders of the popup,
- * position: relative would make more sense but seems to
- * confuse firefox into drawing the background color of the outermost
- * div over the top and bottom of the chooser.
- * Using float: left fixes firefox, but creates the "double margin"
- * bug in IE, which is fixed with display:inline
- * (inline is invalid on floats, but gets ignored except
- * to mysteriously fix the IE double margin bug)
- */
-
- .dh-popup .dh-border {
- /* hacks! see comment above */
- float: left;
- display: inline;
- /* end hacks */
- margin-left: 0px;
- margin-top: 0px;
- /* background of parent is drop shadow */
- margin-bottom: 1px;
- }
-
- .dh-popup .dh-content-padding {
- /* hacks! see comment above */
- float: left;
- display: inline;
- /* end hacks */
- /* background of parent is the black border */
- margin-top: 1px;
- margin-bottom: 1px;
- margin-left: 1px;
- }
-
- .dh-popup .dh-content {
- /* hacks! see comment above */
- float: left;
- display: inline;
- /* end hacks */
- margin-top: 10px;
- margin-left: 10px;
- /* IE seems to ignore margin-bottom, I don't know why,
- * since we don't set any heights padding works too
- */
- padding-bottom: 10px;
- /* if we have a fixed width, don't exceed it */
- overflow: hidden;
- }
-
- .dh-popup .dh-content .dh-title {
- position: relative;
- }
- .dh-page-shinybox-title-large {
- margin-top: 5px;
- margin-bottom: 5px;
- }
-
- .dh-page-shinybox-subtitle {
- margin-top: 10px;
- }
- .dh-shiny-box {
- margin-bottom: 10px;
- display: block;
- }
-
- .dh-shiny-box-spacer-table {
- width: 100%;
- }
- .dh-shiny-box-left {
- float: left;
- clear: left;
- }
-
- .dh-shiny-box-right {
- float: right;
- clear: right;
- }
-
- .dh-shiny-box-bottom {
- width: 100%;
- }
- .dh-shiny-box-content-side-spacer {
- width: 10px;
- }
- .dh-shiny-box-content-border {
- margin: 0px 0px;
- }
- .dh-stacker-container {
- width: 100%;
- display: block;
- }
- .dh-stacker-block {
- width: 100%;
- }
- .dh-stacker-block-mouse-tip {
- display: none;
- position: absolute;
- z-index: 2;
- }
-
- .dh-stacker-block-left {
- margin-top: 5px;
- margin-bottom: 5px;
- margin-right: 5px;
- margin-left: 3px;
- }
-
- .dh-stacker-block-title-image {
- position: relative;
- top: 1px;
- }
-
- .dh-stacker-block-title-lock {
- position: relative;
- top: 1px;
- padding-right: 5px;
- padding-left: 5px;
- }
-
- .dh-stacker-block-bottom-padding {
- font-size: 4px;
- height: 4px;
- }
- .dh-stacker-block-icon-column {
- width: 26px;
- }
- .dh-stacker-block-icon {
- margin: 5px;
- }
-
- .dh-stacker-block-beside-image .dh-stacker-block-icon {
- margin: 0px;
- }
- .dh-stacker-block p {
- margin: 0px;
- padding: 0px;
- }
- .dh-stacker-block-header {
- height: 40px;
- width: 100%;
- }
- .dh-stacker-block-header-description {
- overflow: hidden;
- }
- .dh-stacker-block-description {
- margin-left: 20px;
- }
- .dh-stacker-block-right {
- text-align: right;
- margin-right: 5px;
- }
- .dh-stacker-block-right-container-inner {
- width: 100%;
- margin-top: 5px;
- white-space: nowrap;
- }
- .dh-stacker-block-right-container-inner-table {
- width: 100%;
- table-layout: fixed;
- }
- .dh-stacker-block-right-from-image {
- margin-right: 5px;
- }
- .dh-stacker-block-hr {
- border: none;
- height: 1px;
- color: #666666;
- margin-left: 5px;
- margin-right: 5px;
- }
- .dh-stacker-block-content-left {
- width: 20px;
- }
- .dh-stacker-block-content {
- margin-top: 10px;
- width: 100%;
- }
- .dh-stacker-block-content-container {
- width: 100%;
- }
- .dh-stacker-block-content-padding {
- height: 8px;
- }
- .dh-stacker-block-controls {
- padding-right: 5px;
- }
- .dh-stacker-block-content-main {
- width: 100%;
- }
- .dh-stacker-block-sent-to {
- text-align: right;
- }
- .dh-stacker-block-time-qualifier {
- display: none;
- }
- .dh-stacker-block-chat-time-ago {
- margin-left: 5px;
- }
- .dh-half-shinybox-left-container {
- width: 49%;
- float: left;
- }
- .dh-half-shinybox-right-container {
- width: 49%;
- float: right;
- text-align: left;
- }
-
- .dh-thumbnail-box-border, .dh-rss-box-border {
- position: relative;
- width: 478px;
- margin-top: 10px;
- margin-bottom: 10px;
- /* FIXME this should be margin on the inner box, not padding here, or the width will be broken */
- padding: 1px;
- }
-
- .dh-thumbnail-box, .dh-rss-box {
- position: relative;
- padding: 0px;
- margin: 0px;
- }
-
- .dh-thumbnail-meta, .dh-rss-meta {
- position: relative;
- height: 26px;
- /* FIXME this should be margin on an inner box, not padding here, or the width will be broken */
- padding-top: 6px;
- }
-
- .dh-thumbnail-service, .dh-rss-service {
- position: absolute;
- left: 10px;
- }
-
- .dh-thumbnail-status, .dh-rss-status {
- position: absolute;
- right: 10px;
- }
-
- .dh-thumbnail-photos-border {
- position: relative;
- /* 478px is the whole photos box width, minus 2px more for the border */
- width: 476px;
- overflow: hidden;
- }
-
- .dh-thumbnail-photos {
- margin: 10px;
- margin-top: 0px;
- /*
- * The thumbs each have a 20px right margin, we cap the whole size at 475px.
- * So we need to be at least that wide. It's OK to be larger than the
- * page width by up to the size of the right margin, since it will just
- * get chopped.
- */
- width: 496px;
- }
-
- .dh-thumbnail-photo {
- float: left;
- margin-right: 20px;
- padding: 0px;
- }
-
- .dh-thumbnail-photo img {
- border: none;
- margin: 0px;
- }
-
- .dh-thumbnail-photo .dh-thumbnail-title {
- overflow: hidden;
- text-align: center;
- }
-
- .dh-more, .dh-back {
- margin-top: 5px;
- margin-bottom: 5px;
- }
-
- .dh-person-info .dh-back {
- margin-top: 30px;
- }
-
- .dh-person-header-next-to-image {
- margin-left: 10px;
- }
-
- div.dh-person-header {
- padding-top: 8px;
- }
- div.dh-person-header-title {
- }
-
- .dh-person-header-description {
- margin-left: 5px;
- }
-
- .dh-person-header .dh-person-info {
- width: 100%;
- }
-
- .dh-person-header-next-to-image .dh-favicons {
- padding-top: 5px;
- }
-
- .dh-person-header-stats {
- padding-top: 1px;
- padding-bottom: 2px;
- }
-
- .dh-download-header-area {
- margin-top: 5px;
- }
-
- .dh-learnmore-section {
- width: 100%;
- }
-
- .dh-learnmore-section-top {
- margin-top: 5px;
- }
-
- .dh-learnmore-header {
- margin-bottom: 5px;
- }
-
- #dhLearnMoreNextStep {
- margin-top: 5px;
- margin-bottom: 10px;
- }
-
- #dhLearnMoreNextStep td {
- padding-right: 10px;
- }
-
- #dhLearnMoreButtons td {
- padding-right: 0px;
- }
-
- .dh-download-details {
- border-left: 2px solid #999999;
- padding-left: 10px;
- white-space: nowrap;
- }
-
- .dh-learnmore-summary {
- margin-bottom: 5px;
- }
-
- .dh-learnmore-illustration {
- float: left;
- display: inline;
- margin-right: 10px;
- }
-
- /* overflow: auto keeps all the text to the right of the float instead of pushing part of it underneath
- the float. If this text is floated as a block it tries to be 100% wide in Firefox and all of the text
- ends up underneath the image. */
- .dh-learnmore-explanation {
- overflow: auto;
- }
-
- .dh-learnmore-explanation p {
- margin-top: 0px;
- margin-bottom: 7px;
- }
-
- .dh-download-buttons img, .dh-download-buttons-or {
- margin-right: 10px;
- }
- .dh-thumbnail-block-border {
- width: 100%;
- }
-
- .dh-thumbnail-block-thumbs {
- margin: 10px;
- width: 100%;
- }
-
- .dh-thumbnail-block-thumb {
- float: left;
- margin-right: 20px;
- padding: 0px;
- overflow: hidden;
- text-align: center;
- }
-
- .dh-thumbnail-block-thumb img {
- border: none;
- margin: 0px;
- }
-
- .dh-thumbnail-block-thumb .dh-thumbnail-title {
- overflow: hidden;
- }
-
- .dh-thumbnail-block-more {
- float: left;
- }
-
- #dhTermsOfUseNote, #dhFacebookNote {
- padding: 5px;
- margin-bottom: 5px;
- }
- .dh-tooltip {
- position: absolute;
- display: none;
- z-index: 2;
- }
-
- .dh-person-item {
- position: relative;
- display: block;
- float: left;
- margin: 5px;
- width: 72px;
- overflow: hidden;
- }
-
- .dh-person-item-more-info {
- min-width: 270px;
- padding: 3px;
- }
-
- .dh-person-item .dh-image {
- height: 60px;
- width: 60px;
- margin-left: 6px;
- }
-
- .dh-person-item-more-info .dh-image {
- height: 60px;
- width: 60px;
- padding-right: 3px;
- }
-
- .dh-person-item-name {
- text-align: center;
- white-space: nowrap;
- }
-
- .dh-person-item-more-info .dh-presence {
- position: relative;
- float: left;
- display: inline;
- margin-right: 2px;
- }
-
- .dh-person-item-more-info .dh-person-item-name {
- position: relative;
- float: left;
- clear: right;
- display: inline;
- margin-top: -2px;
- text-align: left;
- }
-
- .dh-person-item-more-info .dh-favicons {
- width: 200px;
- }
-
- .dh-invitation-date {
- margin-left: 1px;
- }
-
- .dh-photo {
- position: relative;
- }
-
- .dh-photo .dh-presence {
- position: absolute;
- top: 0px;
- right: -5px;
- }
- #dhAccountStatus, #dhAccountDisabled {
- position: relative;
- padding-left: 9px;
- padding-right: 9px;
- padding-top: 4px;
- padding-bottom: 4px;
- margin-bottom: 15px;
- }
- .dh-account-status-secondary {
- padding-left: 15px;
- }
- .dh-account-status-secondary input {
- margin-left: 0px;
- }
- #dhDownloadMessageClose {
- position: absolute;
- top: 2px;
- right: 3px;
- }
-
- .dh-section-header {
- margin-top: 5px;
- }
-
- .dh-message {
- padding: 5px;
- margin-top: 5px;
- margin-bottom: 5px;
- }
-
- .dh-message a {
- margin-right: 5px;
- margin-left: 5px;
- }
-
- .dh-shinybox-bottom-content {
- position: relative;
- margin-top: 5px;
- margin-bottom: -10px;
- }
- .dh-tip {
- margin-right: 30px;
- margin-left: 30px;
- }
- .dh-tip-tip {
- padding-left: 5px;
- }