diff --git a/README.md b/README.md index bc6b9ed..918ee6c 100644 --- a/README.md +++ b/README.md @@ -1,27 +1,37 @@ -# Website Builder (未完成) -*當前僅適配1024以上的顯示* +# Website Builder (In Progress) +*Currently only compatible with displays of 1024 and above* -## Over 30 Examples (4 / 32) +## Features +- Various pre-made modules are available for use. + ![](./image/md/0.jpg) +- Easy to edit content text and css style. + ![](./image/md/1.jpg) + ![](./image/md/2.jpg) +- Over 30 pre-made examples (4 / 32) -| ![001](./image/001.jpg) | ![002](./image/002.jpg) | -| - | - | -| ![003](./image/003.jpg) | ![003](./image/004.jpg) | +### Develop +- Built using HTML, CSS / Sass and JavaScript. +- Rendered using [PDExtension-js](https://github.com/pardnchiu/PDExtension-js). +- Use [Font Awesome 6](https://fontawesome.com/v6/search) icons and [Freepik](https://www.freepik.com/) images. +- Preview available [Here](https://pardnchiu.github.io/website-builder). -## 功能特點 +#### Examples -- 使用Html、Css / Sass和JavaScript編寫。 -- 使用[Font Awesome 6](https://fontawesome.com/v6/search)圖標。 -- 可以在[此處](https://pardnchiu.github.io/website-builder/)進行預覽。 -- 可以在[GitHub](https://github.com/pardnchiu/website-builder)上找到源碼。 +| ![001](./image/preview/template/full/001.jpg) | +| - | +| ![002](./image/preview/template/full/002.jpg) | +| ![003](./image/preview/template/full/003.jpg) | +| ![003](./image/preview/template/full/004.jpg) | -## 作者和貢獻者 +## Contributor -- [Pardn Ltd 帕登國際有限公司](https://linkedin.com/company/pardnltd) - [Pardn Chiu 邱敬幃](https://linkedin.com/in/pardnchiu) -## 授權 +## License -本源碼項目使用GPL-3.0 license授權。 +This source code project is licensed under the GPL-3.0 license. -版權所有 (c) 2023 [Pardn Ltd 帕登國際有限公司](https://www.linkedin.com/company/pardnltd) +*** + +©️ 2024 [Pardn Chiu 邱敬幃](https://linkedin.com/in/pardnchiu) diff --git a/css/index.css b/css/index.css index e7adb0e..d10416b 100644 --- a/css/index.css +++ b/css/index.css @@ -1 +1 @@ -*{position:relative;margin:0;padding:0;font-size:1em;font-family:"Noto Sans TC",sans-serif;letter-spacing:0;border:none;outline:none;background-color:rgba(0,0,0,0);color:hsl(223, 82%, 6%);word-wrap:break-word;text-decoration:none;box-sizing:border-box;-ms-overflow-style:none;scrollbar-width:none;-webkit-overflow-scrolling:touch;touch-action:manipulation;-webkit-touch-callout:inherit;-webkit-user-select:inherit;-khtml-user-select:inherit;-moz-user-select:inherit;-ms-user-select:inherit;user-select:inherit}*::-webkit-scrollbar{display:none}*.rz::-webkit-scrollbar{display:block;width:.25rem;background-color:hsl(223, 14%, 97%)}*.rz::-webkit-scrollbar-thumb{background-color:hsl(223, 11%, 81%)}*.rz.vert{resize:vertical}* [user-select=false],* [user-select="0"]{-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}* [user-select=true],* [user-select="1"]{-webkit-touch-callout:initial;-webkit-user-select:initial;-khtml-user-select:initial;-moz-user-select:initial;-ms-user-select:initial;user-select:initial}*::before,*::after{box-sizing:border-box}img{content:url("data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==");object-fit:cover}img[src]:not([src=""]){content:unset}img[data-src]{background:linear-gradient(to right, #EEF0F3, #E0E2E8, #EEF0F3)}textarea{resize:none}input,textarea,select{-webkit-appearance:none;-moz-appearance:none;appearance:none}input::placeholder,textarea::placeholder{color:hsl(223, 11%, 81%);opacity:1}input::-webkit-input-placeholder,textarea::-webkit-input-placeholder{color:hsl(223, 11%, 81%)}input::-ms-input-placeholder,textarea::-ms-input-placeholder{color:hsl(223, 11%, 81%)}a[href]:not([href=""]),button{cursor:pointer}span,b,strong,i,em,time{line-height:inherit;font-size:inherit;color:inherit}html{position:fixed;display:block;width:100%;height:100%;overflow:hidden}body{position:relative;display:flex;flex-flow:column;align-items:flex-start;width:100%;height:100%;background-color:rgba(0,0,0,.0509803922);overflow:hidden scroll}body[ready="0"] *,body[ready="0"] *::before,body[ready="0"] *::after,body:not(.ready) *,body:not(.ready) *::before,body:not(.ready) *::after{transition:none !important}body>div.mask{position:fixed;z-index:1000;top:0;left:0;bottom:0;right:0;width:100%;height:100%;backdrop-filter:blur(2rem);-webkit-backdrop-filter:blur(2rem)}@media screen and (min-width: 1024px){body>div.mask{display:none}}body>div.mask p{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);margin-right:-50%;max-width:calc(100% - 2rem);font-size:.875rem;color:hsl(223, 11%, 32%)}body.builder[data-type=mobile]>nav>section>section:nth-child(2) i.fa-mobile-screen-button{color:hsl(223, 75%, 52%)}body.builder[data-type=mobile]>nav>section>section:nth-child(2) i.fa-desktop{color:#000}body.builder[data-type=mobile]>section.body>iframe{max-width:414px !important}body.builder[data-type=tablet]>nav>section>section:nth-child(2) i.fa-tablet-screen-button{color:hsl(223, 75%, 52%)}body.builder[data-type=tablet]>nav>section>section:nth-child(2) i.fa-desktop{color:#000}body.builder[data-type=tablet]>section.body>iframe{max-width:768px !important}body.builder[data-type=code]>nav>section>section:nth-child(2) i.fa-code{color:hsl(223, 75%, 52%)}body.builder[data-type=code]>nav>section>section:nth-child(2) i.fa-desktop{color:#000}body.builder[data-type=code]>section.body>iframe{display:none}body.builder[data-left="1"]>nav>section>section:nth-child(2) svg.bl path{fill:hsl(223, 75%, 52%)}body.builder[data-left="1"]>section.left{left:0}body.builder[data-left="1"]>section.body{padding-left:16rem}body.builder[data-right="1"]>nav>section section:nth-child(2) svg.br path{fill:hsl(223, 75%, 52%)}body.builder[data-right="1"]>section.right{right:0}body.builder[data-right="1"]>section.body{padding-right:22.5rem}body.builder>nav{position:sticky;z-index:1000;top:0;left:0;right:0;width:100%;background-color:#fffefc;border-bottom:1px solid rgba(0,0,0,.1019607843)}body.builder>nav>section{display:flex;justify-content:space-between;align-items:center;margin:0 auto;padding:0 1rem;width:100%;height:5rem}body.builder>nav>section>section:nth-child(1){display:flex;align-items:center;gap:.5rem}body.builder>nav>section>section:nth-child(1):has(svg)>strong.logo{margin-left:-0.5rem}body.builder>nav>section>section:nth-child(1)>svg{flex-shrink:0;height:2.75rem}body.builder>nav>section>section:nth-child(1) strong.logo{letter-spacing:-0.25px;font-size:1.25rem;white-space:nowrap;overflow:hidden;transition:.3s}body.builder>nav>section>section:nth-child(1) strong.logo span{letter-spacing:-1px;font-size:1.5rem;color:hsl(223, 75%, 52%)}body.builder>nav>section>section:nth-child(2){position:absolute;display:flex;align-items:center;gap:1.5rem;top:0;left:50%;transform:translateX(-50%);height:100%}body.builder>nav>section>section:nth-child(2) i{width:1.25rem;text-align:center;cursor:pointer;transition:.2s}@media(hover: hover)and (pointer: fine){body.builder>nav>section>section:nth-child(2) i:hover{font-size:1.125rem}}body.builder>nav>section>section:nth-child(2) i.fa-desktop{color:hsl(223, 75%, 52%)}body.builder>nav>section>section:nth-child(2) svg{width:1.25rem;height:1rem;transition:.2s;cursor:pointer}@media(hover: hover)and (pointer: fine){body.builder>nav>section>section:nth-child(2) svg:hover{height:1.125rem}}body.builder>nav>section>section:nth-child(2) svg path{fill:#000}body.builder>nav>section>section:nth-child(2) div{width:1px;height:.75rem;background-color:rgba(0,0,0,.2)}body.builder>nav>section>section:nth-child(3){display:flex;align-items:center;gap:1.5rem}body.builder>nav>section>section:nth-child(3) section{display:flex;align-items:center;gap:1rem}body.builder>nav>section>section:nth-child(3) section button{display:flex;align-items:center;gap:.5rem;padding:0 1rem;line-height:2.5rem;background-color:hsl(223, 14%, 97%);border-radius:1.25rem}body.builder>nav>section>section:nth-child(3) section button.clr{background-color:hsl(223, 75%, 52%);color:#fff}body.builder>nav>section>section:nth-child(3) section button.pub{position:relative;padding:0 0 0 1rem;font-size:.875rem;background-color:rgba(0,0,0,0);color:hsl(223, 14%, 97%)}body.builder>nav>section>section:nth-child(3) section button.pub::before{content:"";position:absolute;top:0;left:0;bottom:0;margin:auto 0;width:.5rem;height:.5rem;border-radius:50%;background-color:hsl(223, 14%, 97%)}body.builder>nav>section>section:nth-child(3) section button i{font-size:inherit;color:inherit}body.builder>nav>section>section:nth-child(3) img.head{width:2.75rem;height:2.75rem;border-radius:50%;border:.5px solid rgba(0,0,0,.0509803922);cursor:pointer}body.builder>section.body{width:100%;height:calc(100% - 5rem);transition:.3s}body.builder>section.body section.code{display:flex;width:100%;height:100%;background-color:hsl(223, 82%, 6%)}body.builder>section.body section.code>section{position:relative;display:block;padding:.5rem;width:50%;height:100%;min-height:1.75rem;line-height:1.75rem;letter-spacing:1px;font-family:monospace;font-size:1rem;color:#fff;overflow:hidden scroll}body.builder>section.body section.code>section::before{content:attr(hint);position:absolute;top:50%;left:0;width:100%;text-align:center;letter-spacing:.25rem;font-size:4rem;color:rgba(255,255,255,.1019607843)}body.builder>section.body section.code>section div{line-height:inherit;letter-spacing:inherit;font-family:inherit;font-size:inherit;color:inherit}body.builder>section.body section.code>section:nth-child(1){border-right:1px solid hsl(223, 5%, 92%)}body.builder>section.body>iframe{display:block;margin:0 auto;width:100%;max-width:100%;height:initial;min-height:100%;transition:.3s;container-type:inline-size}body.builder ul.tab{display:flex;list-style:none;width:100%}body.builder ul.tab[index="0"] li:nth-child(2),body.builder ul.tab[index="1"] li:nth-child(1){background-color:rgba(0,0,0,.0509803922)}body.builder ul.tab li{display:flex;justify-content:center;align-items:center;gap:.5rem;flex:1;line-height:2rem;text-align:center;font-size:.875rem;font-weight:500;cursor:pointer}body.builder ul.tab li i{width:1.25rem;text-align:center;font-size:inherit;color:inherit}body.builder ul.button{display:flex;flex-flow:row;gap:.5rem;padding:.75rem .5rem;width:100%;list-style:none;border-bottom:1px solid rgba(0,0,0,.1019607843)}body.builder ul.button.r2[index="0"] li:nth-child(1),body.builder ul.button.r3[index="0"] li:nth-child(1){background-color:hsl(223, 75%, 52%);color:#fff}body.builder ul.button.r2[index="1"] li:nth-child(2),body.builder ul.button.r3[index="1"] li:nth-child(2){background-color:hsl(223, 75%, 52%);color:#fff}body.builder ul.button.r2[index="2"] li:nth-child(3),body.builder ul.button.r3[index="2"] li:nth-child(3){background-color:hsl(223, 75%, 52%);color:#fff}body.builder ul.button.r2 li,body.builder ul.button.r3 li{gap:.5rem;font-size:.875rem}body.builder ul.button.r4[index="0"] li:nth-child(1){flex:2;gap:.5rem;font-size:.875rem;background-color:hsl(223, 75%, 52%);color:#fff}body.builder ul.button.r4[index="1"] li:nth-child(2){flex:2;gap:.5rem;font-size:.875rem;background-color:hsl(223, 75%, 52%);color:#fff}body.builder ul.button.r4[index="2"] li:nth-child(3){flex:2;gap:.5rem;font-size:.875rem;background-color:hsl(223, 75%, 52%);color:#fff}body.builder ul.button.r4[index="3"] li:nth-child(4){flex:2;gap:.5rem;font-size:.875rem;background-color:hsl(223, 75%, 52%);color:#fff}body.builder ul.button li{flex:1;display:flex;justify-content:center;align-items:center;gap:0;line-height:1.75rem;text-align:center;font-size:0;font-weight:500;border-radius:.5rem;transition:.3s;cursor:pointer}@media(hover: hover)and (pointer: fine){body.builder ul.button li:hover{background-color:hsl(223, 14%, 97%)}}body.builder ul.button li i{width:1.25rem;text-align:center;font-size:.875rem}body.builder ul.top{display:flex;justify-content:center;gap:.5rem;padding:.5rem 0}body.builder ul.top li{display:flex;flex:1;justify-content:center;align-items:center;gap:.5rem;height:1.75rem;text-align:center;font-size:.875rem;font-weight:500;border-radius:.5rem;transition:.3s;cursor:pointer}@media(hover: hover)and (pointer: fine){body.builder ul.top li:hover{background-color:hsl(223, 14%, 97%)}}body.builder ul.top li.clr{color:hsl(223, 75%, 52%)}body.builder ul.top li.del{color:red}body.builder ul.top li i{width:1.25rem;text-align:center;font-size:inherit;color:inherit}body.builder ul.path{position:sticky;bottom:0;z-index:10;display:none;flex-flow:row wrap;justify-content:center;gap:.25rem;padding:.5rem;width:22.5rem;list-style:none;border-top:1px solid rgba(0,0,0,.1019607843);border-left:1px solid rgba(0,0,0,.1019607843);border-bottom:1px solid rgba(0,0,0,.1019607843);background-color:#fff;transition:.3s}body.builder ul.path:has(li){display:flex}body.builder ul.path li{font-size:.75rem;font-weight:500;transition:.3s;cursor:pointer}body.builder ul.path li:not(body.builder ul.path li:nth-child(1)):before{content:"▸";margin-right:.25rem;color:#000 !important}body.builder ul.path li:nth-last-child(1){pointer-events:none;color:hsl(223, 75%, 52%);cursor:auto}@media(hover: hover)and (pointer: fine){body.builder ul.path li:not(body.builder ul.path li:nth-last-child(1)):hover{color:hsl(223, 75%, 52%)}}body.builder>section.left{position:fixed;top:5rem;left:-16rem;display:flex;flex-shrink:0;flex-flow:column;align-items:flex-start;width:16rem;height:calc(100% - 5rem);background-color:#fffefc;border-right:1px solid rgba(0,0,0,.1019607843);transition:.3s}body.builder>section.left section.pg{display:flex;flex-flow:column;flex-shrink:0;align-items:center;gap:.75rem;padding:1rem;width:100%;height:12rem;border-bottom:1px solid rgba(0,0,0,.1019607843);overflow:auto}body.builder>section.left section.pg strong{width:100%;font-weight:500}body.builder>section.left section.pg button{display:flex;align-items:center;gap:.5rem;padding:0 1rem;width:100%;line-height:2rem;text-align:left;font-size:.875rem;font-weight:400;background-color:hsl(223, 14%, 97%);border-radius:.5rem}body.builder>section.left section.pg button:nth-last-child(1){margin-top:.25rem;width:initial;text-align:center;font-weight:500;background-color:hsl(223, 75%, 52%);color:#fff}body.builder>section.left section.pg button:nth-last-child(1) i{width:1.25rem;text-align:center;font-size:inherit;color:inherit}body.builder>section.right{position:fixed;top:5rem;right:-22.5rem;display:flex;flex-shrink:0;flex-flow:column;width:22.5rem;height:calc(100% - 5rem);background-color:#fffefc;border-left:1px solid rgba(0,0,0,.1019607843);transition:.3s}body.builder>section.right>span{flex-grow:1}body.builder #color-picker{position:fixed;display:flex;align-items:center;z-index:10000;top:100%;left:0;bottom:0;right:0;width:100%;height:100%;background-color:rgba(0,0,0,0);backdrop-filter:blur(0);-webkit-backdrop-filter:blur(0);opacity:0;transition:.3s;transition-delay:.15s,0s,0s,0s,.15s;transition-property:top,background-color,backdrop-filter,opacity,-webkit-backdrop-filter}body.builder #color-picker.show{top:0;opacity:1;background-color:rgba(0,0,0,.5);backdrop-filter:blur(1rem);-webkit-backdrop-filter:blur(1rem);opacity:1;transition-delay:0s,.15s,.15s,.15s,.15s;transition-property:top,background-color,backdrop-filter,-webkit-backdrop-filter,opacity}body.builder #color-picker>section{display:flex;flex-flow:column;justify-content:center;align-items:center;gap:2rem;margin:0 auto;width:100%}body.builder #color-picker>section div{position:fixed;z-index:10;top:calc((100vh - .5rem - 5rem)/2);left:calc((100vw - .5rem)/2);width:.25rem;height:.25rem;outline:2px solid #fff;border-radius:50%;display:none}body.builder #color-picker>section canvas{position:relative;margin:auto;width:25rem;height:25rem;border-radius:50%;border:1px solid rgba(255,255,255,.1019607843)}body.builder #color-picker>section section{display:flex;justify-content:center;align-items:center;height:3rem}body.builder #color-picker>section section span{position:relative;z-index:1;display:block;margin-right:-3rem;width:3rem;height:3rem;background-color:#000;border-radius:1.5rem;border:.25rem solid #fff;transition:.4s}body.builder #color-picker>section section input{position:relative;z-index:0;padding-left:3rem;padding-right:4.25rem;width:20rem;height:3rem;line-height:3rem;text-align:center;font-size:.875rem;background-color:#fbfbfb;border-radius:1.5rem}body.builder #color-picker>section section button{position:relative;z-index:1;margin-left:-4rem;width:3.5rem;height:2rem;font-size:.875rem;font-weight:500;background-color:hsl(223, 75%, 52%);color:#fff;border-radius:1rem;transition:.4s}@media(hover: hover)and (pointer: fine){body.builder #color-picker>section section button:hover{background-color:hsl(223, 47%, 48%)}}body.builder>section.right>section.body,body.builder>section.left>section.body{display:flex;flex-flow:column;padding:0 1rem 5rem;width:100%;overflow:hidden scroll}body.builder>section.right>section.body>section,body.builder>section.left>section.body>section{display:flex;flex-flow:column;align-items:flex-start;gap:.75rem;padding:.75rem 0;width:100%;list-style:none;border-bottom:1px solid rgba(0,0,0,0)}body.builder>section.right>section.body>section.none,body.builder>section.left>section.body>section.none{display:none}body.builder>section.right>section.body>section.hide,body.builder>section.left>section.body>section.hide{border-bottom:1px solid rgba(0,0,0,.1019607843)}body.builder>section.right>section.body>section.hide>button i,body.builder>section.left>section.body>section.hide>button i{transform:rotate(0)}body.builder>section.right>section.body>section.hide section,body.builder>section.left>section.body>section.hide section{margin-top:-0.75rem;max-height:0;opacity:0;overflow:hidden}body.builder>section.right>section.body>section>button,body.builder>section.left>section.body>section>button{text-align:left;font-size:.875rem;font-weight:500;color:hsl(223, 75%, 52%)}body.builder>section.right>section.body>section>button i,body.builder>section.left>section.body>section>button i{margin-left:.5rem;font-size:inherit;color:inherit;transition:.3s;transform:rotate(90deg)}body.builder>section.right>section.body>section>section,body.builder>section.left>section.body>section>section{display:flex;flex-flow:row wrap;gap:.75rem 1rem;margin-top:0;width:100%;transition:.3s}body.builder>section.right>section.body>section>section img,body.builder>section.left>section.body>section>section img{display:block;width:100%;border-radius:.5rem;border:1px solid rgba(0,0,0,.0509803922);box-shadow:0 2px 4px rgba(0,0,0,0);transition:.3s;cursor:pointer}@media(hover: hover)and (pointer: fine){body.builder>section.right>section.body>section>section img:hover,body.builder>section.left>section.body>section>section img:hover{top:-0.5px;box-shadow:0 2px 4px rgba(0,0,0,.1019607843)}body.builder>section.right>section.body>section>section img:active,body.builder>section.left>section.body>section>section img:active{top:.5px;box-shadow:0 2px 4px rgba(0,0,0,0)}}body.builder>section.right>section.body>section>section>p,body.builder>section.left>section.body>section>section>p{padding:.5rem 0;width:100%;text-align:center;font-size:.625rem;font-weight:500}body.builder>section.right>section.body>section>section>p::before,body.builder>section.right>section.body>section>section>p::after,body.builder>section.left>section.body>section>section>p::before,body.builder>section.left>section.body>section>section>p::after{padding:.5rem;content:"——"}body.builder>section.right>section.body>section>section.input label,body.builder>section.left>section.body>section>section.input label{position:relative;width:100%;font-size:.625rem;font-weight:500}body.builder>section.right>section.body>section>section.input label.r2,body.builder>section.left>section.body>section>section.input label.r2{width:calc((100% - 1rem)/2)}body.builder>section.right>section.body>section>section.input label.r3,body.builder>section.left>section.body>section>section.input label.r3{width:calc((100% - 2rem)/3)}body.builder>section.right>section.body>section>section.input label.r4,body.builder>section.left>section.body>section>section.input label.r4{width:calc((100% - 3rem)/4)}body.builder>section.right>section.body>section>section.input label.file input[type=file]::before,body.builder>section.left>section.body>section>section.input label.file input[type=file]::before{padding-left:1.125rem;width:calc(100% - 1.125rem)}body.builder>section.right>section.body>section>section.input label.file i,body.builder>section.left>section.body>section>section.input label.file i{display:block}@media(hover: hover)and (pointer: fine){body.builder>section.right>section.body>section>section.input label a[href]:not([href=""]):hover i,body.builder>section.left>section.body>section>section.input label a[href]:not([href=""]):hover i{opacity:1}}body.builder>section.right>section.body>section>section.input label a i,body.builder>section.left>section.body>section>section.input label a i{margin-left:.25rem;font-size:inherit;opacity:0;transition:.3s}body.builder>section.right>section.body>section>section.input label input,body.builder>section.left>section.body>section>section.input label input{text-overflow:ellipsis}body.builder>section.right>section.body>section>section.input label select,body.builder>section.right>section.body>section>section.input label input,body.builder>section.right>section.body>section>section.input label textarea,body.builder>section.left>section.body>section>section.input label select,body.builder>section.left>section.body>section>section.input label input,body.builder>section.left>section.body>section>section.input label textarea{position:relative;margin-top:.25rem;padding:0 .5rem;width:100%;line-height:2rem;text-align:center;text-align-last:center;-moz-text-align-last:center;font-size:.75rem;font-weight:400;border:1px solid rgba(0,0,0,.1019607843);border-radius:.5rem}body.builder>section.right>section.body>section>section.input label select[type=color],body.builder>section.right>section.body>section>section.input label input[type=color],body.builder>section.right>section.body>section>section.input label textarea[type=color],body.builder>section.left>section.body>section>section.input label select[type=color],body.builder>section.left>section.body>section>section.input label input[type=color],body.builder>section.left>section.body>section>section.input label textarea[type=color]{height:2.125rem;cursor:pointer}body.builder>section.right>section.body>section>section.input label select[type=file],body.builder>section.right>section.body>section>section.input label input[type=file],body.builder>section.right>section.body>section>section.input label textarea[type=file],body.builder>section.left>section.body>section>section.input label select[type=file],body.builder>section.left>section.body>section>section.input label input[type=file],body.builder>section.left>section.body>section>section.input label textarea[type=file]{height:2.125rem;cursor:pointer}body.builder>section.right>section.body>section>section.input label select[type=file]::before,body.builder>section.right>section.body>section>section.input label input[type=file]::before,body.builder>section.right>section.body>section>section.input label textarea[type=file]::before,body.builder>section.left>section.body>section>section.input label select[type=file]::before,body.builder>section.left>section.body>section>section.input label input[type=file]::before,body.builder>section.left>section.body>section>section.input label textarea[type=file]::before{content:attr(placeholder);position:absolute;top:0;left:0;bottom:0;right:0;width:100%;height:100%;font-size:.75rem;background-color:#fffefc;border-radius:inherit}body.builder>section.right>section.body>section>section.input label select,body.builder>section.left>section.body>section>section.input label select{cursor:pointer}body.builder>section.right>section.body>section>section.input label textarea,body.builder>section.left>section.body>section>section.input label textarea{height:10rem;text-align:left;text-align-last:left;-moz-text-align-last:left}body.builder>section.right>section.body>section>section.input label>i,body.builder>section.left>section.body>section>section.input label>i{position:absolute;display:none;left:.5rem;bottom:.4375rem;width:1.25rem;height:1.25rem;line-height:1.25rem;text-align:center;border-radius:.625rem;transition:.3s;cursor:pointer}@media(hover: hover)and (pointer: fine){body.builder>section.right>section.body>section>section.input label>i:hover,body.builder>section.left>section.body>section>section.input label>i:hover{background-color:hsl(223, 14%, 97%)}}body.builder>section.right>section.body>section>section.child div,body.builder>section.left>section.body>section>section.child div{display:flex;justify-content:space-between;width:100%;border-bottom:1px solid rgba(0,0,0,.1019607843)}body.builder>section.right>section.body>section>section.child div button,body.builder>section.left>section.body>section>section.child div button{display:flex;align-items:center;gap:.5rem;height:3.75rem;font-size:.875rem;font-weight:500}body.builder>section.right>section.body>section>section.child div section:nth-last-child(1),body.builder>section.left>section.body>section>section.child div section:nth-last-child(1){display:flex;align-items:center;gap:1rem}body.builder>section.right>section.body>section>section.child div section:nth-last-child(1) i,body.builder>section.left>section.body>section>section.child div section:nth-last-child(1) i{color:rgba(0,0,0,.5019607843);cursor:pointer}body.builder>section.right>section.body>section>section.tag button,body.builder>section.left>section.body>section>section.tag button{display:flex;flex-flow:column;justify-content:center;align-items:center;width:calc((100% - 1rem)/2);aspect-ratio:1/1;background-color:#fff;border-radius:1rem;border:1px solid rgba(0,0,0,.1019607843)}body.builder>section.right>section.body>section>section.tag button strong,body.builder>section.left>section.body>section>section.tag button strong{font-size:.875rem;font-weight:500}body.builder>section.right>section.body>section>section.tag button p,body.builder>section.left>section.body>section>section.tag button p{font-size:.75rem;color:hsl(223, 75%, 52%)}body.builder>section.right>section.body>section>section.tag button i,body.builder>section.left>section.body>section>section.tag button i{margin-top:1rem}/*# sourceMappingURL=index.css.map */ +*{position:relative;margin:0;padding:0;font-size:1em;font-family:"Noto Sans TC",sans-serif;letter-spacing:0;border:none;outline:none;background-color:rgba(0,0,0,0);color:hsl(223, 82%, 6%);word-wrap:break-word;text-decoration:none;box-sizing:border-box;-ms-overflow-style:none;scrollbar-width:none;-webkit-overflow-scrolling:touch;touch-action:manipulation;-webkit-touch-callout:inherit;-webkit-user-select:inherit;-khtml-user-select:inherit;-moz-user-select:inherit;-ms-user-select:inherit;user-select:inherit}*::-webkit-scrollbar{display:none}*.rz::-webkit-scrollbar{display:block;width:.25rem;background-color:hsl(223, 14%, 97%)}*.rz::-webkit-scrollbar-thumb{background-color:hsl(223, 11%, 81%)}*.rz.vert{resize:vertical}* [user-select=false],* [user-select="0"]{-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}* [user-select=true],* [user-select="1"]{-webkit-touch-callout:initial;-webkit-user-select:initial;-khtml-user-select:initial;-moz-user-select:initial;-ms-user-select:initial;user-select:initial}*::before,*::after{box-sizing:border-box}img{content:url("data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==");object-fit:cover}img[src]:not([src=""]){content:unset}img[data-src]{background:linear-gradient(to right, #EEF0F3, #E0E2E8, #EEF0F3)}textarea{resize:none}input,textarea,select{-webkit-appearance:none;-moz-appearance:none;appearance:none}input::placeholder,textarea::placeholder{color:hsl(223, 11%, 81%);opacity:1}input::-webkit-input-placeholder,textarea::-webkit-input-placeholder{color:hsl(223, 11%, 81%)}input::-ms-input-placeholder,textarea::-ms-input-placeholder{color:hsl(223, 11%, 81%)}a[href]:not([href=""]),button{cursor:pointer}span,b,strong,i,em,time{line-height:inherit;font-size:inherit;color:inherit}html{position:fixed;display:block;width:100%;height:100%;overflow:hidden}body{position:relative;display:flex;flex-flow:column;align-items:flex-start;width:100%;height:100%;background-color:rgba(0,0,0,.0509803922);overflow:hidden scroll}body[ready="0"] *,body[ready="0"] *::before,body[ready="0"] *::after,body:not(.ready) *,body:not(.ready) *::before,body:not(.ready) *::after{transition:none !important}body>div.mask{position:fixed;z-index:1000;top:0;left:0;bottom:0;right:0;width:100%;height:100%;backdrop-filter:blur(2rem);-webkit-backdrop-filter:blur(2rem)}@media screen and (min-width: 1024px){body>div.mask{display:none}}body>div.mask p{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);margin-right:-50%;max-width:calc(100% - 2rem);font-size:.875rem;color:hsl(223, 11%, 32%)}body.builder[data-type=mobile]>nav>section>section:nth-child(2) i.fa-mobile-screen-button{color:hsl(223, 75%, 52%)}body.builder[data-type=mobile]>nav>section>section:nth-child(2) i.fa-desktop{color:#000}body.builder[data-type=mobile]>section.body>iframe{max-width:414px !important}body.builder[data-type=tablet]>nav>section>section:nth-child(2) i.fa-tablet-screen-button{color:hsl(223, 75%, 52%)}body.builder[data-type=tablet]>nav>section>section:nth-child(2) i.fa-desktop{color:#000}body.builder[data-type=tablet]>section.body>iframe{max-width:768px !important}body.builder[data-type=code]>nav>section>section:nth-child(2) i.fa-code{color:hsl(223, 75%, 52%)}body.builder[data-type=code]>nav>section>section:nth-child(2) i.fa-desktop{color:#000}body.builder[data-type=code]>section.body>iframe{display:none}body.builder[data-left="1"]>nav>section>section:nth-child(2) svg.bl path{fill:hsl(223, 75%, 52%)}body.builder[data-left="1"]>section.left{left:0}body.builder[data-left="1"]>section.body{padding-left:16rem}body.builder[data-right="1"]>nav>section section:nth-child(2) svg.br path{fill:hsl(223, 75%, 52%)}body.builder[data-right="1"]>section.right{right:0}body.builder[data-right="1"]>section.body{padding-right:22.5rem}body.builder>nav{position:sticky;z-index:1000;top:0;left:0;right:0;width:100%;background-color:#fffefc;border-bottom:1px solid rgba(0,0,0,.1019607843)}body.builder>nav>section{display:flex;justify-content:space-between;align-items:center;margin:0 auto;padding:0 1rem;width:100%;height:5rem}body.builder>nav>section>section:nth-child(1){display:flex;align-items:center;gap:.5rem}body.builder>nav>section>section:nth-child(1):has(svg)>strong.logo{margin-left:-0.5rem}body.builder>nav>section>section:nth-child(1)>svg{flex-shrink:0;height:2.75rem}body.builder>nav>section>section:nth-child(1) strong.logo{letter-spacing:-0.25px;font-size:1.25rem;white-space:nowrap;overflow:hidden;transition:.3s}body.builder>nav>section>section:nth-child(1) strong.logo span{letter-spacing:-1px;font-size:1.5rem;color:hsl(223, 75%, 52%)}body.builder>nav>section>section:nth-child(2){position:absolute;display:flex;align-items:center;gap:1.5rem;top:0;left:50%;transform:translateX(-50%);height:100%}body.builder>nav>section>section:nth-child(2) i{width:1.25rem;text-align:center;cursor:pointer;transition:.2s}@media(hover: hover)and (pointer: fine){body.builder>nav>section>section:nth-child(2) i:hover{font-size:1.125rem}}body.builder>nav>section>section:nth-child(2) i.fa-desktop{color:hsl(223, 75%, 52%)}body.builder>nav>section>section:nth-child(2) svg{width:1.25rem;height:1rem;transition:.2s;cursor:pointer}@media(hover: hover)and (pointer: fine){body.builder>nav>section>section:nth-child(2) svg:hover{height:1.125rem}}body.builder>nav>section>section:nth-child(2) svg path{fill:#000}body.builder>nav>section>section:nth-child(2) div{width:1px;height:.75rem;background-color:rgba(0,0,0,.2)}body.builder>nav>section>section:nth-child(3){display:flex;align-items:center;gap:1.5rem}body.builder>nav>section>section:nth-child(3) section{display:flex;align-items:center;gap:1rem}body.builder>nav>section>section:nth-child(3) section button{display:flex;align-items:center;gap:.5rem;padding:0 1rem;line-height:2.5rem;background-color:hsl(223, 14%, 97%);border-radius:1.25rem}body.builder>nav>section>section:nth-child(3) section button.clr{background-color:hsl(223, 75%, 52%);color:#fff}body.builder>nav>section>section:nth-child(3) section button.pub{position:relative;padding:0 0 0 1rem;font-size:.875rem;background-color:rgba(0,0,0,0);color:hsl(223, 14%, 97%)}body.builder>nav>section>section:nth-child(3) section button.pub::before{content:"";position:absolute;top:0;left:0;bottom:0;margin:auto 0;width:.5rem;height:.5rem;border-radius:50%;background-color:hsl(223, 14%, 97%)}body.builder>nav>section>section:nth-child(3) section button i{font-size:inherit;color:inherit}body.builder>nav>section>section:nth-child(3) img.head{width:2.75rem;height:2.75rem;border-radius:50%;border:.5px solid rgba(0,0,0,.0509803922);cursor:pointer}body.builder>section.body{width:100%;height:calc(100% - 5rem);transition:.3s}body.builder>section.body section.code{display:flex;width:100%;height:100%;background-color:hsl(223, 82%, 6%)}body.builder>section.body section.code>section{position:relative;display:block;padding:.5rem;width:50%;height:100%;min-height:1.75rem;line-height:1.75rem;letter-spacing:1px;font-family:monospace;font-size:1rem;color:#fff;overflow:hidden scroll}body.builder>section.body section.code>section::before{content:attr(hint);position:absolute;top:50%;left:0;width:100%;text-align:center;letter-spacing:.25rem;font-size:4rem;color:rgba(255,255,255,.1019607843)}body.builder>section.body section.code>section div{line-height:inherit;letter-spacing:inherit;font-family:inherit;font-size:inherit;color:inherit}body.builder>section.body section.code>section:nth-child(1){border-right:1px solid hsl(223, 5%, 92%)}body.builder>section.body>iframe{display:block;margin:0 auto;width:100%;max-width:100%;height:initial;min-height:100%;transition:.3s;container-type:inline-size}body.builder ul.tab{display:flex;list-style:none;width:100%}body.builder ul.tab[index="0"] li:nth-child(2),body.builder ul.tab[index="1"] li:nth-child(1){background-color:rgba(0,0,0,.0509803922)}body.builder ul.tab li{display:flex;justify-content:center;align-items:center;gap:.5rem;flex:1;line-height:2rem;text-align:center;font-size:.875rem;font-weight:500;cursor:pointer}body.builder ul.tab li i{width:1.25rem;text-align:center;font-size:inherit;color:inherit}body.builder ul.button{display:flex;flex-flow:row;gap:.5rem;padding:.75rem .5rem;width:100%;list-style:none;border-bottom:1px solid rgba(0,0,0,.1019607843)}body.builder ul.button.r2[index="0"] li:nth-child(1),body.builder ul.button.r3[index="0"] li:nth-child(1){background-color:hsl(223, 75%, 52%);color:#fff}body.builder ul.button.r2[index="1"] li:nth-child(2),body.builder ul.button.r3[index="1"] li:nth-child(2){background-color:hsl(223, 75%, 52%);color:#fff}body.builder ul.button.r2[index="2"] li:nth-child(3),body.builder ul.button.r3[index="2"] li:nth-child(3){background-color:hsl(223, 75%, 52%);color:#fff}body.builder ul.button.r2 li,body.builder ul.button.r3 li{gap:.5rem;font-size:.875rem}body.builder ul.button.r4[index="0"] li:nth-child(1){flex:2;gap:.5rem;font-size:.875rem;background-color:hsl(223, 75%, 52%);color:#fff}body.builder ul.button.r4[index="1"] li:nth-child(2){flex:2;gap:.5rem;font-size:.875rem;background-color:hsl(223, 75%, 52%);color:#fff}body.builder ul.button.r4[index="2"] li:nth-child(3){flex:2;gap:.5rem;font-size:.875rem;background-color:hsl(223, 75%, 52%);color:#fff}body.builder ul.button.r4[index="3"] li:nth-child(4){flex:2;gap:.5rem;font-size:.875rem;background-color:hsl(223, 75%, 52%);color:#fff}body.builder ul.button li{flex:1;display:flex;justify-content:center;align-items:center;gap:0;line-height:1.75rem;text-align:center;font-size:0;font-weight:500;border-radius:.5rem;transition:.3s;cursor:pointer}@media(hover: hover)and (pointer: fine){body.builder ul.button li:hover{background-color:hsl(223, 14%, 97%)}}body.builder ul.button li i{width:1.25rem;text-align:center;font-size:.875rem}body.builder ul.top{display:flex;justify-content:center;gap:.5rem;padding:.5rem 0}body.builder ul.top li{display:flex;flex:1;justify-content:center;align-items:center;gap:.5rem;height:1.75rem;text-align:center;font-size:.875rem;font-weight:500;border-radius:.5rem;transition:.3s;cursor:pointer}@media(hover: hover)and (pointer: fine){body.builder ul.top li:hover{background-color:hsl(223, 14%, 97%)}}body.builder ul.top li.clr{color:hsl(223, 75%, 52%)}body.builder ul.top li.del{color:red}body.builder ul.top li i{width:1.25rem;text-align:center;font-size:inherit;color:inherit}body.builder ul.path{position:sticky;bottom:0;z-index:10;display:none;flex-flow:row wrap;justify-content:center;gap:.25rem;padding:.5rem;width:22.5rem;list-style:none;border-top:1px solid rgba(0,0,0,.1019607843);background-color:#fff;transition:.3s}body.builder ul.path:has(li){display:flex}body.builder ul.path li{font-size:.75rem;font-weight:500;transition:.3s;cursor:pointer}body.builder ul.path li:not(body.builder ul.path li:nth-child(1)):before{content:"▸";margin-right:.25rem;color:#000 !important}body.builder ul.path li:nth-last-child(1){pointer-events:none;color:hsl(223, 75%, 52%);cursor:auto}@media(hover: hover)and (pointer: fine){body.builder ul.path li:not(body.builder ul.path li:nth-last-child(1)):hover{color:hsl(223, 75%, 52%)}}body.builder>section.left{position:fixed;top:5rem;left:-16rem;display:flex;flex-shrink:0;flex-flow:column;align-items:flex-start;width:16rem;height:calc(100% - 5rem);background-color:#fffefc;border-right:1px solid rgba(0,0,0,.1019607843);transition:.3s}body.builder>section.left section.pg{display:flex;flex-flow:column;flex-shrink:0;align-items:center;gap:.75rem;padding:1rem;width:100%;height:12rem;border-bottom:1px solid rgba(0,0,0,.1019607843);overflow:auto}body.builder>section.left section.pg strong{width:100%;font-weight:500}body.builder>section.left section.pg button{display:flex;align-items:center;gap:.5rem;padding:0 1rem;width:100%;line-height:2rem;text-align:left;font-size:.875rem;font-weight:400;background-color:hsl(223, 14%, 97%);border-radius:.5rem}body.builder>section.left section.pg button:nth-last-child(1){margin-top:.25rem;width:initial;text-align:center;font-weight:500;background-color:hsl(223, 75%, 52%);color:#fff}body.builder>section.left section.pg button:nth-last-child(1) i{width:1.25rem;text-align:center;font-size:inherit;color:inherit}body.builder>section.right{position:fixed;top:5rem;right:-22.5rem;display:flex;flex-shrink:0;flex-flow:column;width:22.5rem;height:calc(100% - 5rem);background-color:#fffefc;border-left:1px solid rgba(0,0,0,.1019607843);transition:.3s}body.builder>section.right>span{flex-grow:1}body.builder #color-picker{position:fixed;display:flex;align-items:center;z-index:10000;top:100%;left:0;bottom:0;right:0;width:100%;height:100%;background-color:rgba(0,0,0,0);backdrop-filter:blur(0);-webkit-backdrop-filter:blur(0);opacity:0;transition:.3s;transition-delay:.15s,0s,0s,0s,.15s;transition-property:top,background-color,backdrop-filter,opacity,-webkit-backdrop-filter}body.builder #color-picker.show{top:0;opacity:1;background-color:rgba(0,0,0,.5);backdrop-filter:blur(1rem);-webkit-backdrop-filter:blur(1rem);opacity:1;transition-delay:0s,.15s,.15s,.15s,.15s;transition-property:top,background-color,backdrop-filter,-webkit-backdrop-filter,opacity}body.builder #color-picker>section{display:flex;flex-flow:column;justify-content:center;align-items:center;gap:2rem;margin:0 auto;width:100%}body.builder #color-picker>section div{position:fixed;z-index:10;top:calc((100vh - .5rem - 5rem)/2);left:calc((100vw - .5rem)/2);width:.25rem;height:.25rem;outline:2px solid #fff;border-radius:50%;display:none}body.builder #color-picker>section canvas{position:relative;margin:auto;width:25rem;height:25rem;border-radius:50%;border:1px solid rgba(255,255,255,.1019607843)}body.builder #color-picker>section section{display:flex;justify-content:center;align-items:center;height:3rem}body.builder #color-picker>section section span{position:relative;z-index:1;display:block;margin-right:-3rem;width:3rem;height:3rem;background-color:#000;border-radius:1.5rem;border:.25rem solid #fff;transition:.4s}body.builder #color-picker>section section input{position:relative;z-index:0;padding-left:3rem;padding-right:4.25rem;width:20rem;height:3rem;line-height:3rem;text-align:center;font-size:.875rem;background-color:#fbfbfb;border-radius:1.5rem}body.builder #color-picker>section section button{position:relative;z-index:1;margin-left:-4rem;width:3.5rem;height:2rem;font-size:.875rem;font-weight:500;background-color:hsl(223, 75%, 52%);color:#fff;border-radius:1rem;transition:.4s}@media(hover: hover)and (pointer: fine){body.builder #color-picker>section section button:hover{background-color:hsl(223, 47%, 48%)}}body.builder>section.right>section.body,body.builder>section.left>section.body{display:flex;flex-flow:column;padding:0 1rem 5rem;width:100%;overflow:hidden scroll}body.builder>section.right>section.body>section,body.builder>section.left>section.body>section{display:flex;flex-flow:column;align-items:flex-start;gap:.75rem;padding:.75rem 0;width:100%;list-style:none;border-bottom:1px solid rgba(0,0,0,0)}body.builder>section.right>section.body>section.none,body.builder>section.left>section.body>section.none{display:none}body.builder>section.right>section.body>section.hide,body.builder>section.left>section.body>section.hide{border-bottom:1px solid rgba(0,0,0,.1019607843)}body.builder>section.right>section.body>section.hide>button i,body.builder>section.left>section.body>section.hide>button i{transform:rotate(0)}body.builder>section.right>section.body>section.hide section,body.builder>section.left>section.body>section.hide section{margin-top:-0.75rem;max-height:0;opacity:0;overflow:hidden}body.builder>section.right>section.body>section>button,body.builder>section.left>section.body>section>button{text-align:left;font-size:.875rem;font-weight:500;color:hsl(223, 75%, 52%)}body.builder>section.right>section.body>section>button i,body.builder>section.left>section.body>section>button i{margin-left:.5rem;font-size:inherit;color:inherit;transition:.3s;transform:rotate(90deg)}body.builder>section.right>section.body>section>section,body.builder>section.left>section.body>section>section{display:flex;flex-flow:row wrap;gap:.75rem 1rem;margin-top:0;width:100%;transition:.3s}body.builder>section.right>section.body>section>section img,body.builder>section.left>section.body>section>section img{display:block;width:100%;border-radius:.5rem;border:1px solid rgba(0,0,0,.0509803922);box-shadow:0 2px 4px rgba(0,0,0,0);transition:.3s;cursor:pointer}@media(hover: hover)and (pointer: fine){body.builder>section.right>section.body>section>section img:hover,body.builder>section.left>section.body>section>section img:hover{top:-0.5px;box-shadow:0 2px 4px rgba(0,0,0,.1019607843)}body.builder>section.right>section.body>section>section img:active,body.builder>section.left>section.body>section>section img:active{top:.5px;box-shadow:0 2px 4px rgba(0,0,0,0)}}body.builder>section.right>section.body>section>section>p,body.builder>section.left>section.body>section>section>p{padding:.5rem 0;width:100%;text-align:center;font-size:.625rem;font-weight:500}body.builder>section.right>section.body>section>section>p::before,body.builder>section.right>section.body>section>section>p::after,body.builder>section.left>section.body>section>section>p::before,body.builder>section.left>section.body>section>section>p::after{padding:.5rem;content:"——"}body.builder>section.right>section.body>section>section.input label,body.builder>section.left>section.body>section>section.input label{position:relative;width:100%;font-size:.625rem;font-weight:500}body.builder>section.right>section.body>section>section.input label.r2,body.builder>section.left>section.body>section>section.input label.r2{width:calc((100% - 1rem)/2)}body.builder>section.right>section.body>section>section.input label.r3,body.builder>section.left>section.body>section>section.input label.r3{width:calc((100% - 2rem)/3)}body.builder>section.right>section.body>section>section.input label.r4,body.builder>section.left>section.body>section>section.input label.r4{width:calc((100% - 3rem)/4)}body.builder>section.right>section.body>section>section.input label.file input[type=file]::before,body.builder>section.left>section.body>section>section.input label.file input[type=file]::before{padding-left:1.125rem;width:calc(100% - 1.125rem)}body.builder>section.right>section.body>section>section.input label.file i,body.builder>section.left>section.body>section>section.input label.file i{display:block}@media(hover: hover)and (pointer: fine){body.builder>section.right>section.body>section>section.input label a[href]:not([href=""]):hover i,body.builder>section.left>section.body>section>section.input label a[href]:not([href=""]):hover i{opacity:1}}body.builder>section.right>section.body>section>section.input label a i,body.builder>section.left>section.body>section>section.input label a i{margin-left:.25rem;font-size:inherit;opacity:0;transition:.3s}body.builder>section.right>section.body>section>section.input label input,body.builder>section.left>section.body>section>section.input label input{text-overflow:ellipsis}body.builder>section.right>section.body>section>section.input label select,body.builder>section.right>section.body>section>section.input label input,body.builder>section.right>section.body>section>section.input label textarea,body.builder>section.left>section.body>section>section.input label select,body.builder>section.left>section.body>section>section.input label input,body.builder>section.left>section.body>section>section.input label textarea{position:relative;margin-top:.25rem;padding:0 .5rem;width:100%;line-height:2rem;text-align:center;text-align-last:center;-moz-text-align-last:center;font-size:.75rem;font-weight:400;border:1px solid rgba(0,0,0,.1019607843);border-radius:.5rem}body.builder>section.right>section.body>section>section.input label select[type=color],body.builder>section.right>section.body>section>section.input label input[type=color],body.builder>section.right>section.body>section>section.input label textarea[type=color],body.builder>section.left>section.body>section>section.input label select[type=color],body.builder>section.left>section.body>section>section.input label input[type=color],body.builder>section.left>section.body>section>section.input label textarea[type=color]{height:2.125rem;cursor:pointer}body.builder>section.right>section.body>section>section.input label select[type=file],body.builder>section.right>section.body>section>section.input label input[type=file],body.builder>section.right>section.body>section>section.input label textarea[type=file],body.builder>section.left>section.body>section>section.input label select[type=file],body.builder>section.left>section.body>section>section.input label input[type=file],body.builder>section.left>section.body>section>section.input label textarea[type=file]{height:2.125rem;cursor:pointer}body.builder>section.right>section.body>section>section.input label select[type=file]::before,body.builder>section.right>section.body>section>section.input label input[type=file]::before,body.builder>section.right>section.body>section>section.input label textarea[type=file]::before,body.builder>section.left>section.body>section>section.input label select[type=file]::before,body.builder>section.left>section.body>section>section.input label input[type=file]::before,body.builder>section.left>section.body>section>section.input label textarea[type=file]::before{content:attr(placeholder);position:absolute;top:0;left:0;bottom:0;right:0;width:100%;height:100%;font-size:.75rem;background-color:#fffefc;border-radius:inherit}body.builder>section.right>section.body>section>section.input label select,body.builder>section.left>section.body>section>section.input label select{cursor:pointer}body.builder>section.right>section.body>section>section.input label textarea,body.builder>section.left>section.body>section>section.input label textarea{height:10rem;text-align:left;text-align-last:left;-moz-text-align-last:left}body.builder>section.right>section.body>section>section.input label>i,body.builder>section.left>section.body>section>section.input label>i{position:absolute;display:none;left:.5rem;bottom:.4375rem;width:1.25rem;height:1.25rem;line-height:1.25rem;text-align:center;border-radius:.625rem;transition:.3s;cursor:pointer}@media(hover: hover)and (pointer: fine){body.builder>section.right>section.body>section>section.input label>i:hover,body.builder>section.left>section.body>section>section.input label>i:hover{background-color:hsl(223, 14%, 97%)}}body.builder>section.right>section.body>section>section.child div,body.builder>section.left>section.body>section>section.child div{display:flex;justify-content:space-between;width:100%;border-bottom:1px solid rgba(0,0,0,.1019607843)}body.builder>section.right>section.body>section>section.child div button,body.builder>section.left>section.body>section>section.child div button{display:flex;align-items:center;gap:.5rem;height:3.75rem;font-size:.875rem;font-weight:500}body.builder>section.right>section.body>section>section.child div section:nth-last-child(1),body.builder>section.left>section.body>section>section.child div section:nth-last-child(1){display:flex;align-items:center;gap:1rem}body.builder>section.right>section.body>section>section.child div section:nth-last-child(1) i,body.builder>section.left>section.body>section>section.child div section:nth-last-child(1) i{color:rgba(0,0,0,.5019607843);cursor:pointer}body.builder>section.right>section.body>section>section.tag button,body.builder>section.left>section.body>section>section.tag button{display:flex;flex-flow:column;justify-content:center;align-items:center;width:calc((100% - 1rem)/2);aspect-ratio:1/1;background-color:#fff;border-radius:1rem;border:1px solid rgba(0,0,0,.1019607843)}body.builder>section.right>section.body>section>section.tag button strong,body.builder>section.left>section.body>section>section.tag button strong{font-size:.875rem;font-weight:500}body.builder>section.right>section.body>section>section.tag button p,body.builder>section.left>section.body>section>section.tag button p{font-size:.75rem;color:hsl(223, 75%, 52%)}body.builder>section.right>section.body>section>section.tag button i,body.builder>section.left>section.body>section>section.tag button i{margin-top:1rem}/*# sourceMappingURL=index.css.map */ diff --git a/css/index.css.map b/css/index.css.map index 23c0819..f565058 100644 --- a/css/index.css.map +++ b/css/index.css.map @@ -1 +1 @@ -{"version":3,"sourceRoot":"","sources":["../sass/_init.scss","../sass/index.scss","../sass/builder/_index.scss","../sass/builder/_nav.scss","../sass/builder/_body.scss","../sass/builder/_ul.tab.scss","../sass/builder/_ul.button.scss","../sass/builder/_ul.top.scss","../sass/builder/_ul.path.scss","../sass/builder/_body-left.scss","../sass/builder/_body-right.scss","../sass/builder/_color-picker.scss"],"names":[],"mappings":"CA0HA,EACI,kBACA,SACA,UACA,cACA,sCACA,iBACA,YACA,aACA,+BACA,MAvBI,kBAwBJ,qBACA,qBACA,sBACA,wBACA,qBACA,iCACA,0BAuBA,8BACA,4BACA,2BACA,yBACA,wBACA,oBA1BA,qBACI,aAKA,wBACI,cACA,aACA,iBAjDJ,mBAoDA,8BACI,iBApDJ,mBAuDA,UACI,gBAWR,0CAEI,2BACA,yBACA,wBACA,sBACA,qBACA,iBAGJ,yCAEI,8BACA,4BACA,2BACA,yBACA,wBACA,oBAGJ,mBAEI,sBAIR,IACI,0FACA,iBAGA,uBACI,cAGJ,cACI,gEAIR,SACI,YAGJ,sBAGI,wBACA,qBACA,gBAMA,yCACI,MA3HA,mBA4HA,UAGJ,qEACI,MAhIA,mBAmIJ,6DACI,MApIA,mBAwIR,8BAEI,eAGJ,wBAMI,oBACA,kBACA,cCxPJ,KACC,eACA,cACA,WACA,YACA,gBAGD,KACC,kBACA,aACG,iBACA,uBACH,WACA,YACG,yCACH,uBAEA,6IAMC,2BAGE,cACI,eACA,aACA,MACA,OACA,SACA,QACA,WACA,YACA,2BACA,mCAEA,sCAZJ,cAaQ,cAGJ,gBACI,kBACA,QACA,SACA,gCACA,kBACA,4BACA,UD/CN,QCgDM,MDmDJ,mBEpGI,0FACI,MFiDP,mBE9CG,6EACI,WAIR,mDACI,2BAQA,0FACI,MF+BP,mBE5BG,6EACI,WAIR,mDACI,2BAQA,wEACI,MFaP,mBEVG,2EACI,WAIR,iDACI,aAMJ,yEACI,KFHH,mBEMD,yCACI,OAGJ,yCACI,mBAMJ,0EACI,KFlBH,mBEqBD,2CACI,QAGJ,0CACI,sBCjFZ,iBACI,gBACA,aACA,MACA,OACA,QACA,WACA,yBACA,gDAEA,yBACI,aACA,8BACA,mBACA,cACA,eACA,WACA,OHQF,KGNE,8CACI,aACA,mBACA,IHnBP,MGqBO,mEACI,oBAGJ,kDACI,cACA,OHZV,QGeM,0DACI,uBACA,UH1BV,QG2BU,mBACA,gBACA,eAEA,+DACI,oBACA,UH/Bd,OGgCc,MHYX,mBGND,8CACI,kBACA,aACA,mBACA,WACA,MACA,SACA,2BACA,YAEA,gDACI,cACA,kBACA,eACA,eAEA,wCACI,sDACI,oBAIR,2DACI,MHjBX,mBGqBG,kDACI,cACA,YACA,eACA,eAEA,wCACI,wDACI,iBAIR,uDACI,UAKR,kDACI,UACA,cACA,gCAIR,8CACI,aACA,mBACA,WAEA,sDACI,aACA,mBACA,SAEA,6DACI,aACA,mBACA,UACA,eACA,mBACA,iBHhBZ,mBGiBY,sBAEA,iEACI,iBHlEf,mBGmEe,WAGJ,iEACI,kBACA,mBACA,kBACA,+BACA,MH7BhB,mBG+BgB,yEACI,WACA,kBACA,MACA,OACA,SACA,cACA,YACA,aACA,kBACA,iBHzCpB,mBG6CY,+DACI,kBACA,cAKZ,uDACI,cACA,eACA,kBACA,0CACA,eC9JhB,0BAGI,WAEA,yBACA,eAEA,uCACI,aACA,WACA,YACA,iBJiGA,kBI/FA,+CACI,kBACA,cACA,QJdP,MIeO,UACA,YACA,WJPN,QIQM,YJRN,QISM,mBACA,sBACA,UJjBN,KIkBM,WACA,uBAOA,uDACI,mBACA,kBACA,QACA,OACA,WACA,kBACA,eJvCX,OIwCW,UJnBV,KIoBU,oCAGJ,mDACI,oBACA,uBACA,oBACA,kBACA,cAGJ,4DACI,yCAKZ,iCACI,cACA,cACA,WACA,eACA,eACA,gBACA,eACA,2BCnER,oBACI,aACA,gBACA,WAEA,8FAEI,yCAGJ,uBACI,aACA,uBACA,mBACA,ILXH,MKYG,OACA,YLFF,KKGE,kBACA,ULZF,QKaE,gBACA,eAEA,yBACI,cACA,kBACA,kBACA,cC1BZ,uBACI,aACA,cACA,UACA,qBACA,WACA,gBACA,gDAOQ,0GACI,iBNwCP,mBMvCO,WAFJ,0GACI,iBNwCP,mBMvCO,WAFJ,0GACI,iBNwCP,mBMvCO,WAIR,0DACI,INlBP,MMmBO,UNhBN,QMwBM,qDACI,OACA,IN7BX,MM8BW,UN3BV,QM4BU,iBNqBP,mBMpBO,WALJ,qDACI,OACA,IN7BX,MM8BW,UN3BV,QM4BU,iBNqBP,mBMpBO,WALJ,qDACI,OACA,IN7BX,MM8BW,UN3BV,QM4BU,iBNqBP,mBMpBO,WALJ,qDACI,OACA,IN7BX,MM8BW,UN3BV,QM4BU,iBNqBP,mBMpBO,WAKZ,0BACI,OACA,aACA,uBACA,mBACA,MACA,YNjCF,QMkCE,kBACA,YACA,gBACA,cN/CH,MMgDG,eACA,eAEA,wCACI,gCACI,iBN6CR,oBMzCA,4BACI,cACA,kBACA,UNzDN,QONN,oBACI,aACA,uBACA,UACA,gBAEA,uBACI,aACA,OACA,uBACA,mBACA,IPRH,MOSG,OPCF,0BOCE,UPRF,QOSE,gBACA,cPbH,MOcG,eACA,eAEA,wCACI,6BACI,iBP+ER,oBO3EA,2BACI,MP4BH,mBOzBD,2BACI,UAGJ,yBACI,cACA,kBACA,kBACA,cCtCZ,qBACI,gBACA,SAEA,WACA,aACA,mBACA,uBACA,IRPC,OQQD,QRNC,MQOD,cACA,gBACA,6CACA,8CACA,gDACA,sBACA,eAEA,6BACI,aAGJ,wBACI,URlBF,OQmBE,gBACA,eACA,eAEA,yEACI,YACA,aR7BP,OQ8BO,sBAGJ,0CACI,oBACA,MRmBH,mBQlBG,YAGJ,wCACI,6EACI,MRaP,oBSvDT,0BACI,eACA,ITuBE,KStBF,YACA,aACA,cACA,iBACA,uBACA,YACA,yBACA,yBACA,+CACA,eAEA,qCACI,aACA,iBACA,cACA,mBACA,ITdF,OSeE,QTbF,KScE,WACA,aACA,gDACA,cAEA,4CACI,WACA,gBAGJ,4CACI,aACA,mBACA,IT/BP,MSgCO,eACA,WACA,YTvBN,KSwBM,gBACA,UTjCN,QSkCM,gBACA,iBT4DJ,mBS3DI,cTvCP,MSyCO,8DACI,WT5CX,OS6CW,cACA,kBACA,gBACA,iBTMP,mBSLO,WAEA,gEACI,cACA,kBACA,kBACA,cCxDpB,2BACI,eACA,IVuBE,KUtBF,eACA,aACA,cACA,iBAEA,cACA,yBACH,yBACG,8CACA,eAEA,gCACI,YCfR,2BACI,eACA,aACA,mBACA,cACA,SACA,OACA,SACA,QACA,WACA,YACA,+BACA,wBACA,gCACA,UACA,eACA,oCACA,yFAEA,gCACI,MACA,UACA,gCACA,2BACA,mCACA,UACA,wCACA,yFAGJ,mCACI,aACA,iBACA,uBACA,mBACA,SACA,cACA,WAEA,uCACI,eACA,WACA,mCACA,6BACA,aACA,cACA,uBACA,kBACA,aAGJ,0CACI,kBACA,YACA,YACA,aACA,kBACA,+CAGJ,2CACI,aACA,uBACA,mBACA,YAEA,gDACI,kBACA,UACA,cACA,mBACA,WACA,YACA,sBACA,qBACA,yBACA,eAGJ,iDACI,kBACA,UACA,kBACA,sBACA,YACA,YACA,iBACA,kBACA,UXlFV,QWmFU,yBACA,qBAGJ,kDACI,kBACA,UACA,kBACA,aACA,YACA,UX7FV,QW8FU,gBACA,iBX9CP,mBW+CO,WACA,mBACA,eAEA,wCACI,wDACI,iBXpDf,oBE0CD,+EACI,aACA,iBACA,oBACA,WACA,uBAEA,+FACI,aACA,iBACA,uBACA,IFxGV,OEyGU,iBACA,WACA,gBACA,sCAEA,yGACI,aAGJ,yGACI,gDAEA,2HACI,oBAGJ,yHACI,oBACA,aACA,UACA,gBAIR,6GACI,gBACA,UFlId,QEmIc,gBACA,MFnFX,mBEqFW,iHACI,kBACA,kBACA,cACA,eACA,wBAIR,+GACI,aACA,mBACA,gBACA,aACA,WACA,eAGA,uHACI,cACA,WACA,cF9JnB,ME+JmB,yCACA,mCACA,eACA,eAEA,wCACI,mIACI,WACA,6CAGJ,qIACI,SACA,oCAKZ,mHACI,gBACA,WACA,kBACA,UFpLlB,QEqLkB,gBAEA,oQAEI,cACA,aAIR,uIACI,kBACA,WACA,UFjMlB,QEkMkB,gBAEA,6IACI,4BAGJ,6IACI,4BAGJ,6IACI,4BAKA,mMACI,aF/M1B,SEgN0B,4BAGJ,qJACI,cAMJ,wCACI,qMACI,WAIR,+IACI,mBACA,kBACA,UACA,eAIR,mJACI,uBAGJ,icAGI,kBACA,WFvPvB,OEwPuB,gBACA,WACA,YF7OtB,KE8OsB,kBACA,uBACA,4BACA,UF1PtB,OE2PsB,gBACA,yCACA,cF/PvB,MEiQuB,ygBACI,OFtP1B,SEuP0B,eAGJ,mgBACI,OF3P1B,SE4P0B,eAEA,mjBACI,0BACA,kBACA,MACA,OACA,SACA,QACA,WACA,YACA,UFjR9B,OEkR8B,yBACA,sBAKZ,qJACI,eAGJ,yJACI,aACA,gBACA,qBACA,0BAGJ,2IACI,kBACA,aACA,KFxSvB,MEySuB,gBACA,MFpStB,QEqSsB,OFrStB,QEsSsB,YFtStB,QEuSsB,kBACA,cF7StB,QE8SsB,eACA,eAEA,wCACI,uJACI,iBFlN5B,oBEwNY,mIACI,aACA,8BACA,WACA,gDAEA,iJACI,aACA,mBACA,IFnUvB,MEoUuB,eACA,UFlUtB,QEmUsB,gBAGJ,uLACI,aACA,mBACA,IFxUtB,KE0UsB,2LACI,8BACA,eAKZ,qIACI,aACA,iBACA,uBACA,mBACA,4BACA,iBACA,sBACA,cFzVlB,KE0VkB,yCAEA,mJACI,UF9VtB,QE+VsB,gBAGJ,yIACI,UFpWtB,OEqWsB,MFnTnB,mBEsTe,yIACI,WFvWtB","file":"index.css"} \ No newline at end of file +{"version":3,"sourceRoot":"","sources":["../sass/_init.scss","../sass/index.scss","../sass/builder/_index.scss","../sass/builder/_nav.scss","../sass/builder/_body.scss","../sass/builder/_ul.tab.scss","../sass/builder/_ul.button.scss","../sass/builder/_ul.top.scss","../sass/builder/_ul.path.scss","../sass/builder/_body-left.scss","../sass/builder/_body-right.scss","../sass/builder/_color-picker.scss"],"names":[],"mappings":"CA0HA,EACI,kBACA,SACA,UACA,cACA,sCACA,iBACA,YACA,aACA,+BACA,MAvBI,kBAwBJ,qBACA,qBACA,sBACA,wBACA,qBACA,iCACA,0BAuBA,8BACA,4BACA,2BACA,yBACA,wBACA,oBA1BA,qBACI,aAKA,wBACI,cACA,aACA,iBAjDJ,mBAoDA,8BACI,iBApDJ,mBAuDA,UACI,gBAWR,0CAEI,2BACA,yBACA,wBACA,sBACA,qBACA,iBAGJ,yCAEI,8BACA,4BACA,2BACA,yBACA,wBACA,oBAGJ,mBAEI,sBAIR,IACI,0FACA,iBAGA,uBACI,cAGJ,cACI,gEAIR,SACI,YAGJ,sBAGI,wBACA,qBACA,gBAMA,yCACI,MA3HA,mBA4HA,UAGJ,qEACI,MAhIA,mBAmIJ,6DACI,MApIA,mBAwIR,8BAEI,eAGJ,wBAMI,oBACA,kBACA,cCxPJ,KACC,eACA,cACA,WACA,YACA,gBAGD,KACC,kBACA,aACG,iBACA,uBACH,WACA,YACG,yCACH,uBAEA,6IAMC,2BAGE,cACI,eACA,aACA,MACA,OACA,SACA,QACA,WACA,YACA,2BACA,mCAEA,sCAZJ,cAaQ,cAGJ,gBACI,kBACA,QACA,SACA,gCACA,kBACA,4BACA,UD/CN,QCgDM,MDmDJ,mBEpGI,0FACI,MFiDP,mBE9CG,6EACI,WAIR,mDACI,2BAQA,0FACI,MF+BP,mBE5BG,6EACI,WAIR,mDACI,2BAQA,wEACI,MFaP,mBEVG,2EACI,WAIR,iDACI,aAMJ,yEACI,KFHH,mBEMD,yCACI,OAGJ,yCACI,mBAMJ,0EACI,KFlBH,mBEqBD,2CACI,QAGJ,0CACI,sBCjFZ,iBACI,gBACA,aACA,MACA,OACA,QACA,WACA,yBACA,gDAEA,yBACI,aACA,8BACA,mBACA,cACA,eACA,WACA,OHQF,KGNE,8CACI,aACA,mBACA,IHnBP,MGqBO,mEACI,oBAGJ,kDACI,cACA,OHZV,QGeM,0DACI,uBACA,UH1BV,QG2BU,mBACA,gBACA,eAEA,+DACI,oBACA,UH/Bd,OGgCc,MHYX,mBGND,8CACI,kBACA,aACA,mBACA,WACA,MACA,SACA,2BACA,YAEA,gDACI,cACA,kBACA,eACA,eAEA,wCACI,sDACI,oBAIR,2DACI,MHjBX,mBGqBG,kDACI,cACA,YACA,eACA,eAEA,wCACI,wDACI,iBAIR,uDACI,UAKR,kDACI,UACA,cACA,gCAIR,8CACI,aACA,mBACA,WAEA,sDACI,aACA,mBACA,SAEA,6DACI,aACA,mBACA,UACA,eACA,mBACA,iBHhBZ,mBGiBY,sBAEA,iEACI,iBHlEf,mBGmEe,WAGJ,iEACI,kBACA,mBACA,kBACA,+BACA,MH7BhB,mBG+BgB,yEACI,WACA,kBACA,MACA,OACA,SACA,cACA,YACA,aACA,kBACA,iBHzCpB,mBG6CY,+DACI,kBACA,cAKZ,uDACI,cACA,eACA,kBACA,0CACA,eC9JhB,0BAGI,WAEA,yBACA,eAEA,uCACI,aACA,WACA,YACA,iBJiGA,kBI/FA,+CACI,kBACA,cACA,QJdP,MIeO,UACA,YACA,WJPN,QIQM,YJRN,QISM,mBACA,sBACA,UJjBN,KIkBM,WACA,uBAOA,uDACI,mBACA,kBACA,QACA,OACA,WACA,kBACA,eJvCX,OIwCW,UJnBV,KIoBU,oCAGJ,mDACI,oBACA,uBACA,oBACA,kBACA,cAGJ,4DACI,yCAKZ,iCACI,cACA,cACA,WACA,eACA,eACA,gBACA,eACA,2BCnER,oBACI,aACA,gBACA,WAEA,8FAEI,yCAGJ,uBACI,aACA,uBACA,mBACA,ILXH,MKYG,OACA,YLFF,KKGE,kBACA,ULZF,QKaE,gBACA,eAEA,yBACI,cACA,kBACA,kBACA,cC1BZ,uBACI,aACA,cACA,UACA,qBACA,WACA,gBACA,gDAOQ,0GACI,iBNwCP,mBMvCO,WAFJ,0GACI,iBNwCP,mBMvCO,WAFJ,0GACI,iBNwCP,mBMvCO,WAIR,0DACI,INlBP,MMmBO,UNhBN,QMwBM,qDACI,OACA,IN7BX,MM8BW,UN3BV,QM4BU,iBNqBP,mBMpBO,WALJ,qDACI,OACA,IN7BX,MM8BW,UN3BV,QM4BU,iBNqBP,mBMpBO,WALJ,qDACI,OACA,IN7BX,MM8BW,UN3BV,QM4BU,iBNqBP,mBMpBO,WALJ,qDACI,OACA,IN7BX,MM8BW,UN3BV,QM4BU,iBNqBP,mBMpBO,WAKZ,0BACI,OACA,aACA,uBACA,mBACA,MACA,YNjCF,QMkCE,kBACA,YACA,gBACA,cN/CH,MMgDG,eACA,eAEA,wCACI,gCACI,iBN6CR,oBMzCA,4BACI,cACA,kBACA,UNzDN,QONN,oBACI,aACA,uBACA,UACA,gBAEA,uBACI,aACA,OACA,uBACA,mBACA,IPRH,MOSG,OPCF,0BOCE,UPRF,QOSE,gBACA,cPbH,MOcG,eACA,eAEA,wCACI,6BACI,iBP+ER,oBO3EA,2BACI,MP4BH,mBOzBD,2BACI,UAGJ,yBACI,cACA,kBACA,kBACA,cCtCZ,qBACI,gBACA,SAEA,WACA,aACA,mBACA,uBACA,IRPC,OQQD,QRNC,MQOD,cACA,gBACA,6CACA,sBACA,eAEA,6BACI,aAGJ,wBACI,URhBF,OQiBE,gBACA,eACA,eAEA,yEACI,YACA,aR3BP,OQ4BO,sBAGJ,0CACI,oBACA,MRqBH,mBQpBG,YAGJ,wCACI,6EACI,MReP,oBSvDT,0BACI,eACA,ITuBE,KStBF,YACA,aACA,cACA,iBACA,uBACA,YACA,yBACA,yBACA,+CACA,eAEA,qCACI,aACA,iBACA,cACA,mBACA,ITdF,OSeE,QTbF,KScE,WACA,aACA,gDACA,cAEA,4CACI,WACA,gBAGJ,4CACI,aACA,mBACA,IT/BP,MSgCO,eACA,WACA,YTvBN,KSwBM,gBACA,UTjCN,QSkCM,gBACA,iBT4DJ,mBS3DI,cTvCP,MSyCO,8DACI,WT5CX,OS6CW,cACA,kBACA,gBACA,iBTMP,mBSLO,WAEA,gEACI,cACA,kBACA,kBACA,cCxDpB,2BACI,eACA,IVuBE,KUtBF,eACA,aACA,cACA,iBAEA,cACA,yBACH,yBACG,8CACA,eAEA,gCACI,YCfR,2BACI,eACA,aACA,mBACA,cACA,SACA,OACA,SACA,QACA,WACA,YACA,+BACA,wBACA,gCACA,UACA,eACA,oCACA,yFAEA,gCACI,MACA,UACA,gCACA,2BACA,mCACA,UACA,wCACA,yFAGJ,mCACI,aACA,iBACA,uBACA,mBACA,SACA,cACA,WAEA,uCACI,eACA,WACA,mCACA,6BACA,aACA,cACA,uBACA,kBACA,aAGJ,0CACI,kBACA,YACA,YACA,aACA,kBACA,+CAGJ,2CACI,aACA,uBACA,mBACA,YAEA,gDACI,kBACA,UACA,cACA,mBACA,WACA,YACA,sBACA,qBACA,yBACA,eAGJ,iDACI,kBACA,UACA,kBACA,sBACA,YACA,YACA,iBACA,kBACA,UXlFV,QWmFU,yBACA,qBAGJ,kDACI,kBACA,UACA,kBACA,aACA,YACA,UX7FV,QW8FU,gBACA,iBX9CP,mBW+CO,WACA,mBACA,eAEA,wCACI,wDACI,iBXpDf,oBE0CD,+EACI,aACA,iBACA,oBACA,WACA,uBAEA,+FACI,aACA,iBACA,uBACA,IFxGV,OEyGU,iBACA,WACA,gBACA,sCAEA,yGACI,aAGJ,yGACI,gDAEA,2HACI,oBAGJ,yHACI,oBACA,aACA,UACA,gBAIR,6GACI,gBACA,UFlId,QEmIc,gBACA,MFnFX,mBEqFW,iHACI,kBACA,kBACA,cACA,eACA,wBAIR,+GACI,aACA,mBACA,gBACA,aACA,WACA,eAGA,uHACI,cACA,WACA,cF9JnB,ME+JmB,yCACA,mCACA,eACA,eAEA,wCACI,mIACI,WACA,6CAGJ,qIACI,SACA,oCAKZ,mHACI,gBACA,WACA,kBACA,UFpLlB,QEqLkB,gBAEA,oQAEI,cACA,aAIR,uIACI,kBACA,WACA,UFjMlB,QEkMkB,gBAEA,6IACI,4BAGJ,6IACI,4BAGJ,6IACI,4BAKA,mMACI,aF/M1B,SEgN0B,4BAGJ,qJACI,cAMJ,wCACI,qMACI,WAIR,+IACI,mBACA,kBACA,UACA,eAIR,mJACI,uBAGJ,icAGI,kBACA,WFvPvB,OEwPuB,gBACA,WACA,YF7OtB,KE8OsB,kBACA,uBACA,4BACA,UF1PtB,OE2PsB,gBACA,yCACA,cF/PvB,MEiQuB,ygBACI,OFtP1B,SEuP0B,eAGJ,mgBACI,OF3P1B,SE4P0B,eAEA,mjBACI,0BACA,kBACA,MACA,OACA,SACA,QACA,WACA,YACA,UFjR9B,OEkR8B,yBACA,sBAKZ,qJACI,eAGJ,yJACI,aACA,gBACA,qBACA,0BAGJ,2IACI,kBACA,aACA,KFxSvB,MEySuB,gBACA,MFpStB,QEqSsB,OFrStB,QEsSsB,YFtStB,QEuSsB,kBACA,cF7StB,QE8SsB,eACA,eAEA,wCACI,uJACI,iBFlN5B,oBEwNY,mIACI,aACA,8BACA,WACA,gDAEA,iJACI,aACA,mBACA,IFnUvB,MEoUuB,eACA,UFlUtB,QEmUsB,gBAGJ,uLACI,aACA,mBACA,IFxUtB,KE0UsB,2LACI,8BACA,eAKZ,qIACI,aACA,iBACA,uBACA,mBACA,4BACA,iBACA,sBACA,cFzVlB,KE0VkB,yCAEA,mJACI,UF9VtB,QE+VsB,gBAGJ,yIACI,UFpWtB,OEqWsB,MFnTnB,mBEsTe,yIACI,WFvWtB","file":"index.css"} \ No newline at end of file diff --git a/image/md/0.jpg b/image/md/0.jpg new file mode 100644 index 0000000..0a8fa84 Binary files /dev/null and b/image/md/0.jpg differ diff --git a/image/md/1.jpg b/image/md/1.jpg new file mode 100644 index 0000000..2e11717 Binary files /dev/null and b/image/md/1.jpg differ diff --git a/image/md/2.jpg b/image/md/2.jpg new file mode 100644 index 0000000..7c18dcc Binary files /dev/null and b/image/md/2.jpg differ diff --git a/image/001.jpg b/image/preview/template/full/001.jpg similarity index 100% rename from image/001.jpg rename to image/preview/template/full/001.jpg diff --git a/image/002.jpg b/image/preview/template/full/002.jpg similarity index 100% rename from image/002.jpg rename to image/preview/template/full/002.jpg diff --git a/image/003.jpg b/image/preview/template/full/003.jpg similarity index 100% rename from image/003.jpg rename to image/preview/template/full/003.jpg diff --git a/image/004.jpg b/image/preview/template/full/004.jpg similarity index 100% rename from image/004.jpg rename to image/preview/template/full/004.jpg