merged branch lmcd/wdt-shadow-fix (PR #6615)

This PR was squashed before being merged into the master branch (closes #6615).

Commits
-------

490c746 [WDT] Toolbar cleanups

Discussion
----------

[WDT] Toolbar cleanups

Ok this is ridiculously minor, but it's one of those little things that winds me up on a daily basis so I fixed it.

When you mouseover a section on the WDT, the box-shadow is blurry on the right edge.

Edit: this PR now covers a few other minor tweaks - see below.

---------------------------------------------------------------------------

by lmcd at 2013-01-09T07:41:42Z

Just pushed a couple more changes that cleanup WDT popup boxes a little bit. Again the changes are subtle, but better imo.

Before:
![box1-before](https://f.cloud.github.com/assets/363540/52807/efc2cf7e-5a2f-11e2-9c42-1f5a33d667a9.png)

After:
![box1-after](https://f.cloud.github.com/assets/363540/52808/f4929c8c-5a2f-11e2-9195-7583979d8ce9.png)

Before:
![box2-before](https://f.cloud.github.com/assets/363540/52809/f8b1752c-5a2f-11e2-8166-a602e9e80d3a.png)

After:
![box2-after](https://f.cloud.github.com/assets/363540/52812/11791ede-5a30-11e2-92d4-b35c0d7ecc6b.png)

Note: requires cross-browser testing
This commit is contained in:
Fabien Potencier 2013-01-16 10:29:16 +01:00
commit efabb1e9ae
1 changed files with 35 additions and 5 deletions

View File

@ -79,11 +79,21 @@
}
.sf-toolbar-block .sf-toolbar-info-piece {
padding-bottom: 5px;
padding-left: 9px;
padding-right: 9px;
line-height: 19px;
margin-bottom: 5px;
}
.sf-toolbar-block .sf-toolbar-info-piece .sf-toolbar-status {
padding: 0px 5px;
border-radius: 5px;
margin-bottom: 0px;
vertical-align: top;
}
.sf-toolbar-block .sf-toolbar-info-piece:last-child {
padding-bottom: 0;
margin-bottom: 0;
}
.sf-toolbar-block .sf-toolbar-info-piece a,
@ -94,6 +104,7 @@
.sf-toolbar-block .sf-toolbar-info-piece b {
display: inline-block;
width: 110px;
vertical-align: top;
}
.sf-toolbar-block .sf-toolbar-info-with-next-pointer:after {
@ -112,11 +123,13 @@
position: absolute;
background-color: #fff;
border: 1px solid #bbb;
padding: 10px 8px;
padding: 9px 0;
margin-left: -1px;
bottom: 38px;
border-bottom-width: 0;
border-bottom: 1px solid #bbb;
border-radius: 4px 4px 0 0;
}
.sf-toolbar-block .sf-toolbar-info:empty {
@ -230,14 +243,24 @@
}
.sf-toolbar-block:hover {
box-shadow: rgba(0, 0, 0, 0.3) 0 0 5px;
box-shadow: rgba(0, 0, 0, 0.35) 0 0 5px;
border-right: none;
margin-right: 1px;
position: relative;
}
.sf-toolbar-block:hover .sf-toolbar-icon {
background-color: #fff;
border-top: 1px dotted #DDD;
position: relative;
margin-top: -1px;
z-index: 10002;
}
.sf-toolbar-block:hover .sf-toolbar-info {
display: block;
min-width: 100%;
z-index: 10001;
}
/***** Override the setting when the toolbar is on the top *****/
@ -274,7 +297,14 @@
top: 39px;
bottom: auto;
border-top-width: 0;
border-bottom: 1px solid #bbb;
border-radius: 0 0 4px 4px;
}
.sf-toolbar-block:hover .sf-toolbar-icon {
border-top: none;
border-bottom: 1px dotted #DDD;
margin-top: 0;
margin-bottom: -1px;
}
{% endif %}