@magflip/core/index.css

Contains core MagFlip objects such as Book, Page, BookShelf, and BookViewer.

body,html{font-family:Noto Sans KR,sans-serif;margin:0;padding:0}#bookShelf{box-sizing:border-box;display:flex;flex-direction:row;gap:20px;padding:20px;width:100vw}#bookShelf .book-holder{border:1px solid #eee;border-radius:5px;box-shadow:1px 1px 5px #eee;padding:3px;position:relative}#bookShelf .book-holder:before{align-items:center;color:#eee;content:"MagZog";display:flex;font-size:24px;height:100%;justify-content:center;position:absolute;width:100%;z-index:-1}#bookShelf .book,#bookShelf .book-holder,#bookShelf .book-on-shelf{width:300px}#bookShelf .book-on-shelf img{height:100%;width:100%}#bookShelf .book-on-shelf:hover{cursor:pointer}#bookViewer.hidden{display:none}#bookViewer{align-items:center;background:hsla(0,0%,100%,.9);box-sizing:border-box;display:flex;height:100vh;justify-content:center;left:0;padding:0;position:fixed;top:0;width:100vw}#bookViewer.flip-view{--s:87px;--c1:#f2f2f2;--c2:#efeeec;--_s:calc(var(--s)*2) calc(var(--s)*2);--_g:35.36% 35.36% at;--_c:#0000 66%,var(--c2) 68% 70%,#0000 72%;background:radial-gradient(var(--_g) 100% 25%,var(--_c)) var(--s) var(--s)/var(--_s),radial-gradient(var(--_g) 0 75%,var(--_c)) var(--s) var(--s)/var(--_s),radial-gradient(var(--_g) 100% 25%,var(--_c)) 0 0/var(--_s),radial-gradient(var(--_g) 0 75%,var(--_c)) 0 0/var(--_s),repeating-conic-gradient(var(--c1) 0 25%,#0000 0 50%) 0 0/var(--_s),radial-gradient(var(--_c)) 0 calc(var(--s)/2)/var(--s) var(--s) var(--c1)}.noselect{user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none}#bookViewer #btnClose{background-color:#222;border:none;border-radius:4px;color:#fff;cursor:pointer;font-size:18px;height:30px;line-height:30px;margin:0;padding:0;position:absolute;right:10px;top:10px;width:30px;z-index:100}img{height:100%;width:100%}