WordPress.org

Make WordPress Core

Ticket #18693: 18693.prelim-css.diff

File 18693.prelim-css.diff, 2.3 KB (added by georgestephanis, 7 years ago)

Preliminary styling changes for pointer boxes. Requires two images (forthcoming).

  • wp-includes/css/wp-pointer.dev.css

     
     1.wp-pointer {
     2        padding-top:15px;
     3}
    14
    25.wp-pointer-content {
    3         padding: 0 15px;
    4         background: white;
    5         border: 1px solid #ccc;
     6        background:#fff;
     7        border:1px solid #dfdfdf;
     8        border:1px solid rgba(0,0,0,.125); /* So as to look better against non-white backgrounds for rgba-compliant browsers */
     9        border-radius:3px;
     10        box-shadow:0 2px 4px rgba(0,0,0,.19);
     11        padding:0 0 10px;
     12        position:relative;
     13}
    614
    7         -webkit-border-radius: 3px;
    8         border-radius: 3px;
     15.wp-pointer-content:before {
     16        width:30px;
     17        height:15px;
     18        position:absolute;
     19        top:-15px;
     20        left:50px;
     21        background:url('../images/arrow-pointer-blue.png') 100% 100% no-repeat;
     22        content:' ';
     23}
    924
    10         -moz-box-shadow: 1px 1px 2px rgba( 0, 0, 0, 0.4 );
    11         -webkit-box-shadow: 5px 5px 25px rgba(0, 0, 0, 0.5);
    12         box-shadow: 5px 5px 25px rgba(0, 0, 0, 0.5);
     25.wp-pointer-content h3 {
     26        margin:0;
     27        padding:18px 18px 18px 56px;
     28        font-size:14px;
     29        color:#fff;
     30        border-radius:3px 3px 0 0;
     31        text-shadow:0 -1px 0 rgba(0,0,0,.3);
     32        background-color: #8cc1e9;
     33        background-image: -webkit-linear-gradient(bottom, rgb(114,167,207) 0%, rgb(140,193,233) 100%);
     34        background-image: -moz-linear-gradient(bottom, rgb(114,167,207) 0%, rgb(140,193,233) 100%);
     35        background-image: -ms-linear-gradient(bottom, rgb(114,167,207) 0%, rgb(140,193,233) 100%);
     36        background-image: -o-linear-gradient(bottom, rgb(114,167,207) 0%, rgb(140,193,233) 100%);
     37        background-image: linear-gradient(bottom, rgb(114,167,207) 0%, rgb(140,193,233) 100%);
    1338}
    1439
     40.wp-pointer-content h3:before {
     41        position:absolute;
     42        top:7px;
     43        left:10px;
     44        content:' ';
     45        width:36px;
     46        height:37px;
     47        background:url('../images/icon-pointer-flag.png') 0 0 no-repeat;
     48}
     49
     50.wp-pointer-content p {
     51        padding:5px 15px;
     52}
     53
    1554.wp-pointer-buttons {
    16         margin: 0 -15px;
    17         padding: 5px 10px;
     55        margin: 0;
     56        padding: 5px 15px;
    1857        overflow: auto;
    19         background: #f5f5f5;
    20         border-top: 1px solid #ddd;
    21 
    22         -webkit-border-bottom-right-radius: 3px;
    23         -webkit-border-bottom-left-radius: 3px;
    24         border-bottom-right-radius: 3px;
    25         border-bottom-left-radius: 3px;
    2658}
    2759
    2860.wp-pointer-buttons a {
     
    124156        left: -9px;
    125157}
    126158
     159
     160
     161