1 /**

     2  * Colors

     3  */

     4 /**

     5  * Breakpoints & Media Queries

     6  */

     7 /**

     8  * Often re-used variables

     9  */

    10 /**

    11  * Breakpoint mixins

    12  */

    13 /**

    14  * Long content fade mixin

    15  *

    16  * Creates a fading overlay to signify that the content is longer

    17  * than the space allows.

    18  */

    19 /**

    20  * Button states and focus styles

    21  */

    22 /**

    23  * Applies editor left position to the selector passed as argument

    24  */

    25 /**

    26  * Applies editor right position to the selector passed as argument

    27  */

    28 /**

    29  * Styles that are reused verbatim in a few places

    30  */

    31 /**

    32  * Allows users to opt-out of animations via OS-level preferences.

    33  */

    34 .block-editor-format-toolbar__image-container-content {

    35   display: flex; }

    36   .block-editor-format-toolbar__image-container-content .components-icon-button {

    37     height: 52px;

    38     align-self: flex-end; }

    39 

    40 .block-editor-format-toolbar__image-container-value {

    41   margin: 7px;

    42   flex-grow: 1;

    43   flex-shrink: 1;

    44   white-space: nowrap;

    45   min-width: 150px;

    46   max-width: 500px; }

    47   .block-editor-format-toolbar__image-container-value.components-base-control .components-base-control__field {

    48     margin-bottom: 0; }

    49 

    50 .block-editor-format-toolbar__link-container-content {

    51   display: flex; }

    52 

    53 .block-editor-format-toolbar__link-container-value {

    54   margin: 7px;

    55   flex-grow: 1;

    56   flex-shrink: 1;

    57   overflow: hidden;

    58   text-overflow: ellipsis;

    59   white-space: nowrap;

    60   min-width: 150px;

    61   max-width: 500px; }

    62   .block-editor-format-toolbar__link-container-value.has-invalid-link {

    63     color: #d94f4f; }