diff options
Diffstat (limited to 'views/default/css/elements/navigation.php')
| -rw-r--r-- | views/default/css/elements/navigation.php | 539 |
1 files changed, 507 insertions, 32 deletions
diff --git a/views/default/css/elements/navigation.php b/views/default/css/elements/navigation.php index 0bd90c02a..6b29e4c19 100644 --- a/views/default/css/elements/navigation.php +++ b/views/default/css/elements/navigation.php @@ -6,80 +6,555 @@ * @subpackage UI */ ?> -/* <style> + /* *************************************** PAGINATION *************************************** */ -.elgg-menu > li > a:hover,.elgg-menu > li > a{text-decoration:none;}.elgg-menu-owner-block li > a > .elgg-icon,.elgg-menu-extras li > a > .elgg-icon,.elgg-menu-page li > a > .elgg-icon,.elgg-menu-composer li > a > .elgg-icon{margin-left:-20px;margin-right:4px;}.elgg-pagination{display:block;border:1px solid #CCC;background:#F7F7F7;text-align:center;border-width:1px 0;}.elgg-pagination > li{display:inline-block;}.elgg-pagination > li > a,.elgg-pagination > li > span{font-size:13px;font-weight:700;text-align:center;display:block;margin:3px 11px 0 0;padding:3px 4px 4px;}.elgg-pagination > li > a:hover{background:#3B5998;color:#FFF;text-decoration:none;}.elgg-pagination > .elgg-state-selected > span{border-bottom:2px solid #3B3B3B;} +.elgg-pagination { + margin: 10px 0; + display: block; + text-align: center; +} +.elgg-pagination li { + display: inline-block; + margin: 0 6px 0 0; + text-align: center; +} +.elgg-pagination a, .elgg-pagination span { + -webkit-border-radius: 4px; + -moz-border-radius: 4px; + border-radius: 4px; + + display: block; + padding: 2px 6px; + color: #4690d6; + border: 1px solid #4690d6; + font-size: 12px; +} +.elgg-pagination a:hover { + background: #4690d6; + color: white; + text-decoration: none; +} +.elgg-pagination .elgg-state-disabled span { + color: #CCCCCC; + border-color: #CCCCCC; +} +.elgg-pagination .elgg-state-selected span { + color: #555555; + border-color: #555555; +} + /* *************************************** TABS *************************************** */ -.elgg-tabs{border-bottom:1px solid #D8DFEA;display:block;width:100%;padding-left:15px;}.elgg-tabs > li{display:inline-block;background:#D8DFEA;border:1px solid #D8DFEA;border-bottom:0;margin:2px 2px -1px 0;}.elgg-tabs > :hover{background:#627AAD;border:1px solid #627AAD;border-bottom:0;}.elgg-tabs > li > a{font-size:13px;font-weight:700;text-align:center;display:block;padding:3px 11px 4px;}.elgg-tabs > :hover > a{color:#FFF;text-decoration:none;}.elgg-tabs > .elgg-state-selected{border:1px solid #D8DFEA;border-bottom:0;margin-top:0;}.elgg-tabs > .elgg-state-selected > a,.elgg-tabs > .elgg-state-selected:hover > a{background:#FFF;color:#333;padding:5px 10px 4px;} +.elgg-tabs { + margin-bottom: 5px; + border-bottom: 2px solid #cccccc; + display: table; + width: 100%; +} +.elgg-tabs li { + float: left; + border: 2px solid #ccc; + border-bottom: 0; + background: #eee; + margin: 0 0 0 10px; + + -webkit-border-radius: 5px 5px 0 0; + -moz-border-radius: 5px 5px 0 0; + border-radius: 5px 5px 0 0; +} +.elgg-tabs a { + text-decoration: none; + display: block; + padding: 3px 10px 0 10px; + text-align: center; + height: 21px; + color: #999; +} +.elgg-tabs a:hover { + background: #dedede; + color: #4690D6; +} +.elgg-tabs .elgg-state-selected { + border-color: #ccc; + background: white; +} +.elgg-tabs .elgg-state-selected a { + position: relative; + top: 2px; + background: white; +} + /* *************************************** BREADCRUMBS *************************************** */ -.elgg-breadcrumbs{font-size:80%;font-weight:700;line-height:1.2em;color:#bababa;}.elgg-breadcrumbs > li{display:inline-block;}.elgg-breadcrumbs > li:after{content:"\003E";font-weight:400;padding:0 4px;}.elgg-breadcrumbs > li > a{display:inline-block;color:#999;}.elgg-breadcrumbs > li > a:hover{color:#0054a7;text-decoration:underline;} +.elgg-breadcrumbs { + font-size: 80%; + font-weight: bold; + line-height: 1.2em; + color: #bababa; +} +.elgg-breadcrumbs > li { + display: inline-block; +} +.elgg-breadcrumbs > li:after { + content: "\003E"; + padding: 0 4px; + font-weight: normal; +} +.elgg-breadcrumbs > li > a { + display: inline-block; + color: #999; +} +.elgg-breadcrumbs > li > a:hover { + color: #0054a7; + text-decoration: underline; +} + +.elgg-main .elgg-breadcrumbs { + position: relative; + top: -6px; + left: 0; +} + /* *************************************** TOPBAR MENU *************************************** */ -.elgg-menu-topbar{float:left;}.elgg-menu-topbar > li{float:left;position:relative;}.elgg-menu-topbar > li > a{color:#FFF;display:block;font-weight:700;height:24px;}.elgg-menu-topbar-default > li > a{margin:0 1px;padding:8px 4px 0;}.elgg-menu-topbar-alt{float:right;margin-right:1px;}.elgg-menu-topbar-alt > li > a{padding:8px 7px 0;}.elgg-menu-topbar .elgg-menu-parent:after{content:" \25BC ";font-size:smaller;}.elgg-menu-topbar .elgg-child-menu{background:#FFF;border:1px solid #333;border-bottom:2px solid #3D3D3D;margin-right:-1px;margin-top:-1px;min-width:200px;position:absolute;right:0;top:100%;display:none;z-index:1;padding:4px 0;}.elgg-menu-topbar .elgg-child-menu.elgg-state-active{display:block;}.elgg-menu-topbar .elgg-child-menu > li > a{border-bottom:1px solid #FFF;border-top:1px solid #FFF;color:#333;display:block;font-weight:400;height:18px;line-height:18px;white-space:nowrap;padding:0 22px;}.elgg-menu-topbar .elgg-child-menu > li > a:hover{background:#5B5B5B;border-bottom:1px solid #3D3D3D;border-top:1px solid #3D3D3D;color:#FFF;text-decoration:none;}.elgg-menu-topbar > li > .elgg-menu-opened,.elgg-menu-topbar > li > .elgg-menu-opened:hover{background:#FFF;border:1px solid #333;border-bottom:0;color:#333;position:relative;z-index:2;margin:-1px -1px 0;}.elgg-menu-topbar-default > li > a:hover,.elgg-menu-topbar-alt > li > a:hover{background:#5B5B5B;} +.elgg-menu-topbar { + float: left; +} + +.elgg-menu-topbar > li { + float: left; +} + +.elgg-menu-topbar > li > a { + padding-top: 2px; + color: #eee; + margin: 1px 15px 0; +} + +.elgg-menu-topbar > li > a:hover { + color: #4690D6; + text-decoration: none; +} + +.elgg-menu-topbar-alt { + float: right; +} + +.elgg-menu-topbar .elgg-icon { + vertical-align: middle; + margin-top: -1px; +} + +.elgg-menu-topbar > li > a.elgg-topbar-logo { + margin-top: 0; + padding-left: 5px; + width: 38px; + height: 20px; +} + +.elgg-menu-topbar > li > a.elgg-topbar-avatar { + width: 18px; + height: 18px; +} + /* *************************************** SITE MENU *************************************** */ -.elgg-menu-site:after{content:'.';clear:both;display:block;height:0;line-height:0;}.elgg-menu-site{background:#ECEFF5;}.elgg-menu-site > li{float:left;}.elgg-menu-site > li > a{padding:8px 10px;}.elgg-menu-site > li > a:hover{background:#FFF;} +.elgg-menu-site { + z-index: 1; +} + +.elgg-menu-site > li > a { + font-weight: bold; + padding: 3px 13px 0px 13px; + height: 20px; +} + +.elgg-menu-site > li > a:hover { + text-decoration: none; +} + +.elgg-menu-site-default { + position: absolute; + bottom: 0; + left: 0; + height: 23px; +} + +.elgg-menu-site-default > li { + float: left; + margin-right: 1px; +} + +.elgg-menu-site-default > li > a { + color: white; +} + +.elgg-menu-site > li > ul { + display: none; + background-color: white; +} + +.elgg-menu-site > li:hover > ul { + display: block; +} + +.elgg-menu-site-default > .elgg-state-selected > a, +.elgg-menu-site-default > li:hover > a { + background: white; + color: #555; + + -webkit-box-shadow: 2px -1px 1px rgba(0, 0, 0, 0.25); + -moz-box-shadow: 2px -1px 1px rgba(0, 0, 0, 0.25); + box-shadow: 2px -1px 1px rgba(0, 0, 0, 0.25); + + -webkit-border-radius: 4px 4px 0 0; + -moz-border-radius: 4px 4px 0 0; + border-radius: 4px 4px 0 0; +} + +.elgg-menu-site-more { + position: relative; + left: -1px; + width: 100%; + min-width: 150px; + border: 1px solid #999; + border-top: 0; + + -webkit-border-radius: 0 0 4px 4px; + -moz-border-radius: 0 0 4px 4px; + border-radius: 0 0 4px 4px; + + -webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.25); + -moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.25); + box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.25); +} + +.elgg-menu-site-more > li > a { + background-color: white; + color: #555; + + -webkit-border-radius: 0; + -moz-border-radius: 0; + border-radius: 0; + + -webkit-box-shadow: none; + -moz-box-shadow: none; + box-shadow: none; +} + +.elgg-menu-site-more > li > a:hover { + background: #4690D6; + color: white; +} + +.elgg-menu-site-more > li:last-child > a, +.elgg-menu-site-more > li:last-child > a:hover { + -webkit-border-radius: 0 0 4px 4px; + -moz-border-radius: 0 0 4px 4px; + border-radius: 0 0 4px 4px; +} + +.elgg-more > a:before { + content: "\25BC"; + font-size: smaller; + margin-right: 4px; +} + /* *************************************** TITLE *************************************** */ -.elgg-menu-title {float: right;}.elgg-menu-title > li {display: inline-block;margin-left: 4px;} +.elgg-menu-title { + float: right; +} + +.elgg-menu-title > li { + display: inline-block; + margin-left: 4px; +} + /* *************************************** FILTER MENU *************************************** */ -.elgg-menu-filter{display:table;;padding-left:10px;} -.elgg-menu-filter:after{content:'.';display: table;clear:both;visibility:hidden;height:0;line-height:0;} -.elgg-menu-filter > li{float: left;padding-top: 5px;padding-bottom: 5px;padding-right: 12px; -padding-left: 12px; -margin-right: 2px; -line-height: 14px;} -.elgg-menu-filter > .elgg-state-selected, .elgg-menu-filter > li > a{padding-top: 5px;padding-bottom: 5px;margin-top: 2px;margin-bottom: 2px;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;color:#08C;} -.elgg-menu-filter > .elgg-state-selected{color: white;background-color: #08C;} -.elgg-menu-filter .elgg-state-selected a{color: white;background-color: #08C;} +.elgg-menu-filter { + margin-bottom: 5px; + border-bottom: 2px solid #ccc; + display: table; + width: 100%; +} +.elgg-menu-filter > li { + float: left; + border: 2px solid #ccc; + border-bottom: 0; + background: #eee; + margin: 0 0 0 10px; + + -webkit-border-radius: 5px 5px 0 0; + -moz-border-radius: 5px 5px 0 0; + border-radius: 5px 5px 0 0; +} +.elgg-menu-filter > li:hover { + background: #dedede; +} +.elgg-menu-filter > li > a { + text-decoration: none; + display: block; + padding: 3px 10px 0; + text-align: center; + height: 21px; + color: #999; +} +.elgg-menu-filter > li > a:hover { + background: #dedede; + color: #4690D6; +} +.elgg-menu-filter > .elgg-state-selected { + border-color: #ccc; + background: white; +} +.elgg-menu-filter > .elgg-state-selected > a { + position: relative; + top: 2px; + background: white; +} + /* *************************************** PAGE MENU *************************************** */ -.elgg-menu-page{border-bottom:1px solid #EEE;margin-bottom:7px;padding-bottom:7px;}.elgg-menu-page li > a{display:block;color:#333;margin-bottom:1px;padding:3px 8px 3px 26px;}.elgg-menu-page li > a:hover{background-color:#EEE;}.elgg-menu-page li.elgg-state-selected > a{background-color:#E9E9E9;font-weight:700;}.elgg-menu-page .elgg-child-menu{display:none;margin-left:15px;}.elgg-menu-page .elgg-menu-closed:before,.elgg-menu-page .elgg-menu-opened:before{display:inline-block;padding-right:4px;}.elgg-menu-page .elgg-menu-closed:before{content:"\002B";}.elgg-menu-page .elgg-menu-opened:before{content:"\002D";} +.elgg-menu-page { + margin-bottom: 15px; +} + +.elgg-menu-page a { + display: block; + + -webkit-border-radius: 8px; + -moz-border-radius: 8px; + border-radius: 8px; + + background-color: white; + margin: 0 0 3px; + padding: 2px 4px 2px 8px; +} +.elgg-menu-page a:hover { + background-color: #0054A7; + color: white; + text-decoration: none; +} +.elgg-menu-page li.elgg-state-selected > a { + background-color: #4690D6; + color: white; +} +.elgg-menu-page .elgg-child-menu { + display: none; + margin-left: 15px; +} +.elgg-menu-page .elgg-menu-closed:before, .elgg-menu-opened:before { + display: inline-block; + padding-right: 4px; +} +.elgg-menu-page .elgg-menu-closed:before { + content: "\002B"; +} +.elgg-menu-page .elgg-menu-opened:before { + content: "\002D"; +} + /* *************************************** HOVER MENU *************************************** */ -.elgg-menu-hover{display:none;position:absolute;z-index:10000;width:165px;border:solid 1px;background-color:#FFF;-webkit-box-shadow:2px 2px 6px rgba(0,0,0,0.50);-moz-box-shadow:2px 2px 6px rgba(0,0,0,0.50);box-shadow:2px 2px 6px rgba(0,0,0,0.50);border-color:#E5E5E5 #999 #999 #E5E5E5;}.elgg-menu-hover > li{border-bottom:1px solid #ddd;}.elgg-menu-hover > li:last-child{border-bottom:none;}.elgg-menu-hover .elgg-heading-basic{display:block;}.elgg-menu-hover a{font-size:92%;padding:2px 8px;}.elgg-menu-hover a:hover{background:#ccc;}.elgg-menu-hover-admin a{color:red;}.elgg-menu-hover-admin a:hover{color:#FFF;background-color:red;} +.elgg-menu-hover { + display: none; + position: absolute; + z-index: 10000; + + overflow: hidden; + + min-width: 165px; + max-width: 250px; + border: solid 1px; + border-color: #E5E5E5 #999 #999 #E5E5E5; + background-color: #FFF; + + -webkit-box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.50); + -moz-box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.50); + box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.50); +} +.elgg-menu-hover > li { + border-bottom: 1px solid #ddd; +} +.elgg-menu-hover > li:last-child { + border-bottom: none; +} +.elgg-menu-hover .elgg-heading-basic { + display: block; +} +.elgg-menu-hover a { + padding: 2px 8px; + font-size: 92%; +} +.elgg-menu-hover a:hover { + background: #ccc; + text-decoration: none; +} +.elgg-menu-hover-admin a { + color: red; +} +.elgg-menu-hover-admin a:hover { + color: white; + background-color: red; +} + /* *************************************** - FOOTER + SITE FOOTER *************************************** */ -.elgg-menu-footer > li,.elgg-menu-footer > li > a {color:#999;display: inline-block;}.elgg-menu-footer > li:after {content: " \00B7 ";padding: 0 4px;}.elgg-menu-footer-default {float:right;}.elgg-menu-footer-alt {float: left;} +.elgg-menu-footer > li, +.elgg-menu-footer > li > a { + display: inline-block; + color: #999; +} + +.elgg-menu-footer > li:after { + content: "\007C"; + padding: 0 4px; +} + +.elgg-menu-footer-default { + float: right; +} + +.elgg-menu-footer-alt { + float: left; +} + /* *************************************** - ENTITY + GENERAL MENU *************************************** */ -.elgg-menu-entity{float:right;margin-left:15px;font-size:90%;color:#aaa;}.elgg-menu-entity > li{display:inline-block;margin-left:15px;}.elgg-menu-entity > li > a{color:#aaa;} +.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 { + float: right; + margin-left: 15px; + font-size: 90%; + color: #aaa; + line-height: 16px; + height: 16px; +} +.elgg-menu-entity > li, .elgg-menu-annotation > li { + margin-left: 15px; +} +.elgg-menu-entity > li > a, .elgg-menu-annotation > li > a { + color: #aaa; +} +<?php // need to override .elgg-menu-hz ?> +.elgg-menu-entity > li > a, .elgg-menu-annotation > li > a { + display: block; +} +.elgg-menu-entity > li > span, .elgg-menu-annotation > li > span { + vertical-align: baseline; +} + /* *************************************** OWNER BLOCK *************************************** */ -.elgg-menu-owner-block li > a{border-bottom:1px solid #D8DFEA;padding:3px 8px 3px 26px;}.elgg-menu-owner-block li > a:hover{background-color:#EEE;color:0;}.elgg-menu-owner-block .elgg-state-selected > a{background-color:#E9E9E9;}.elgg-menu-owner-block .elgg-menu > li > a{padding-left:44px;} +.elgg-menu-owner-block li a { + display: block; + + -webkit-border-radius: 8px; + -moz-border-radius: 8px; + border-radius: 8px; + + background-color: white; + margin: 3px 0 5px 0; + padding: 2px 4px 2px 8px; +} +.elgg-menu-owner-block li a:hover { + background-color: #0054A7; + color: white; + text-decoration: none; +} +.elgg-menu-owner-block li.elgg-state-selected > a { + background-color: #4690D6; + color: white; +} + /* *************************************** LONGTEXT *************************************** */ -.elgg-menu-longtext {float: right;} +.elgg-menu-longtext { + float: right; +} + /* *************************************** RIVER *************************************** */ -.elgg-menu-river{color:#888;display:inline-block;margin:3px 0 0 -3px;}.elgg-menu-river > li{display:inline;}.elgg-menu-river > li:before{content:" \00B7 ";display:inline-block;margin:0 3px;} .elgg-menu-river > li > a{color:#3D3D3D;display:inline;}.elgg-menu-river > li > a:hover{text-decoration:underline;} +.elgg-menu-river { + float: right; + margin-left: 15px; + font-size: 90%; + color: #aaa; + line-height: 16px; + height: 16px; +} +.elgg-menu-river > li { + display: inline-block; + margin-left: 5px; +} +.elgg-menu-river > li > a { + color: #aaa; + height: 16px; +} +<?php // need to override .elgg-menu-hz ?> +.elgg-menu-river > li > a { + display: block; +} +.elgg-menu-river > li > span { + vertical-align: baseline; +} + /* *************************************** SIDEBAR EXTRAS (rss, bookmark, etc) *************************************** */ -.elgg-menu-extras > li > a {padding: 3px 8px 3px 26px;}.elgg-menu-extras > li > a:hover {text-decoration:underline;} -/* *************************************** - COMPOSER -*************************************** */ -.elgg-menu-composer{display:inline-block;height:22px;}.elgg-menu-composer > li{font-weight:700;margin-left:10px;}.elgg-menu-composer > li > a{line-height:16px;padding-left:20px;}.elgg-menu-composer > li > a:hover{text-decoration:underline;}.elgg-menu-composer > li.ui-state-active > a{cursor:default;color:#000;text-decoration:none;}.elgg-menu-composer > .ui-state-active > a:before,.elgg-menu-composer > .ui-state-active > a:after{position:absolute;display:block;content:" ";height:0;width:0;left:0;border-style:solid;border-width:8px;}.elgg-menu-composer > .ui-state-active > a:before{top:11px;border-color:transparent transparent #B4BBCD;}.elgg-menu-composer > .ui-state-active > a:after{top:12px;border-color:transparent transparent #FFF;} +.elgg-menu-extras { + margin-bottom: 15px; +} + /* *************************************** - SCROLLBAR + WIDGET MENU *************************************** */ -::-webkit-scrollbar{width:10px;height:10px;}::-webkit-scrollbar-track-piece{background-color:#EEE;-webkit-border-radius:0;-webkit-border-bottom-right-radius:8px;-webkit-border-bottom-left-radius:8px;}::-webkit-scrollbar-thumb:vertical{height:50px;background-color:#999;-webkit-border-radius:8px;}::-webkit-scrollbar-thumb:horizontal{width:50px;background-color:#999;-webkit-border-radius:8px;}
\ No newline at end of file +.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; +} |