WordPress.org

Making WordPress.org


Ignore:
Timestamp:
06/24/2021 05:19:19 PM (7 months ago)
Author:
ryelle
Message:

Pattern Directory: Sync with git WordPress/pattern-directory@07f8189a7c5bdbd0344edac212c63a7b956159f6

File:
1 edited

Legend:

Unmodified
Added
Removed
  • sites/trunk/wordpress.org/public_html/wp-content/themes/pub/wporg-patterns/css/components/_favorite-button.scss

    r11023 r11058  
    55    width: 2.25rem;
    66    border-radius: 2px;
    7     color: $color__text;
     7    color: color(gray-60);
    88
    99    svg {
     
    1616
    1717        path {
    18             fill: $color-gray-300;
     18            fill: color(gray-60);
    1919        }
    2020    }
    2121
    22     .pattern__favorite-filled {
     22    .pattern-favorite-button__filled {
    2323        opacity: 0;
    2424    }
    2525
    2626    &:hover {
    27         color: $color__text;
     27        color: color(gray-60);
    2828        background: transparent;
    2929
    3030        svg path {
    31             fill: $color__text;
     31            fill: color(gray-60);
    3232        }
     33    }
     34
     35    &:focus {
     36        box-shadow:
     37            inset 0 0 0 1px #fff,
     38            0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
    3339    }
    3440
     
    5460    }
    5561
     62    &:not(.has-label) {
     63        background-color: $color-white;
     64        box-shadow: 0 1px 2px rgba($color-black, 0.15);
     65
     66        &:hover {
     67            background: color(gray-2);
     68        }
     69
     70        &:focus {
     71            box-shadow:
     72                inset 0 0 0 1px #fff,
     73                0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
     74        }
     75    }
     76
    5677    &.is-favorited {
    5778        svg path {
    58             fill: $color-alert-red;
     79            fill: color(red-40);
    5980        }
    6081
    61         .pattern__favorite-outline {
     82        .pattern-favorite-button__outline {
    6283            opacity: 0;
    6384            transform: scale(2.8);
    6485        }
    6586
    66         .pattern__favorite-filled {
     87        .pattern-favorite-button__filled {
    6788            opacity: 1;
    6889        }
    6990
    70         &:hover .pattern__favorite-filled {
     91        &:hover .pattern-favorite-button__filled {
    7192            animation: 0.9s infinite HeartBeat;
    7293
     
    7596            }
    7697        }
     98    }
     99}
     100
     101.pattern-favorite-button-small {
     102    height: auto;
     103
     104    &:hover {
     105        background: transparent;
     106    }
     107
     108    &:focus {
     109        background: transparent;
     110        outline: 1px dotted currentColor;
     111        box-shadow: none;
     112    }
     113
     114    &.is-favorited svg path {
     115        fill: color(red-40);
    77116    }
    78117}
Note: See TracChangeset for help on using the changeset viewer.