@ninesstudios/whiteboard 0.2.0 → 0.2.2

package/dist/whiteboard.css

@@ -1 +1 @@
-.wb-watermark{position:absolute;bottom:0;right:0;padding:8px 12px;background-color:#fffc;border-top-left-radius:8px;font-family:sans-serif;font-size:14px;color:#666;pointer-events:none;z-index:1000;-webkit-user-select:none;user-select:none;text-decoration:none}.wb-lock-indicator{position:absolute;top:10px;left:10px;background-color:#ff4444e6;color:#fff;padding:8px 16px;border-radius:4px;display:flex;align-items:center;gap:8px;box-shadow:0 2px 4px #0003;z-index:1000;pointer-events:none;-webkit-user-select:none;user-select:none;font-family:sans-serif;font-size:14px;font-weight:500;transition:left .3s ease}.wb-lock-indicator.wb-shifted{left:60px}.wb-toolbar{position:absolute;left:10px;top:50%;transform:translateY(-50%);width:44px;padding:1px;margin:10px auto;z-index:1000;border:1px solid #ccc;background:#fff;border-radius:8px;display:flex;flex-direction:column;justify-content:space-between;align-items:center;box-shadow:0 2px 8px #0000001a}.wb-toolbar>button:first-child{border-top-left-radius:8px;border-top-right-radius:8px}.wb-toolbar>button:last-child{border-bottom-left-radius:8px;border-bottom-right-radius:8px}.wb-toolbar>.wb-language-container:last-child button{border-bottom-left-radius:8px;border-bottom-right-radius:8px}.wb-toolbar button{width:40px;height:40px;border:none;border-radius:4px;background-color:#fff;cursor:pointer;transition:background .3s;text-align:center;line-height:40px;display:flex;justify-content:center;align-items:center}.wb-toolbar button:hover{background:#e9e9e9}.wb-toolbar button.wb-active{background:#d0e8ff;color:#06c}.wb-ellipsis-container{position:relative}.wb-shapes-popup{position:absolute;left:50px;top:50%;transform:translateY(-50%);background:#fff;border:1px solid #ccc;border-radius:8px;box-shadow:0 4px 12px #00000026;padding:8px;min-width:160px;z-index:1001}.wb-shapes-popup-header{font-size:12px;font-weight:600;color:#666;padding:4px 8px 8px;border-bottom:1px solid #eee;margin-bottom:8px}.wb-shapes-popup-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:4px}.wb-shapes-popup-grid button{width:36px;height:36px;padding:0;display:flex;align-items:center;justify-content:center;font-size:16px}.wb-shapes-popup-grid button:hover{background:#e9e9e9}.wb-shapes-popup-grid button.wb-active{background:#d0e8ff;color:#06c}.wb-language-container{position:relative}.wb-language-popup{position:absolute;left:50px;top:50%;transform:translateY(-50%);background:#fff;border:1px solid #ccc;border-radius:8px;box-shadow:0 4px 12px #00000026;padding:8px;min-width:140px;z-index:1001}.wb-language-popup-header{font-size:12px;font-weight:600;color:#666;padding:4px 8px 8px;border-bottom:1px solid #eee;margin-bottom:8px}.wb-language-options{display:flex;flex-direction:column;gap:4px}.wb-language-options button{width:100%;height:32px;padding:0 8px;display:flex;align-items:center;justify-content:flex-start;font-size:14px;gap:8px;border-radius:4px}.wb-language-options button:hover{background:#e9e9e9}.wb-language-options button.wb-active{background:#d0e8ff;color:#06c}@media(max-width:768px){.wb-toolbar{top:auto;bottom:20px;left:50%;transform:translate(-50%);width:auto;height:44px;flex-direction:row;padding:4px}.wb-toolbar>button:first-child{border-top-left-radius:8px;border-bottom-left-radius:8px;border-top-right-radius:0}.wb-toolbar>button:last-child{border-top-right-radius:8px;border-bottom-right-radius:8px;border-bottom-left-radius:0}.wb-toolbar .wb-language-container:last-child button{border-top-right-radius:8px;border-bottom-right-radius:8px;border-bottom-left-radius:0}.wb-shapes-popup,.wb-language-popup{left:50%;top:auto;bottom:60px;transform:translate(-50%)}.wb-toolbar button{margin:0 2px}}@media(min-width:769px)and (max-height:600px){.wb-toolbar{width:36px;padding:1px}.wb-toolbar button{width:32px;height:32px;line-height:32px;font-size:12px}.wb-shapes-popup,.wb-language-popup{left:40px}}.wb-confirm-popup-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#00000080;z-index:1000;display:flex;justify-content:center;align-items:center;animation:fadeIn .3s ease-out forwards}.wb-confirm-popup-overlay.wb-closing{animation:fadeOut .3s ease-in forwards}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}.wb-confirm-popup{background-color:#fff;padding:20px;border-radius:5px;box-shadow:0 2px 10px #0000001a;z-index:1001;min-width:200px;display:flex;flex-direction:column;align-items:center;animation:popIn .3s cubic-bezier(.175,.885,.32,1.275) forwards}.wb-confirm-popup-overlay.wb-closing .wb-confirm-popup{animation:popOut .3s ease-in forwards}@keyframes popIn{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}@keyframes popOut{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.8)}}.wb-actions{display:flex;justify-content:flex-end;width:100%}.wb-actions button{margin-left:10px;padding:10px 20px;border:none;border-radius:5px;cursor:pointer;background-color:#007bff;color:#fff}.wb-actions button:first-child{margin-left:0}.wb-prop-tools{position:absolute;bottom:10px;left:10px;padding:1px;margin:10px auto;z-index:1000;border:1px solid #ccc;background:#fff;border-radius:8px;display:flex;flex-direction:row;justify-content:space-between;align-items:center;box-shadow:0 2px 8px #0000001a;transition:left .3s ease,bottom .3s ease,transform .3s ease}.wb-prop-tools>button:first-child{border-top-left-radius:8px;border-top-right-radius:8px}.wb-prop-tools>button:last-child{border-bottom-left-radius:8px;border-bottom-right-radius:8px}.wb-prop-tools button{width:40px;height:40px;border:none;border-radius:4px;background-color:#fff;cursor:pointer;transition:background .3s;text-align:center;line-height:40px;display:flex;justify-content:center;align-items:center}.wb-prop-tools button:hover{background:#e9e9e9}.wb-prop-tools button.wb-active{background:#d0e8ff;color:#06c}.wb-prop-tools select{width:36px;height:36px;border:none;border-radius:4px;background-color:#fff;cursor:pointer;text-align:center;line-height:36px;display:flex;justify-content:center;align-items:center;font-size:14px}.wb-prop-tool-item{min-width:80px;margin:2px 4px;display:flex;flex-direction:column;justify-content:space-between;align-items:center}.wb-prop-tool-item>*{text-align:center;flex:auto;min-height:30px;width:100%;box-sizing:border-box;padding-left:4px;padding-right:4px}.wb-prop-tool-item>span{font-size:12px;color:#555;margin-bottom:4px;display:flex;justify-content:center;align-items:center;text-align:center;white-space:nowrap}.wb-layer-buttons{display:flex;flex-direction:row;gap:4px;justify-content:center}.wb-layer-buttons button{width:36px;height:36px;padding:0;display:flex;justify-content:center;align-items:center}@media(max-width:768px){.wb-prop-tools{bottom:80px;left:50%;margin:0;transform:translate(-50%);flex-wrap:wrap;justify-content:center;max-width:90vw}.wb-prop-tools>button:first-child{border-top-left-radius:8px;border-bottom-left-radius:8px;border-top-right-radius:0}.wb-prop-tools>button:last-child{border-top-right-radius:8px;border-bottom-right-radius:8px;border-bottom-left-radius:0}}.wb-prop-tools.wb-shifted{left:60px}.wb-canvas-tools{position:absolute;left:50%;transform:translate(-50%);top:10px;bottom:auto;z-index:1000;border:1px solid #ccc;background:#fff;border-radius:8px;padding:1px;display:flex;flex-direction:row;box-shadow:0 2px 8px #0000001a}.wb-canvas-tools button{width:40px;height:40px;border:none;border-radius:4px;background-color:#fff;cursor:pointer;transition:background .3s;text-align:center;line-height:40px;display:flex;justify-content:center;align-items:center;margin:0 2px}.wb-canvas-tools button:hover{background:#e9e9e9}.wb-canvas-tools>button:first-child{border-top-left-radius:8px;border-bottom-left-radius:8px}.wb-canvas-tools>button:last-child{border-top-right-radius:8px;border-bottom-right-radius:8px}@media(max-width:768px){.wb-canvas-tools{top:10px;bottom:auto}}
+.wb-watermark{position:absolute;bottom:0;right:0;padding:8px 12px;background-color:#fffc;border-top-left-radius:8px;font-family:sans-serif;font-size:14px;color:#666;pointer-events:none;z-index:1000;-webkit-user-select:none;user-select:none;text-decoration:none}.wb-lock-indicator{position:absolute;top:10px;left:10px;background-color:#ff4444e6;color:#fff;padding:8px 16px;border-radius:4px;display:flex;align-items:center;gap:8px;box-shadow:0 2px 4px #0003;z-index:1000;pointer-events:none;-webkit-user-select:none;user-select:none;font-family:sans-serif;font-size:14px;font-weight:500;transition:left .3s ease}.wb-lock-indicator.wb-shifted{left:60px}.wb-toolbar{position:absolute;left:10px;top:50%;transform:translateY(-50%);width:44px;padding:1px;margin:10px auto;z-index:1000;border:1px solid #ccc;background:#fff;border-radius:8px;display:flex;flex-direction:column;justify-content:space-between;align-items:center;box-shadow:0 2px 8px #0000001a}.wb-toolbar>button:first-child{border-top-left-radius:8px;border-top-right-radius:8px}.wb-toolbar>button:last-child{border-bottom-left-radius:8px;border-bottom-right-radius:8px}.wb-toolbar>.wb-language-container:last-child button{border-bottom-left-radius:8px;border-bottom-right-radius:8px}.wb-toolbar button{width:40px;height:40px;border:none;border-radius:4px;background-color:#fff;cursor:pointer;transition:background .3s;text-align:center;line-height:40px;display:flex;justify-content:center;align-items:center}.wb-toolbar button:hover{background:#e9e9e9}.wb-toolbar button.wb-active{background:#d0e8ff;color:#06c}.wb-ellipsis-container{position:relative}.wb-shapes-popup{position:absolute;left:50px;top:50%;transform:translateY(-50%);background:#fff;border:1px solid #ccc;border-radius:8px;box-shadow:0 4px 12px #00000026;padding:8px;min-width:160px;z-index:1001}.wb-shapes-popup-header{font-size:12px;font-weight:600;color:#666;padding:4px 8px 8px;border-bottom:1px solid #eee;margin-bottom:8px}.wb-shapes-popup-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:4px}.wb-shapes-popup-grid button{width:36px;height:36px;padding:0;display:flex;align-items:center;justify-content:center;font-size:16px}.wb-shapes-popup-grid button:hover{background:#e9e9e9}.wb-shapes-popup-grid button.wb-active{background:#d0e8ff;color:#06c}.wb-language-container{position:relative}.wb-language-popup{position:absolute;left:50px;top:50%;transform:translateY(-50%);background:#fff;border:1px solid #ccc;border-radius:8px;box-shadow:0 4px 12px #00000026;padding:8px;min-width:140px;z-index:1001}.wb-language-popup-header{font-size:12px;font-weight:600;color:#666;padding:4px 8px 8px;border-bottom:1px solid #eee;margin-bottom:8px}.wb-language-options{display:flex;flex-direction:column;gap:4px}.wb-language-options button{width:100%;height:32px;padding:0 8px;display:flex;align-items:center;justify-content:flex-start;font-size:14px;gap:8px;border-radius:4px}.wb-language-options button:hover{background:#e9e9e9}.wb-language-options button.wb-active{background:#d0e8ff;color:#06c}@media(max-width:768px){.wb-toolbar{top:auto;bottom:20px;left:50%;transform:translate(-50%);width:auto;height:44px;flex-direction:row;padding:4px}.wb-toolbar>button:first-child{border-top-left-radius:8px;border-bottom-left-radius:8px;border-top-right-radius:0}.wb-toolbar>button:last-child{border-top-right-radius:8px;border-bottom-right-radius:8px;border-bottom-left-radius:0}.wb-toolbar .wb-language-container:last-child button{border-top-right-radius:8px;border-bottom-right-radius:8px;border-bottom-left-radius:0}.wb-shapes-popup,.wb-language-popup{left:50%;top:auto;bottom:60px;transform:translate(-50%)}.wb-toolbar button{margin:0 2px}}@media(min-width:769px)and (max-height:600px){.wb-toolbar{width:36px;padding:1px}.wb-toolbar button{width:32px;height:32px;line-height:32px;font-size:12px}.wb-shapes-popup,.wb-language-popup{left:40px}}.wb-confirm-popup-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#00000080;z-index:1000;display:flex;justify-content:center;align-items:center;animation:fadeIn .3s ease-out forwards}.wb-confirm-popup-overlay.wb-closing{animation:fadeOut .3s ease-in forwards}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}.wb-confirm-popup{background-color:#fff;padding:20px;border-radius:5px;box-shadow:0 2px 10px #0000001a;z-index:1001;min-width:200px;display:flex;flex-direction:column;align-items:center;animation:popIn .3s cubic-bezier(.175,.885,.32,1.275) forwards}.wb-confirm-popup-overlay.wb-closing .wb-confirm-popup{animation:popOut .3s ease-in forwards}@keyframes popIn{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}@keyframes popOut{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.8)}}.wb-actions{display:flex;justify-content:flex-end;width:100%}.wb-actions button{margin-left:10px;padding:10px 20px;border:none;border-radius:5px;cursor:pointer;background-color:#007bff;color:#fff}.wb-actions button:first-child{margin-left:0}.wb-prop-tools{position:absolute;bottom:10px;left:10px;padding:1px;margin:10px auto;z-index:1000;border:1px solid #ccc;background:#fff;border-radius:8px;display:flex;flex-direction:row;justify-content:space-between;align-items:center;box-shadow:0 2px 8px #0000001a;transition:left .3s ease,bottom .3s ease,transform .3s ease}.wb-prop-tools>button:first-child{border-top-left-radius:8px;border-top-right-radius:8px}.wb-prop-tools>button:last-child{border-bottom-left-radius:8px;border-bottom-right-radius:8px}.wb-prop-tools button{width:40px;height:40px;border:none;border-radius:4px;background-color:#fff;cursor:pointer;transition:background .3s;text-align:center;line-height:40px;display:flex;justify-content:center;align-items:center}.wb-prop-tools button:hover{background:#e9e9e9}.wb-prop-tools button.wb-active{background:#d0e8ff;color:#06c}.wb-prop-tools select{width:36px;height:36px;border:none;border-radius:4px;background-color:#fff;cursor:pointer;text-align:center;line-height:36px;display:flex;justify-content:center;align-items:center;font-size:14px}.wb-prop-tool-item{min-width:80px;margin:2px 4px;display:flex;flex-direction:column;justify-content:space-between;align-items:center}.wb-prop-tool-item>*{text-align:center;flex:auto;min-height:30px;width:100%;box-sizing:border-box;padding-left:4px;padding-right:4px}.wb-prop-tool-item>span{font-size:12px;color:#555;margin-bottom:4px;display:flex;justify-content:center;align-items:center;text-align:center;white-space:nowrap}.wb-layer-buttons{display:flex;flex-direction:row;gap:4px;justify-content:center}.wb-layer-buttons button{width:36px;height:36px;padding:0;display:flex;justify-content:center;align-items:center}@media(max-width:768px){.wb-prop-tools{bottom:80px;left:50%;margin:0;transform:translate(-50%);flex-wrap:wrap;justify-content:center;max-width:90vw}.wb-prop-tools>button:first-child{border-top-left-radius:8px;border-bottom-left-radius:8px;border-top-right-radius:0}.wb-prop-tools>button:last-child{border-top-right-radius:8px;border-bottom-right-radius:8px;border-bottom-left-radius:0}}.wb-prop-tools.wb-shifted{left:60px}.wb-canvas-tools{position:absolute;left:50%;transform:translate(-50%);top:10px;bottom:auto;z-index:1000;border:1px solid #ccc;background:#fff;border-radius:8px;padding:1px;display:flex;flex-direction:row;box-shadow:0 2px 8px #0000001a}.wb-canvas-tools button{width:40px;height:40px;border:none;border-radius:4px;background-color:#fff;cursor:pointer;transition:background .3s;text-align:center;line-height:40px;display:flex;justify-content:center;align-items:center;margin:0 2px}.wb-canvas-tools button:hover{background:#e9e9e9}.wb-canvas-tools>button:first-child{border-top-left-radius:8px;border-bottom-left-radius:8px}.wb-canvas-tools>button:last-child{border-top-right-radius:8px;border-bottom-right-radius:8px}@media(max-width:768px){.wb-canvas-tools{top:10px;bottom:auto}}.wb-pdf-navigation{position:absolute;bottom:20px;left:50%;transform:translate(-50%);display:flex;align-items:center;background-color:#fff;padding:8px 16px;border-radius:8px;box-shadow:0 2px 10px #0000001a;z-index:1000;gap:12px;font-family:sans-serif;font-size:14px;color:#333}.wb-pdf-nav-button{background:none;border:1px solid #e0e0e0;border-radius:4px;cursor:pointer;padding:6px;display:flex;align-items:center;justify-content:center;color:#555;transition:all .2s}.wb-pdf-nav-button:hover:not(:disabled){background-color:#f0f0f0;color:#000}.wb-pdf-nav-button:disabled{opacity:.5;cursor:not-allowed;border-color:#f0f0f0}.wb-pdf-delete:hover:not(:disabled){background-color:#ffebee;color:#d32f2f;border-color:#ef9a9a}.wb-pdf-separator{width:1px;height:24px;background-color:#e0e0e0;margin:0 4px}.wb-pdf-page-info{font-weight:500;min-width:80px;text-align:center}