WordPress/wp-includes/css/dist/block-directory/style.css

168 lines
4.4 KiB
CSS

/**
* Colors
*/
/**
* Breakpoints & Media Queries
*/
/**
* Colors
*/
/**
* Often re-used variables
*/
/**
* Breakpoint mixins
*/
/**
* Long content fade mixin
*
* Creates a fading overlay to signify that the content is longer
* than the space allows.
*/
/**
* Button states and focus styles
*/
/**
* Applies editor left position to the selector passed as argument
*/
/**
* Styles that are reused verbatim in a few places
*/
/**
* Allows users to opt-out of animations via OS-level preferences.
*/
/**
* Reset default styles for JavaScript UI based pages.
* This is a WP-admin agnostic reset
*/
/**
* Reset the WP Admin page styles for Gutenberg-like pages.
*/
.block-directory-downloadable-block-header__row {
display: flex;
flex-grow: 1; }
.block-directory-downloadable-block-header__row .block-editor-block-icon {
width: 36px;
height: 36px;
font-size: 36px;
background-color: #edeff0; }
.block-directory-downloadable-block-header__row img {
width: 36px;
height: 36px; }
.block-directory-downloadable-block-header__row .block-directory-downloadable-block-header__column {
display: flex;
flex-direction: column;
flex-grow: 1; }
.block-directory-downloadable-block-header__row .block-directory-downloadable-block-header__column .block-directory-downloadable-block-header__title {
font-weight: 600;
margin-left: 12px; }
.block-directory-downloadable-block-header__row .block-directory-downloadable-block-header__column .block-directory-block-ratings {
margin-left: 12px; }
.block-directory-downloadable-block-info__content {
font-size: 13px; }
.block-directory-downloadable-block-info__row {
display: flex;
justify-content: space-between;
color: #606a73;
margin-top: 8px;
font-size: 12px; }
.block-directory-downloadable-block-info__row .block-directory-downloadable-block-info__column {
display: flex;
align-items: center; }
.block-directory-downloadable-block-info__row .block-directory-downloadable-block-info__column .dashicon {
font-size: 16px;
margin-right: 4px; }
.block-directory-downloadable-block-author-info__content {
color: #606a73;
margin-bottom: 4px; }
.block-directory-downloadable-block-author-info__content-author {
margin-bottom: 4px;
font-size: 14px; }
.block-directory-downloadable-block-list-item {
width: 100%;
padding: 0;
margin: 0 0 12px;
display: flex;
flex-direction: row;
font-size: 13px;
color: #32373c;
align-items: flex-start;
justify-content: center;
background: transparent;
word-break: break-word;
border-radius: 4px;
border: 1px solid #e2e4e7;
transition: all 0.05s ease-in-out;
position: relative;
text-align: left;
overflow: hidden; }
@media (prefers-reduced-motion: reduce) {
.block-directory-downloadable-block-list-item {
transition-duration: 0s; } }
.block-directory-downloadable-block-list-item__panel {
display: flex;
flex-grow: 1;
flex-direction: column; }
.block-directory-downloadable-block-list-item__header {
display: flex;
flex-direction: column;
padding: 12px 12px 0; }
.block-directory-downloadable-block-list-item__body {
display: flex;
flex-direction: column;
padding: 12px; }
.block-directory-downloadable-block-list-item__footer {
display: flex;
flex-direction: column;
padding: 12px;
background-color: #f3f4f5; }
.block-directory-downloadable-block-list-item__content {
color: #606a73; }
.block-directory-downloadable-blocks-list {
list-style: none;
padding: 2px 0;
overflow: hidden;
display: flex;
flex-wrap: wrap; }
.block-directory-downloadable-blocks-panel__description {
font-style: italic;
padding: 0;
margin-top: 0;
text-align: left;
color: #606a73; }
.block-directory-downloadable-blocks-panel__description.has-no-results {
font-style: normal;
padding: 0;
margin-top: 100px;
text-align: center;
color: #606a73; }
.block-directory-downloadable-blocks-panel__description.has-no-results .components-spinner {
float: inherit; }
.block-directory-block-ratings {
display: flex; }
.block-directory-block-ratings > div {
line-height: 1;
display: flex; }
.block-directory-block-ratings .dashicons {
font-size: ms(-2);
width: 1.1em; }
.block-directory-block-ratings .block-directory-block-ratings__rating-count {
color: #606a73;
font-size: ms(-2); }
.block-directory-block-ratings [class*="dashicons-star-"] {
color: #ffb900; }