diff options
Diffstat (limited to 'views/default/css/elements')
| -rw-r--r-- | views/default/css/elements/components.php | 26 | ||||
| -rw-r--r-- | views/default/css/elements/core.php | 22 | ||||
| -rw-r--r-- | views/default/css/elements/forms.php | 102 | ||||
| -rw-r--r-- | views/default/css/elements/helpers.php | 17 | ||||
| -rw-r--r-- | views/default/css/elements/icons.php | 4 | ||||
| -rw-r--r-- | views/default/css/elements/layout.php | 5 | ||||
| -rw-r--r-- | views/default/css/elements/misc.php | 2 | ||||
| -rw-r--r-- | views/default/css/elements/modules.php | 19 | ||||
| -rw-r--r-- | views/default/css/elements/navigation.php | 56 | ||||
| -rw-r--r-- | views/default/css/elements/typography.php | 5 |
10 files changed, 157 insertions, 101 deletions
diff --git a/views/default/css/elements/components.php b/views/default/css/elements/components.php index f675ab7cb..7fe535d57 100644 --- a/views/default/css/elements/components.php +++ b/views/default/css/elements/components.php @@ -7,17 +7,6 @@ * @package Elgg.Core * @subpackage UI */ -/** - * elgg-body fills the space available to it. - * It uses hidden text to expand itself. The combination of auto width, overflow - * hidden, and the hidden text creates this effect. - * - * This allows us to float fixed width divs to either side of an .elgg-body div - * without having to specify the body div's width. - * - * @todo check what happens with long <pre> tags or large images - * @todo Move this to its own file -- it is very complicated and should not have to be overridden. - */ ?> /* *************************************** @@ -96,7 +85,11 @@ width: 100%; border-top: 1px solid #ccc; } -.elgg-table-alt td { +.elgg-table-alt th { + background-color: #eee; + font-weight: bold; +} +.elgg-table-alt td, .elgg-table-alt th { padding: 2px 4px 2px 4px; border-bottom: 1px solid #ccc; } @@ -276,17 +269,16 @@ Tags *************************************** */ .elgg-tags { - display: inline; font-size: 85%; } -.elgg-tags li { - display: inline; +.elgg-tags > li { + float:left; margin-right: 5px; } -.elgg-tags li:after { +.elgg-tags li.elgg-tag:after { content: ","; } -.elgg-tags li:last-child:after { +.elgg-tags li.elgg-tag:last-child:after { content: ""; } .elgg-tagcloud { diff --git a/views/default/css/elements/core.php b/views/default/css/elements/core.php index 627cae55c..74f21ee59 100644 --- a/views/default/css/elements/core.php +++ b/views/default/css/elements/core.php @@ -46,13 +46,28 @@ *overflow:visible; } -<?php //@todo isn't this only needed if we use display:table-cell? ?> +<?php +/** + * elgg-body fills the space available to it. + * It uses hidden text to expand itself. The combination of auto width, overflow + * hidden, and the hidden text creates this effect. + * + * This allows us to float fixed width divs to either side of an .elgg-body div + * without having to specify the body div's width. + * + * @todo check what happens with long <pre> tags or large images + * @todo Move this to its own file -- it is very complicated and should not have to be overridden. + */ + +//@todo isn't this only needed if we use display:table-cell? +?> .elgg-body:after, .elgg-col-last:after { display: block; visibility: hidden; height: 0 !important; line-height: 0; + overflow: hidden; /* Stretch to fill up available space */ font-size: xx-large; @@ -68,8 +83,9 @@ /* Enabled nesting of dropdown/flyout menus */ .elgg-menu > li { position: relative; } -/* Separators should only come between list items */ -.elgg-menu > li:last-child:after { display: none } +.elgg-menu > li:last-child::after { + display: none; +} /* Maximize click target */ .elgg-menu > li > a { display: block } diff --git a/views/default/css/elements/forms.php b/views/default/css/elements/forms.php index 83ec2f602..068cc8fd6 100644 --- a/views/default/css/elements/forms.php +++ b/views/default/css/elements/forms.php @@ -41,7 +41,7 @@ input, textarea { box-sizing: border-box; } -input:focus, textarea:focus { +input[type=text]:focus, textarea:focus { border: solid 1px #4690d6; background: #e4ecf5; color:#333; @@ -69,17 +69,17 @@ input[type="radio"] { margin:0 3px 0 0; padding:0; border:none; + border-radius:0; width:auto; } .elgg-input-checkboxes.elgg-horizontal li, -.elgg-input-radio.elgg-horizontal li { +.elgg-input-radios.elgg-horizontal li { display: inline; padding-right: 10px; } -.elgg-form-account input[type="text"], -.elgg-form-account input[type="password"] { - width: 300px; +.elgg-form-login, .elgg-form-account { + max-width: 450px; } /* *************************************** @@ -105,7 +105,7 @@ input[type="radio"] { margin: 0; padding:0; position: relative; - width: 100%; + width: 730px; } .friends-picker { position: relative; @@ -235,19 +235,55 @@ input[type="radio"] { } /* *************************************** - USER PICKER + AUTOCOMPLETE *************************************** */ +<?php //autocomplete will expand to fullscreen without max-width ?> +.ui-autocomplete { + position: absolute; + cursor: default; +} +.elgg-autocomplete-item .elgg-body { + max-width: 600px; +} +.ui-autocomplete { + background-color: white; + border: 1px solid #ccc; + overflow: hidden; -.user-picker .user-picker-entry { - clear:both; - height:25px; - padding:5px; - margin-top:5px; - border-bottom:1px solid #cccccc; + -webkit-border-radius: 5px; + -moz-border-radius: 5px; + border-radius: 5px; } -.user-picker-entry .elgg-button-delete { - margin-right:10px; +.ui-autocomplete .ui-menu-item { + padding: 0px 4px; + + -webkit-border-radius: 5px; + -moz-border-radius: 5px; + border-radius: 5px; +} +.ui-autocomplete .ui-menu-item:hover { + background-color: #eee; +} +.ui-autocomplete a:hover { + text-decoration: none; + color: #4690D6; } +.ui-autocomplete a.ui-state-hover { + background-color: #eee; + display: block; +} + +/* *************************************** + USER PICKER +*************************************** */ +.elgg-user-picker-list li:first-child { + border-top: 1px dotted #ccc; + margin-top: 5px; +} +.elgg-user-picker-list > li { + border-bottom: 1px dotted #ccc; +} + /* *************************************** DATE PICKER **************************************** */ @@ -284,20 +320,20 @@ input[type="radio"] { color: white; } .ui-datepicker-prev, .ui-datepicker-next { - position: absolute; - top: 5px; + position: absolute; + top: 5px; cursor: pointer; } .ui-datepicker-prev { - left: 6px; + left: 6px; } .ui-datepicker-next { - right: 6px; + right: 6px; } .ui-datepicker-title { - line-height: 1.8em; - margin: 0 30px; - text-align: center; + line-height: 1.8em; + margin: 0 30px; + text-align: center; font-weight: bold; } .ui-datepicker-calendar { @@ -306,34 +342,34 @@ input[type="radio"] { .ui-datepicker th { color: #0054A7; border: none; - font-weight: bold; - padding: 5px 6px; - text-align: center; + font-weight: bold; + padding: 5px 6px; + text-align: center; } .ui-datepicker td { padding: 1px; } .ui-datepicker td span, .ui-datepicker td a { - display: block; - padding: 2px; + display: block; + padding: 2px; line-height: 1.2em; - text-align: right; - text-decoration: none; + text-align: right; + text-decoration: none; } .ui-datepicker-calendar .ui-state-default { border: 1px solid #ccc; - color: #4690D6;; + color: #4690D6;; background: #fafafa; } .ui-datepicker-calendar .ui-state-hover { border: 1px solid #aaa; - color: #0054A7; + color: #0054A7; background: #eee; } .ui-datepicker-calendar .ui-state-active, .ui-datepicker-calendar .ui-state-active.ui-state-hover { font-weight: bold; - border: 1px solid #0054A7; - color: #0054A7; + border: 1px solid #0054A7; + color: #0054A7; background: #E4ECF5; } diff --git a/views/default/css/elements/helpers.php b/views/default/css/elements/helpers.php index e6f59260d..e9a9e0a30 100644 --- a/views/default/css/elements/helpers.php +++ b/views/default/css/elements/helpers.php @@ -33,27 +33,10 @@ float: right; } -.right { - float: right; -} - -.left { - float: left; -} - .link { cursor: pointer; } -<?php @todo // do we need something like large and small? ?> -.large { - font-size: 120%; -} - -.small { - font-size: 80%; -} - .elgg-discover .elgg-discoverable { display: none; } diff --git a/views/default/css/elements/icons.php b/views/default/css/elements/icons.php index f7c789e33..9b12e0a57 100644 --- a/views/default/css/elements/icons.php +++ b/views/default/css/elements/icons.php @@ -288,8 +288,8 @@ .elgg-ajax-loader { background: white url(<?php echo elgg_get_site_url(); ?>_graphics/ajax_loader_bw.gif) no-repeat center center; - min-height: 33px; - min-width: 33px; + min-height: 31px; + min-width: 31px; } /* *************************************** diff --git a/views/default/css/elements/layout.php b/views/default/css/elements/layout.php index 42d898439..9d92752b4 100644 --- a/views/default/css/elements/layout.php +++ b/views/default/css/elements/layout.php @@ -81,6 +81,9 @@ .elgg-layout-two-sidebar { background: transparent url(<?php echo elgg_get_site_url(); ?>_graphics/two_sidebar_background.gif) repeat-y right top; } +.elgg-layout-error { + margin-top: 20px; +} .elgg-sidebar { position: relative; padding: 20px 10px; @@ -115,4 +118,4 @@ } .elgg-page-footer a:hover { color: #666; -}
\ No newline at end of file +} diff --git a/views/default/css/elements/misc.php b/views/default/css/elements/misc.php index ebac2b91f..d9622d34a 100644 --- a/views/default/css/elements/misc.php +++ b/views/default/css/elements/misc.php @@ -18,7 +18,7 @@ #avatar-croppingtool { border-top: 1px solid #ccc; } -#user-avatar { +#user-avatar-cropper { float: left; } #user-avatar-preview { diff --git a/views/default/css/elements/modules.php b/views/default/css/elements/modules.php index ef85d4dd5..a37ae094b 100644 --- a/views/default/css/elements/modules.php +++ b/views/default/css/elements/modules.php @@ -155,19 +155,10 @@ padding: 4px 45px 0 20px; color: #666; } -.elgg-module-widget.elgg-state-draggable > .elgg-head { +.elgg-module-widget.elgg-state-draggable .elgg-widget-handle { cursor: move; } -.elgg-module-widget > .elgg-head a { - position: absolute; - top: 4px; - display: inline-block; - width: 18px; - height: 18px; - padding: 2px 2px 0 0; -} a.elgg-widget-collapse-button { - left: 5px; color: #c5c5c5; } a.elgg-widget-collapse-button:hover, @@ -181,12 +172,6 @@ a.elgg-widget-collapse-button:before { a.elgg-widget-collapsed:before { content: "\25BA"; } -a.elgg-widget-delete-button { - right: 5px; -} -a.elgg-widget-edit-button { - right: 25px; -} .elgg-module-widget > .elgg-body { background-color: white; width: 100%; @@ -206,4 +191,4 @@ a.elgg-widget-edit-button { .elgg-widget-placeholder { border: 2px dashed #dedede; margin-bottom: 15px; -}
\ No newline at end of file +} diff --git a/views/default/css/elements/navigation.php b/views/default/css/elements/navigation.php index bee1312ec..6b29e4c19 100644 --- a/views/default/css/elements/navigation.php +++ b/views/default/css/elements/navigation.php @@ -16,7 +16,7 @@ text-align: center; } .elgg-pagination li { - display: inline; + display: inline-block; margin: 0 6px 0 0; text-align: center; } @@ -24,7 +24,8 @@ -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; - + + display: block; padding: 2px 6px; color: #4690d6; border: 1px solid #4690d6; @@ -130,9 +131,9 @@ } .elgg-menu-topbar > li > a { - padding: 2px 15px 0; + padding-top: 2px; color: #eee; - margin-top: 1px; + margin: 1px 15px 0; } .elgg-menu-topbar > li > a:hover { @@ -372,7 +373,10 @@ position: absolute; z-index: 10000; - width: 165px; + overflow: hidden; + + min-width: 165px; + max-width: 250px; border: solid 1px; border-color: #E5E5E5 #999 #999 #E5E5E5; background-color: #FFF; @@ -407,7 +411,7 @@ } /* *************************************** - FOOTER + SITE FOOTER *************************************** */ .elgg-menu-footer > li, .elgg-menu-footer > li > a { @@ -429,10 +433,24 @@ } /* *************************************** + GENERAL MENU +*************************************** */ +.elgg-menu-general > li, +.elgg-menu-general > li > a { + display: inline-block; + color: #999; +} + +.elgg-menu-general > li:after { + content: "\007C"; + padding: 0 4px; +} + +/* *************************************** ENTITY AND ANNOTATION *************************************** */ <?php // height depends on line height/font size ?> -.elgg-menu-entity, elgg-menu-annotation { +.elgg-menu-entity, .elgg-menu-annotation { float: right; margin-left: 15px; font-size: 90%; @@ -517,4 +535,26 @@ *************************************** */ .elgg-menu-extras { margin-bottom: 15px; -}
\ No newline at end of file +} + +/* *************************************** + WIDGET MENU +*************************************** */ +.elgg-menu-widget > li { + position: absolute; + top: 4px; + display: inline-block; + width: 18px; + height: 18px; + padding: 2px 2px 0 0; +} + +.elgg-menu-widget > .elgg-menu-item-collapse { + left: 5px; +} +.elgg-menu-widget > .elgg-menu-item-delete { + right: 5px; +} +.elgg-menu-widget > .elgg-menu-item-settings { + right: 25px; +} diff --git a/views/default/css/elements/typography.php b/views/default/css/elements/typography.php index f080a29b2..c044cb1cc 100644 --- a/views/default/css/elements/typography.php +++ b/views/default/css/elements/typography.php @@ -139,7 +139,7 @@ h6 { font-size: 0.8em; } .elgg-output dt { font-weight: bold } .elgg-output dd { margin: 0 0 1em 1em } -.elgg-output ul, ol { +.elgg-output ul, .elgg-output ol { margin: 0 1.5em 1.5em 0; padding-left: 1.5em; } @@ -158,4 +158,5 @@ h6 { font-size: 0.8em; } } .elgg-output img { max-width: 100%; -}
\ No newline at end of file + height: auto; +} |
