diff options
Diffstat (limited to 'views/default/css/elements/forms.php')
| -rw-r--r-- | views/default/css/elements/forms.php | 322 |
1 files changed, 123 insertions, 199 deletions
diff --git a/views/default/css/elements/forms.php b/views/default/css/elements/forms.php index 0230cbc54..068cc8fd6 100644 --- a/views/default/css/elements/forms.php +++ b/views/default/css/elements/forms.php @@ -16,6 +16,10 @@ fieldset > div { fieldset > div:last-child { margin-bottom: 0; } +.elgg-form-alt > fieldset > .elgg-foot { + border-top: 1px solid #CCC; + padding: 10px 0; +} label { font-weight: bold; @@ -37,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; @@ -65,17 +69,25 @@ 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-login, .elgg-form-account { + max-width: 450px; +} + /* *************************************** FRIENDS PICKER *************************************** */ +.friends-picker-main-wrapper { + margin-bottom: 15px; +} .friends-picker-container h3 { font-size:4em !important; text-align: left; @@ -93,7 +105,7 @@ input[type="radio"] { margin: 0; padding:0; position: relative; - width: 100%; + width: 730px; } .friends-picker { position: relative; @@ -223,229 +235,141 @@ input[type="radio"] { } /* *************************************** - USER PICKER + AUTOCOMPLETE *************************************** */ - -.user-picker .user-picker-entry { - clear:both; - height:25px; - padding:5px; - margin-top:5px; - border-bottom:1px solid #cccccc; +<?php //autocomplete will expand to fullscreen without max-width ?> +.ui-autocomplete { + position: absolute; + cursor: default; } -.user-picker-entry .elgg-button-delete { - margin-right:10px; +.elgg-autocomplete-item .elgg-body { + max-width: 600px; } -/* *************************************** - Datepicker -**************************************** */ +.ui-autocomplete { + background-color: white; + border: 1px solid #ccc; + overflow: hidden; -#ui-datepicker-div, .ui-datepicker-inline, .ui-datepicker-calendar{ - font-family: Arial, Helvetica, sans-serif; - font-size: 14px; - padding: 0; - margin: 0; - background: #E4ECF5; - width: 220px; - color: black; -} -#ui-datepicker-div { - display: none; - border: 1px solid #777; - z-index: 9999; /*must have*/ -} -.ui-datepicker-inline { - float: left; - display: block; - border: 0; -} -.ui-datepicker-rtl { - direction: rtl; -} -.ui-datepicker-dialog { - padding: 5px !important; - border: 4px ridge #ddd !important; -} -button.ui-datepicker-trigger { - width: 25px; + -webkit-border-radius: 5px; + -moz-border-radius: 5px; + border-radius: 5px; } -img.ui-datepicker-trigger { - margin: 2px; - vertical-align: middle; +.ui-autocomplete .ui-menu-item { + padding: 0px 4px; + + -webkit-border-radius: 5px; + -moz-border-radius: 5px; + border-radius: 5px; } -.ui-datepicker-prompt { - float: left; - padding: 2px; - background: #ddd; - color: #000; +.ui-autocomplete .ui-menu-item:hover { + background-color: #eee; } -* html .ui-datepicker-prompt { - width: 185px; +.ui-autocomplete a:hover { + text-decoration: none; + color: #4690D6; } -.ui-datepicker-control, .ui-datepicker-links, .ui-datepicker-header, .ui-datepicker { - clear: both; - float: left; - width: 218px; - color: #fff; +.ui-autocomplete a.ui-state-hover { + background-color: #eee; + display: block; } -.ui-datepicker-control { - background: #400; - padding: 2px 0px; + +/* *************************************** + USER PICKER +*************************************** */ +.elgg-user-picker-list li:first-child { + border-top: 1px dotted #ccc; + margin-top: 5px; } -.ui-datepicker-links { - background: #000; - padding: 2px 0px; +.elgg-user-picker-list > li { + border-bottom: 1px dotted #ccc; } -.ui-datepicker-control, .ui-datepicker-links { - font-weight: bold; - font-size: 80%; + +/* *************************************** + DATE PICKER +**************************************** */ +.ui-datepicker { + display: none; + + margin-top: 3px; + width: 208px; + background-color: white; + border: 1px solid #0054A7; + -webkit-border-radius: 6px; + -moz-border-radius: 6px; + border-radius: 6px; + overflow: hidden; + + -webkit-box-shadow: 4px 4px 4px rgba(0, 0, 0, 0.5); + -moz-box-shadow: 4px 4px 4px rgba(0, 0, 0, 0.5); + box-shadow: 4px 4px 4px rgba(0, 0, 0, 0.5); } -.ui-datepicker-links label { /* disabled links */ - padding: 2px 5px; - color: #888; +.ui-datepicker-inline { + -webkit-box-shadow: none; + -moz-box-shadow: none; + box-shadow: none; } -.ui-datepicker-clear, .ui-datepicker-prev { - float: left; + +.ui-datepicker-header { + position: relative; + background: #4690D6; + color: white; + padding: 2px 0; + border-bottom: 1px solid #0054A7; } -.ui-datepicker-rtl .ui-datepicker-clear, .ui-datepicker-rtl .ui-datepicker-prev { - float: right; - text-align: right; +.ui-datepicker-header a { + color: white; } -.ui-datepicker-current { - float: left; - width: 30%; - text-align: center; +.ui-datepicker-prev, .ui-datepicker-next { + position: absolute; + top: 5px; + cursor: pointer; } -.ui-datepicker-close, .ui-datepicker-next { - float: right; - text-align: right; - padding: 0px 0px 2px 0px; +.ui-datepicker-prev { + left: 6px; } -.ui-datepicker-rtl .ui-datepicker-close, .ui-datepicker-rtl { - float: left; - text-align: left; +.ui-datepicker-next { + right: 6px; } -.ui-datepicker-header { - padding: 1px 0 3px; - background: #4690D6; +.ui-datepicker-title { + line-height: 1.8em; + margin: 0 30px; text-align: center; font-weight: bold; - height: 1.3em; - padding: 0 2px 3px 0; } -.ui-datepicker-header select { - background: #333; - color: #fff; - border: 0px; - font-weight: bold; +.ui-datepicker-calendar { + margin: 4px; } -.ui-datepicker { - background: #ccc; +.ui-datepicker th { + color: #0054A7; + border: none; + font-weight: bold; + padding: 5px 6px; text-align: center; - font-size: 100%; -} -.ui-datepicker a { - display: block; - width: 30px; -} -.ui-datepicker-title-row { - background: #777; -} -.ui-datepicker-days-row { - background: #eee; - color: #666; -} -.ui-datepicker-week-col { - background: #777; - color: #fff; } -.ui-datepicker-days-cell { - color: #000; - border: 1px solid #ddd; +.ui-datepicker td { + padding: 1px; } -.ui-datepicker-days-cell a{ +.ui-datepicker td span, .ui-datepicker td a { display: block; + padding: 2px; + line-height: 1.2em; + text-align: right; + text-decoration: none; } -.ui-datepicker-week-end-cell { - background: #ddd; -} -.ui-datepicker-title-row .ui-datepicker-week-end-cell { - background: #777; -} -.ui-datepicker-days-cell-over { - background: #fff; - border: 1px solid #777; -} -.ui-datepicker-unselectable { - color: #E4ECF5; -} -.ui-datepicker-today { - background: #4690D6 !important; -} -.ui-datepicker-current-day { - background: #999 !important; -} -.ui-datepicker-status { - background: #ddd; - width: 100%; - font-size: 80%; - text-align: center; -} - -/* ________ Datepicker Links _______ - -** Reset link properties and then override them with !important */ -#ui-datepicker-div a, .ui-datepicker-inline a { - cursor: pointer; - margin: 0; - padding: 0; - background: none; - color: #000; - align: center !important; -} -.ui-datepicker-inline .ui-datepicker-links a { - padding: 0 5px !important; -} -.ui-datepicker-control a, .ui-datepicker-links a { - padding: 2px 5px !important; - color: #eee !important; -} -.ui-datepicker-title-row a { - color: #eee !important; -} -.ui-datepicker-control a:hover { - background: #fdd !important; - color: #333 !important; -} -.ui-datepicker-links a:hover, .ui-datepicker-title-row a:hover { - background: #ddd !important; - color: #333 !important; +.ui-datepicker-calendar .ui-state-default { + border: 1px solid #ccc; + color: #4690D6;; + background: #fafafa; } - -/* ___________ MULTIPLE MONTHS _________*/ - -.ui-datepicker-multi .ui-datepicker { - border: 1px solid #777; +.ui-datepicker-calendar .ui-state-hover { + border: 1px solid #aaa; + color: #0054A7; + background: #eee; } -.ui-datepicker-one-month { - float: left; - width: 185px; -} -.ui-datepicker-new-row { - clear: left; -} - -/* ___________ IE6 IFRAME FIX ________ */ - -.ui-datepicker-cover { - display: none; /*sorry for IE5*/ - display/**/: block; /*sorry for IE5*/ - position: absolute; /*must have*/ - z-index: -1; /*must have*/ - filter: mask(); /*must have*/ - top: -4px; /*must have*/ - left: -4px; /*must have*/ - width: 200px; /*must have*/ - height: 200px; /*must have*/ +.ui-datepicker-calendar .ui-state-active, +.ui-datepicker-calendar .ui-state-active.ui-state-hover { + font-weight: bold; + border: 1px solid #0054A7; + color: #0054A7; + background: #E4ECF5; } - |