@silentsheet/react/dist/index.css

React component for silentsheet.

.silentsheet-root{margin:0;padding:0;width:100%;height:100vh;display:flex;align-items:flex-start;justify-content:center;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;position:fixed;inset:0;overflow:hidden}.silentsheet-root *{margin:0;padding:0;box-sizing:border-box}.container{height:100vh;width:100%;margin:0;position:relative;animation:fadeIn .3s ease-in;display:flex;flex-direction:column}.textarea{width:100%;flex:1;padding:20px 20px 80px;border:none;resize:none;background:transparent;color:inherit;outline:none;line-height:1.5;-webkit-font-smoothing:antialiased;overflow-y:auto}.textarea::placeholder{color:inherit;opacity:.5}.controls{position:fixed;bottom:16px;left:16px;display:flex;gap:8px;align-items:center;padding:8px;z-index:1000;opacity:.4;transition:opacity .2s;max-width:calc(100% - 32px);transform:translateZ(0)}.controls:before{content:"";position:absolute;inset:0;background:var(--bg-color, #ffffff);opacity:.7;z-index:-1;border-radius:6px}.silentsheet-root[data-theme=light]{--bg-color: #ffffff;--text-color: rgba(0, 0, 0, .8);--hover-bg: rgba(0, 0, 0, .05)}.silentsheet-root[data-theme=sepia]{--bg-color: #f9f7ee;--text-color: rgba(0, 0, 0, .7);--hover-bg: rgba(0, 0, 0, .05)}.silentsheet-root[data-theme=night]{--bg-color: #1a1a1a;--text-color: rgba(255, 255, 255, .8);--hover-bg: rgba(255, 255, 255, .1)}.controls:hover{opacity:1}.controls-group{display:flex;gap:8px;align-items:center;position:relative;flex-wrap:nowrap}.select{background:transparent;border:none;color:var(--text-color);padding:4px;cursor:pointer;font-size:13px;font-family:sans-serif;opacity:.8;transition:all .2s ease;-webkit-appearance:none;-moz-appearance:none;appearance:none;position:relative;min-width:90px;max-width:120px}.select:hover{opacity:1;background:var(--hover-bg)}.select{background-image:url(data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%23666%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E);background-repeat:no-repeat;background-position:right .2rem center;background-size:.7em auto;padding-right:1.2em}.select option{position:relative;background-color:var(--bg-color);color:var(--text-color);font-size:13px;padding:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.font-size-control{display:flex;align-items:center;gap:8px}.font-size-value{font-size:12px;opacity:.8;min-width:32px;font-variant-numeric:tabular-nums;color:var(--text-color)}.range{width:80px;cursor:pointer;opacity:.8;transition:opacity .2s;-webkit-appearance:none;height:2px;background:var(--text-color)}.range:hover{opacity:1}.range::-webkit-slider-thumb{-webkit-appearance:none;width:12px;height:12px;border-radius:50%;background:var(--text-color);cursor:pointer}.range::-moz-range-thumb{width:12px;height:12px;border-radius:50%;background:var(--text-color);cursor:pointer;border:none}.icon-button{display:flex;align-items:center;justify-content:center;padding:6px;border:none;background:transparent;border-radius:4px;cursor:pointer;color:var(--text-color);opacity:.8;transition:all .2s ease}.icon-button:hover{opacity:1;background:var(--hover-bg)}.icon-button svg{width:14px;height:14px}.silentsheet-root[data-theme=light] .select,.silentsheet-root[data-theme=light] .icon-button,.silentsheet-root[data-theme=sepia] .select,.silentsheet-root[data-theme=sepia] .icon-button,.silentsheet-root[data-theme=night] .select,.silentsheet-root[data-theme=night] .icon-button{background-color:var(--bg-color)}@media (max-width: 768px){.font-size-control{gap:6px}.font-size-value{font-size:11px;min-width:28px}.range{width:60px}.controls{flex-wrap:wrap;gap:8px;bottom:12px;left:12px;padding:8px}.controls-group{gap:6px}.select{font-size:12px;min-width:80px;padding:3px}.icon-button svg{width:12px;height:12px}}@media (max-width: 480px){.font-size-control{gap:4px}.font-size-value{font-size:10px;min-width:24px}.range{width:50px}.controls{bottom:8px;left:8px;gap:6px;flex-direction:column;align-items:flex-start;transform:translateZ(0)}.controls-group{gap:4px;width:100%;justify-content:flex-start;position:relative}.controls-group:last-child{justify-content:flex-start}.select{min-width:70px;font-size:12px;position:relative;z-index:2}.select:focus{z-index:3}.controls-group:focus-within{z-index:4}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.word-count{position:fixed;bottom:16px;right:16px;font-size:13px;opacity:.4;transition:opacity .2s;padding:8px;z-index:1000;color:var(--text-color)}.word-count:hover{opacity:1}.silentsheet-root[data-theme=light] .word-count,.silentsheet-root[data-theme=sepia] .word-count{color:#00000080}.silentsheet-root[data-theme=night] .word-count{color:#ffffff80}@media (max-width: 768px){.word-count{bottom:12px;right:12px;font-size:12px}}@media (max-width: 480px){.word-count{bottom:8px;right:8px;font-size:11px}}.timer-button{min-width:90px;text-align:center;padding:8px 12px;border:none;border-radius:4px;background:transparent;color:inherit;font-size:13px;font-family:sans-serif;cursor:pointer;transition:opacity .2s,color .2s;opacity:.8}.timer-button:hover{opacity:1}@media (max-width: 768px){.timer-button{font-size:12px}}@media (max-width: 480px){.timer-button{font-size:12px;min-width:70px}}.github-link{position:fixed;top:16px;right:16px;font-size:13px;color:inherit;text-decoration:none;opacity:.4;transition:opacity .2s;font-family:sans-serif;z-index:1000}.github-link:hover{opacity:1}@media (max-width: 768px){.github-link{top:12px;right:12px;font-size:12px}}@media (max-width: 480px){.github-link{top:8px;right:8px}}.textarea.hemingway-mode{caret-color:#e74c3c}
/*# sourceMappingURL=index.css.map */