styles.css 6.2 KB

1
  1. @-webkit-keyframes sk-bouncedelay{0%,80%,to{-webkit-transform:scale(0)}40%{-webkit-transform:scale(1)}}@keyframes sk-bouncedelay{0%,80%,to{-webkit-transform:scale(0);transform:scale(0)}40%{-webkit-transform:scale(1);transform:scale(1)}}.spinner{display:flex;gap:8px;width:70px;text-align:center}.spinner>div{width:18px;height:18px;background-color:var(--text-muted);border-radius:100%;display:inline-block;-webkit-animation:sk-bouncedelay 1.4s infinite ease-in-out both;animation:sk-bouncedelay 1.4s infinite ease-in-out both}.spinner .bounce1{-webkit-animation-delay:-.32s;animation-delay:-.32s}.spinner .bounce2{-webkit-animation-delay:-.16s;animation-delay:-.16s}.obsidian-banner{position:absolute;top:0;left:0;right:0;height:var(--banner-height);width:100%;overflow:hidden;user-select:none}.obsidian-banner.gradient:not(.error){mask-image:linear-gradient(to bottom,black 50%,transparent);-webkit-mask-image:linear-gradient(to bottom,black 50%,transparent)}.obsidian-banner .banner-message{position:absolute;inset:16px;display:flex;justify-content:center;align-items:center;padding:16px;border:2px solid var(--background-modifier-border)}.obsidian-banner .banner-message p{margin:6px 8px;text-align:center;color:var(--text-muted)}.obsidian-banner .banner-image{position:relative;object-fit:cover;max-width:none;height:100%;width:100%}.obsidian-banner .banner-image.draggable{cursor:grab}.obsidian-banner .banner-image.draggable:active{cursor:grabbing}.obsidian-banner.loaded .banner-message,.obsidian-banner.error .banner-image{display:none}.obsidian-banner-wrapper{margin-top:calc(var(--banner-height) - 15px);padding-top:.5em}.obsidian-banner-spacer{height:calc(var(--banner-height) - 24px)}.obsidian-banner-icon{display:flex;position:relative;font-size:4em;pointer-events:none;user-select:none}.obsidian-banner-icon.h-left{justify-content:flex-start}.obsidian-banner-icon.h-center{justify-content:center}.obsidian-banner-icon.h-right{justify-content:flex-end}.obsidian-banner-icon .icon-box{display:inline-flex;align-items:center;height:calc(1em + 12px);padding:6px;border-radius:4px;pointer-events:initial;transition:ease .2s background}.obsidian-banner-icon .icon-box:hover{background:#aaa3;cursor:pointer}.obsidian-banner-icon img.emoji{height:1em;width:1em;vertical-align:-.1em}.internal-embed .markdown-embed-content .obsidian-banner-wrapper{margin-top:var(--banner-internal-embed-height)}.internal-embed .markdown-embed-content .obsidian-banner-wrapper>.obsidian-banner{height:var(--banner-internal-embed-height)}.internal-embed .markdown-embed-content .obsidian-banner-wrapper>.obsidian-banner img{cursor:initial}.popover .markdown-embed-content .obsidian-banner-wrapper{margin-top:var(--banner-preview-embed-height)}.popover .markdown-embed-content .obsidian-banner-wrapper>.obsidian-banner{height:var(--banner-preview-embed-height)}.popover .markdown-embed-content .obsidian-banner-wrapper>.obsidian-banner img{cursor:initial}.obsidian-banner-wrapper.has-banner-icon{padding-top:0}.obsidian-banner-wrapper.has-banner-icon .obsidian-banner-icon.v-above{margin-top:calc(-1em - 12px)}.obsidian-banner-wrapper.has-banner-icon .obsidian-banner-icon.v-center,.obsidian-banner-wrapper.has-banner-icon .obsidian-banner-icon.v-custom{margin-top:calc(-0.5em - 6px)}.obsidian-banner-wrapper.has-banner-icon .obsidian-banner-icon.v-below{padding-top:.5rem}.has-banner .cm6-banner-icon.v-above{margin-top:calc(-1em - 12px)}.has-banner .cm6-banner-icon.v-center,.has-banner .cm6-banner-icon.v-custom{margin-top:calc(-0.5em - 6px)}.has-banner .cm6-banner-icon.v-below{margin:.5rem 0}.markdown-source-view.mod-cm6 .cm-line.has-banner,.markdown-source-view.mod-cm6 .cm-line.has-banner-icon{position:inherit}.markdown-source-view.mod-cm6 .cm-line.has-banner .cm-fold-indicator,.markdown-source-view.mod-cm6 .cm-line.has-banner-icon .cm-fold-indicator{position:absolute}.markdown-source-view.mod-cm6 .cm-line.has-banner-icon .cm6-banner-icon,.markdown-source-view.mod-cm6 .cm-line.has-banner:not(.has-banner-icon) .obsidian-banner-spacer{margin-bottom:1.5rem}.markdown-source-view.mod-cm6 .cm-line.has-banner-icon:not(.has-banner) .cm-fold-indicator{top:calc(4em + 60px)}.markdown-source-view.mod-cm6 .cm-line.has-banner:not(.has-banner-icon) .cm-fold-indicator{top:calc(var(--banner-height) + 25px)}.markdown-source-view.mod-cm6 .cm-line.has-banner.has-banner-icon[data-icon-v=above] .cm-fold-indicator{top:calc(var(--banner-height) + 25px)}.markdown-source-view.mod-cm6 .cm-line.has-banner.has-banner-icon[data-icon-v=center] .cm-fold-indicator,.markdown-source-view.mod-cm6 .cm-line.has-banner.has-banner-icon[data-icon-v=custom] .cm-fold-indicator{top:calc(var(--banner-height) + 2em + 31px)}.markdown-source-view.mod-cm6 .cm-line.has-banner.has-banner-icon[data-icon-v=below] .cm-fold-indicator{top:calc(var(--banner-height) + 4em + 45px)}.banner-local-image-modal .banner-suggestion-item{padding:6px 10px}.banner-local-image-modal .suggestion-text{height:0;margin:0;padding-left:10px}.banner-local-image-modal .suggestion-image-wrapper{position:relative;height:200px;width:100%;margin:6px 0;overflow:hidden}.banner-local-image-modal .suggestion-image-wrapper img{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:100%;object-fit:cover}.banner-icon-modal span.regular-emoji{font-size:1.2em;vertical-align:bottom}.banner-icon-modal img.emoji{margin-right:.5em;height:1.2em;width:1.2em;vertical-align:middle}.banner-settings .banner-setting-header{display:block;padding:6px 0}.banner-settings .banner-setting-header p{margin:0;font-size:1.2em}.banner-settings .banner-setting-header .banner-setting-header-title{font-size:1.3em}.banner-settings .banner-setting-header .banner-setting-header-description{margin-top:2px;font-size:.7em;color:var(--text-muted);line-height:18px}.banner-settings .setting-item-control{gap:8px}.is-mobile .has-banner-icon{margin-top:20px}.is-mobile .obsidian-banner-wrapper{margin-top:var(--banner-height)}.is-mobile .obsidian-banner-wrapper:not(.has-banner-icon){margin-top:calc(var(--banner-height) + 20px)}@media print{.obsidian-banner-wrapper{margin-top:0}.obsidian-banner-wrapper>.obsidian-banner{position:initial;margin-bottom:20px}.has-banner-icon,.has-banner-icon .obsidian-banner-icon,.obsidian-banner-wrapper.has-banner-icon{margin-top:0}.obsidian-banner-wrapper.has-banner-icon .obsidian-banner-icon{position:initial}}