diff --git a/css/cloudinary.css b/css/cloudinary.css index 399710eed..509b99382 100644 --- a/css/cloudinary.css +++ b/css/cloudinary.css @@ -1 +1 @@ -.tippy-box[data-animation=fade][data-state=hidden]{opacity:0}[data-tippy-root]{max-width:calc(100vw - 10px)}.tippy-box{background-color:#333;border-radius:4px;color:#fff;font-size:14px;line-height:1.4;outline:0;position:relative;transition-property:transform,visibility,opacity}.tippy-box[data-placement^=top]>.tippy-arrow{bottom:0}.tippy-box[data-placement^=top]>.tippy-arrow:before{border-top-color:initial;border-width:8px 8px 0;bottom:-7px;left:0;transform-origin:center top}.tippy-box[data-placement^=bottom]>.tippy-arrow{top:0}.tippy-box[data-placement^=bottom]>.tippy-arrow:before{border-bottom-color:initial;border-width:0 8px 8px;left:0;top:-7px;transform-origin:center bottom}.tippy-box[data-placement^=left]>.tippy-arrow{right:0}.tippy-box[data-placement^=left]>.tippy-arrow:before{border-left-color:initial;border-width:8px 0 8px 8px;right:-7px;transform-origin:center left}.tippy-box[data-placement^=right]>.tippy-arrow{left:0}.tippy-box[data-placement^=right]>.tippy-arrow:before{border-right-color:initial;border-width:8px 8px 8px 0;left:-7px;transform-origin:center right}.tippy-box[data-inertia][data-state=visible]{transition-timing-function:cubic-bezier(.54,1.5,.38,1.11)}.tippy-arrow{color:#333;height:16px;width:16px}.tippy-arrow:before{border-color:transparent;border-style:solid;content:"";position:absolute}.tippy-content{padding:5px 9px;position:relative;z-index:1}@font-face{font-family:cloudinary;font-style:normal;font-weight:500;src:url(../css/fonts/cloudinary.d1a91c7f695026fd20974570349bc540.eot);src:url(../css/fonts/cloudinary.d1a91c7f695026fd20974570349bc540.eot#iefix) format("embedded-opentype"),url(../css/fonts/cloudinary.3b839e5145ad58edde0191367a5a96f0.woff) format("woff"),url(../css/fonts/cloudinary.d8de6736f15e12f71ac22a2d374002e5.ttf) format("truetype"),url(../css/images/cloudinary.svg#cloudinary) format("svg")}.dashicons-cloudinary{speak:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-style:normal;font-variant:normal;font-weight:400;line-height:1;text-transform:none}.dashicons-cloudinary:before{content:"";font-family:cloudinary,monospace!important}.dashicons-cloudinary-media:before{content:"";font-family:cloudinary,monospace!important}.dashicons-cloudinary-dam:before{content:"";font-family:cloudinary,monospace!important}.dashicons-cloudinary.success{color:#558b2f}.dashicons-cloudinary.error{color:#dd2c00}.dashicons-cloudinary.error:before{content:""}.dashicons-cloudinary.uploading{color:#fd9d2c}.dashicons-cloudinary.uploading:before{content:""}.dashicons-cloudinary.info{color:#0071ba}.dashicons-cloudinary.downloading:before{content:""}.dashicons-cloudinary.syncing:before{content:""}.dashicons-cloudinary.media:before{content:""}.dashicons-cloudinary.dam:before{content:""}.column-cld_status{width:5.5em}.column-cld_status .dashicons-cloudinary,.column-cld_status .dashicons-cloudinary-dam{display:inline-block}.column-cld_status .dashicons-cloudinary-dam:before,.column-cld_status .dashicons-cloudinary:before{font-size:1.8rem}.form-field .error-notice,.form-table .error-notice{color:#dd2c00;display:none}.form-field input.cld-field:invalid,.form-table input.cld-field:invalid{border-color:#dd2c00}.form-field input.cld-field:invalid+.error-notice,.form-table input.cld-field:invalid+.error-notice{display:inline-block}.cloudinary-welcome{background-image:url(../css/images/logo.svg);background-position:top 12px right 20px;background-repeat:no-repeat;background-size:153px}.cloudinary-stats{display:inline-block;margin-left:25px}.cloudinary-stat{cursor:help}.cloudinary-percent{color:#0071ba;font-size:.8em;vertical-align:top}.settings-image{max-width:100%;padding-top:5px}.settings-tabs>li{display:inline-block}.settings-tabs>li a{padding:.6em}.settings-tabs>li a.active{background-color:#fff}.settings-tab-section{max-width:1030px;padding:20px 0 0;position:relative}.settings-tab-section.cloudinary-welcome .settings-tab-section-fields-dashboard{align-content:flex-start;align-items:flex-start;display:flex;margin-top:40px}.settings-tab-section.cloudinary-welcome .settings-tab-section-fields-dashboard-description{margin:0 auto 0 0;width:55%}.settings-tab-section.cloudinary-welcome .settings-tab-section-fields-dashboard-content{margin:0 auto;width:35%}.settings-tab-section.cloudinary-welcome .settings-tab-section-fields-dashboard-content .dashicons{color:#9ea3a8}.settings-tab-section.cloudinary-welcome .settings-tab-section-card{margin-top:0}.settings-tab-section-fields .field-heading th{color:#23282d;display:block;font-size:1.1em;margin:1em 0;width:auto}.settings-tab-section-fields .field-heading td{display:none;visibility:hidden}.settings-tab-section-fields .regular-textarea{height:60px;width:100%}.settings-tab-section-fields .dashicons{text-decoration:none;vertical-align:middle}.settings-tab-section-fields a .dashicons{color:#5f5f5f}.settings-tab-section-fields-dashboard-error{color:#5f5f5f;font-size:1.2em}.settings-tab-section-fields-dashboard-error.expanded{margin-bottom:25px;padding-top:40px}.settings-tab-section-fields-dashboard-error .dashicons{color:#ac0000}.settings-tab-section-fields-dashboard-error .button{font-size:1.1em;height:40px;line-height:40px;padding-left:40px;padding-right:40px}.settings-tab-section-fields-dashboard-success{color:#23282d;font-size:1.2em}.settings-tab-section-fields-dashboard-success.expanded{margin-bottom:25px;padding-top:40px}.settings-tab-section-fields-dashboard-success .dashicons{color:#4fb651}.settings-tab-section-fields-dashboard-success .button{font-size:1.1em;height:40px;line-height:40px;padding-left:40px;padding-right:40px}.settings-tab-section-fields-dashboard-success .description{color:#5f5f5f;font-weight:400;margin-top:12px}.settings-tab-section-card{background-color:#fff;border:1px solid #e5e5e5;box-shadow:0 1px 1px 0 rgba(0,0,0,.07);box-sizing:border-box;margin-top:12px;padding:20px 23px}.settings-tab-section-card .dashicons{font-size:1.4em}.settings-tab-section-card h2{font-size:1.8em;font-weight:400;margin-top:0}.settings-tab-section-card.pull-right{float:right;padding:12px;position:relative;width:450px;z-index:10}.settings-tab-section-card.pull-right img.settings-image{border:1px solid #979797;box-shadow:0 2px 4px 0 rgba(0,0,0,.5);margin-top:12px}.settings-tab-section-card.pull-right h3,.settings-tab-section-card.pull-right h4{margin-top:0}.settings-tab-section .field-row-cloudinary_url,.settings-tab-section .field-row-signup{display:block}.settings-tab-section .field-row-cloudinary_url td,.settings-tab-section .field-row-cloudinary_url th,.settings-tab-section .field-row-signup td,.settings-tab-section .field-row-signup th{display:block;padding:10px 0 0;width:auto}.settings-tab-section .field-row-cloudinary_url td .sign-up,.settings-tab-section .field-row-cloudinary_url th .sign-up,.settings-tab-section .field-row-signup td .sign-up,.settings-tab-section .field-row-signup th .sign-up{vertical-align:baseline}.settings-tab-section.connect .form-table{display:inline-block;max-width:580px;width:auto}.settings-valid{color:#558b2f;font-size:30px}.settings-valid-field{border-color:#558b2f!important}.settings-invalid-field{border-color:#dd2c00!important}.settings-alert{box-shadow:0 1px 1px rgba(0,0,0,.04);display:inline-block;padding:5px 7px}.settings-alert-info{background-color:#e9faff;border:1px solid #ccd0d4;border-left:4px solid #00a0d2}.settings-alert-warning{background-color:#fff5e9;border:1px solid #f6e7b6;border-left:4px solid #e3be38}.settings-alert-error{background-color:#ffe9e9;border:1px solid #d4cccc;border-left:4px solid #d20000}.field-radio input[type=radio].cld-field{margin:0 5px 0 0}.field-radio label{margin-right:10px}.settings-tab-section h2{margin:0}.cloudinary-collapsible{background-color:#fff;border:1px solid #ccd0d4;box-shadow:0 1px 1px rgba(0,0,0,.04);box-sizing:border-box;margin:20px 0;padding:10px;width:95%}.cloudinary-collapsible__toggle{cursor:pointer;display:flex}.cloudinary-collapsible__toggle h2{margin:0!important}.cloudinary-collapsible__toggle button{background-color:inherit;border:none;cursor:pointer;margin:0 0 0 auto;padding:0;width:auto}.cloudinary-collapsible__toggle .cld-ui-icon{margin-right:6px;width:24px}.cloudinary-collapsible__content .cld-ui-title{margin:3em 0 1em}.cloudinary-collapsible__content .cld-more-details{margin-top:2em}.sync .spinner{display:inline-block;float:none;margin:0 5px 0 0;visibility:visible}.sync-media,.sync-media-progress{display:none}.sync-media-progress-outer{background-color:#e5e5e5;height:20px;margin:20px 0 10px;position:relative;width:500px}.sync-media-progress-outer .progress-bar{background-color:#558b2f;height:20px;transition:width .25s;width:0}.sync-media-progress-notice{color:#dd2c00}.sync-media-resource{display:inline-block;width:100px}.sync-media-error{color:#dd2c00}.sync-count{font-weight:700}.sync-details{margin-top:10px}.sync .button.start-sync,.sync .button.stop-sync{display:none;padding:0 16px}.sync .button.start-sync .dashicons,.sync .button.stop-sync .dashicons{line-height:2.2}.sync .progress-text{display:inline-block;font-weight:700;padding:12px 4px 12px 12px}.sync .completed{display:none;max-width:300px}.sync-status-disabled{color:#dd2c00}.sync-status-enabled{color:#558b2f}.sync-status-button.button{vertical-align:baseline}.cloudinary-widget{height:100%}.cloudinary-widget-wrapper{background-image:url(data:image/svg+xml;base64,PHN2ZyBjbGFzcz0ic3Bpbm5lciIgdmlld0JveD0iLTQgLTQgMTUxIDEwMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICAgIDxzdHlsZSB0eXBlPSJ0ZXh0L2NzcyI+PCFbQ0RBVEFbCiAgICAgIEBrZXlmcmFtZXMgY29sb3JzIHsKICAgICAgICAwJSB7IHN0cm9rZTogIzAwNzhGRjsgfQogICAgICAgICAgNTAlIHsgc3Ryb2tlOiAjMGUyZjVhOyB9CiAgICAgICAgICAxMDAlIHsgc3Ryb2tlOiAjMDA3OEZGOyB9CiAgICAgIH0KCiAgICAgIEBrZXlmcmFtZXMgZGFzaCB7CiAgICAgICAwJSB7IHN0cm9rZS1kYXNob2Zmc2V0OiA1NjA7IH0KICAgICAgIDUwJSB7CiAgICAgICAgICBzdHJva2UtZGFzaG9mZnNldDogMDsKICAgICAgIH0KICAgICAgIDEwMCUgeyAgIHN0cm9rZS1kYXNob2Zmc2V0OiA1NjA7IH0KICAgICAgfQogICAgICBALXdlYmtpdC1rZXlmcmFtZXMgY29sb3JzIHsKICAgICAgICAwJSB7IHN0cm9rZTogIzAwNzhmZjsgfQogICAgICAgICAgNTAlIHsgc3Ryb2tlOiAjMGUyZjVhOyB9CiAgICAgICAgICAxMDAlIHsgc3Ryb2tlOiAjMDA3OGZmOyB9CiAgICAgIH0KCiAgICAgIEAtd2Via2l0LWtleWZyYW1lcyBkYXNoIHsKICAgICAgIDAlIHsgc3Ryb2tlLWRhc2hvZmZzZXQ6IDU2MDsgfQogICAgICAgNTAlIHsKICAgICAgICAgIHN0cm9rZS1kYXNob2Zmc2V0OiAwOwogICAgICAgfQogICAgICAgMTAwJSB7ICAgc3Ryb2tlLWRhc2hvZmZzZXQ6IDU2MDsKICAgICAgIH0KICAgICAgfQogICAgICAucGF0aCB7CiAgICAgICAgc3Ryb2tlLWRhc2hhcnJheTogMjgwOwogICAgICAgIHN0cm9rZS1kYXNob2Zmc2V0OiAwOwogICAgICAgIHRyYW5zZm9ybS1vcmlnaW46IGNlbnRlcjsKICAgICAgICAtd2Via2l0LWFuaW1hdGlvbjoKICAgICAgICAgIGRhc2ggMnMgZWFzZS1pbi1vdXQgaW5maW5pdGUsIGNvbG9ycyA4cyBlYXNlLWluLW91dCBpbmZpbml0ZTsKICAgICAgICBhbmltYXRpb246CiAgICAgICAgICBkYXNoIDJzIGVhc2UtaW4tb3V0IGluZmluaXRlLCBjb2xvcnMgOHMgZWFzZS1pbi1vdXQgaW5maW5pdGU7CiAgICAgIH0KICAgIF1dPjwvc3R5bGU+CiAgPHBhdGggY2xhc3M9InBhdGgiIGQ9Ik0xMjEuNjYzIDkwLjYzOGMtMS43OTYgMC05OS4zMy0uNDk4LTEwMS40NzQtMS40NzhDOC42ODUgODMuODc3IDEuMjUgNzIuMTk2IDEuMjUgNTkuMzk2YzAtMTYuNjU2IDEyLjc5Ny0zMC42MSAyOS4wNTItMzIuMzIzIDcuNDktMTUuNzA2IDIzLjE4Ni0yNS43MDcgNDAuNzE0LTI1LjcwNyAyMC45OCAwIDM5LjIxNSAxNC43NTIgNDMuOTQ1IDM0LjkwNyAxNS4wOS4yNDUgMjcuMjkgMTIuNjMgMjcuMjkgMjcuODIyIDAgMTEuOTY4LTcuNzM4IDIyLjU1LTE5LjI1NiAyNi4zMyIgc3Ryb2tlLXdpZHRoPSI5IiBzdHJva2UtbGluZWNhcD0icm91bmQiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPgo8L3N2Zz4K);background-position:50%;background-repeat:no-repeat;background-size:150px;height:100%;overflow:hidden}.attachment-actions .button.edit-attachment,.attachment-info .edit-attachment{display:none}.global-transformations-preview{max-width:600px;position:relative}.global-transformations-spinner{display:none}.global-transformations-button.button-primary{display:none;position:absolute;z-index:100}.global-transformations-url{margin-bottom:5px;margin-top:5px}.global-transformations-url-transformation{color:#51a3ff;max-width:100px;overflow:hidden;text-overflow:ellipsis}.global-transformations-url-file{color:#f2d864}.global-transformations-url-link{background-color:#262c35;border-radius:6px;color:#fff;display:block;overflow:hidden;padding:16px;text-decoration:none;text-overflow:ellipsis}.global-transformations-url-link:hover{color:#888;text-decoration:underline}.cld-tax-order-list-item{background-color:#fff;border:1px solid #efefef;margin:0 0 -1px;padding:4px}.cld-tax-order-list-item.no-items{color:#888;display:none;text-align:center}.cld-tax-order-list-item.no-items:last-child{display:block}.cld-tax-order-list-item.ui-sortable-helper{box-shadow:0 2px 5px rgba(0,0,0,.2)}.cld-tax-order-list-item-placeholder{background-color:#efefef;height:45px;margin:0}.cld-tax-order-list-item-handle{color:#999;cursor:grab;margin-right:4px}.cld-tax-order-list-type{display:inline-block;margin-right:8px}.cld-tax-order-list-type input{margin-right:4px!important}.cloudinary-media-library{margin-left:-20px;position:relative}@media screen and (max-width:782px){.cloudinary-media-library{margin-left:-10px}}.cld-ui-suffix{background-color:#e8e8e8;border-radius:4px;color:#999;display:inline-block;font-family:Courier New,Courier,monospace;font-size:12px;font-weight:700;line-height:1.7em;margin-left:13px;padding:4px 6px}.cld-ui-preview .cld-ui-header{margin-top:-1px}.cld-ui-preview .cld-ui-header:first-child{margin-top:13px}.cld-ui-collapse{align-self:center;cursor:pointer;padding:0 .45rem}.cld-ui-title{font-size:12px}.cld-ui-title h2{font-size:15px;font-weight:700;margin:6px 0 1px}.cld-ui-title.collapsible{cursor:pointer}.cld-ui-conditional .closed,.cld-ui-wrap .closed{display:none}.cld-ui-wrap .description{color:rgba(0,0,1,.5);font-size:12px}.cld-ui-wrap .button:not(.wp-color-result){background-color:#3448c5;border:0;border-radius:4px;color:#fff;display:inline-block;font-size:11px;font-weight:700;margin:0;min-height:28px;padding:5px 14px;text-decoration:none}.cld-ui-wrap .button:active,.cld-ui-wrap .button:hover{background-color:#1e337f}.cld-ui-wrap .button:focus{background-color:#3448c5;border-color:#3448c5;box-shadow:0 0 0 1px #fff,0 0 0 3px #3448c5}.cld-ui-wrap .button.button-small,.cld-ui-wrap .button.button-small:hover{font-size:11px;line-height:2.18181818;min-height:26px;padding:0 8px}.cld-ui-wrap .button.wp-color-result{border-color:#d0d0d0}.cld-ui-error{color:#dd2c00}.cld-referrer-link{display:inline-block;margin:12px 0 0;text-decoration:none}.cld-referrer-link span{margin-right:5px}.cld-settings{margin-left:-20px}.cld-page-tabs{background-color:#fff;border-bottom:1px solid #e5e5e5;display:none;flex-wrap:nowrap;justify-content:center;margin:-20px -18px 20px;padding:0!important}@media only screen and (max-width:1200px){.cld-page-tabs{display:flex}}.cld-page-tabs-tab{list-style:none;margin-bottom:0;text-indent:0;width:100%}.cld-page-tabs-tab button{background:transparent;border:0;color:#000001;cursor:pointer;display:block;font-weight:500;padding:1rem 2rem;text-align:center;white-space:nowrap;width:100%}.cld-page-tabs-tab button.is-active{border-bottom:2px solid #3448c5;color:#3448c5}.cld-page-header{align-items:center;background-color:#3448c5;display:flex;flex-direction:column;justify-content:space-between;margin-bottom:0;padding:16px}@media only screen and (min-width:783px){.cld-page-header{flex-direction:row}}.cld-page-header img{width:150px}.cld-page-header-button{background-color:#1e337f;border-radius:4px;color:#fff;display:inline-block;font-weight:700;margin:1em 0 0 9px;padding:5px 14px;text-decoration:none}@media only screen and (min-width:783px){.cld-page-header-button{margin-top:0}}.cld-page-header-button:focus,.cld-page-header-button:hover{color:#fff;text-decoration:none}.cld-page-header-logo{align-items:center;display:flex}.cld-page-header-logo .version{color:#fff;font-size:10px;margin-left:12px}.cld-page-header p{font-size:11px;margin:0}.cld-info-box,.cld-panel,.cld-panel-short{background-color:#fff;border:1px solid #c6d1db;margin-top:13px;padding:23px 24px}.cld-panel.full-width,.full-width.cld-info-box,.full-width.cld-panel-short{max-width:100%}.cld-panel.has-heading,.has-heading.cld-info-box,.has-heading.cld-panel-short{border-top:0;margin-top:0}.cld-panel-heading{display:flex;justify-content:space-between;padding:19px 23px;position:relative}.cld-panel-heading.full-width{max-width:100%}.cld-panel-heading img{margin-right:.6rem}.cld-panel-heading.collapsible{cursor:pointer;padding-right:1rem}.cld-panel-inner{background-color:hsla(0,0%,86.3%,.2);border:1px solid #e5e5e5;margin:1em 0;padding:1.3rem}.cld-panel-inner h2{color:#3273ab}.cld-info-box hr,.cld-panel-short hr,.cld-panel hr{border-top:1px solid #e5e5e5;clear:both;margin:19px 0 20px}.cld-info-box ul,.cld-panel-short ul,.cld-panel ul{list-style:initial;padding:0 3em}.cld-info-box .stat-boxes,.cld-panel-short .stat-boxes,.cld-panel .stat-boxes{border:1px solid #e5e5e5;font-size:1.2em}.cld-info-box .stat-boxes .box,.cld-panel-short .stat-boxes .box,.cld-panel .stat-boxes .box{border-bottom:1px solid #e5e5e5;padding:2rem;text-align:center}.cld-info-box .stat-boxes .box:last-of-type,.cld-panel-short .stat-boxes .box:last-of-type,.cld-panel .stat-boxes .box:last-of-type{border-bottom:none}.cld-info-box .stat-boxes .box .cld-ui-icon,.cld-panel-short .stat-boxes .box .cld-ui-icon,.cld-panel .stat-boxes .box .cld-ui-icon{height:35px;width:35px}.cld-info-box .stat-boxes .icon,.cld-panel-short .stat-boxes .icon,.cld-panel .stat-boxes .icon{height:50px;margin-right:.5em;width:50px}.cld-info-box .stat-boxes h3,.cld-panel-short .stat-boxes h3,.cld-panel .stat-boxes h3{margin-bottom:1.5rem;margin-top:2.4rem}.cld-info-box .stat-boxes .limit,.cld-panel-short .stat-boxes .limit,.cld-panel .stat-boxes .limit{font-size:2em;font-weight:700;margin-right:.5em;white-space:nowrap}.cld-info-box .stat-boxes .usage,.cld-panel-short .stat-boxes .usage,.cld-panel .stat-boxes .usage{color:#3273ab;font-size:1.5em;font-weight:400}@media only screen and (min-width:783px){.cld-info-box .stat-boxes,.cld-panel-short .stat-boxes,.cld-panel .stat-boxes{display:flex;flex-wrap:nowrap;font-size:1em}.cld-info-box .stat-boxes .box,.cld-panel-short .stat-boxes .box,.cld-panel .stat-boxes .box{border-bottom:none;border-right:1px solid #e5e5e5;flex-grow:1}.cld-info-box .stat-boxes .box:last-of-type,.cld-panel-short .stat-boxes .box:last-of-type,.cld-panel .stat-boxes .box:last-of-type{border-right:none}}@media only screen and (min-width:1200px){.cld-info-box .stat-boxes,.cld-panel-short .stat-boxes,.cld-panel .stat-boxes{font-size:1.2em}}.cld-info-box .img-connection-string,.cld-panel-short .img-connection-string,.cld-panel .img-connection-string{max-width:607px;width:100%}.cld-info-box .media-status-box,.cld-info-box .stat-boxes,.cld-panel-short .media-status-box,.cld-panel-short .stat-boxes,.cld-panel .media-status-box,.cld-panel .stat-boxes{border:1px solid #e5e5e5}.cld-info-box .media-status-box,.cld-panel-short .media-status-box,.cld-panel .media-status-box{padding:2rem;text-align:center}.cld-info-box .media-status-box .status,.cld-panel-short .media-status-box .status,.cld-panel .media-status-box .status{font-size:2rem;font-weight:700;margin-right:.5em}.cld-info-box .media-status-box .cld-ui-icon,.cld-panel-short .media-status-box .cld-ui-icon,.cld-panel .media-status-box .cld-ui-icon{height:35px;width:35px}.cld-info-box .notification,.cld-panel-short .notification,.cld-panel .notification{display:inline-flex;font-weight:700;padding:1.5rem}.cld-info-box .notification-success,.cld-panel-short .notification-success,.cld-panel .notification-success{background-color:rgba(32,184,50,.2);border:2px solid #20b832}.cld-info-box .notification-success:before,.cld-panel-short .notification-success:before,.cld-panel .notification-success:before{color:#20b832}.cld-info-box .notification-syncing,.cld-panel-short .notification-syncing,.cld-panel .notification-syncing{background-color:rgba(50,115,171,.2);border:2px solid #3273ab;color:#444;text-decoration:none}.cld-info-box .notification-syncing:before,.cld-panel-short .notification-syncing:before,.cld-panel .notification-syncing:before{-webkit-animation:spin 1s infinite running;-moz-animation:spin 1s linear infinite;animation:spin 1s linear infinite;color:#3273ab}@keyframes spin{to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}.cld-info-box .notification:before,.cld-panel-short .notification:before,.cld-panel .notification:before{margin-right:.5em}.cld-info-box .help-wrap,.cld-panel-short .help-wrap,.cld-panel .help-wrap{align-items:stretch;display:flex;flex-direction:row;flex-grow:1;justify-content:flex-start}.cld-info-box .help-wrap .help-box .large-button,.cld-panel-short .help-wrap .help-box .large-button,.cld-panel .help-wrap .help-box .large-button{background:#fff;border-radius:4px;box-shadow:0 1px 8px 0 rgba(0,0,0,.3);color:initial;display:block;height:100%;text-decoration:none}.cld-info-box .help-wrap .help-box .large-button:hover,.cld-panel-short .help-wrap .help-box .large-button:hover,.cld-panel .help-wrap .help-box .large-button:hover{background-color:#eaecfa;box-shadow:0 1px 8px 0 rgba(0,0,0,.5)}.cld-info-box .help-wrap .help-box .large-button .cld-ui-wrap,.cld-panel-short .help-wrap .help-box .large-button .cld-ui-wrap,.cld-panel .help-wrap .help-box .large-button .cld-ui-wrap{padding-bottom:.5em}.cld-info-box .help-wrap .help-box img,.cld-panel-short .help-wrap .help-box img,.cld-panel .help-wrap .help-box img{border-radius:4px 4px 0 0;width:100%}.cld-info-box .help-wrap .help-box div,.cld-info-box .help-wrap .help-box h4,.cld-panel-short .help-wrap .help-box div,.cld-panel-short .help-wrap .help-box h4,.cld-panel .help-wrap .help-box div,.cld-panel .help-wrap .help-box h4{padding:0 12px}.cld-panel-short{display:inline-block;min-width:270px;width:auto}.cld-info-box{align-items:stretch;border-radius:4px;display:flex;margin:0 0 19px;max-width:500px;padding:0}@media only screen and (min-width:783px){.cld-info-box{flex-direction:row}}.cld-info-box .cld-ui-title h2{font-size:15px;margin:0 0 6px}.cld-info-box .cld-info-icon{background-color:#eaecfa;border-radius:4px 0 0 4px;display:flex;justify-content:center;text-align:center;vertical-align:center;width:49px}.cld-info-box .cld-info-icon img{width:24px}.cld-info-box a.button,.cld-info-box img{align-self:center}.cld-info-box .cld-ui-body{display:inline-block;font-size:12px;line-height:normal;margin:0 auto;padding:12px 9px;width:100%}.cld-info-box-text{color:rgba(0,0,1,.5);font-size:12px}.cld-submit,.cld-switch-cloud{background-color:#fff;border:1px solid #c6d1db;border-top:0;padding:1.2rem 1.75rem}.cld-panel.closed+.cld-submit,.cld-panel.closed+.cld-switch-cloud,.closed.cld-info-box+.cld-submit,.closed.cld-info-box+.cld-switch-cloud,.closed.cld-panel-short+.cld-submit,.closed.cld-panel-short+.cld-switch-cloud{display:none}.cld-stat-percent{align-items:center;display:flex;justify-content:flex-start;line-height:1}.cld-stat-percent h2{color:#54c8db;font-size:48px;margin:0 12px 0 0}.cld-stat-percent-text{font-weight:700}.cld-stat-legend{display:flex;font-weight:700;margin:0 0 16px 12px;min-width:200px}.cld-stat-legend-dot{border-radius:50%;display:inline-block;height:20px;margin-right:6px;width:20px}.cld-stat-legend-dot.blue-dot{background-color:#2e49cd}.cld-stat-legend-dot.aqua-dot{background-color:#54c8db}.cld-stat-legend-dot.red-dot{background-color:#e12600}.cld-stat-text{font-weight:700;margin:.75em 0}.cld-loading{background-image:url(data:image/svg+xml;base64,PHN2ZyBjbGFzcz0ic3Bpbm5lciIgdmlld0JveD0iLTQgLTQgMTUxIDEwMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICAgIDxzdHlsZSB0eXBlPSJ0ZXh0L2NzcyI+PCFbQ0RBVEFbCiAgICAgIEBrZXlmcmFtZXMgY29sb3JzIHsKICAgICAgICAwJSB7IHN0cm9rZTogIzAwNzhGRjsgfQogICAgICAgICAgNTAlIHsgc3Ryb2tlOiAjMGUyZjVhOyB9CiAgICAgICAgICAxMDAlIHsgc3Ryb2tlOiAjMDA3OEZGOyB9CiAgICAgIH0KCiAgICAgIEBrZXlmcmFtZXMgZGFzaCB7CiAgICAgICAwJSB7IHN0cm9rZS1kYXNob2Zmc2V0OiA1NjA7IH0KICAgICAgIDUwJSB7CiAgICAgICAgICBzdHJva2UtZGFzaG9mZnNldDogMDsKICAgICAgIH0KICAgICAgIDEwMCUgeyAgIHN0cm9rZS1kYXNob2Zmc2V0OiA1NjA7IH0KICAgICAgfQogICAgICBALXdlYmtpdC1rZXlmcmFtZXMgY29sb3JzIHsKICAgICAgICAwJSB7IHN0cm9rZTogIzAwNzhmZjsgfQogICAgICAgICAgNTAlIHsgc3Ryb2tlOiAjMGUyZjVhOyB9CiAgICAgICAgICAxMDAlIHsgc3Ryb2tlOiAjMDA3OGZmOyB9CiAgICAgIH0KCiAgICAgIEAtd2Via2l0LWtleWZyYW1lcyBkYXNoIHsKICAgICAgIDAlIHsgc3Ryb2tlLWRhc2hvZmZzZXQ6IDU2MDsgfQogICAgICAgNTAlIHsKICAgICAgICAgIHN0cm9rZS1kYXNob2Zmc2V0OiAwOwogICAgICAgfQogICAgICAgMTAwJSB7ICAgc3Ryb2tlLWRhc2hvZmZzZXQ6IDU2MDsKICAgICAgIH0KICAgICAgfQogICAgICAucGF0aCB7CiAgICAgICAgc3Ryb2tlLWRhc2hhcnJheTogMjgwOwogICAgICAgIHN0cm9rZS1kYXNob2Zmc2V0OiAwOwogICAgICAgIHRyYW5zZm9ybS1vcmlnaW46IGNlbnRlcjsKICAgICAgICAtd2Via2l0LWFuaW1hdGlvbjoKICAgICAgICAgIGRhc2ggMnMgZWFzZS1pbi1vdXQgaW5maW5pdGUsIGNvbG9ycyA4cyBlYXNlLWluLW91dCBpbmZpbml0ZTsKICAgICAgICBhbmltYXRpb246CiAgICAgICAgICBkYXNoIDJzIGVhc2UtaW4tb3V0IGluZmluaXRlLCBjb2xvcnMgOHMgZWFzZS1pbi1vdXQgaW5maW5pdGU7CiAgICAgIH0KICAgIF1dPjwvc3R5bGU+CiAgPHBhdGggY2xhc3M9InBhdGgiIGQ9Ik0xMjEuNjYzIDkwLjYzOGMtMS43OTYgMC05OS4zMy0uNDk4LTEwMS40NzQtMS40NzhDOC42ODUgODMuODc3IDEuMjUgNzIuMTk2IDEuMjUgNTkuMzk2YzAtMTYuNjU2IDEyLjc5Ny0zMC42MSAyOS4wNTItMzIuMzIzIDcuNDktMTUuNzA2IDIzLjE4Ni0yNS43MDcgNDAuNzE0LTI1LjcwNyAyMC45OCAwIDM5LjIxNSAxNC43NTIgNDMuOTQ1IDM0LjkwNyAxNS4wOS4yNDUgMjcuMjkgMTIuNjMgMjcuMjkgMjcuODIyIDAgMTEuOTY4LTcuNzM4IDIyLjU1LTE5LjI1NiAyNi4zMyIgc3Ryb2tlLXdpZHRoPSI5IiBzdHJva2UtbGluZWNhcD0icm91bmQiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPgo8L3N2Zz4K);background-position:50%;background-repeat:no-repeat;background-size:50px 50px;height:100px;width:auto}.cld-loading.tree-branch{background-position:25px;background-size:50px 50px}.cld-syncing{background:url(../css/images/loading.svg) no-repeat 50%;display:inline-block;height:20px;margin-left:12px;padding:4px;width:30px}.cld-dashboard-placeholder{align-content:center;align-items:center;background-color:#eff5f8;display:flex;flex-direction:column;justify-content:center;min-height:120px}.cld-dashboard-placeholder h4{margin:12px 0 0}.cld-chart-stat{padding-bottom:2em}.cld-chart-stat canvas{max-height:100%;max-width:100%}.cld-progress-circular{display:block;height:160px;margin:2em .5em 2em 0;position:relative;width:160px}.cld-progress-circular .progressbar-text{color:#222;font-size:1em;font-weight:bolder;left:50%;margin:0;padding:0;position:absolute;text-align:center;text-transform:capitalize;top:50%;transform:translate(-50%,-50%);width:100%}.cld-progress-circular .progressbar-text h2{font-size:48px;line-height:1;margin:0 0 .15em}.cld-progress-box{align-items:center;display:flex;justify-content:flex-start;margin:0 0 16px;width:100%}.cld-progress-box-title{font-size:15px;line-height:1.4;margin:12px 0 16px}.cld-progress-box-line{display:block;height:5px;min-width:1px;transition:width 2s;width:0}.cld-progress-box-line-value{font-weight:700;padding:0 0 0 8px;width:100px}.cld-progress-line{background-color:#c6d1db;display:block;height:3px;position:relative;width:100%}.cld-progress-header{font-weight:bolder}.cld-progress-header-titles{display:flex;font-size:12px;justify-content:space-between;margin-top:5px}.cld-progress-header-titles-left{color:#3448c5}.cld-progress-header-titles-right{color:#c6d1db;font-weight:400}.cld-line-stat{margin-bottom:15px}.cld-pagenav{color:#555;line-height:2.4em;margin-top:5px}.cld-pagenav-text{margin:0 2em}.cld-delete{color:#dd2c00;cursor:pointer;float:right}.cld-apply-action{float:right}.cld-table thead tr th.cld-table-th{line-height:1.8em}.cld-asset .cld-input-on-off{display:inline-block}.cld-asset .cld-input-label{display:inline-block;margin-bottom:0}.cld-asset-edit{align-items:flex-end;display:flex}.cld-asset-edit-button.button.button-primary{padding:3px 14px 4px}.cld-asset-preview-label{font-weight:bolder;margin-right:10px;width:100%}.cld-asset-preview-input{margin-top:6px;width:100%}.cld-link-button{background-color:#3448c5;border-radius:4px;display:inline-block;font-size:11px;font-weight:700;margin:0;padding:5px 14px}.cld-link-button,.cld-link-button:focus,.cld-link-button:hover{color:#fff;text-decoration:none}.cld-tooltip{color:#999;font-size:12px;line-height:1.3em;margin:8px 0}.cld-tooltip .selected{color:rgba(0,0,1,.75)}.cld-notice-box{box-shadow:0 0 2px rgba(0,0,0,.1);margin-bottom:12px;margin-right:20px;position:relative}.cld-notice-box .cld-notice{padding:1rem 2.2rem .75rem 1.2rem}.cld-notice-box .cld-notice img.cld-ui-icon{height:100%}.cld-notice-box.is-dismissible{padding-right:38px}.cld-notice-box.has-icon{padding-left:38px}.cld-notice-box.is-created,.cld-notice-box.is-success,.cld-notice-box.is-updated{background-color:#ebf5ec;border-left:4px solid #42ad4f}.cld-notice-box.is-created .dashicons,.cld-notice-box.is-success .dashicons,.cld-notice-box.is-updated .dashicons{color:#2a0}.cld-notice-box.is-error{background-color:#f8e8e7;border-left:4px solid #cb3435}.cld-notice-box.is-error .dashicons{color:#dd2c00}.cld-notice-box.is-warning{background-color:#fff7e5;border-left:4px solid #f2ad4c}.cld-notice-box.is-warning .dashicons{color:#fd9d2c}.cld-notice-box.is-info{background-color:#e4f4f8;border-left:4px solid #2a95c3}.cld-notice-box.is-info .dashicons{color:#3273ab}.cld-notice-box.is-neutral{background-color:#fff;border-left:4px solid #ccd0d4}.cld-notice-box.is-neutral .dashicons{color:#90a0b3}.cld-notice-box.dismissed{overflow:hidden;transition:height .3s ease-out}.cld-notice-box .cld-ui-icon,.cld-notice-box .dashicons{left:19px;position:absolute;top:14px}.cld-connection-box{align-items:center;background-color:#303a47;border-radius:4px;color:#fff;display:flex;justify-content:space-around;max-width:500px;padding:20px 17px}.cld-connection-box h3{color:#fff;margin:0 0 5px}.cld-connection-box span{display:inline-block;padding:0 12px 0 0}.cld-connection-box .dashicons{font-size:30px;height:30px;margin:0;padding:0;width:30px}.cld-row{clear:both;display:flex;margin:0}.cld-row.align-center{align-items:center}@media only screen and (max-width:783px){.cld-row{flex-direction:column-reverse}}.cld-column{box-sizing:border-box;padding:0 0 0 13px;width:100%}@media only screen and (min-width:783px){.cld-column.column-45{width:45%}.cld-column.column-55{width:55%}.cld-column:last-child{padding-right:13px}}@media only screen and (max-width:783px){.cld-column{min-width:100%}.cld-column .cld-info-text{text-align:center}}@media only screen and (max-width:1200px){.cld-column.tabbed-content{display:none}.cld-column.tabbed-content.is-active{display:block}}.cld-column .cld-column{margin-right:16px;padding:0}.cld-column .cld-column:last-child{margin-left:auto;margin-right:0}.cld-center-column.cld-info-text{font-size:15px;font-weight:bolder;padding-left:2em}.cld-center-column.cld-info-text .description{font-size:12px;padding-top:8px}.cld-breakpoints-preview,.cld-image-preview,.cld-lazyload-preview,.cld-video-preview{border:1px solid #c6d1db;border-radius:4px;padding:9px}.cld-breakpoints-preview-wrapper,.cld-image-preview-wrapper,.cld-lazyload-preview-wrapper,.cld-video-preview-wrapper{position:relative}.cld-breakpoints-preview .cld-ui-title,.cld-image-preview .cld-ui-title,.cld-lazyload-preview .cld-ui-title,.cld-video-preview .cld-ui-title{font-weight:700;margin:5px 0 12px}.cld-breakpoints-preview img,.cld-image-preview img,.cld-lazyload-preview img,.cld-video-preview img{border-radius:4px;height:100%;width:100%}.cld.cld-ui-preview{max-width:322px}.cld-breakpoints-preview .cld-image-preview-wrapper:hover .preview-image,.cld-lazyload-preview .cld-image-preview-wrapper:hover .preview-image{opacity:0}.cld-breakpoints-preview .cld-image-preview-wrapper:hover .main-image,.cld-lazyload-preview .cld-image-preview-wrapper:hover .main-image{opacity:1}.cld-breakpoints-preview .cld-image-preview-wrapper:hover .main-image img,.cld-breakpoints-preview .cld-image-preview-wrapper:hover .main-image span,.cld-lazyload-preview .cld-image-preview-wrapper:hover .main-image img,.cld-lazyload-preview .cld-image-preview-wrapper:hover .main-image span{opacity:.4}.cld-breakpoints-preview .preview-image,.cld-lazyload-preview .preview-image{background-color:#222;border-radius:4px;bottom:0;box-shadow:2px -2px 3px rgba(0,0,0,.9);display:flex;left:0;position:absolute}.cld-breakpoints-preview .preview-image:hover,.cld-breakpoints-preview .preview-image:hover img,.cld-breakpoints-preview .preview-image:hover span,.cld-lazyload-preview .preview-image:hover,.cld-lazyload-preview .preview-image:hover img,.cld-lazyload-preview .preview-image:hover span{opacity:1!important}.cld-breakpoints-preview .preview-image.main-image,.cld-lazyload-preview .preview-image.main-image{box-shadow:none;position:relative}.cld-breakpoints-preview .preview-text,.cld-lazyload-preview .preview-text{background-color:#3448c5;color:#fff;padding:3px;position:absolute;right:0;text-shadow:0 0 3px #000;top:0}.cld-breakpoints-preview .global-transformations-url-link:hover,.cld-lazyload-preview .global-transformations-url-link:hover{color:#fff;text-decoration:none}.cld-lazyload-preview .progress-bar{background-color:#3448c5;height:2px;transition:width 1s;width:0}.cld-lazyload-preview .preview-image{background-color:#fff}.cld-lazyload-preview img{transition:opacity 1s}.cld-lazyload-preview .global-transformations-url-link{background-color:transparent}.cld-group .cld-group .cld-group{padding-left:4px}.cld-group .cld-group .cld-group hr{display:none}.cld-group-heading{display:flex;justify-content:space-between}.cld-group-heading h3{font-size:.9rem}.cld-group-heading h3 .description{font-size:.7rem;font-weight:400;margin-left:.7em}.cld-group .cld-ui-title-head{margin-bottom:1em}.cld-input{display:block;margin:0 0 23px;max-width:800px}.cld-input-label{display:block;margin-bottom:8px}.cld-input-label .cld-ui-title{font-size:14px;font-weight:700}.cld-input-label-link{color:#3448c5;font-size:12px;margin-left:8px}.cld-input-label-link:hover{color:#1e337f}.cld-input-radio-label{display:block}.cld-input-radio-label:not(:first-of-type){padding-top:8px}.cld-input .regular-number,.cld-input .regular-text{border:1px solid #d0d0d0;border-radius:3px;font-size:13px;padding:.1rem .5rem;width:100%}.cld-input .regular-number-small,.cld-input .regular-text-small{width:40%}.cld-input .regular-number{width:100px}.cld-input .regular-select{appearance:none;border:1px solid #d0d0d0;border-radius:3px;display:inline;font-size:13px;font-weight:600;min-width:150px;padding:2px 30px 2px 6px}.cld-input-on-off .description{color:inherit;font-size:13px;font-weight:600;margin:0}.cld-input-on-off .description.left{margin-left:0;margin-right:.4rem}.cld-input-on-off input[type=checkbox]~.spinner{background-size:12px 12px;float:none;height:12px;margin:2px;opacity:1;position:absolute;right:14px;top:0;transition:right .2s;visibility:visible;width:12px}.cld-input-on-off input[type=checkbox]:checked~.spinner{right:0}.cld-input-on-off-control{display:inline-block;height:16px;margin-right:.4rem;position:relative;width:30px}.cld-input-on-off-control input,.cld-input-on-off-control input:disabled{height:0;opacity:0;width:0}.cld-input-on-off-control-slider{background-color:#90a0b3;border-radius:10px;bottom:0;cursor:pointer;left:0;position:absolute;right:0;top:0;transition:background-color .3s}input:disabled+.cld-input-on-off-control-slider{opacity:.4}input:checked+.cld-input-on-off-control-slider{background-color:#3448c5!important}input:checked.partial+.cld-input-on-off-control-slider{background-color:#fd9d2c!important}input:checked.delete+.cld-input-on-off-control-slider{background-color:#dd2c00!important}.cld-input-on-off-control-slider:before{background-color:#fff;border-radius:50%;bottom:2px;content:"";display:block;height:12px;left:2px;position:absolute;transition:transform .2s;width:12px}input:checked+.cld-input-on-off-control-slider:before{transform:translateX(14px)}.mini input:checked+.cld-input-on-off-control-slider:before{transform:translateX(10px)}.cld-input-on-off-control.mini{height:10px;width:20px}.mini .cld-input-on-off-control-slider:before{bottom:1px;height:8px;left:1px;width:8px}.cld-input-icon-toggle{align-items:center;display:inline-flex}.cld-input-icon-toggle .description{margin:0 0 0 .4rem}.cld-input-icon-toggle .description.left{margin-left:0;margin-right:.4rem}.cld-input-icon-toggle-control{display:inline-block;position:relative}.cld-input-icon-toggle-control input{height:0;opacity:0;position:absolute;width:0}.cld-input-icon-toggle-control-slider .icon-on{display:none;visibility:hidden}.cld-input-icon-toggle-control-slider .icon-off,input:checked+.cld-input-icon-toggle-control-slider .icon-on{display:inline-block;visibility:visible}input:checked+.cld-input-icon-toggle-control-slider .icon-off{display:none;visibility:hidden}.cld-input-excluded-types div{display:flex}.cld-input-excluded-types .type{border:1px solid #c6d1db;border-radius:20px;display:flex;justify-content:space-between;margin-right:8px;min-width:50px;padding:3px 6px}.cld-input-excluded-types .dashicons{cursor:pointer}.cld-input-excluded-types .dashicons:hover{color:#dd2c00}.cld-input-tags{align-items:center;border:1px solid #d0d0d0;border-radius:3px;display:flex;flex-wrap:wrap;justify-content:flex-start;margin:5px 0 0;padding:2px 6px}.cld-input-tags-item{border:1px solid #c6d1db;border-radius:14px;box-shadow:inset -25px 0 0 #c6d1db;display:inline-flex;justify-content:space-between;margin:5px 6px 5px 0;opacity:1;overflow:hidden;padding:3px 4px 3px 8px;transition:opacity .25s,width .5s,margin .25s,padding .25s}.cld-input-tags-item-text{margin-right:8px}.cld-input-tags-item-delete{color:#90a0b3;cursor:pointer}.cld-input-tags-item-delete:hover{color:#3448c5}.cld-input-tags-item.pulse{animation:pulse-animation .5s infinite}.cld-input-tags-input{display:inline-block;min-width:100px;opacity:.4;overflow:visible;padding:10px 0;white-space:nowrap}.cld-input-tags-input:focus-visible{opacity:1;outline:none;padding:10px}@keyframes pulse-animation{0%{color:rgba(255,0,0,0)}50%{color:red}to{color:rgba(255,0,0,0)}}.cld-input-tags-input.pulse{animation:pulse-animation .5s infinite}.cld-input .prefixed{margin-left:6px;width:40%}.cld-input .suffixed{margin-right:6px;width:40%}.cld-input input::placeholder{color:#90a0b3}.cld-gallery-settings{box-sizing:border-box;display:flex;flex-wrap:wrap;padding:1rem 0;width:100%}@media only screen and (min-width:960px){.cld-gallery-settings{margin-left:-1rem;margin-right:-1rem}}.cld-gallery-settings__column{box-sizing:border-box;width:100%}@media only screen and (min-width:960px){.cld-gallery-settings__column{padding-left:1rem;padding-right:1rem;width:50%}}.components-base-control__field select{display:block;margin:1rem 0}.components-range-control__wrapper{margin:0!important}.components-range-control__root{flex-direction:row-reverse;margin:1rem 0}.components-input-control.components-number-control.components-range-control__number{margin-left:0!important;margin-right:16px}.components-panel{border:0!important}.components-panel__body:first-child{border-top:0!important}.components-panel__body:last-child{border-bottom:0!important}.components-textarea-control__input{display:block;margin:.5rem 0;width:100%}table .cld-input{margin-bottom:0}tr .file-size.small{color:#a8a8a8;font-size:.8em;font-style:italic;letter-spacing:.4px;margin-left:6px;margin-right:6px}td.tree{color:#212529;line-height:1.5;padding-top:0;position:relative}td.tree ul.striped>:nth-child(odd){background-color:#f6f7f7}td.tree ul.striped>:nth-child(2n){background-color:#fff}td.tree .success{color:#20b832}td+td.tree{padding-top:0}td.tree .cld-input{margin-bottom:0;vertical-align:text-bottom}td.tree .cld-search{font-size:.9em;height:26px;margin-right:12px;min-height:20px;padding:4px 6px;vertical-align:initial;width:300px}td.tree .file-size{color:#a8a8a8;font-size:.8em;font-style:italic;letter-spacing:.4px;margin-left:6px}td.tree .fa-folder,td.tree .fa-folder-open{color:#007bff}td.tree .fa-html5{color:#f21f10}td.tree ul{list-style:none;margin:0;padding-left:5px}td.tree ul li{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;margin-bottom:0;padding-bottom:5px;padding-left:25px;padding-top:5px;position:relative}td.tree ul li:before{height:1px;margin:auto;top:14px;width:20px}td.tree ul li:after,td.tree ul li:before{background-color:#666;content:"";left:0;position:absolute}td.tree ul li:after{bottom:0;height:100%;top:0;width:1px}td.tree ul li:after:nth-of-type(odd){background-color:#666}td.tree ul li:last-child:after{height:14px}td.tree ul a{cursor:pointer}td.tree ul a:hover{text-decoration:none}.cld-modal{align-content:center;align-items:center;background-color:rgba(0,0,0,.8);bottom:0;display:flex;flex-direction:row;flex-wrap:nowrap;left:0;opacity:0;position:fixed;right:0;top:0;transition:opacity .1s;visibility:hidden;z-index:10000}.cld-modal[data-cloudinary-only="1"] .modal-body,.cld-modal[data-cloudinary-only=true] .modal-body{display:none}.cld-modal[data-cloudinary-only="1"] [data-action=submit],.cld-modal[data-cloudinary-only=true] [data-action=submit]{cursor:not-allowed;opacity:.5;pointer-events:none}.cld-modal .warning{color:#dd2c00}.cld-modal .modal-header{margin-bottom:2em}.cld-modal .modal-uninstall{display:none}.cld-modal-box{background-color:#fff;box-shadow:0 2px 14px 0 rgba(0,0,0,.5);display:flex;flex-direction:column;font-size:10.5px;font-weight:600;justify-content:space-between;margin:0 auto;max-width:80%;padding:25px;position:relative;transition:height 1s;width:500px}.cld-modal-box .modal-footer{align-items:stretch;display:flex;flex-direction:row;justify-content:flex-end}.cld-modal-box .more{display:none}.cld-modal-box input[type=radio]:checked~.more{color:#32373c;display:block;line-height:2;margin-left:2em;margin-top:.5em}.cld-modal-box input[type=radio]:checked{border:1px solid #3448c5}.cld-modal-box input[type=radio]:checked:before{background-color:#3448c5;border-radius:50%;content:"";height:.5rem;line-height:1.14285714;margin:.1875rem;width:.5rem}@media screen and (max-width:782px){.cld-modal-box input[type=radio]:checked:before{height:.5625rem;line-height:.76190476;margin:.4375rem;vertical-align:middle;width:.5625rem}}.cld-modal-box input[type=radio]:focus{border-color:#3448c5;box-shadow:0 0 0 1px #3448c5;outline:2px solid transparent}.cld-modal-box input[type=checkbox]~label{margin-left:.25em}.cld-modal-box input[type=email]{width:100%}.cld-modal-box textarea{font-size:inherit;resize:none;width:100%}.cld-modal-box ul{margin-bottom:21px}.cld-modal-box p{font-size:10.5px;margin:0 0 12px}.cld-modal-box .button{background-color:#e9ecf9;border:0;color:#000;font-size:9.5px;font-weight:700;margin:22px 0 0 10px;padding:4px 14px}.cld-modal-box .button.button-primary{background-color:#3448c5;color:#fff}.cld-optimisation{display:flex;font-size:12px;justify-content:space-between;line-height:2}.cld-optimisation:first-child{margin-top:7px}.cld-optimisation-item{color:#3448c5;font-weight:600}.cld-optimisation-item:hover{color:#1e337f}.cld-optimisation-item-active,.cld-optimisation-item-not-active{font-size:10px;font-weight:700}.cld-optimisation-item-active .dashicons,.cld-optimisation-item-not-active .dashicons{font-size:12px;line-height:2}.cld-optimisation-item-active{color:#2a0}.cld-optimisation-item-not-active{color:#c6d1db}.cld-ui-sidebar{width:100%}@media only screen and (min-width:783px){.cld-ui-sidebar{max-width:500px;min-width:400px;width:auto}}.cld-ui-sidebar .cld-info-box,.cld-ui-sidebar .cld-panel,.cld-ui-sidebar .cld-panel-short{padding:14px 18px}.cld-ui-sidebar .cld-ui-header{margin-top:-1px;padding:6px 14px}.cld-ui-sidebar .cld-ui-header:first-child{margin-top:13px}.cld-ui-sidebar .cld-ui-title h2{font-size:14px}.cld-ui-sidebar .cld-info-box{align-items:flex-start;border:0;margin:0;padding:0}.cld-ui-sidebar .cld-info-box .cld-ui-body{padding-top:0}.cld-ui-sidebar .cld-info-box .button{align-self:flex-start;cursor:default;line-height:inherit;opacity:.5}.cld-ui-sidebar .cld-info-icon{background-color:transparent}.cld-ui-sidebar .cld-info-icon img{width:40px}.cld-ui-sidebar .extension-item{border-bottom:1px solid #e5e5e5;border-radius:0;margin-bottom:18px}.cld-ui-sidebar .extension-item:last-of-type{border-bottom:none;margin-bottom:0}.cld-plan{display:flex;flex-wrap:wrap}.cld-plan-item{display:flex;margin-bottom:25px;width:33%}.cld-plan-item img{margin-right:12px;width:24px}.cld-plan-item .description{font-size:12px}.cld-plan-item .cld-title{font-size:14px;font-weight:700}.cld-wizard{margin-left:auto;margin-right:auto;max-width:1100px}.cld-wizard-tabs{display:flex;flex-direction:row;font-size:15px;font-weight:600;width:50%}.cld-wizard-tabs-tab{align-items:center;display:flex;flex-direction:column;position:relative;width:33%}.cld-wizard-tabs-tab-count{align-items:center;background-color:rgba(52,72,197,.15);border:2px solid transparent;border-radius:50%;display:flex;height:32px;justify-content:center;width:32px}.active .cld-wizard-tabs-tab-count{border:2px solid #3448c5}.complete .cld-wizard-tabs-tab-count{background-color:#2a0;color:#2a0}.complete .cld-wizard-tabs-tab-count:before{color:#fff;content:"";font-family:dashicons;font-size:30px;width:25px}.cld-wizard-tabs-tab.active{color:#3448c5}.cld-wizard-tabs-tab:after{border:1px solid rgba(52,72,197,.15);content:"";left:75%;position:absolute;top:16px;width:50%}.cld-wizard-tabs-tab.complete:after{border-color:#2a0}.cld-wizard-tabs-tab:last-child:after{display:none}.cld-wizard-intro{text-align:center}.cld-wizard-intro-welcome{border:2px solid #c6d1db;border-radius:4px;box-shadow:0 2px 10px 0 rgba(0,0,0,.3);margin:27px auto;padding:19px;width:645px}.cld-wizard-intro-welcome img{width:100%}.cld-wizard-intro-welcome-info{background-color:#323a45;border-radius:0 0 4px 4px;color:#fff;display:flex;font-size:12px;margin:0 -19px -19px;padding:15px;text-align:left}.cld-wizard-intro-welcome-info img{margin-right:12px;width:25px}.cld-wizard-intro-welcome-info h2{color:#fff;font-size:14px}.cld-wizard-connect-connection{align-items:flex-end;display:flex;flex-direction:row;justify-content:flex-start}.cld-wizard-connect-connection-input{margin-right:10px;margin-top:20px;width:725px}.cld-wizard-connect-connection-input input{max-width:100%;width:100%}.cld-wizard-connect-status{align-items:center;border-radius:14px;display:none;font-weight:700;justify-content:space-between;padding:5px 11px}.cld-wizard-connect-status.active{display:inline-flex}.cld-wizard-connect-status.success{background-color:#ccefc9;color:#2a0}.cld-wizard-connect-status.error{background-color:#f9cecd;color:#dd2c00}.cld-wizard-connect-status.working{background-color:#eaecfa;color:#1e337f;padding:5px}.cld-wizard-connect-status.working .spinner{margin:0;visibility:visible}.cld-wizard-connect-help{align-items:center;display:flex;justify-content:space-between;margin-top:50px}.cld-wizard-lock{cursor:pointer;display:flex}.cld-wizard-lock.hidden{display:none;height:0;width:0}.cld-wizard-lock .dashicons{color:#3448c5;font-size:25px;line-height:.7;margin-right:10px}.cld-wizard-optimize-settings.disabled{opacity:.4}.cld-wizard-complete{background-image:url(../css/images/confetti.png);background-position:50%;background-repeat:no-repeat;background-size:cover;margin:-23px;padding:98px;text-align:center}.cld-wizard-complete.hidden{display:none}.cld-wizard-complete.active{align-items:center;display:flex;flex-direction:column;justify-content:center;margin:-23px -24px;text-align:center}.cld-wizard-complete.active *{max-width:450px}.cld-wizard-complete-icons{display:flex;justify-content:center}.cld-wizard-complete-icons img{margin:30px 10px;width:70px}.cld-wizard-complete-icons .dashicons{background-color:#f1f1f1;border:4px solid #fff;border-radius:6px;box-shadow:0 2px 8px 0 rgba(0,0,0,.3);font-size:50px;height:70px;line-height:1.4;width:70px}.cld-wizard-complete-icons .dashicons-cloudinary{color:#3448c5;font-size:65px;line-height:.9}.cld-wizard-complete .cld-ui-title{margin-top:30px}.cld-wizard-complete .cld-ui-title h3{font-size:14px}.cld-wizard .cld-panel-heading{align-items:center}.cld-wizard .cld-ui-title{text-transform:none}.cld-wizard .cld-submit{align-items:center;display:flex;justify-content:space-between}.cld-wizard .cld-submit .button{margin-left:10px}.cld-import{display:none;height:100%;padding:0 10px;position:absolute;right:0;width:200px}.cld-import-item{align-items:center;display:flex;margin-top:10px;min-height:20px;opacity:0;transition:opacity .5s;white-space:nowrap}.cld-import-item .spinner{margin:0 6px 0 0;visibility:visible;width:24px}.cld-import-item-id{display:block;overflow:hidden;text-overflow:ellipsis}.cld-import-process{background-color:#fff;background-position:50%;border-radius:40px;float:none;opacity:1;padding:5px;visibility:visible}.media-library{margin-right:0;transition:margin-right .2s}.tippy-box[data-theme~=cloudinary]{background-color:rgba(0,0,0,.8);color:#fff;font-size:.8em} \ No newline at end of file +.tippy-box[data-animation=fade][data-state=hidden]{opacity:0}[data-tippy-root]{max-width:calc(100vw - 10px)}.tippy-box{background-color:#333;border-radius:4px;color:#fff;font-size:14px;line-height:1.4;outline:0;position:relative;transition-property:transform,visibility,opacity}.tippy-box[data-placement^=top]>.tippy-arrow{bottom:0}.tippy-box[data-placement^=top]>.tippy-arrow:before{border-top-color:initial;border-width:8px 8px 0;bottom:-7px;left:0;transform-origin:center top}.tippy-box[data-placement^=bottom]>.tippy-arrow{top:0}.tippy-box[data-placement^=bottom]>.tippy-arrow:before{border-bottom-color:initial;border-width:0 8px 8px;left:0;top:-7px;transform-origin:center bottom}.tippy-box[data-placement^=left]>.tippy-arrow{right:0}.tippy-box[data-placement^=left]>.tippy-arrow:before{border-left-color:initial;border-width:8px 0 8px 8px;right:-7px;transform-origin:center left}.tippy-box[data-placement^=right]>.tippy-arrow{left:0}.tippy-box[data-placement^=right]>.tippy-arrow:before{border-right-color:initial;border-width:8px 8px 8px 0;left:-7px;transform-origin:center right}.tippy-box[data-inertia][data-state=visible]{transition-timing-function:cubic-bezier(.54,1.5,.38,1.11)}.tippy-arrow{color:#333;height:16px;width:16px}.tippy-arrow:before{border-color:transparent;border-style:solid;content:"";position:absolute}.tippy-content{padding:5px 9px;position:relative;z-index:1}@font-face{font-family:cloudinary;font-style:normal;font-weight:500;src:url(../css/fonts/cloudinary.d1a91c7f695026fd20974570349bc540.eot);src:url(../css/fonts/cloudinary.d1a91c7f695026fd20974570349bc540.eot#iefix) format("embedded-opentype"),url(../css/fonts/cloudinary.3b839e5145ad58edde0191367a5a96f0.woff) format("woff"),url(../css/fonts/cloudinary.d8de6736f15e12f71ac22a2d374002e5.ttf) format("truetype"),url(../css/images/cloudinary.svg#cloudinary) format("svg")}.dashicons-cloudinary{speak:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-style:normal;font-variant:normal;font-weight:400;line-height:1;text-transform:none}.dashicons-cloudinary:before{content:"";font-family:cloudinary,monospace!important}.dashicons-cloudinary-media:before{content:"";font-family:cloudinary,monospace!important}.dashicons-cloudinary-dam:before{content:"";font-family:cloudinary,monospace!important}.dashicons-cloudinary.success{color:#558b2f}.dashicons-cloudinary.error{color:#dd2c00}.dashicons-cloudinary.error:before{content:""}.dashicons-cloudinary.uploading{color:#fd9d2c}.dashicons-cloudinary.uploading:before{content:""}.dashicons-cloudinary.info{color:#0071ba}.dashicons-cloudinary.downloading:before{content:""}.dashicons-cloudinary.syncing:before{content:""}.dashicons-cloudinary.media:before{content:""}.dashicons-cloudinary.dam:before{content:""}.column-cld_status{width:5.5em}.column-cld_status .dashicons-cloudinary,.column-cld_status .dashicons-cloudinary-dam{display:inline-block}.column-cld_status .dashicons-cloudinary-dam:before,.column-cld_status .dashicons-cloudinary:before{font-size:1.8rem}.form-field .error-notice,.form-table .error-notice{color:#dd2c00;display:none}.form-field input.cld-field:invalid,.form-table input.cld-field:invalid{border-color:#dd2c00}.form-field input.cld-field:invalid+.error-notice,.form-table input.cld-field:invalid+.error-notice{display:inline-block}.cloudinary-welcome{background-image:url(../css/images/logo.svg);background-position:top 12px right 20px;background-repeat:no-repeat;background-size:153px}.cloudinary-stats{display:inline-block;margin-left:25px}.cloudinary-stat{cursor:help}.cloudinary-percent{color:#0071ba;font-size:.8em;vertical-align:top}.settings-image{max-width:100%;padding-top:5px}.settings-tabs>li{display:inline-block}.settings-tabs>li a{padding:.6em}.settings-tabs>li a.active{background-color:#fff}.settings-tab-section{max-width:1030px;padding:20px 0 0;position:relative}.settings-tab-section.cloudinary-welcome .settings-tab-section-fields-dashboard{align-content:flex-start;align-items:flex-start;display:flex;margin-top:40px}.settings-tab-section.cloudinary-welcome .settings-tab-section-fields-dashboard-description{margin:0 auto 0 0;width:55%}.settings-tab-section.cloudinary-welcome .settings-tab-section-fields-dashboard-content{margin:0 auto;width:35%}.settings-tab-section.cloudinary-welcome .settings-tab-section-fields-dashboard-content .dashicons{color:#9ea3a8}.settings-tab-section.cloudinary-welcome .settings-tab-section-card{margin-top:0}.settings-tab-section-fields .field-heading th{color:#23282d;display:block;font-size:1.1em;margin:1em 0;width:auto}.settings-tab-section-fields .field-heading td{display:none;visibility:hidden}.settings-tab-section-fields .regular-textarea{height:60px;width:100%}.settings-tab-section-fields .dashicons{text-decoration:none;vertical-align:middle}.settings-tab-section-fields a .dashicons{color:#5f5f5f}.settings-tab-section-fields-dashboard-error{color:#5f5f5f;font-size:1.2em}.settings-tab-section-fields-dashboard-error.expanded{margin-bottom:25px;padding-top:40px}.settings-tab-section-fields-dashboard-error .dashicons{color:#ac0000}.settings-tab-section-fields-dashboard-error .button{font-size:1.1em;height:40px;line-height:40px;padding-left:40px;padding-right:40px}.settings-tab-section-fields-dashboard-success{color:#23282d;font-size:1.2em}.settings-tab-section-fields-dashboard-success.expanded{margin-bottom:25px;padding-top:40px}.settings-tab-section-fields-dashboard-success .dashicons{color:#4fb651}.settings-tab-section-fields-dashboard-success .button{font-size:1.1em;height:40px;line-height:40px;padding-left:40px;padding-right:40px}.settings-tab-section-fields-dashboard-success .description{color:#5f5f5f;font-weight:400;margin-top:12px}.settings-tab-section-card{background-color:#fff;border:1px solid #e5e5e5;box-shadow:0 1px 1px 0 rgba(0,0,0,.07);box-sizing:border-box;margin-top:12px;padding:20px 23px}.settings-tab-section-card .dashicons{font-size:1.4em}.settings-tab-section-card h2{font-size:1.8em;font-weight:400;margin-top:0}.settings-tab-section-card.pull-right{float:right;padding:12px;position:relative;width:450px;z-index:10}.settings-tab-section-card.pull-right img.settings-image{border:1px solid #979797;box-shadow:0 2px 4px 0 rgba(0,0,0,.5);margin-top:12px}.settings-tab-section-card.pull-right h3,.settings-tab-section-card.pull-right h4{margin-top:0}.settings-tab-section .field-row-cloudinary_url,.settings-tab-section .field-row-signup{display:block}.settings-tab-section .field-row-cloudinary_url td,.settings-tab-section .field-row-cloudinary_url th,.settings-tab-section .field-row-signup td,.settings-tab-section .field-row-signup th{display:block;padding:10px 0 0;width:auto}.settings-tab-section .field-row-cloudinary_url td .sign-up,.settings-tab-section .field-row-cloudinary_url th .sign-up,.settings-tab-section .field-row-signup td .sign-up,.settings-tab-section .field-row-signup th .sign-up{vertical-align:baseline}.settings-tab-section.connect .form-table{display:inline-block;max-width:580px;width:auto}.settings-valid{color:#558b2f;font-size:30px}.settings-valid-field{border-color:#558b2f!important}.settings-invalid-field{border-color:#dd2c00!important}.settings-alert{box-shadow:0 1px 1px rgba(0,0,0,.04);display:inline-block;padding:5px 7px}.settings-alert-info{background-color:#e9faff;border:1px solid #ccd0d4;border-left:4px solid #00a0d2}.settings-alert-warning{background-color:#fff5e9;border:1px solid #f6e7b6;border-left:4px solid #e3be38}.settings-alert-error{background-color:#ffe9e9;border:1px solid #d4cccc;border-left:4px solid #d20000}.field-radio input[type=radio].cld-field{margin:0 5px 0 0}.field-radio label{margin-right:10px}.settings-tab-section h2{margin:0}.cloudinary-collapsible{background-color:#fff;border:1px solid #ccd0d4;box-shadow:0 1px 1px rgba(0,0,0,.04);box-sizing:border-box;margin:20px 0;padding:10px;width:95%}.cloudinary-collapsible__toggle{cursor:pointer;display:flex}.cloudinary-collapsible__toggle h2{margin:0!important}.cloudinary-collapsible__toggle button{background-color:inherit;border:none;cursor:pointer;margin:0 0 0 auto;padding:0;width:auto}.cloudinary-collapsible__toggle .cld-ui-icon{margin-right:6px;width:24px}.cloudinary-collapsible__content .cld-ui-title{margin:3em 0 1em}.cloudinary-collapsible__content .cld-more-details{margin-top:2em}.sync .spinner{display:inline-block;float:none;margin:0 5px 0 0;visibility:visible}.sync-media,.sync-media-progress{display:none}.sync-media-progress-outer{background-color:#e5e5e5;height:20px;margin:20px 0 10px;position:relative;width:500px}.sync-media-progress-outer .progress-bar{background-color:#558b2f;height:20px;transition:width .25s;width:0}.sync-media-progress-notice{color:#dd2c00}.sync-media-resource{display:inline-block;width:100px}.sync-media-error{color:#dd2c00}.sync-count{font-weight:700}.sync-details{margin-top:10px}.sync .button.start-sync,.sync .button.stop-sync{display:none;padding:0 16px}.sync .button.start-sync .dashicons,.sync .button.stop-sync .dashicons{line-height:2.2}.sync .progress-text{display:inline-block;font-weight:700;padding:12px 4px 12px 12px}.sync .completed{display:none;max-width:300px}.sync-status-disabled{color:#dd2c00}.sync-status-enabled{color:#558b2f}.sync-status-button.button{vertical-align:baseline}.cloudinary-widget{height:100%}.cloudinary-widget-wrapper{background-image:url(data:image/svg+xml;base64,PHN2ZyBjbGFzcz0ic3Bpbm5lciIgdmlld0JveD0iLTQgLTQgMTUxIDEwMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICAgIDxzdHlsZSB0eXBlPSJ0ZXh0L2NzcyI+PCFbQ0RBVEFbCiAgICAgIEBrZXlmcmFtZXMgY29sb3JzIHsKICAgICAgICAwJSB7IHN0cm9rZTogIzAwNzhGRjsgfQogICAgICAgICAgNTAlIHsgc3Ryb2tlOiAjMGUyZjVhOyB9CiAgICAgICAgICAxMDAlIHsgc3Ryb2tlOiAjMDA3OEZGOyB9CiAgICAgIH0KCiAgICAgIEBrZXlmcmFtZXMgZGFzaCB7CiAgICAgICAwJSB7IHN0cm9rZS1kYXNob2Zmc2V0OiA1NjA7IH0KICAgICAgIDUwJSB7CiAgICAgICAgICBzdHJva2UtZGFzaG9mZnNldDogMDsKICAgICAgIH0KICAgICAgIDEwMCUgeyAgIHN0cm9rZS1kYXNob2Zmc2V0OiA1NjA7IH0KICAgICAgfQogICAgICBALXdlYmtpdC1rZXlmcmFtZXMgY29sb3JzIHsKICAgICAgICAwJSB7IHN0cm9rZTogIzAwNzhmZjsgfQogICAgICAgICAgNTAlIHsgc3Ryb2tlOiAjMGUyZjVhOyB9CiAgICAgICAgICAxMDAlIHsgc3Ryb2tlOiAjMDA3OGZmOyB9CiAgICAgIH0KCiAgICAgIEAtd2Via2l0LWtleWZyYW1lcyBkYXNoIHsKICAgICAgIDAlIHsgc3Ryb2tlLWRhc2hvZmZzZXQ6IDU2MDsgfQogICAgICAgNTAlIHsKICAgICAgICAgIHN0cm9rZS1kYXNob2Zmc2V0OiAwOwogICAgICAgfQogICAgICAgMTAwJSB7ICAgc3Ryb2tlLWRhc2hvZmZzZXQ6IDU2MDsKICAgICAgIH0KICAgICAgfQogICAgICAucGF0aCB7CiAgICAgICAgc3Ryb2tlLWRhc2hhcnJheTogMjgwOwogICAgICAgIHN0cm9rZS1kYXNob2Zmc2V0OiAwOwogICAgICAgIHRyYW5zZm9ybS1vcmlnaW46IGNlbnRlcjsKICAgICAgICAtd2Via2l0LWFuaW1hdGlvbjoKICAgICAgICAgIGRhc2ggMnMgZWFzZS1pbi1vdXQgaW5maW5pdGUsIGNvbG9ycyA4cyBlYXNlLWluLW91dCBpbmZpbml0ZTsKICAgICAgICBhbmltYXRpb246CiAgICAgICAgICBkYXNoIDJzIGVhc2UtaW4tb3V0IGluZmluaXRlLCBjb2xvcnMgOHMgZWFzZS1pbi1vdXQgaW5maW5pdGU7CiAgICAgIH0KICAgIF1dPjwvc3R5bGU+CiAgPHBhdGggY2xhc3M9InBhdGgiIGQ9Ik0xMjEuNjYzIDkwLjYzOGMtMS43OTYgMC05OS4zMy0uNDk4LTEwMS40NzQtMS40NzhDOC42ODUgODMuODc3IDEuMjUgNzIuMTk2IDEuMjUgNTkuMzk2YzAtMTYuNjU2IDEyLjc5Ny0zMC42MSAyOS4wNTItMzIuMzIzIDcuNDktMTUuNzA2IDIzLjE4Ni0yNS43MDcgNDAuNzE0LTI1LjcwNyAyMC45OCAwIDM5LjIxNSAxNC43NTIgNDMuOTQ1IDM0LjkwNyAxNS4wOS4yNDUgMjcuMjkgMTIuNjMgMjcuMjkgMjcuODIyIDAgMTEuOTY4LTcuNzM4IDIyLjU1LTE5LjI1NiAyNi4zMyIgc3Ryb2tlLXdpZHRoPSI5IiBzdHJva2UtbGluZWNhcD0icm91bmQiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPgo8L3N2Zz4K);background-position:50%;background-repeat:no-repeat;background-size:150px;height:100%;overflow:hidden}.global-transformations-preview{max-width:600px;position:relative}.global-transformations-spinner{display:none}.global-transformations-button.button-primary{display:none;position:absolute;z-index:100}.global-transformations-url{margin-bottom:5px;margin-top:5px}.global-transformations-url-transformation{color:#51a3ff;max-width:100px;overflow:hidden;text-overflow:ellipsis}.global-transformations-url-file{color:#f2d864}.global-transformations-url-link{background-color:#262c35;border-radius:6px;color:#fff;display:block;overflow:hidden;padding:16px;text-decoration:none;text-overflow:ellipsis}.global-transformations-url-link:hover{color:#888;text-decoration:underline}.cld-tax-order-list-item{background-color:#fff;border:1px solid #efefef;margin:0 0 -1px;padding:4px}.cld-tax-order-list-item.no-items{color:#888;display:none;text-align:center}.cld-tax-order-list-item.no-items:last-child{display:block}.cld-tax-order-list-item.ui-sortable-helper{box-shadow:0 2px 5px rgba(0,0,0,.2)}.cld-tax-order-list-item-placeholder{background-color:#efefef;height:45px;margin:0}.cld-tax-order-list-item-handle{color:#999;cursor:grab;margin-right:4px}.cld-tax-order-list-type{display:inline-block;margin-right:8px}.cld-tax-order-list-type input{margin-right:4px!important}.cloudinary-media-library{margin-left:-20px;position:relative}@media screen and (max-width:782px){.cloudinary-media-library{margin-left:-10px}}.cld-ui-suffix{background-color:#e8e8e8;border-radius:4px;color:#999;display:inline-block;font-family:Courier New,Courier,monospace;font-size:12px;font-weight:700;line-height:1.7em;margin-left:13px;padding:4px 6px}.cld-ui-preview .cld-ui-header{margin-top:-1px}.cld-ui-preview .cld-ui-header:first-child{margin-top:13px}.cld-ui-collapse{align-self:center;cursor:pointer;padding:0 .45rem}.cld-ui-title{font-size:12px}.cld-ui-title h2{font-size:15px;font-weight:700;margin:6px 0 1px}.cld-ui-title.collapsible{cursor:pointer}.cld-ui-conditional .closed,.cld-ui-wrap .closed{display:none}.cld-ui-wrap .description{color:rgba(0,0,1,.5);font-size:12px}.cld-ui-wrap .button:not(.wp-color-result){background-color:#3448c5;border:0;border-radius:4px;color:#fff;display:inline-block;font-size:11px;font-weight:700;margin:0;min-height:28px;padding:5px 14px;text-decoration:none}.cld-ui-wrap .button:active,.cld-ui-wrap .button:hover{background-color:#1e337f}.cld-ui-wrap .button:focus{background-color:#3448c5;border-color:#3448c5;box-shadow:0 0 0 1px #fff,0 0 0 3px #3448c5}.cld-ui-wrap .button.button-small,.cld-ui-wrap .button.button-small:hover{font-size:11px;line-height:2.18181818;min-height:26px;padding:0 8px}.cld-ui-wrap .button.wp-color-result{border-color:#d0d0d0}.cld-ui-error{color:#dd2c00}.cld-referrer-link{display:inline-block;margin:12px 0 0;text-decoration:none}.cld-referrer-link span{margin-right:5px}.cld-settings{margin-left:-20px}.cld-page-tabs{background-color:#fff;border-bottom:1px solid #e5e5e5;display:none;flex-wrap:nowrap;justify-content:center;margin:-20px -18px 20px;padding:0!important}@media only screen and (max-width:1200px){.cld-page-tabs{display:flex}}.cld-page-tabs-tab{list-style:none;margin-bottom:0;text-indent:0;width:100%}.cld-page-tabs-tab button{background:transparent;border:0;color:#000001;cursor:pointer;display:block;font-weight:500;padding:1rem 2rem;text-align:center;white-space:nowrap;width:100%}.cld-page-tabs-tab button.is-active{border-bottom:2px solid #3448c5;color:#3448c5}.cld-page-header{align-items:center;background-color:#3448c5;display:flex;flex-direction:column;justify-content:space-between;margin-bottom:0;padding:16px}@media only screen and (min-width:783px){.cld-page-header{flex-direction:row}}.cld-page-header img{width:150px}.cld-page-header-button{background-color:#1e337f;border-radius:4px;color:#fff;display:inline-block;font-weight:700;margin:1em 0 0 9px;padding:5px 14px;text-decoration:none}@media only screen and (min-width:783px){.cld-page-header-button{margin-top:0}}.cld-page-header-button:focus,.cld-page-header-button:hover{color:#fff;text-decoration:none}.cld-page-header-logo{align-items:center;display:flex}.cld-page-header-logo .version{color:#fff;font-size:10px;margin-left:12px}.cld-page-header p{font-size:11px;margin:0}.cld-info-box,.cld-panel,.cld-panel-short{background-color:#fff;border:1px solid #c6d1db;margin-top:13px;padding:23px 24px}.cld-panel.full-width,.full-width.cld-info-box,.full-width.cld-panel-short{max-width:100%}.cld-panel.has-heading,.has-heading.cld-info-box,.has-heading.cld-panel-short{border-top:0;margin-top:0}.cld-panel-heading{display:flex;justify-content:space-between;padding:19px 23px;position:relative}.cld-panel-heading.full-width{max-width:100%}.cld-panel-heading img{margin-right:.6rem}.cld-panel-heading.collapsible{cursor:pointer;padding-right:1rem}.cld-panel-inner{background-color:hsla(0,0%,86.3%,.2);border:1px solid #e5e5e5;margin:1em 0;padding:1.3rem}.cld-panel-inner h2{color:#3273ab}.cld-info-box hr,.cld-panel-short hr,.cld-panel hr{border-top:1px solid #e5e5e5;clear:both;margin:19px 0 20px}.cld-info-box ul,.cld-panel-short ul,.cld-panel ul{list-style:initial;padding:0 3em}.cld-info-box .stat-boxes,.cld-panel-short .stat-boxes,.cld-panel .stat-boxes{border:1px solid #e5e5e5;font-size:1.2em}.cld-info-box .stat-boxes .box,.cld-panel-short .stat-boxes .box,.cld-panel .stat-boxes .box{border-bottom:1px solid #e5e5e5;padding:2rem;text-align:center}.cld-info-box .stat-boxes .box:last-of-type,.cld-panel-short .stat-boxes .box:last-of-type,.cld-panel .stat-boxes .box:last-of-type{border-bottom:none}.cld-info-box .stat-boxes .box .cld-ui-icon,.cld-panel-short .stat-boxes .box .cld-ui-icon,.cld-panel .stat-boxes .box .cld-ui-icon{height:35px;width:35px}.cld-info-box .stat-boxes .icon,.cld-panel-short .stat-boxes .icon,.cld-panel .stat-boxes .icon{height:50px;margin-right:.5em;width:50px}.cld-info-box .stat-boxes h3,.cld-panel-short .stat-boxes h3,.cld-panel .stat-boxes h3{margin-bottom:1.5rem;margin-top:2.4rem}.cld-info-box .stat-boxes .limit,.cld-panel-short .stat-boxes .limit,.cld-panel .stat-boxes .limit{font-size:2em;font-weight:700;margin-right:.5em;white-space:nowrap}.cld-info-box .stat-boxes .usage,.cld-panel-short .stat-boxes .usage,.cld-panel .stat-boxes .usage{color:#3273ab;font-size:1.5em;font-weight:400}@media only screen and (min-width:783px){.cld-info-box .stat-boxes,.cld-panel-short .stat-boxes,.cld-panel .stat-boxes{display:flex;flex-wrap:nowrap;font-size:1em}.cld-info-box .stat-boxes .box,.cld-panel-short .stat-boxes .box,.cld-panel .stat-boxes .box{border-bottom:none;border-right:1px solid #e5e5e5;flex-grow:1}.cld-info-box .stat-boxes .box:last-of-type,.cld-panel-short .stat-boxes .box:last-of-type,.cld-panel .stat-boxes .box:last-of-type{border-right:none}}@media only screen and (min-width:1200px){.cld-info-box .stat-boxes,.cld-panel-short .stat-boxes,.cld-panel .stat-boxes{font-size:1.2em}}.cld-info-box .img-connection-string,.cld-panel-short .img-connection-string,.cld-panel .img-connection-string{max-width:607px;width:100%}.cld-info-box .media-status-box,.cld-info-box .stat-boxes,.cld-panel-short .media-status-box,.cld-panel-short .stat-boxes,.cld-panel .media-status-box,.cld-panel .stat-boxes{border:1px solid #e5e5e5}.cld-info-box .media-status-box,.cld-panel-short .media-status-box,.cld-panel .media-status-box{padding:2rem;text-align:center}.cld-info-box .media-status-box .status,.cld-panel-short .media-status-box .status,.cld-panel .media-status-box .status{font-size:2rem;font-weight:700;margin-right:.5em}.cld-info-box .media-status-box .cld-ui-icon,.cld-panel-short .media-status-box .cld-ui-icon,.cld-panel .media-status-box .cld-ui-icon{height:35px;width:35px}.cld-info-box .notification,.cld-panel-short .notification,.cld-panel .notification{display:inline-flex;font-weight:700;padding:1.5rem}.cld-info-box .notification-success,.cld-panel-short .notification-success,.cld-panel .notification-success{background-color:rgba(32,184,50,.2);border:2px solid #20b832}.cld-info-box .notification-success:before,.cld-panel-short .notification-success:before,.cld-panel .notification-success:before{color:#20b832}.cld-info-box .notification-syncing,.cld-panel-short .notification-syncing,.cld-panel .notification-syncing{background-color:rgba(50,115,171,.2);border:2px solid #3273ab;color:#444;text-decoration:none}.cld-info-box .notification-syncing:before,.cld-panel-short .notification-syncing:before,.cld-panel .notification-syncing:before{-webkit-animation:spin 1s infinite running;-moz-animation:spin 1s linear infinite;animation:spin 1s linear infinite;color:#3273ab}@keyframes spin{to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}.cld-info-box .notification:before,.cld-panel-short .notification:before,.cld-panel .notification:before{margin-right:.5em}.cld-info-box .help-wrap,.cld-panel-short .help-wrap,.cld-panel .help-wrap{align-items:stretch;display:flex;flex-direction:row;flex-grow:1;justify-content:flex-start}.cld-info-box .help-wrap .help-box .large-button,.cld-panel-short .help-wrap .help-box .large-button,.cld-panel .help-wrap .help-box .large-button{background:#fff;border-radius:4px;box-shadow:0 1px 8px 0 rgba(0,0,0,.3);color:initial;display:block;height:100%;text-decoration:none}.cld-info-box .help-wrap .help-box .large-button:hover,.cld-panel-short .help-wrap .help-box .large-button:hover,.cld-panel .help-wrap .help-box .large-button:hover{background-color:#eaecfa;box-shadow:0 1px 8px 0 rgba(0,0,0,.5)}.cld-info-box .help-wrap .help-box .large-button .cld-ui-wrap,.cld-panel-short .help-wrap .help-box .large-button .cld-ui-wrap,.cld-panel .help-wrap .help-box .large-button .cld-ui-wrap{padding-bottom:.5em}.cld-info-box .help-wrap .help-box img,.cld-panel-short .help-wrap .help-box img,.cld-panel .help-wrap .help-box img{border-radius:4px 4px 0 0;width:100%}.cld-info-box .help-wrap .help-box div,.cld-info-box .help-wrap .help-box h4,.cld-panel-short .help-wrap .help-box div,.cld-panel-short .help-wrap .help-box h4,.cld-panel .help-wrap .help-box div,.cld-panel .help-wrap .help-box h4{padding:0 12px}.cld-panel-short{display:inline-block;min-width:270px;width:auto}.cld-info-box{align-items:stretch;border-radius:4px;display:flex;margin:0 0 19px;max-width:500px;padding:0}@media only screen and (min-width:783px){.cld-info-box{flex-direction:row}}.cld-info-box .cld-ui-title h2{font-size:15px;margin:0 0 6px}.cld-info-box .cld-info-icon{background-color:#eaecfa;border-radius:4px 0 0 4px;display:flex;justify-content:center;text-align:center;vertical-align:center;width:49px}.cld-info-box .cld-info-icon img{width:24px}.cld-info-box a.button,.cld-info-box img{align-self:center}.cld-info-box .cld-ui-body{display:inline-block;font-size:12px;line-height:normal;margin:0 auto;padding:12px 9px;width:100%}.cld-info-box-text{color:rgba(0,0,1,.5);font-size:12px}.cld-submit,.cld-switch-cloud{background-color:#fff;border:1px solid #c6d1db;border-top:0;padding:1.2rem 1.75rem}.cld-panel.closed+.cld-submit,.cld-panel.closed+.cld-switch-cloud,.closed.cld-info-box+.cld-submit,.closed.cld-info-box+.cld-switch-cloud,.closed.cld-panel-short+.cld-submit,.closed.cld-panel-short+.cld-switch-cloud{display:none}.cld-stat-percent{align-items:center;display:flex;justify-content:flex-start;line-height:1}.cld-stat-percent h2{color:#54c8db;font-size:48px;margin:0 12px 0 0}.cld-stat-percent-text{font-weight:700}.cld-stat-legend{display:flex;font-weight:700;margin:0 0 16px 12px;min-width:200px}.cld-stat-legend-dot{border-radius:50%;display:inline-block;height:20px;margin-right:6px;width:20px}.cld-stat-legend-dot.blue-dot{background-color:#2e49cd}.cld-stat-legend-dot.aqua-dot{background-color:#54c8db}.cld-stat-legend-dot.red-dot{background-color:#e12600}.cld-stat-text{font-weight:700;margin:.75em 0}.cld-loading{background-image:url(data:image/svg+xml;base64,PHN2ZyBjbGFzcz0ic3Bpbm5lciIgdmlld0JveD0iLTQgLTQgMTUxIDEwMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICAgIDxzdHlsZSB0eXBlPSJ0ZXh0L2NzcyI+PCFbQ0RBVEFbCiAgICAgIEBrZXlmcmFtZXMgY29sb3JzIHsKICAgICAgICAwJSB7IHN0cm9rZTogIzAwNzhGRjsgfQogICAgICAgICAgNTAlIHsgc3Ryb2tlOiAjMGUyZjVhOyB9CiAgICAgICAgICAxMDAlIHsgc3Ryb2tlOiAjMDA3OEZGOyB9CiAgICAgIH0KCiAgICAgIEBrZXlmcmFtZXMgZGFzaCB7CiAgICAgICAwJSB7IHN0cm9rZS1kYXNob2Zmc2V0OiA1NjA7IH0KICAgICAgIDUwJSB7CiAgICAgICAgICBzdHJva2UtZGFzaG9mZnNldDogMDsKICAgICAgIH0KICAgICAgIDEwMCUgeyAgIHN0cm9rZS1kYXNob2Zmc2V0OiA1NjA7IH0KICAgICAgfQogICAgICBALXdlYmtpdC1rZXlmcmFtZXMgY29sb3JzIHsKICAgICAgICAwJSB7IHN0cm9rZTogIzAwNzhmZjsgfQogICAgICAgICAgNTAlIHsgc3Ryb2tlOiAjMGUyZjVhOyB9CiAgICAgICAgICAxMDAlIHsgc3Ryb2tlOiAjMDA3OGZmOyB9CiAgICAgIH0KCiAgICAgIEAtd2Via2l0LWtleWZyYW1lcyBkYXNoIHsKICAgICAgIDAlIHsgc3Ryb2tlLWRhc2hvZmZzZXQ6IDU2MDsgfQogICAgICAgNTAlIHsKICAgICAgICAgIHN0cm9rZS1kYXNob2Zmc2V0OiAwOwogICAgICAgfQogICAgICAgMTAwJSB7ICAgc3Ryb2tlLWRhc2hvZmZzZXQ6IDU2MDsKICAgICAgIH0KICAgICAgfQogICAgICAucGF0aCB7CiAgICAgICAgc3Ryb2tlLWRhc2hhcnJheTogMjgwOwogICAgICAgIHN0cm9rZS1kYXNob2Zmc2V0OiAwOwogICAgICAgIHRyYW5zZm9ybS1vcmlnaW46IGNlbnRlcjsKICAgICAgICAtd2Via2l0LWFuaW1hdGlvbjoKICAgICAgICAgIGRhc2ggMnMgZWFzZS1pbi1vdXQgaW5maW5pdGUsIGNvbG9ycyA4cyBlYXNlLWluLW91dCBpbmZpbml0ZTsKICAgICAgICBhbmltYXRpb246CiAgICAgICAgICBkYXNoIDJzIGVhc2UtaW4tb3V0IGluZmluaXRlLCBjb2xvcnMgOHMgZWFzZS1pbi1vdXQgaW5maW5pdGU7CiAgICAgIH0KICAgIF1dPjwvc3R5bGU+CiAgPHBhdGggY2xhc3M9InBhdGgiIGQ9Ik0xMjEuNjYzIDkwLjYzOGMtMS43OTYgMC05OS4zMy0uNDk4LTEwMS40NzQtMS40NzhDOC42ODUgODMuODc3IDEuMjUgNzIuMTk2IDEuMjUgNTkuMzk2YzAtMTYuNjU2IDEyLjc5Ny0zMC42MSAyOS4wNTItMzIuMzIzIDcuNDktMTUuNzA2IDIzLjE4Ni0yNS43MDcgNDAuNzE0LTI1LjcwNyAyMC45OCAwIDM5LjIxNSAxNC43NTIgNDMuOTQ1IDM0LjkwNyAxNS4wOS4yNDUgMjcuMjkgMTIuNjMgMjcuMjkgMjcuODIyIDAgMTEuOTY4LTcuNzM4IDIyLjU1LTE5LjI1NiAyNi4zMyIgc3Ryb2tlLXdpZHRoPSI5IiBzdHJva2UtbGluZWNhcD0icm91bmQiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPgo8L3N2Zz4K);background-position:50%;background-repeat:no-repeat;background-size:50px 50px;height:100px;width:auto}.cld-loading.tree-branch{background-position:25px;background-size:50px 50px}.cld-syncing{background:url(../css/images/loading.svg) no-repeat 50%;display:inline-block;height:20px;margin-left:12px;padding:4px;width:30px}.cld-dashboard-placeholder{align-content:center;align-items:center;background-color:#eff5f8;display:flex;flex-direction:column;justify-content:center;min-height:120px}.cld-dashboard-placeholder h4{margin:12px 0 0}.cld-chart-stat{padding-bottom:2em}.cld-chart-stat canvas{max-height:100%;max-width:100%}.cld-progress-circular{display:block;height:160px;margin:2em .5em 2em 0;position:relative;width:160px}.cld-progress-circular .progressbar-text{color:#222;font-size:1em;font-weight:bolder;left:50%;margin:0;padding:0;position:absolute;text-align:center;text-transform:capitalize;top:50%;transform:translate(-50%,-50%);width:100%}.cld-progress-circular .progressbar-text h2{font-size:48px;line-height:1;margin:0 0 .15em}.cld-progress-box{align-items:center;display:flex;justify-content:flex-start;margin:0 0 16px;width:100%}.cld-progress-box-title{font-size:15px;line-height:1.4;margin:12px 0 16px}.cld-progress-box-line{display:block;height:5px;min-width:1px;transition:width 2s;width:0}.cld-progress-box-line-value{font-weight:700;padding:0 0 0 8px;width:100px}.cld-progress-line{background-color:#c6d1db;display:block;height:3px;position:relative;width:100%}.cld-progress-header{font-weight:bolder}.cld-progress-header-titles{display:flex;font-size:12px;justify-content:space-between;margin-top:5px}.cld-progress-header-titles-left{color:#3448c5}.cld-progress-header-titles-right{color:#c6d1db;font-weight:400}.cld-line-stat{margin-bottom:15px}.cld-pagenav{color:#555;line-height:2.4em;margin-top:5px}.cld-pagenav-text{margin:0 2em}.cld-delete{color:#dd2c00;cursor:pointer;float:right}.cld-apply-action{float:right}.cld-table thead tr th.cld-table-th{line-height:1.8em}.cld-asset .cld-input-on-off{display:inline-block}.cld-asset .cld-input-label{display:inline-block;margin-bottom:0}.cld-asset-edit{align-items:flex-end;display:flex}.cld-asset-edit-button.button.button-primary{padding:3px 14px 4px}.cld-asset-preview-label{font-weight:bolder;margin-right:10px;width:100%}.cld-asset-preview-input{margin-top:6px;width:100%}.cld-link-button{background-color:#3448c5;border-radius:4px;display:inline-block;font-size:11px;font-weight:700;margin:0;padding:5px 14px}.cld-link-button,.cld-link-button:focus,.cld-link-button:hover{color:#fff;text-decoration:none}.cld-tooltip{color:#999;font-size:12px;line-height:1.3em;margin:8px 0}.cld-tooltip .selected{color:rgba(0,0,1,.75)}.cld-notice-box{box-shadow:0 0 2px rgba(0,0,0,.1);margin-bottom:12px;margin-right:20px;position:relative}.cld-notice-box .cld-notice{padding:1rem 2.2rem .75rem 1.2rem}.cld-notice-box .cld-notice img.cld-ui-icon{height:100%}.cld-notice-box.is-dismissible{padding-right:38px}.cld-notice-box.has-icon{padding-left:38px}.cld-notice-box.is-created,.cld-notice-box.is-success,.cld-notice-box.is-updated{background-color:#ebf5ec;border-left:4px solid #42ad4f}.cld-notice-box.is-created .dashicons,.cld-notice-box.is-success .dashicons,.cld-notice-box.is-updated .dashicons{color:#2a0}.cld-notice-box.is-error{background-color:#f8e8e7;border-left:4px solid #cb3435}.cld-notice-box.is-error .dashicons{color:#dd2c00}.cld-notice-box.is-warning{background-color:#fff7e5;border-left:4px solid #f2ad4c}.cld-notice-box.is-warning .dashicons{color:#fd9d2c}.cld-notice-box.is-info{background-color:#e4f4f8;border-left:4px solid #2a95c3}.cld-notice-box.is-info .dashicons{color:#3273ab}.cld-notice-box.is-neutral{background-color:#fff;border-left:4px solid #ccd0d4}.cld-notice-box.is-neutral .dashicons{color:#90a0b3}.cld-notice-box.dismissed{overflow:hidden;transition:height .3s ease-out}.cld-notice-box .cld-ui-icon,.cld-notice-box .dashicons{left:19px;position:absolute;top:14px}.cld-connection-box{align-items:center;background-color:#303a47;border-radius:4px;color:#fff;display:flex;justify-content:space-around;max-width:500px;padding:20px 17px}.cld-connection-box h3{color:#fff;margin:0 0 5px}.cld-connection-box span{display:inline-block;padding:0 12px 0 0}.cld-connection-box .dashicons{font-size:30px;height:30px;margin:0;padding:0;width:30px}.cld-row{clear:both;display:flex;margin:0}.cld-row.align-center{align-items:center}@media only screen and (max-width:783px){.cld-row{flex-direction:column-reverse}}.cld-column{box-sizing:border-box;padding:0 0 0 13px;width:100%}@media only screen and (min-width:783px){.cld-column.column-45{width:45%}.cld-column.column-55{width:55%}.cld-column:last-child{padding-right:13px}}@media only screen and (max-width:783px){.cld-column{min-width:100%}.cld-column .cld-info-text{text-align:center}}@media only screen and (max-width:1200px){.cld-column.tabbed-content{display:none}.cld-column.tabbed-content.is-active{display:block}}.cld-column .cld-column{margin-right:16px;padding:0}.cld-column .cld-column:last-child{margin-left:auto;margin-right:0}.cld-center-column.cld-info-text{font-size:15px;font-weight:bolder;padding-left:2em}.cld-center-column.cld-info-text .description{font-size:12px;padding-top:8px}.cld-breakpoints-preview,.cld-image-preview,.cld-lazyload-preview,.cld-video-preview{border:1px solid #c6d1db;border-radius:4px;padding:9px}.cld-breakpoints-preview-wrapper,.cld-image-preview-wrapper,.cld-lazyload-preview-wrapper,.cld-video-preview-wrapper{position:relative}.cld-breakpoints-preview .cld-ui-title,.cld-image-preview .cld-ui-title,.cld-lazyload-preview .cld-ui-title,.cld-video-preview .cld-ui-title{font-weight:700;margin:5px 0 12px}.cld-breakpoints-preview img,.cld-image-preview img,.cld-lazyload-preview img,.cld-video-preview img{border-radius:4px;height:100%;width:100%}.cld.cld-ui-preview{max-width:322px}.cld-breakpoints-preview .cld-image-preview-wrapper:hover .preview-image,.cld-lazyload-preview .cld-image-preview-wrapper:hover .preview-image{opacity:0}.cld-breakpoints-preview .cld-image-preview-wrapper:hover .main-image,.cld-lazyload-preview .cld-image-preview-wrapper:hover .main-image{opacity:1}.cld-breakpoints-preview .cld-image-preview-wrapper:hover .main-image img,.cld-breakpoints-preview .cld-image-preview-wrapper:hover .main-image span,.cld-lazyload-preview .cld-image-preview-wrapper:hover .main-image img,.cld-lazyload-preview .cld-image-preview-wrapper:hover .main-image span{opacity:.4}.cld-breakpoints-preview .preview-image,.cld-lazyload-preview .preview-image{background-color:#222;border-radius:4px;bottom:0;box-shadow:2px -2px 3px rgba(0,0,0,.9);display:flex;left:0;position:absolute}.cld-breakpoints-preview .preview-image:hover,.cld-breakpoints-preview .preview-image:hover img,.cld-breakpoints-preview .preview-image:hover span,.cld-lazyload-preview .preview-image:hover,.cld-lazyload-preview .preview-image:hover img,.cld-lazyload-preview .preview-image:hover span{opacity:1!important}.cld-breakpoints-preview .preview-image.main-image,.cld-lazyload-preview .preview-image.main-image{box-shadow:none;position:relative}.cld-breakpoints-preview .preview-text,.cld-lazyload-preview .preview-text{background-color:#3448c5;color:#fff;padding:3px;position:absolute;right:0;text-shadow:0 0 3px #000;top:0}.cld-breakpoints-preview .global-transformations-url-link:hover,.cld-lazyload-preview .global-transformations-url-link:hover{color:#fff;text-decoration:none}.cld-lazyload-preview .progress-bar{background-color:#3448c5;height:2px;transition:width 1s;width:0}.cld-lazyload-preview .preview-image{background-color:#fff}.cld-lazyload-preview img{transition:opacity 1s}.cld-lazyload-preview .global-transformations-url-link{background-color:transparent}.cld-group .cld-group .cld-group{padding-left:4px}.cld-group .cld-group .cld-group hr{display:none}.cld-group-heading{display:flex;justify-content:space-between}.cld-group-heading h3{font-size:.9rem}.cld-group-heading h3 .description{font-size:.7rem;font-weight:400;margin-left:.7em}.cld-group .cld-ui-title-head{margin-bottom:1em}.cld-input{display:block;margin:0 0 23px;max-width:800px}.cld-input-label{display:block;margin-bottom:8px}.cld-input-label .cld-ui-title{font-size:14px;font-weight:700}.cld-input-label-link{color:#3448c5;font-size:12px;margin-left:8px}.cld-input-label-link:hover{color:#1e337f}.cld-input-radio-label{display:block}.cld-input-radio-label:not(:first-of-type){padding-top:8px}.cld-input .regular-number,.cld-input .regular-text{border:1px solid #d0d0d0;border-radius:3px;font-size:13px;padding:.1rem .5rem;width:100%}.cld-input .regular-number-small,.cld-input .regular-text-small{width:40%}.cld-input .regular-number{width:100px}.cld-input .regular-select{appearance:none;border:1px solid #d0d0d0;border-radius:3px;display:inline;font-size:13px;font-weight:600;min-width:150px;padding:2px 30px 2px 6px}.cld-input-on-off .description{color:inherit;font-size:13px;font-weight:600;margin:0}.cld-input-on-off .description.left{margin-left:0;margin-right:.4rem}.cld-input-on-off input[type=checkbox]~.spinner{background-size:12px 12px;float:none;height:12px;margin:2px;opacity:1;position:absolute;right:14px;top:0;transition:right .2s;visibility:visible;width:12px}.cld-input-on-off input[type=checkbox]:checked~.spinner{right:0}.cld-input-on-off-control{display:inline-block;height:16px;margin-right:.4rem;position:relative;width:30px}.cld-input-on-off-control input,.cld-input-on-off-control input:disabled{height:0;opacity:0;width:0}.cld-input-on-off-control-slider{background-color:#90a0b3;border-radius:10px;bottom:0;cursor:pointer;left:0;position:absolute;right:0;top:0;transition:background-color .3s}input:disabled+.cld-input-on-off-control-slider{opacity:.4}input:checked+.cld-input-on-off-control-slider{background-color:#3448c5!important}input:checked.partial+.cld-input-on-off-control-slider{background-color:#fd9d2c!important}input:checked.delete+.cld-input-on-off-control-slider{background-color:#dd2c00!important}.cld-input-on-off-control-slider:before{background-color:#fff;border-radius:50%;bottom:2px;content:"";display:block;height:12px;left:2px;position:absolute;transition:transform .2s;width:12px}input:checked+.cld-input-on-off-control-slider:before{transform:translateX(14px)}.mini input:checked+.cld-input-on-off-control-slider:before{transform:translateX(10px)}.cld-input-on-off-control.mini{height:10px;width:20px}.mini .cld-input-on-off-control-slider:before{bottom:1px;height:8px;left:1px;width:8px}.cld-input-icon-toggle{align-items:center;display:inline-flex}.cld-input-icon-toggle .description{margin:0 0 0 .4rem}.cld-input-icon-toggle .description.left{margin-left:0;margin-right:.4rem}.cld-input-icon-toggle-control{display:inline-block;position:relative}.cld-input-icon-toggle-control input{height:0;opacity:0;position:absolute;width:0}.cld-input-icon-toggle-control-slider .icon-on{display:none;visibility:hidden}.cld-input-icon-toggle-control-slider .icon-off,input:checked+.cld-input-icon-toggle-control-slider .icon-on{display:inline-block;visibility:visible}input:checked+.cld-input-icon-toggle-control-slider .icon-off{display:none;visibility:hidden}.cld-input-excluded-types div{display:flex}.cld-input-excluded-types .type{border:1px solid #c6d1db;border-radius:20px;display:flex;justify-content:space-between;margin-right:8px;min-width:50px;padding:3px 6px}.cld-input-excluded-types .dashicons{cursor:pointer}.cld-input-excluded-types .dashicons:hover{color:#dd2c00}.cld-input-tags{align-items:center;border:1px solid #d0d0d0;border-radius:3px;display:flex;flex-wrap:wrap;justify-content:flex-start;margin:5px 0 0;padding:2px 6px}.cld-input-tags-item{border:1px solid #c6d1db;border-radius:14px;box-shadow:inset -25px 0 0 #c6d1db;display:inline-flex;justify-content:space-between;margin:5px 6px 5px 0;opacity:1;overflow:hidden;padding:3px 4px 3px 8px;transition:opacity .25s,width .5s,margin .25s,padding .25s}.cld-input-tags-item-text{margin-right:8px}.cld-input-tags-item-delete{color:#90a0b3;cursor:pointer}.cld-input-tags-item-delete:hover{color:#3448c5}.cld-input-tags-item.pulse{animation:pulse-animation .5s infinite}.cld-input-tags-input{display:inline-block;min-width:100px;opacity:.4;overflow:visible;padding:10px 0;white-space:nowrap}.cld-input-tags-input:focus-visible{opacity:1;outline:none;padding:10px}@keyframes pulse-animation{0%{color:rgba(255,0,0,0)}50%{color:red}to{color:rgba(255,0,0,0)}}.cld-input-tags-input.pulse{animation:pulse-animation .5s infinite}.cld-input .prefixed{margin-left:6px;width:40%}.cld-input .suffixed{margin-right:6px;width:40%}.cld-input input::placeholder{color:#90a0b3}.cld-gallery-settings{box-sizing:border-box;display:flex;flex-wrap:wrap;padding:1rem 0;width:100%}@media only screen and (min-width:960px){.cld-gallery-settings{margin-left:-1rem;margin-right:-1rem}}.cld-gallery-settings__column{box-sizing:border-box;width:100%}@media only screen and (min-width:960px){.cld-gallery-settings__column{padding-left:1rem;padding-right:1rem;width:50%}}.components-base-control__field select{display:block;margin:1rem 0}.components-range-control__wrapper{margin:0!important}.components-range-control__root{flex-direction:row-reverse;margin:1rem 0}.components-input-control.components-number-control.components-range-control__number{margin-left:0!important;margin-right:16px}.components-panel{border:0!important}.components-panel__body:first-child{border-top:0!important}.components-panel__body:last-child{border-bottom:0!important}.components-textarea-control__input{display:block;margin:.5rem 0;width:100%}table .cld-input{margin-bottom:0}tr .file-size.small{color:#a8a8a8;font-size:.8em;font-style:italic;letter-spacing:.4px;margin-left:6px;margin-right:6px}td.tree{color:#212529;line-height:1.5;padding-top:0;position:relative}td.tree ul.striped>:nth-child(odd){background-color:#f6f7f7}td.tree ul.striped>:nth-child(2n){background-color:#fff}td.tree .success{color:#20b832}td+td.tree{padding-top:0}td.tree .cld-input{margin-bottom:0;vertical-align:text-bottom}td.tree .cld-search{font-size:.9em;height:26px;margin-right:12px;min-height:20px;padding:4px 6px;vertical-align:initial;width:300px}td.tree .file-size{color:#a8a8a8;font-size:.8em;font-style:italic;letter-spacing:.4px;margin-left:6px}td.tree .fa-folder,td.tree .fa-folder-open{color:#007bff}td.tree .fa-html5{color:#f21f10}td.tree ul{list-style:none;margin:0;padding-left:5px}td.tree ul li{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;margin-bottom:0;padding-bottom:5px;padding-left:25px;padding-top:5px;position:relative}td.tree ul li:before{height:1px;margin:auto;top:14px;width:20px}td.tree ul li:after,td.tree ul li:before{background-color:#666;content:"";left:0;position:absolute}td.tree ul li:after{bottom:0;height:100%;top:0;width:1px}td.tree ul li:after:nth-of-type(odd){background-color:#666}td.tree ul li:last-child:after{height:14px}td.tree ul a{cursor:pointer}td.tree ul a:hover{text-decoration:none}.cld-modal{align-content:center;align-items:center;background-color:rgba(0,0,0,.8);bottom:0;display:flex;flex-direction:row;flex-wrap:nowrap;left:0;opacity:0;position:fixed;right:0;top:0;transition:opacity .1s;visibility:hidden;z-index:10000}.cld-modal[data-cloudinary-only="1"] .modal-body,.cld-modal[data-cloudinary-only=true] .modal-body{display:none}.cld-modal[data-cloudinary-only="1"] [data-action=submit],.cld-modal[data-cloudinary-only=true] [data-action=submit]{cursor:not-allowed;opacity:.5;pointer-events:none}.cld-modal .warning{color:#dd2c00}.cld-modal .modal-header{margin-bottom:2em}.cld-modal .modal-uninstall{display:none}.cld-modal-box{background-color:#fff;box-shadow:0 2px 14px 0 rgba(0,0,0,.5);display:flex;flex-direction:column;font-size:10.5px;font-weight:600;justify-content:space-between;margin:0 auto;max-width:80%;padding:25px;position:relative;transition:height 1s;width:500px}.cld-modal-box .modal-footer{align-items:stretch;display:flex;flex-direction:row;justify-content:flex-end}.cld-modal-box .more{display:none}.cld-modal-box input[type=radio]:checked~.more{color:#32373c;display:block;line-height:2;margin-left:2em;margin-top:.5em}.cld-modal-box input[type=radio]:checked{border:1px solid #3448c5}.cld-modal-box input[type=radio]:checked:before{background-color:#3448c5;border-radius:50%;content:"";height:.5rem;line-height:1.14285714;margin:.1875rem;width:.5rem}@media screen and (max-width:782px){.cld-modal-box input[type=radio]:checked:before{height:.5625rem;line-height:.76190476;margin:.4375rem;vertical-align:middle;width:.5625rem}}.cld-modal-box input[type=radio]:focus{border-color:#3448c5;box-shadow:0 0 0 1px #3448c5;outline:2px solid transparent}.cld-modal-box input[type=checkbox]~label{margin-left:.25em}.cld-modal-box input[type=email]{width:100%}.cld-modal-box textarea{font-size:inherit;resize:none;width:100%}.cld-modal-box ul{margin-bottom:21px}.cld-modal-box p{font-size:10.5px;margin:0 0 12px}.cld-modal-box .button{background-color:#e9ecf9;border:0;color:#000;font-size:9.5px;font-weight:700;margin:22px 0 0 10px;padding:4px 14px}.cld-modal-box .button.button-primary{background-color:#3448c5;color:#fff}.cld-optimisation{display:flex;font-size:12px;justify-content:space-between;line-height:2}.cld-optimisation:first-child{margin-top:7px}.cld-optimisation-item{color:#3448c5;font-weight:600}.cld-optimisation-item:hover{color:#1e337f}.cld-optimisation-item-active,.cld-optimisation-item-not-active{font-size:10px;font-weight:700}.cld-optimisation-item-active .dashicons,.cld-optimisation-item-not-active .dashicons{font-size:12px;line-height:2}.cld-optimisation-item-active{color:#2a0}.cld-optimisation-item-not-active{color:#c6d1db}.cld-ui-sidebar{width:100%}@media only screen and (min-width:783px){.cld-ui-sidebar{max-width:500px;min-width:400px;width:auto}}.cld-ui-sidebar .cld-info-box,.cld-ui-sidebar .cld-panel,.cld-ui-sidebar .cld-panel-short{padding:14px 18px}.cld-ui-sidebar .cld-ui-header{margin-top:-1px;padding:6px 14px}.cld-ui-sidebar .cld-ui-header:first-child{margin-top:13px}.cld-ui-sidebar .cld-ui-title h2{font-size:14px}.cld-ui-sidebar .cld-info-box{align-items:flex-start;border:0;margin:0;padding:0}.cld-ui-sidebar .cld-info-box .cld-ui-body{padding-top:0}.cld-ui-sidebar .cld-info-box .button{align-self:flex-start;cursor:default;line-height:inherit;opacity:.5}.cld-ui-sidebar .cld-info-icon{background-color:transparent}.cld-ui-sidebar .cld-info-icon img{width:40px}.cld-ui-sidebar .extension-item{border-bottom:1px solid #e5e5e5;border-radius:0;margin-bottom:18px}.cld-ui-sidebar .extension-item:last-of-type{border-bottom:none;margin-bottom:0}.cld-plan{display:flex;flex-wrap:wrap}.cld-plan-item{display:flex;margin-bottom:25px;width:33%}.cld-plan-item img{margin-right:12px;width:24px}.cld-plan-item .description{font-size:12px}.cld-plan-item .cld-title{font-size:14px;font-weight:700}.cld-wizard{margin-left:auto;margin-right:auto;max-width:1100px}.cld-wizard-tabs{display:flex;flex-direction:row;font-size:15px;font-weight:600;width:50%}.cld-wizard-tabs-tab{align-items:center;display:flex;flex-direction:column;position:relative;width:33%}.cld-wizard-tabs-tab-count{align-items:center;background-color:rgba(52,72,197,.15);border:2px solid transparent;border-radius:50%;display:flex;height:32px;justify-content:center;width:32px}.active .cld-wizard-tabs-tab-count{border:2px solid #3448c5}.complete .cld-wizard-tabs-tab-count{background-color:#2a0;color:#2a0}.complete .cld-wizard-tabs-tab-count:before{color:#fff;content:"";font-family:dashicons;font-size:30px;width:25px}.cld-wizard-tabs-tab.active{color:#3448c5}.cld-wizard-tabs-tab:after{border:1px solid rgba(52,72,197,.15);content:"";left:75%;position:absolute;top:16px;width:50%}.cld-wizard-tabs-tab.complete:after{border-color:#2a0}.cld-wizard-tabs-tab:last-child:after{display:none}.cld-wizard-intro{text-align:center}.cld-wizard-intro-welcome{border:2px solid #c6d1db;border-radius:4px;box-shadow:0 2px 10px 0 rgba(0,0,0,.3);margin:27px auto;padding:19px;width:645px}.cld-wizard-intro-welcome img{width:100%}.cld-wizard-intro-welcome-info{background-color:#323a45;border-radius:0 0 4px 4px;color:#fff;display:flex;font-size:12px;margin:0 -19px -19px;padding:15px;text-align:left}.cld-wizard-intro-welcome-info img{margin-right:12px;width:25px}.cld-wizard-intro-welcome-info h2{color:#fff;font-size:14px}.cld-wizard-connect-connection{align-items:flex-end;display:flex;flex-direction:row;justify-content:flex-start}.cld-wizard-connect-connection-input{margin-right:10px;margin-top:20px;width:725px}.cld-wizard-connect-connection-input input{max-width:100%;width:100%}.cld-wizard-connect-status{align-items:center;border-radius:14px;display:none;font-weight:700;justify-content:space-between;padding:5px 11px}.cld-wizard-connect-status.active{display:inline-flex}.cld-wizard-connect-status.success{background-color:#ccefc9;color:#2a0}.cld-wizard-connect-status.error{background-color:#f9cecd;color:#dd2c00}.cld-wizard-connect-status.working{background-color:#eaecfa;color:#1e337f;padding:5px}.cld-wizard-connect-status.working .spinner{margin:0;visibility:visible}.cld-wizard-connect-help{align-items:center;display:flex;justify-content:space-between;margin-top:50px}.cld-wizard-lock{cursor:pointer;display:flex}.cld-wizard-lock.hidden{display:none;height:0;width:0}.cld-wizard-lock .dashicons{color:#3448c5;font-size:25px;line-height:.7;margin-right:10px}.cld-wizard-optimize-settings.disabled{opacity:.4}.cld-wizard-complete{background-image:url(../css/images/confetti.png);background-position:50%;background-repeat:no-repeat;background-size:cover;margin:-23px;padding:98px;text-align:center}.cld-wizard-complete.hidden{display:none}.cld-wizard-complete.active{align-items:center;display:flex;flex-direction:column;justify-content:center;margin:-23px -24px;text-align:center}.cld-wizard-complete.active *{max-width:450px}.cld-wizard-complete-icons{display:flex;justify-content:center}.cld-wizard-complete-icons img{margin:30px 10px;width:70px}.cld-wizard-complete-icons .dashicons{background-color:#f1f1f1;border:4px solid #fff;border-radius:6px;box-shadow:0 2px 8px 0 rgba(0,0,0,.3);font-size:50px;height:70px;line-height:1.4;width:70px}.cld-wizard-complete-icons .dashicons-cloudinary{color:#3448c5;font-size:65px;line-height:.9}.cld-wizard-complete .cld-ui-title{margin-top:30px}.cld-wizard-complete .cld-ui-title h3{font-size:14px}.cld-wizard .cld-panel-heading{align-items:center}.cld-wizard .cld-ui-title{text-transform:none}.cld-wizard .cld-submit{align-items:center;display:flex;justify-content:space-between}.cld-wizard .cld-submit .button{margin-left:10px}.cld-import{display:none;height:100%;padding:0 10px;position:absolute;right:0;width:200px}.cld-import-item{align-items:center;display:flex;margin-top:10px;min-height:20px;opacity:0;transition:opacity .5s;white-space:nowrap}.cld-import-item .spinner{margin:0 6px 0 0;visibility:visible;width:24px}.cld-import-item-id{display:block;overflow:hidden;text-overflow:ellipsis}.cld-import-process{background-color:#fff;background-position:50%;border-radius:40px;float:none;opacity:1;padding:5px;visibility:visible}.media-library{margin-right:0;transition:margin-right .2s}.tippy-box[data-theme~=cloudinary]{background-color:rgba(0,0,0,.8);color:#fff;font-size:.8em} \ No newline at end of file diff --git a/js/gallery-init.asset.php b/js/gallery-init.asset.php deleted file mode 100644 index d74ed931c..000000000 --- a/js/gallery-init.asset.php +++ /dev/null @@ -1 +0,0 @@ - array('wp-polyfill'), 'version' => '7dee1274efa118f514dd4a926a80bccd'); \ No newline at end of file diff --git a/js/gallery-init.js b/js/gallery-init.js deleted file mode 100644 index 3397f0b2b..000000000 --- a/js/gallery-init.js +++ /dev/null @@ -1 +0,0 @@ -!function(e){var t={};function n(r){if(t[r])return t[r].exports;var o=t[r]={i:r,l:!1,exports:{}};return e[r].call(o.exports,o,o.exports,n),o.l=!0,o.exports}n.m=e,n.c=t,n.d=function(e,t,r){n.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:r})},n.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},n.t=function(e,t){if(1&t&&(e=n(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var r=Object.create(null);if(n.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var o in e)n.d(r,o,function(t){return e[t]}.bind(null,o));return r},n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="",n(n.s=0)}([function(e,t){var n;n=cloudinary.galleryWidget,window.addEventListener("load",(function(){var e,t;document.querySelector(".woocommerce-page")&&CLD_GALLERY_CONFIG&&(null===(e=CLD_GALLERY_CONFIG)||void 0===e||null===(t=e.mediaAssets)||void 0===t?void 0:t.length)&&n(CLD_GALLERY_CONFIG).render()}))}]); \ No newline at end of file diff --git a/js/gallery-ui.js b/js/gallery-ui.js deleted file mode 100644 index 05e4c3fc4..000000000 --- a/js/gallery-ui.js +++ /dev/null @@ -1 +0,0 @@ -!function(e){var t={};function r(n){if(t[n])return t[n].exports;var o=t[n]={i:n,l:!1,exports:{}};return e[n].call(o.exports,o,o.exports,r),o.l=!0,o.exports}r.m=e,r.c=t,r.d=function(e,t,n){r.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:n})},r.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},r.t=function(e,t){if(1&t&&(e=r(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var n=Object.create(null);if(r.r(n),Object.defineProperty(n,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var o in e)r.d(n,o,function(t){return e[t]}.bind(null,o));return n},r.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return r.d(t,"a",t),t},r.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},r.p="",r(r.s=0)}([function(e,t,r){"use strict";r.r(t)}]); \ No newline at end of file diff --git a/js/image-editor.asset.php b/js/image-editor.asset.php new file mode 100644 index 000000000..9c016e332 --- /dev/null +++ b/js/image-editor.asset.php @@ -0,0 +1 @@ + array('wp-api-fetch', 'wp-polyfill'), 'version' => '2e041551b5c653c88ee8288c66b994bf'); \ No newline at end of file diff --git a/js/image-editor.js b/js/image-editor.js new file mode 100644 index 000000000..70a667dc8 --- /dev/null +++ b/js/image-editor.js @@ -0,0 +1 @@ +!function(t){var e={};function i(o){if(e[o])return e[o].exports;var n=e[o]={i:o,l:!1,exports:{}};return t[o].call(n.exports,n,n.exports,i),n.l=!0,n.exports}i.m=t,i.c=e,i.d=function(t,e,o){i.o(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:o})},i.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},i.t=function(t,e){if(1&e&&(t=i(t)),8&e)return t;if(4&e&&"object"==typeof t&&t&&t.__esModule)return t;var o=Object.create(null);if(i.r(o),Object.defineProperty(o,"default",{enumerable:!0,value:t}),2&e&&"string"!=typeof t)for(var n in t)i.d(o,n,function(e){return t[e]}.bind(null,n));return o},i.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return i.d(e,"a",e),e},i.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},i.p="",i(i.s=2)}([function(t,e){t.exports=window.wp.apiFetch},,function(t,e,i){"use strict";i.r(e);var o=i(0),n=i.n(o),r={container:document.getElementById("cloudinary-editor"),mediaPreview:document.getElementById("cloudinary-media-preview"),startControls:document.getElementById("edit-start-wrap"),editStart:document.getElementById("edit-start"),editClose:document.getElementById("edit-close"),editControls:document.getElementById("edit-controls-wrap"),saveButton:document.getElementById("edit-save"),restoreButton:document.getElementById("edit-restore"),config:cldData.editor?cldData.editor:{},editor:null,init:function(){var t=this;this.config.publicId&&(this.show(this.editStart),this.container.style.transition="opacity 0.5s",n.a.use(n.a.createNonceMiddleware(this.config.nonce)),this.editStart.addEventListener("click",(function(){t.open()})),this.editClose.addEventListener("click",(function(){t.close()})),this.saveButton.addEventListener("click",(function(){t.editor.triggerExport()})),this.restoreButton.addEventListener("click",(function(){t.restoreButton.disabled=!0;var e={ID:t.config.assetID};t.restore(e)})),this.restoreMaybe(),this.editor=cloudinary.mediaEditor({appendTo:this.container}),["interactivecropresize","interactivecropmove","flipvertically","fliphorizontally","rotateclockwise","rotatecounterclockwise","aspectratioclick","cropclick"].forEach((function(e){t.editor.on(e,(function(e){t.enableSave()}))})))},disableSave:function(){"image"===this.config.resourceType&&(this.saveButton.disabled=!0)},enableSave:function(){"image"===this.config.resourceType&&(this.saveButton.disabled=!1)},restoreMaybe:function(){this.config.original?this.hide(this.restoreButton):(this.restoreButton.disabled=!1,this.show(this.restoreButton))},openEditor:function(){var t=this;this.mediaPreview.addEventListener("load",(function(){t.mediaPreview.style.opacity=1})),this.updateEditor(),this.editor.on("export",(function(e){var i={ID:t.config.assetID,transformations:e.transformation,imageUrl:e.assets[0].secureUrl};t.saveButton.disabled=!0,t.save(i)})),this.editor.show()},updateEditor:function(){this.editor.update({cloudName:this.config.cloudName,publicIds:[{publicId:this.config.publicId,resourceType:this.config.resourceType}],mode:"inline",image:{transformation:this.config.transformation,steps:["resizeAndCrop"],resizeAndCrop:{toggleAspectRatio:!0},export:{download:!1,quality:["best"],share:!1}}}),this.disableSave()},hide:function(t){t.style.display="none"},show:function(t){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"block";t.style.display=e},open:function(){this.hide(this.startControls),this.show(this.editControls,"flex"),this.hide(this.mediaPreview);var t=document.body.offsetHeight-this.container.offsetTop-200;this.show(this.container),this.container.style.height=t+"px",this.openEditor()},close:function(){this.show(this.startControls),this.hide(this.editControls),this.show(this.mediaPreview),this.hide(this.container),this.editor.hide()},save:function(t){var e=this;this.disableSave(),this.container.style.opacity=.5,n()({url:this.config.saveUrl,data:t,method:"POST"}).then((function(t){e.config.publicId=t.publicId,e.config.original=t.original,e.updateEditor(),e.mediaPreview.src=t.previewUrl,e.container.style.opacity=1,e.restoreMaybe()}))},restore:function(t){var e=this;this.container.style.opacity=.5,n()({url:this.config.restoreUrl,data:t,method:"POST"}).then((function(t){e.config.publicId=t.publicId,e.config.original=t.original,e.updateEditor(),e.mediaPreview.src=t.previewUrl,e.container.style.opacity=1,e.restoreMaybe()}))}};window.addEventListener("load",(function(){return r.init()})),e.default=r}]); \ No newline at end of file diff --git a/js/inline-loader.asset.php b/js/inline-loader.asset.php index c43e36b08..cde8e4305 100644 --- a/js/inline-loader.asset.php +++ b/js/inline-loader.asset.php @@ -1 +1 @@ - array('wp-polyfill'), 'version' => '37570643f51b47c7e76cf52f909c916f'); \ No newline at end of file + array('wp-polyfill'), 'version' => 'a44e8b4e876c3a00e69afdaf3881c27f'); \ No newline at end of file diff --git a/js/inline-loader.js b/js/inline-loader.js index ac29380ac..95442c49c 100644 --- a/js/inline-loader.js +++ b/js/inline-loader.js @@ -1 +1 @@ -!function(e){var t={};function i(n){if(t[n])return t[n].exports;var r=t[n]={i:n,l:!1,exports:{}};return e[n].call(r.exports,r,r.exports,i),r.l=!0,r.exports}i.m=e,i.c=t,i.d=function(e,t,n){i.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:n})},i.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},i.t=function(e,t){if(1&t&&(e=i(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var n=Object.create(null);if(i.r(n),Object.defineProperty(n,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var r in e)i.d(n,r,function(t){return e[t]}.bind(null,r));return n},i.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return i.d(t,"a",t),t},i.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},i.p="",i(i.s=0)}([function(e,t){var i={deviceDensity:window.devicePixelRatio?window.devicePixelRatio:"auto",density:null,config:CLDLB||{},lazyThreshold:0,enabled:!1,sizeBands:[],iObserver:null,pObserver:null,rObserver:null,aboveFold:!0,bind:function(e){var t=this;e.CLDbound=!0,this.enabled||this._init();var i=e.dataset.size.split(" ");e.originalWidth=i[0],e.originalHeight=i[1],this.pObserver?(this.aboveFold&&this.inInitialView(e)?this.buildImage(e):(this.pObserver.observe(e),this.iObserver.observe(e)),e.addEventListener("error",(function(i){e.srcset="",e.src='data:image/svg+xml;utf8,%26%23x26A0%3B︎',t.rObserver.unobserve(e)}))):this.setupFallback(e)},buildImage:function(e){e.dataset.srcset?(e.cld_loaded=!0,e.srcset=e.dataset.srcset):(e.src=this.getSizeURL(e),e.dataset.responsive&&this.rObserver.observe(e))},inInitialView:function(e){var t=e.getBoundingClientRect();return this.aboveFold=t.top=t;)e-=i,this.sizeBands.push(e);"undefined"!=typeof IntersectionObserver&&this._setupObservers(),this.enabled=!0},_setupObservers:function(){var e=this,t={rootMargin:this.lazyThreshold+"px 0px "+this.lazyThreshold+"px 0px"},i={rootMargin:2*this.lazyThreshold+"px 0px "+2*this.lazyThreshold+"px 0px"};this.rObserver=new ResizeObserver((function(t,i){t.forEach((function(t){t.target.cld_loaded&&t.contentRect.width>=t.target.cld_loaded&&(t.target.src=e.getSizeURL(t.target))}))})),this.iObserver=new IntersectionObserver((function(t,i){t.forEach((function(t){t.isIntersecting&&(e.buildImage(t.target),i.unobserve(t.target))}))}),t),this.pObserver=new IntersectionObserver((function(t,i){t.forEach((function(t){t.isIntersecting&&(t.intersectionRatio<.5&&(t.target.src=e.getPlaceholderURL(t.target)),i.unobserve(t.target))}))}),i)},_calcThreshold:function(){var e=this.config.lazy_threshold.replace(/[^0-9]/g,""),t=0;switch(this.config.lazy_threshold.replace(/[0-9]/g,"").toLowerCase()){case"em":t=parseFloat(getComputedStyle(document.body).fontSize)*e;break;case"rem":t=parseFloat(getComputedStyle(document.documentElement).fontSize)*e;break;case"vh":t=window.innerHeight/e*100;break;default:t=e}this.lazyThreshold=parseInt(t,10)},_getDensity:function(){var e=this.config.dpr?this.config.dpr.replace("X",""):"off";if("off"===e)return this.density=1,1;var t=this.deviceDensity;"max"!==e&&"auto"!==t&&(e=parseFloat(e),t=t>Math.ceil(e)?e:t),this.density=t},scaleWidth:function(e,t){var i=parseInt(this.config.max_width);if(!t)for(t=e.width;-1===this.sizeBands.indexOf(t)&&ti&&(t=i),e.originalWidth%26%23x26A0%3B︎',t.rObserver.unobserve(e)}))):this.setupFallback(e)},buildImage:function(e){e.dataset.srcset?(e.cld_loaded=!0,e.srcset=e.dataset.srcset):(e.src=this.getSizeURL(e),e.dataset.responsive&&this.rObserver.observe(e))},inInitialView:function(e){var t=e.getBoundingClientRect();return this.aboveFold=t.top=t;)e-=i,this.sizeBands.push(e);"undefined"!=typeof IntersectionObserver&&this._setupObservers(),this.enabled=!0},_setupObservers:function(){var e=this,t={rootMargin:this.lazyThreshold+"px 0px "+this.lazyThreshold+"px 0px"},i={rootMargin:2*this.lazyThreshold+"px 0px "+2*this.lazyThreshold+"px 0px"};this.rObserver=new ResizeObserver((function(t,i){t.forEach((function(t){t.target.cld_loaded&&t.contentRect.width>=t.target.cld_loaded&&(t.target.src=e.getSizeURL(t.target))}))})),this.iObserver=new IntersectionObserver((function(t,i){t.forEach((function(t){t.isIntersecting&&(e.buildImage(t.target),i.unobserve(t.target))}))}),t),this.pObserver=new IntersectionObserver((function(t,i){t.forEach((function(t){t.isIntersecting&&(t.intersectionRatio<.5&&(t.target.src=e.getPlaceholderURL(t.target)),i.unobserve(t.target))}))}),i)},_calcThreshold:function(){var e=this.config.lazy_threshold.replace(/[^0-9]/g,""),t=0;switch(this.config.lazy_threshold.replace(/[0-9]/g,"").toLowerCase()){case"em":t=parseFloat(getComputedStyle(document.body).fontSize)*e;break;case"rem":t=parseFloat(getComputedStyle(document.documentElement).fontSize)*e;break;case"vh":t=window.innerHeight/e*100;break;default:t=e}this.lazyThreshold=parseInt(t,10)},_getDensity:function(){var e=this.config.dpr?this.config.dpr.replace("X",""):"off";if("off"===e)return this.density=1,1;var t=this.deviceDensity;"max"!==e&&"auto"!==t&&(e=parseFloat(e),t=t>Math.ceil(e)?e:t),this.density=t},scaleWidth:function(e,t){var i=parseInt(this.config.max_width);if(!t)for(t=e.width;-1===this.sizeBands.indexOf(t)&&ti&&(t=i),e.originalWidth array('wp-polyfill'), 'version' => '3ab27ab002de5aa27056ece5ef61f88f'); \ No newline at end of file diff --git a/js/video-init.js b/js/video-init.js deleted file mode 100644 index 01b380cc2..000000000 --- a/js/video-init.js +++ /dev/null @@ -1 +0,0 @@ -!function(e){var r={};function o(n){if(r[n])return r[n].exports;var t=r[n]={i:n,l:!1,exports:{}};return e[n].call(t.exports,t,t.exports,o),t.l=!0,t.exports}o.m=e,o.c=r,o.d=function(e,r,n){o.o(e,r)||Object.defineProperty(e,r,{enumerable:!0,get:n})},o.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},o.t=function(e,r){if(1&r&&(e=o(e)),8&r)return e;if(4&r&&"object"==typeof e&&e&&e.__esModule)return e;var n=Object.create(null);if(o.r(n),Object.defineProperty(n,"default",{enumerable:!0,value:e}),2&r&&"string"!=typeof e)for(var t in e)o.d(n,t,function(r){return e[r]}.bind(null,t));return n},o.n=function(e){var r=e&&e.__esModule?function(){return e.default}:function(){return e};return o.d(r,"a",r),r},o.o=function(e,r){return Object.prototype.hasOwnProperty.call(e,r)},o.p="",o(o.s=0)}([function(e,r){!function(){if("undefined"!=typeof cldVideos){for(var e in cldVideos=JSON.parse(cldVideos),cldVideos){var r=cldVideos[e],o="cloudinary-video-"+e;cld.videoPlayer(o,r)}window.addEventListener("load",(function(){for(var e in cldVideos){var r="cloudinary-video-"+e,o=document.getElementById(r).getElementsByTagName("video");1===o.length&&((o=o[0]).style.width="100%",videoFreeForm&&-1===o.src.indexOf(videoFreeForm)&&!cldVideos[e].overwrite_transformations&&(o.src=o.src.replace("upload/","upload/"+videoFreeForm+"/")))}}))}}()}]); \ No newline at end of file diff --git a/php/class-editor.php b/php/class-editor.php new file mode 100644 index 000000000..db1edc117 --- /dev/null +++ b/php/class-editor.php @@ -0,0 +1,242 @@ +plugin = $plugin; + add_filter( 'cloudinary_api_rest_endpoints', array( $this, 'rest_endpoints' ) ); + } + + /** + * Setup the hooks and base_url if configured. + */ + public function setup() { + if ( $this->plugin->settings->get_param( 'connected' ) ) { + $this->media = $this->plugin->get_component( 'media' ); + add_action( 'edit_form_after_title', array( $this, 'edit_form_image_editor' ), 9 ); + $editor_params = array( + 'storage' => 'transient', + ); + $this->editor = new Settings( self::EDITOR_SLUG, $editor_params ); + add_action( 'current_screen', array( $this, 'init_editor' ) ); + } + } + + /** + * Initialize the editor when needed. + */ + public function init_editor() { + $screen = get_current_screen(); + if ( $screen && 'attachment' === $screen->id ) { + wp_enqueue_media(); + } + } + + /** + * Register the endpoints. + * + * @param array $endpoints The endpoint to add to. + * + * @return array + */ + public function rest_endpoints( $endpoints ) { + + $endpoints['edit_asset'] = array( + 'method' => WP_REST_Server::CREATABLE, + 'callback' => array( $this, 'rest_edit_asset' ), + 'permission_callback' => array( '\Cloudinary\REST_API', 'rest_can_manage_options' ), + 'args' => array(), + ); + $endpoints['restore_asset'] = array( + 'method' => WP_REST_Server::CREATABLE, + 'callback' => array( $this, 'rest_restore_asset' ), + 'permission_callback' => array( '\Cloudinary\REST_API', 'rest_can_manage_options' ), + 'args' => array(), + ); + + return $endpoints; + } + + /** + * Ensure the resize file is the Cloudinary URL. + * + * @param string $file The file path. + * @param int $attachment_id The attachment ID. + * + * @return string + */ + public function get_resized_url( $file, $attachment_id ) { + + if ( isset( $this->editing[ $file ] ) ) { + $file = $this->editing[ $file ]; + } + + return $file; + } + + /** + * Edit an asset. + * + * @param WP_REST_Request $request The request object. + * + * @return WP_Error|WP_HTTP_Response|WP_REST_Response + */ + public function rest_restore_asset( $request ) { + + require_once ABSPATH . 'wp-admin/includes/image.php'; + require_once ABSPATH . 'wp-admin/includes/image-edit.php'; + require_once ABSPATH . 'wp-admin/includes/media.php'; + + $attachment_id = $request->get_param( 'ID' ); + + wp_restore_image( $attachment_id ); + $this->media->sync->get_sync_type( $attachment_id, false ); + $this->media->sync->add_to_sync( $attachment_id ); + $public_id = $this->media->get_public_id( $attachment_id ); + $return = array( + 'publicId' => $public_id, + 'previewUrl' => $this->media->cloudinary_url( $attachment_id, 'raw' ), + 'original' => self::is_original( $attachment_id ), + ); + + return rest_ensure_response( $return ); + } + + /** + * Edit an asset. + * + * @param WP_REST_Request $request The request object. + * + * @return WP_Error|WP_HTTP_Response|WP_REST_Response + */ + public function rest_edit_asset( $request ) { + + require_once ABSPATH . 'wp-admin/includes/image.php'; + require_once ABSPATH . 'wp-admin/includes/image-edit.php'; + require_once ABSPATH . 'wp-admin/includes/media.php'; + + $attachment_id = $request->get_param( 'ID' ); + $download_url = $request->get_param( 'imageUrl' ); + $preview_url = $download_url; + $attachment_transformations = $this->media->get_transformations( $attachment_id, array(), true ); + if ( ! empty( $attachment_transformations ) ) { + $attachment_transformations = Api::generate_transformation_string( $attachment_transformations ); + $download_url = str_replace( trailingslashit( $attachment_transformations ), '', $download_url ); + } + $_REQUEST['history'] = wp_json_encode( array( 'none' => true ) ); + $_REQUEST['target'] = 'all'; // @todo: Make selection for which to edit. + + $file = get_attached_file( $attachment_id ); + $url = wp_get_attachment_url( $attachment_id ); + $this->editing[ $file ] = $download_url; + $this->editing[ $url ] = $download_url; + + add_filter( 'load_image_to_edit_path', array( $this, 'get_resized_url' ), 10, 2 ); + wp_save_image( $attachment_id ); + $this->media->sync->get_sync_type( $attachment_id, false ); + $this->media->sync->add_to_sync( $attachment_id ); + $public_id = $this->media->get_public_id( $attachment_id ); + $return = array( + 'publicId' => $public_id, + 'previewUrl' => $preview_url, + 'original' => self::is_original( $attachment_id ), + ); + + return rest_ensure_response( $return ); + } + + /** + * Embed the Cloudinary Editor. + * + * @param WP_Post $attachment The attachment post. + */ + public function edit_form_image_editor( $attachment ) { + if ( 'attachment' !== $attachment->post_type || ! $this->media->has_public_id( $attachment->ID ) ) { + return; + } + $struct = array( + 'type' => 'editor', + 'attachment' => $attachment, + ); + $editor = new Setting( 'editor', null, $struct ); + $editor->get_component()->render( true ); + } + + /** + * Check if the file is the original or an edited. + * + * @param int $attachment_id The attachment ID. + * + * @return bool + */ + public static function is_original( $attachment_id ) { + $sizes = get_post_meta( $attachment_id, '_wp_attachment_backup_sizes', true ); + $is_original = true; + if ( ! empty( $sizes ) && ! empty( $sizes['full-orig'] ) ) { + $meta = wp_get_attachment_metadata( $attachment_id ); + $is_original = basename( $meta['file'] ) === $sizes['full-orig']['file']; + } + + return $is_original; + } +} diff --git a/php/class-media.php b/php/class-media.php index 150a62fd4..a89c29bae 100644 --- a/php/class-media.php +++ b/php/class-media.php @@ -1803,6 +1803,8 @@ public function editor_assets() { $this->plugin->register_assets(); // Ensure assets are registered. // External assets. wp_enqueue_script( 'cloudinary-media-library', CLOUDINARY_ENDPOINTS_MEDIA_LIBRARY, array(), $this->plugin->version, true ); + wp_enqueue_script( 'cloudinary-media-editor', CLOUDINARY_ENDPOINTS_MEDIA_EDITOR, array(), null, true ); // phpcs:ignore WordPress.WP.EnqueuedResourceParameters.MissingVersion + wp_enqueue_script( 'cloudinary' ); wp_enqueue_style( 'cloudinary' ); $params = array( diff --git a/php/class-plugin.php b/php/class-plugin.php index eed93959c..aaefd8fb0 100644 --- a/php/class-plugin.php +++ b/php/class-plugin.php @@ -150,6 +150,7 @@ public function init() { $this->components['dashboard'] = new Dashboard( $this ); $this->components['extensions'] = new Extensions( $this ); $this->components['svg'] = new SVG( $this ); + $this->components['editor'] = new Editor( $this ); } /** @@ -542,6 +543,12 @@ protected function setup_endpoints() { define( 'CLOUDINARY_ENDPOINTS_MEDIA_LIBRARY', 'https://media-library.cloudinary.com/global/all.js' ); } + /** + * The Cloudinary endpoint for the Media Editor. + */ + if ( ! defined( 'CLOUDINARY_ENDPOINTS_MEDIA_EDITOR' ) ) { + define( 'CLOUDINARY_ENDPOINTS_MEDIA_EDITOR', 'https://media-editor.cloudinary.com/all.js' ); + } /** * The Cloudinary endpoint for the Preview Image. */ diff --git a/php/ui/component/class-editor.php b/php/ui/component/class-editor.php new file mode 100644 index 000000000..866dd81cf --- /dev/null +++ b/php/ui/component/class-editor.php @@ -0,0 +1,290 @@ +attachment = $setting->get_param( 'attachment' ); + $this->media = get_plugin_instance()->get_component( 'media' ); + parent::__construct( $setting ); + } + + /** + * Filter the wrap part structure. + * + * @param array $struct The array structure. + * + * @return array + */ + protected function wrap( $struct ) { + $struct['attributes']['id'] = 'cloudinary-media-editor'; + $struct['attributes']['style'] = 'margin-top:10px;border:solid 1px; border-color: rgb(218, 225, 233);background-color:#fff;'; + + return $struct; + } + + /** + * Filter the preview part structure. + * + * @param array $struct The array structure. + * + * @return array + */ + protected function preview( $struct ) { + + $attachment_id = $this->attachment->ID; + $src = wp_get_attachment_url( $attachment_id ); + $struct['render'] = true; + $struct['element'] = 'div'; + $struct['attributes']['id'] = 'cloudinary-media-preview'; + $type = $this->media->get_resource_type( $attachment_id ); + if ( 'image' === $type ) { + $struct['element'] = 'img'; + $struct['attributes']['src'] = $src; + } elseif ( 'video' === $type ) { + + $meta = wp_get_attachment_metadata( $attachment_id ); + $atts = array( + 'width' => $meta['width'], + 'height' => $meta['height'], + $meta['fileformat'] => $src, + 'id' => $attachment_id, + 'controls' => true, + ); + $params = self::build_attributes( $atts ); + $struct['content'] = do_shortcode( "[video {$params}][/video]" ); + } + $struct['attributes']['style'] = 'max-width:100%'; + + return $struct; + } + + /** + * Filter the title parts structure. + * + * @param array $struct The array structure. + * + * @return array + */ + protected function edit_holder( $struct ) { + $struct['render'] = true; + $struct['element'] = 'div'; + $struct['attributes']['id'] = 'cloudinary-editor'; + $struct['attributes']['style'] = 'display:none;'; + + return $struct; + } + + /** + * Filter the edit control part structure. + * + * @param array $struct The array structure. + * + * @return array + */ + protected function edit_control( $struct ) { + + $struct['element'] = 'div'; + $struct['attributes']['id'] = 'edit-start-wrap'; + $struct['attributes']['style'] = 'padding:6px 6px 8px 6px;'; + $struct['attributes']['class'] = array( + 'cld-row', + ); + + // Button. + $button = $this->get_part( 'button' ); + $button['attributes']['type'] = 'button'; + $button['attributes']['id'] = 'edit-start'; + $button['attributes']['style'] = 'display:none;'; + $button['attributes']['class'] = array( + 'button', + ); + + $type = strstr( $this->attachment->post_mime_type, '/', true ); + // Translators: placeholder is resource type. + $default_label = sprintf( __( 'Edit %s', 'cloudinary' ), $type ); + $button['content'] = $this->setting->get_param( 'edit_label', $default_label ); + + $struct['children']['edit'] = $button; + + return $struct; + } + + /** + * Filter the controls part structure. + * + * @param array $struct The array structure. + * + * @return array + */ + protected function controls( $struct ) { + $struct['element'] = 'div'; + $struct['attributes']['id'] = 'edit-controls-wrap'; + $struct['attributes']['class'] = array( + 'cld-row', + ); + $struct['attributes']['style'] = 'justify-content: space-between;display:none;padding:6px 6px 8px 6px;'; + + return $struct; + } + + /** + * Filter the closer part structure. + * + * @param array $struct The array structure. + * + * @return array + */ + protected function closer( $struct ) { + $struct['element'] = 'button'; + $struct['attributes']['type'] = 'button'; + $struct['attributes']['id'] = 'edit-close'; + $struct['attributes']['class'] = array( + 'button', + ); + + $struct['content'] = __( 'Close', 'cloudinary' ); + + return $struct; + } + + /** + * Filter the save part structure. + * + * @param array $struct The array structure. + * + * @return array + */ + protected function save( $struct ) { + $struct['element'] = 'button'; + $struct['attributes']['type'] = 'button'; + $struct['attributes']['id'] = 'edit-save'; + $struct['attributes']['class'] = array( + 'button', + ); + + $struct['content'] = __( 'Save changes', 'cloudinary' ); + + return $struct; + } + + /** + * Filter the save part structure. + * + * @param array $struct The array structure. + * + * @return array + */ + protected function restore( $struct ) { + $struct['element'] = 'button'; + $struct['attributes']['type'] = 'button'; + $struct['attributes']['id'] = 'edit-restore'; + $struct['attributes']['style'] = 'display:none;'; + $struct['attributes']['class'] = array( + 'button', + ); + $type = strstr( $this->attachment->post_mime_type, '/', true ); + // Translators: placeholder is resource type. + $default_label = sprintf( __( 'Restore %s', 'cloudinary' ), $type ); + $struct['content'] = $this->setting->get_param( 'restore_label', $default_label ); + + return $struct; + } + + /** + * Check if component is enabled. + * + * @return bool + */ + protected function is_enabled() { + return parent::is_enabled() && ! empty( $this->attachment ); + } + + /** + * Enqueue scripts this component may use. + */ + public function enqueue_scripts() { + + $attachment_id = $this->attachment->ID; + $asset = require $this->media->plugin->dir_path . 'js/image-editor.asset.php'; + + wp_enqueue_script( 'image-editor', $this->media->plugin->dir_url . 'js/image-editor.js', $asset['dependencies'], $asset['version'], true ); + + $data = array( + 'assetID' => $attachment_id, + 'publicId' => $this->media->get_public_id( $attachment_id ), + 'resourceType' => $this->media->get_resource_type( $attachment_id ), + 'saveUrl' => rest_url( REST_API::BASE . '/edit_asset' ), + 'restoreUrl' => rest_url( REST_API::BASE . '/restore_asset' ), + 'nonce' => wp_create_nonce( 'wp_rest' ), + 'transformation' => $this->media->get_transformations( $attachment_id ), + 'cloudName' => $this->media->credentials['cloud_name'], + 'original' => MediaEditor::is_original( $attachment_id ), + ); + + $this->media->plugin->add_script_data( 'editor', $data ); + } + + /** + * Setup the JS data before rendering. + */ + protected function pre_render() { + parent::pre_render(); + ?> + + { + this.open(); + } ); + + this.editClose.addEventListener( 'click', () => { + this.close(); + } ); + this.saveButton.addEventListener( 'click', () => { + this.editor.triggerExport(); + } ); + this.restoreButton.addEventListener( 'click', () => { + this.restoreButton.disabled = true; + const data = { + ID: this.config.assetID, + }; + this.restore( data ); + } ); + + this.restoreMaybe(); + // Setup editor. + this.editor = cloudinary.mediaEditor( { appendTo: this.container } ); + const events = [ + 'interactivecropresize', + 'interactivecropmove', + 'flipvertically', + 'fliphorizontally', + 'rotateclockwise', + 'rotatecounterclockwise', + 'aspectratioclick', + 'cropclick', + ]; + + events.forEach( ( event ) => { + this.editor.on( event, ( ev ) => { + this.enableSave(); + } ); + } ); + }, + disableSave() { + if ( 'image' === this.config.resourceType ) { + this.saveButton.disabled = true; + } + }, + enableSave() { + if ( 'image' === this.config.resourceType ) { + this.saveButton.disabled = false; + } + }, + restoreMaybe() { + if ( this.config.original ) { + this.hide( this.restoreButton ); + } else { + this.restoreButton.disabled = false; + this.show( this.restoreButton ); + } + }, + openEditor() { + // Setup preview. + // @todo: check video/audio events. + this.mediaPreview.addEventListener( 'load', () => { + this.mediaPreview.style.opacity = 1; + } ); + + this.updateEditor(); + // Setup export. + this.editor.on( 'export', ( ev ) => { + const data = { + ID: this.config.assetID, + transformations: ev.transformation, + imageUrl: ev.assets[ 0 ].secureUrl, + }; + this.saveButton.disabled = true; + this.save( data ); + //this.close(); + } ); + + // Show. + this.editor.show(); + }, + updateEditor() { + this.editor.update( { + cloudName: this.config.cloudName, + publicIds: [ + { + publicId: this.config.publicId, + resourceType: this.config.resourceType, + }, + ], + mode: 'inline', + image: { + transformation: this.config.transformation, + steps: [ 'resizeAndCrop' ], + resizeAndCrop: { + toggleAspectRatio: true, + }, + export: { + download: false, + quality: [ 'best' ], + share: false, + }, + }, + } ); + this.disableSave(); + }, + hide( element ) { + element.style.display = 'none'; + }, + show( element, display = 'block' ) { + element.style.display = display; + }, + open() { + this.hide( this.startControls ); + this.show( this.editControls, 'flex' ); + this.hide( this.mediaPreview ); + const height = + document.body.offsetHeight - this.container.offsetTop - 200; + this.show( this.container ); + this.container.style.height = height + 'px'; + this.openEditor(); + }, + close() { + this.show( this.startControls ); + this.hide( this.editControls ); + this.show( this.mediaPreview ); + this.hide( this.container ); + this.editor.hide(); + }, + save( data ) { + this.disableSave(); + this.container.style.opacity = 0.5; + apiFetch( { + url: this.config.saveUrl, + data, + method: 'POST', + } ).then( ( result ) => { + this.config.publicId = result.publicId; + this.config.original = result.original; + //this.editor.hide(); + this.updateEditor(); + this.mediaPreview.src = result.previewUrl; + this.container.style.opacity = 1; + this.restoreMaybe(); + } ); + }, + restore( data ) { + this.container.style.opacity = 0.5; + apiFetch( { + url: this.config.restoreUrl, + data, + method: 'POST', + } ).then( ( result ) => { + this.config.publicId = result.publicId; + this.config.original = result.original; + this.updateEditor(); + this.mediaPreview.src = result.previewUrl; + this.container.style.opacity = 1; + this.restoreMaybe(); + } ); + }, +}; + +window.addEventListener( 'load', () => ImageEditor.init() ); + +export default ImageEditor; diff --git a/webpack.config.js b/webpack.config.js index 7dafe0831..86dd00e12 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -198,6 +198,7 @@ const cldInlineLoader = { ...defaultConfig, entry: { 'inline-loader': './src/js/inline-loader.js', + 'image-editor': './src/js/components/image-editor.js', }, output: { path: path.resolve( process.cwd(), 'js' ),