diff options
Diffstat (limited to 'plugins/jetpack/extensions/blocks/slideshow/style.scss')
-rw-r--r-- | plugins/jetpack/extensions/blocks/slideshow/style.scss | 165 |
1 files changed, 0 insertions, 165 deletions
diff --git a/plugins/jetpack/extensions/blocks/slideshow/style.scss b/plugins/jetpack/extensions/blocks/slideshow/style.scss deleted file mode 100644 index c1d1fc50..00000000 --- a/plugins/jetpack/extensions/blocks/slideshow/style.scss +++ /dev/null @@ -1,165 +0,0 @@ -@import '../../shared/styles/gutenberg-colors.scss'; -@import '../../shared/styles/jetpack-variables.scss'; - -.wp-block-jetpack-slideshow { - margin-bottom: $jetpack-block-margin-bottom; - position: relative; - - .wp-block-jetpack-slideshow_container { - width: 100%; - overflow: hidden; - opacity: 0; - - &.wp-swiper-initialized { - opacity: 1; - } - - // High specifity to override theme styles - .wp-block-jetpack-slideshow_swiper-wrappper, - .wp-block-jetpack-slideshow_slide { - padding: 0; - margin: 0; - line-height: normal; - } - } - - .wp-block-jetpack-slideshow_slide { - background: rgba( 0, 0, 0, 0.1 ); - display: flex; - height: 100%; - width: 100%; - figure { - align-items: center; - display: flex; - height: 100%; - justify-content: center; - margin: 0; - position: relative; - width: 100%; - } - } - - .swiper-container-fade .wp-block-jetpack-slideshow_slide { - background: var( --color-neutral-0 ); - } - - .wp-block-jetpack-slideshow_image { - display: block; - height: auto; - max-height: 100%; - max-width: 100%; - width: auto; - object-fit: contain; - } - - .wp-block-jetpack-slideshow_button-prev, - .wp-block-jetpack-slideshow_button-next, - .wp-block-jetpack-slideshow_button-pause { - background-color: rgba( 0, 0, 0, 0.5 ); - background-position: center; - background-repeat: no-repeat; - background-size: 24px; - border: 0; - border-radius: 4px; - box-shadow: none; - height: 48px; - margin: -24px 0 0; - padding: 0; - transition: background-color 250ms; - width: 48px; - - &:focus, - &:hover { - background-color: rgba( 0, 0, 0, 0.75 ); - } - - &:focus { - outline: thin dotted $white; - outline-offset: -4px; - } - } - - &.swiper-container-rtl .swiper-button-prev.swiper-button-white, - &.swiper-container-rtl .wp-block-jetpack-slideshow_button-prev, - .swiper-button-next.swiper-button-white, - .wp-block-jetpack-slideshow_button-next { - background-image: url( "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath d='M5.88 4.12L13.76 12l-7.88 7.88L8 22l10-10L8 2z' fill='white'/%3E%3Cpath fill='none' d='M0 0h24v24H0z'/%3E%3C/svg%3E" ); - } - - &.swiper-container-rtl .swiper-button-next.swiper-button-white, - &.swiper-container-rtl .wp-block-jetpack-slideshow_button-next, - .swiper-button-prev.swiper-button-white, - .wp-block-jetpack-slideshow_button-prev { - background-image: url( "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath d='M18 4.12L10.12 12 18 19.88 15.88 22l-10-10 10-10z' fill='white'/%3E%3Cpath fill='none' d='M0 0h24v24H0z'/%3E%3C/svg%3E" ); - } - - .wp-block-jetpack-slideshow_button-pause { - background-image: url( "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath d='M6 19h4V5H6v14zm8-14v14h4V5h-4z' fill='white'/%3E%3Cpath d='M0 0h24v24H0z' fill='none'/%3E%3C/svg%3E" ); - display: none; - margin-top: 0; - position: absolute; - right: 10px; - top: 10px; - z-index: 1; - } - - .wp-block-jetpack-slideshow_autoplay-paused .wp-block-jetpack-slideshow_button-pause { - background-image: url( "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath d='M8 5v14l11-7z' fill='white'/%3E%3Cpath d='M0 0h24v24H0z' fill='none'/%3E%3C/svg%3E" ); - } - - &[data-autoplay='true'] .wp-block-jetpack-slideshow_button-pause { - display: block; - } - - .wp-block-jetpack-slideshow_caption.gallery-caption { - background-color: rgba( 0, 0, 0, 0.5 ); - box-sizing: border-box; - bottom: 0; - color: $white; - cursor: text; - left: 0; - margin: 0 !important; - padding: 0.75em; - position: absolute; - right: 0; - text-align: initial; - z-index: 1; - a { - color: inherit; - } - } - - .wp-block-jetpack-slideshow_pagination.swiper-pagination-bullets { - bottom: 0; - line-height: 24px; - padding: 10px 0 2px; - position: relative; - - .swiper-pagination-bullet { - background: currentColor; - color: currentColor; - height: 16px; - opacity: 0.5; - transform: scale( 0.75 ); - transition: opacity 250ms, transform 250ms; - vertical-align: top; - width: 16px; - - &:focus, - &:hover { - opacity: 1; - } - - &:focus { - outline: thin dotted; - outline-offset: 0; - } - } - - .swiper-pagination-bullet-active { - background-color: currentColor; - opacity: 1; - transform: scale( 1 ); - } - } -} |