X-Git-Url: https://scripts.mit.edu/gitweb/autoinstalls/wordpress.git/blobdiff_plain/699231ae09f7057a4d0000cdf32e50a3df6a04ca..refs/tags/wordpress-4.5:/wp-admin/css/widgets.css diff --git a/wp-admin/css/widgets.css b/wp-admin/css/widgets.css index 44eb420e..c2d6754f 100644 --- a/wp-admin/css/widgets.css +++ b/wp-admin/css/widgets.css @@ -1 +1,589 @@ -html,body{min-width:950px;}div.widget-liquid-left{float:left;clear:left;width:100%;margin-right:-325px;}div#widgets-left{margin-left:5px;margin-right:325px;}div#widgets-right{width:285px;margin:0 auto;}div.widget-liquid-right{float:right;clear:right;width:300px;}.widget-liquid-right .widget,#wp_inactive_widgets .widget,.widget-liquid-right .sidebar-description{width:250px;margin:0 auto 20px;overflow:hidden;}.widget-liquid-right .sidebar-description{margin-bottom:10px;}#wp_inactive_widgets .widget{margin:0 10px 20px;float:left;}div.sidebar-name h3{margin:0;padding:5px 12px;font-size:13px;height:19px;overflow:hidden;white-space:nowrap;}div.sidebar-name{background-repeat:repeat-x;background-position:0 0;cursor:pointer;font-size:13px;border-width:1px;border-style:solid;-moz-border-radius-topleft:8px;-moz-border-radius-topright:8px;-webkit-border-top-right-radius:8px;-webkit-border-top-left-radius:8px;-khtml-border-top-right-radius:8px;-khtml-border-top-left-radius:8px;border-top-right-radius:8px;border-top-left-radius:8px;}.js .closed .sidebar-name{-moz-border-radius-bottomleft:8px;-moz-border-radius-bottomright:8px;-webkit-border-bottom-right-radius:8px;-webkit-border-bottom-left-radius:8px;-khtml-border-bottom-right-radius:8px;-khtml-border-bottom-left-radius:8px;border-bottom-right-radius:8px;border-bottom-left-radius:8px;}.widget-liquid-right .widgets-sortables,#widgets-left .widget-holder{border-width:0 1px 1px;border-style:none solid solid;-moz-border-radius-bottomleft:8px;-moz-border-radius-bottomright:8px;-webkit-border-bottom-right-radius:8px;-webkit-border-bottom-left-radius:8px;-khtml-border-bottom-right-radius:8px;-khtml-border-bottom-left-radius:8px;border-bottom-right-radius:8px;border-bottom-left-radius:8px;}.js .closed .widgets-sortables,.js .closed .widget-holder{display:none;}.widget-liquid-right .widgets-sortables{padding:15px 0 0;}#available-widgets .widget-holder{padding:7px 5px 0;}#wp_inactive_widgets{padding:5px 5px 0;}#widget-list .widget{width:250px;margin:0 10px 15px;border:0 none;float:left;}#widget-list .widget-description{padding:5px 8px;}#widget-list .widget-top{border-width:1px;border-style:solid;-moz-border-radius:6px;-khtml-border-radius:6px;-webkit-border-radius:6px;border-radius:6px;}.widget-placeholder{border-width:1px;border-style:dashed;margin:0 auto 20px;height:26px;width:250px;}#wp_inactive_widgets .widget-placeholder{margin:0 10px 20px;float:left;}div.widgets-holder-wrap{padding:0;margin:10px 0 20px;}#widgets-left #available-widgets{background-color:transparent;border:0 none;}ul#widget-list{list-style:none;margin:0;padding:0;min-height:100px;}.widget .widget-top{font-size:12px;font-weight:bold;height:26px;overflow:hidden;}.widget-top .widget-title{padding:5px 9px;}.widget-top .widget-title-action{float:right;}a.widget-action{display:block;width:24px;height:26px;}#available-widgets a.widget-action{display:none;}.widget-top a.widget-action{background:url("../images/menu-bits.gif?ver=20100610") no-repeat scroll 0 -110px;}.widget .widget-inside,.widget .widget-description{padding:12px 12px 10px;font-size:11px;line-height:16px;}.widget-inside,.widget-description{display:none;}#available-widgets .widget-description{display:block;}.widget .widget-inside p{margin:0 0 1em;padding:0;}.widget-title h4{margin:0;line-height:1.3;overflow:hidden;white-space:nowrap;}.widgets-sortables{min-height:90px;}.widget-control-actions{margin-top:8px;}.widget-control-actions a{text-decoration:none;}.widget-control-actions a:hover{text-decoration:underline;}.widget-control-actions .ajax-feedback{padding-bottom:3px;}.widget-control-actions div.alignleft{margin-top:6px;}div#sidebar-info{padding:0 1em;margin-bottom:1em;font-size:11px;}.widget-title a,.widget-title a:hover{text-decoration:none;border-bottom:none;}.widget-control-edit{display:block;font-size:11px;font-weight:normal;line-height:26px;padding:0 8px 0 0;}a.widget-control-edit{text-decoration:none;}.widget-control-edit .add,.widget-control-edit .edit{display:none;}#available-widgets .widget-control-edit .add,#widgets-right .widget-control-edit .edit,#wp_inactive_widgets .widget-control-edit .edit{display:inline;}.editwidget{margin:0 auto 15px;}.editwidget .widget-inside{display:block;border-width:1px;border-style:solid;padding:10px;-moz-border-radius:6px;-khtml-border-radius:6px;-webkit-border-radius:6px;border-radius:6px;}.inactive p.description{margin:5px 15px 8px;}#available-widgets p.description{margin:0 12px 12px;}.widget-position{margin-top:8px;}.inactive{padding-top:2px;}.sidebar-name-arrow{float:right;height:29px;width:26px;}.widget-title .in-widget-title{font-size:11px;white-space:nowrap;}#removing-widget{display:none;font-weight:normal;padding-left:15px;font-size:12px;}.widget-control-noform,#access-off,.widgets_access .widget-action,.widgets_access .sidebar-name-arrow,.widgets_access #access-on,.widgets_access .widget-holder .description{display:none;}.widgets_access .widget-holder,.widgets_access #widget-list{padding-top:10px;}.widgets_access #access-off{display:inline;}.widgets_access #wpbody-content .widget-title-action,.widgets_access #wpbody-content .widget-control-edit,.widgets_access .closed .widgets-sortables,.widgets_access .closed .widget-holder{display:block;}.widgets_access .closed .sidebar-name{-moz-border-radius-bottomleft:0;-moz-border-radius-bottomright:0;-webkit-border-bottom-right-radius:0;-webkit-border-bottom-left-radius:0;-khtml-border-bottom-right-radius:0;-khtml-border-bottom-left-radius:0;border-bottom-right-radius:0;border-bottom-left-radius:0;}.widgets_access .sidebar-name,.widgets_access .widget .widget-top{cursor:default;} \ No newline at end of file +/* General Widgets Styles */ + +.widget { + margin: 0 auto 10px; + position: relative; + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; +} + +.widget-top { + font-size: 13px; + font-weight: 600; + background: #f7f7f7; +} + +.widget-top a.widget-action, +.widget-top a.widget-action:hover { + -webkit-box-shadow: none; + box-shadow: none; + outline: none; + text-decoration: none; +} + +.widget-title h3, +.widget-title h4 { + margin: 0; + padding: 15px; + font-size: 1em; + line-height: 1; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; +} + +.widgets-holder-wrap .widget-inside { + border-top: none; + padding: 1px 15px 15px 15px; + line-height: 16px; +} + +.in-widget-title, +#widgets-right a.widget-control-edit, +#available-widgets .widget-description { + color: #666; +} + +.deleting .widget-title, +.deleting .widget-top a.widget-action:after { + color: #a0a5aa; +} + +/* Widget Dragging Helpers */ +.widget.ui-draggable-dragging { + min-width: 100%; +} + +.widget.ui-sortable-helper { + opacity: 0.8; +} + +.widget-placeholder { + border: 1px dashed #b4b9be; + margin: 0 auto 10px; + height: 45px; + width: 100%; + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; +} + +#widgets-right .widget-placeholder { + margin-top: 0; +} + +#widgets-right .closed .widget-placeholder { + height: 0; + border: 0; + margin-top: -10px; +} + +/* Widget Sidebars */ +.sidebar-name { + position: relative; + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; +} + +.sidebar-name-arrow { + position: absolute; + top: 0; + right: 0; + bottom: 0; +} + +.js .sidebar-name { + cursor: pointer; +} + +.sidebar-name h2, +.sidebar-name h3 { + margin: 0; + padding: 8px 10px; + overflow: hidden; + white-space: nowrap; +} + +.widgets-holder-wrap .description { + padding: 0 0 15px; + margin: 0; + font-style: normal; + color: #72777c; +} + +.widget-holder .description, +.inactive-sidebar .description { + color: #555d66; +} + +#widgets-right .widgets-holder-wrap .description { + padding-left: 7px; + padding-right: 7px; +} + +/* Widgets 2-col Layout */ +div.widget-liquid-left { + margin: 0; + width: 38%; + float: left; +} + +div.widget-liquid-right { + float: right; + width: 58%; +} + +/* Widgets Left - Available Widgets */ + +div#widgets-left { + padding-top: 12px; +} + +div#widgets-left .closed .sidebar-name, +div#widgets-left .inactive-sidebar.closed .sidebar-name { + margin-bottom: 10px; +} + +div#widgets-left .sidebar-name h2, +div#widgets-left .sidebar-name h3 { + padding: 10px 0; + margin: 0 10px 0 0; +} + +#widgets-left .sidebar-name .sidebar-name-arrow:before { + padding: 9px; +} + +#widgets-left .widgets-holder-wrap, +div#widgets-left .widget-holder { + background: transparent; + border: none; +} + +#widgets-left .widgets-holder-wrap { + border: none; + -webkit-box-shadow: none; + box-shadow: none; +} + +#available-widgets .widget-action { + display: none; +} + +#available-widgets .widget { + margin: 0; +} + +#available-widgets .widget:nth-child(odd) { + clear: both; +} + +#available-widgets .widget .widget-description { + display: block; + padding: 10px 15px; + font-size: 12px; +} + +#available-widgets #widget-list { + position: relative; +} + +/* Inactive Sidebars */ +#widgets-left .inactive-sidebar { + clear: both; + width: 100%; + background: transparent; + padding: 0; + margin: 0 0 20px 0; + border: none; + -webkit-box-shadow: none; + box-shadow: none; +} + +#widgets-left .inactive-sidebar.first { + margin-top: 40px; +} + +/* Not sure what this is for... */ +div#widgets-left .inactive-sidebar .widget.expanded { + left: auto; +} + +.widget-title-action { + float: right; + position: relative; +} + +div#widgets-left .inactive-sidebar .widgets-sortables { + min-height: 42px; + padding: 0; + background: transparent; + margin: 0; + position: relative; +} + +/* Widgets Right */ + +div#widgets-right .sidebars-column-1, +div#widgets-right .sidebars-column-2 { + max-width: 450px; +} + +div#widgets-right .widgets-holder-wrap { + margin: 10px 0 0 0; +} + +div#widgets-right .sidebar-description { + min-height: 20px; + margin-top: -5px; +} + +div#widgets-right .sidebar-name h2, +div#widgets-right .sidebar-name h3 { + padding: 15px 7px; +} + +div#widgets-right .sidebar-name .sidebar-name-arrow:before { + top: 2px; +} + +div#widgets-right .widget-top { + padding: 0; +} + +div#widgets-right .widgets-sortables { + padding: 0 8px; + margin-bottom: 9px; + position: relative; + min-height: 123px; +} + +div#widgets-right .closed .widgets-sortables { + min-height: 0; + margin-bottom: 0; +} + +.sidebar-name .spinner, +.remove-inactive-widgets .spinner { + float: none; + position: relative; + top: -2px; + margin: -5px 5px; +} + +/* Dragging a widget over a closed sidebar */ +#widgets-right .widgets-holder-wrap.widget-hover { + border-color: #72777c; + -webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.3); + box-shadow: 0 1px 2px rgba(0,0,0,0.3); +} + +/* Accessibility Mode */ +.widgets_access #widgets-left .widget .widget-top { + cursor: auto; +} + +.widgets_access #wpwrap .widgets-holder-wrap.closed .sidebar-description, +.widgets_access #wpwrap .widgets-holder-wrap.closed .widget, +.widgets_access #wpwrap .widget-control-edit { + display: block; +} + +.widgets_access #widgets-left .widget .widget-top:hover, +.widgets_access #widgets-right .widget .widget-top:hover { + border-color: #ddd; +} + +#available-widgets .widget-control-edit .edit, +#widgets-left .inactive-sidebar .widget-control-edit .add, +#widgets-right .widget-control-edit .add { + display: none; +} + +.widget-control-edit { + display: block; + color: #666; + background: #EEE; + padding: 0 15px; + line-height: 43px; + border-left: 1px solid #DDD; +} + +#widgets-left .widget-control-edit:hover, +#widgets-right .widget-control-edit:hover { + color: #fff; + background: #444; + border-left: 0; + outline: 1px solid #444; +} + +.widgets-holder-wrap .sidebar-name, +.widgets-holder-wrap .sidebar-description { + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; +} + +.editwidget { + margin: 0 auto; +} + +.editwidget .widget-inside { + display: block; + padding: 0 15px; +} + +.editwidget .widget-control-actions { + margin-top: 20px; +} + +.js .widgets-holder-wrap.closed .widget, +.js .widgets-holder-wrap.closed .sidebar-description, +.js .widgets-holder-wrap.closed .remove-inactive-widgets, +.js .closed br.clear { + display: none; +} + +.js .widgets-holder-wrap.closed .widget.ui-sortable-helper { + display: block; +} + +/* Hide Widget Settings by Default */ +.widget-inside, +.widget-description { + display: none; +} + +.widget-inside { + background: #fff; +} + +/* Dragging widgets over the available widget area show's a "Deactivate" message */ +#removing-widget { + display: none; + font-weight: normal; + padding-left: 15px; + font-size: 12px; + line-height: 1; + color: black; +} + +.js #removing-widget { + color: #00a0d2; +} + +.widget-control-noform, +#access-off, +.widgets_access .widget-action, +.widgets_access .sidebar-name-arrow, +.widgets_access #access-on, +.widgets_access .widget-holder .description, +.no-js .widget-holder .description { + display: none; +} + +.widgets_access .widget-holder, +.widgets_access #widget-list { + padding-top: 10px; +} + +.widgets_access #access-off { + display: inline; +} + +.widgets_access .sidebar-name, +.widgets_access .widget .widget-top { + cursor: default; +} + + +/* Widgets Area Chooser */ +.widget-liquid-left #widgets-left.chooser #available-widgets .widget, +.widget-liquid-left #widgets-left.chooser .inactive-sidebar { + -webkit-transition: opacity 0.1s linear; + transition: opacity 0.1s linear; +} + +.widget-liquid-left #widgets-left.chooser #available-widgets .widget, +.widget-liquid-left #widgets-left.chooser .inactive-sidebar { + /* -webkit-filter: blur(1px); */ + opacity: 0.2; + pointer-events: none; +} + +.widget-liquid-left #widgets-left.chooser #available-widgets .widget-in-question { + /* -webkit-filter: none; */ + opacity: 1; + pointer-events: auto; +} + +.widgets-chooser ul, +#widgets-left .widget-in-question .widget-top, +#available-widgets .widget-top:hover, +div#widgets-right .widget-top:hover, +#widgets-left .widget-top:hover { + border-color: #999; + -webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.1); + box-shadow: 0 1px 2px rgba(0,0,0,0.1); +} + +.widgets-chooser ul.widgets-chooser-sidebars { + margin: 0; + list-style-type: none; + max-height: 300px; + overflow: auto; +} + +.widgets-chooser { + display: none; +} + +.widgets-chooser ul { + border: 1px solid #ccc; +} + +.widgets-chooser li { + padding: 10px 15px 10px 35px; + border-bottom: 1px solid #ccc; + background: #fff; + margin: 0; + cursor: pointer; + outline: none; + position: relative; + -webkit-transition: background 0.2s ease-in-out; + transition: background 0.2s ease-in-out; +} + + /* @todo looks like these hover/focus states are overridden by .widgets-chooser-selected */ +.widgets-chooser li:hover, +.widgets-chooser li:focus { + background: rgba(255,255,255,0.7); +} + +.widgets-chooser li:focus:before { + content: "\f147"; + display: block; + -webkit-font-smoothing: antialiased; + font: normal 26px/1 dashicons; + color: #555d66; + position: absolute; + top: 7px; + left: 5px; +} + +.widgets-chooser li:last-child { + border: none; +} + +.widgets-chooser li.widgets-chooser-selected { + background: #00a0d2; + color: #fff; +} + +.widgets-chooser li.widgets-chooser-selected:before, +.widgets-chooser li.widgets-chooser-selected:focus:before { + content: "\f147"; + display: block; + -webkit-font-smoothing: antialiased; + font: normal 26px/1 dashicons; + color: #fff; + position: absolute; + top: 7px; + left: 5px; +} + +.widgets-chooser .widgets-chooser-actions { + padding: 10px 0 12px 0; + text-align: center; +} + +.widgets-chooser button { + margin-right: 5px; +} + +#available-widgets .widget .widget-top { + cursor: pointer; +} + +#available-widgets .widget.ui-draggable-dragging .widget-top { + cursor: move; +} + +/* =Media Queries +-------------------------------------------------------------- */ + +@media screen and (max-width: 480px) { + div.widget-liquid-left { + width: 100%; + float: none; + border-right: none; + padding-right: 0; + } + + #widgets-left .sidebar-name { + margin-right: 0; + } + + #widgets-left #available-widgets .widget-top { + margin-right: 0; + } + + #widgets-left .inactive-sidebar .widgets-sortables { + margin-right: 0; + } + + div.widget-liquid-right { + width: 100%; + float: none; + } + + div.widget { + margin: 0 auto 10px !important; + max-width: 480px; + } +} + +@media screen and (max-width: 320px) { + div.widget { + max-width: 320px; + } +} + +@media only screen and (min-width: 1250px) { + #widgets-left #available-widgets .widget { + width: 49%; + float: left; + } + + .widget.ui-draggable-dragging { + min-width: 49%; + } + + #widgets-left #available-widgets .widget:nth-child(even) { + float: right; + } + + #widgets-right .sidebars-column-1, + #widgets-right .sidebars-column-2 { + float: left; + width: 49%; + } + + #widgets-right .sidebars-column-1 { + margin-right: 2%; + } + + #widgets-right.single-sidebar .sidebars-column-1, + #widgets-right.single-sidebar .sidebars-column-2 { + float: none; + width: 100%; + margin: 0; + } +}