diff --git a/pages/Clear-Data.vue b/pages/Clear-Data.vue index 7ca50d00502fd7b61094d5350e805b95a0dd845b..b8eee733374b411752cf992cb26f635d9dc7293f 100644 --- a/pages/Clear-Data.vue +++ b/pages/Clear-Data.vue @@ -4,140 +4,127 @@ <NuxtLink to="/" class="link-back">Clear data</NuxtLink> <h1 class="sure">Are you 100% sure?</h1> <h2 class="warning">Warning!<br>This process is irreversible</h2> - <NuxtLink to="/"><svg - class="bigtrash" - xmlns="http://www.w3.org/2000/svg" - xmlns:xlink="http://www.w3.org/1999/xlink" - width="39" - height="45" - viewBox="0 0 39 45" - > - <defs> - <filter - id="Rectangle_15" - x="3" - y="0" - width="33" - height="27" - filterUnits="userSpaceOnUse" - > - <feOffset dy="3" input="SourceAlpha" /> - <feGaussianBlur stdDeviation="3" result="blur" /> - <feFlood flood-opacity="0.161" /> - <feComposite operator="in" in2="blur" /> - <feComposite in="SourceGraphic" /> - </filter> - <filter - id="Rectangle_14" - x="0" - y="6" - width="39" - height="39" - filterUnits="userSpaceOnUse" - > - <feOffset dy="3" input="SourceAlpha" /> - <feGaussianBlur stdDeviation="3" result="blur-2" /> - <feFlood flood-opacity="0.161" /> - <feComposite operator="in" in2="blur-2" /> - <feComposite in="SourceGraphic" /> - </filter> - <filter - id="Line_8" - x="5.358" - y="11.152" - width="21" - height="28.697" - filterUnits="userSpaceOnUse" - > - <feOffset dy="3" input="SourceAlpha" /> - <feGaussianBlur stdDeviation="3" result="blur-3" /> - <feFlood flood-opacity="0.161" /> - <feComposite operator="in" in2="blur-3" /> - <feComposite in="SourceGraphic" /> - </filter> - <filter - id="Line_9" - x="12.015" - y="11.152" - width="21" - height="28.697" - filterUnits="userSpaceOnUse" - > - <feOffset dy="3" input="SourceAlpha" /> - <feGaussianBlur stdDeviation="3" result="blur-4" /> - <feFlood flood-opacity="0.161" /> - <feComposite operator="in" in2="blur-4" /> - <feComposite in="SourceGraphic" /> - </filter> - </defs> - <g id="Group_14" data-name="Group 14" transform="translate(36.373 -1900.955)"> - <g class="cls-8" transform="matrix(1, 0, 0, 1, -36.37, 1900.96)"> - <g id="Rectangle_15-2" data-name="Rectangle 15" class="cls-1" transform="translate(12 6)"> - <rect class="cls-3" width="15" height="9" rx="3" /> - <rect - class="cls-4" - x="1.5" - y="1.5" - width="12" - height="6" - rx="1.5" - /> + <NuxtLink to="/"> + <svg + class="bigtrash" + xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink" + width="39" + height="45" + viewBox="0 0 39 45" + > + <defs> + <filter + id="Rectangle_15" + x="3" + y="0" + width="33" + height="27" + filterUnits="userSpaceOnUse" + > + <feOffset dy="3" input="SourceAlpha" /> + <feGaussianBlur stdDeviation="3" result="blur" /> + <feFlood flood-opacity="0.161" /> + <feComposite operator="in" in2="blur" /> + <feComposite in="SourceGraphic" /> + </filter> + <filter + id="Rectangle_14" + x="0" + y="6" + width="39" + height="39" + filterUnits="userSpaceOnUse" + > + <feOffset dy="3" input="SourceAlpha" /> + <feGaussianBlur stdDeviation="3" result="blur-2" /> + <feFlood flood-opacity="0.161" /> + <feComposite operator="in" in2="blur-2" /> + <feComposite in="SourceGraphic" /> + </filter> + <filter + id="Line_8" + x="5.358" + y="11.152" + width="21" + height="28.697" + filterUnits="userSpaceOnUse" + > + <feOffset dy="3" input="SourceAlpha" /> + <feGaussianBlur stdDeviation="3" result="blur-3" /> + <feFlood flood-opacity="0.161" /> + <feComposite operator="in" in2="blur-3" /> + <feComposite in="SourceGraphic" /> + </filter> + <filter + id="Line_9" + x="12.015" + y="11.152" + width="21" + height="28.697" + filterUnits="userSpaceOnUse" + > + <feOffset dy="3" input="SourceAlpha" /> + <feGaussianBlur stdDeviation="3" result="blur-4" /> + <feFlood flood-opacity="0.161" /> + <feComposite operator="in" in2="blur-4" /> + <feComposite in="SourceGraphic" /> + </filter> + </defs> + <g id="Group_14" data-name="Group 14" transform="translate(36.373 -1900.955)"> + <g class="cls-8" transform="matrix(1, 0, 0, 1, -36.37, 1900.96)"> + <g id="Rectangle_15-2" data-name="Rectangle 15" class="cls-1" transform="translate(12 6)"> + <rect class="cls-3" width="15" height="9" rx="3" /> + <rect + class="cls-4" + x="1.5" + y="1.5" + width="12" + height="6" + rx="1.5" + /> + </g> </g> - </g> - <g class="cls-7" transform="matrix(1, 0, 0, 1, -36.37, 1900.96)"> - <g id="Rectangle_14-2" data-name="Rectangle 14" class="cls-2" transform="translate(9 12)"> - <path class="cls-3" d="M0,0H21a0,0,0,0,1,0,0V16a5,5,0,0,1-5,5H5a5,5,0,0,1-5-5V0A0,0,0,0,1,0,0Z" /> - <path - class="cls-4" - d="M3,1.5H18A1.5,1.5,0,0,1,19.5,3V16A3.5,3.5,0,0,1,16,19.5H5A3.5,3.5,0,0,1,1.5,16V3A1.5,1.5,0,0,1,3,1.5Z" - /> + <g class="cls-7" transform="matrix(1, 0, 0, 1, -36.37, 1900.96)"> + <g id="Rectangle_14-2" data-name="Rectangle 14" class="cls-2" transform="translate(9 12)"> + <path class="cls-3" d="M0,0H21a0,0,0,0,1,0,0V16a5,5,0,0,1-5,5H5a5,5,0,0,1-5-5V0A0,0,0,0,1,0,0Z" /> + <path + class="cls-4" + d="M3,1.5H18A1.5,1.5,0,0,1,19.5,3V16A3.5,3.5,0,0,1,16,19.5H5A3.5,3.5,0,0,1,1.5,16V3A1.5,1.5,0,0,1,3,1.5Z" + /> + </g> + </g> + <line id="Line_7" data-name="Line 7" class="cls-2" x2="26.627" transform="translate(-30.5 1914.211)" /> + <g class="cls-6" transform="matrix(1, 0, 0, 1, -36.37, 1900.96)"> + <line id="Line_8-2" data-name="Line 8" class="cls-2" y2="7.697" transform="translate(15.86 18.65)" /> + </g> + <g class="cls-5" transform="matrix(1, 0, 0, 1, -36.37, 1900.96)"> + <line id="Line_9-2" data-name="Line 9" class="cls-2" y2="7.697" transform="translate(22.51 18.65)" /> </g> </g> - <line id="Line_7" data-name="Line 7" class="cls-2" x2="26.627" transform="translate(-30.5 1914.211)" /> - <g class="cls-6" transform="matrix(1, 0, 0, 1, -36.37, 1900.96)"> - <line id="Line_8-2" data-name="Line 8" class="cls-2" y2="7.697" transform="translate(15.86 18.65)" /> - </g> - <g class="cls-5" transform="matrix(1, 0, 0, 1, -36.37, 1900.96)"> - <line id="Line_9-2" data-name="Line 9" class="cls-2" y2="7.697" transform="translate(22.51 18.65)" /> - </g> - </g> - </svg></NuxtLink> + </svg> + </NuxtLink> </div> </section> </template> <script> - +export default { + layout: 'settingLayout' +} </script> -<style lang="scss"> +<style lang="scss" scoped> .clear-section { - .link-back::before { - content: ''; - position: absolute; - left: 40%; - top: 1.9em; - width: 25px; - height: 25px; - border-top: 6px solid white; - border-right: 6px solid white; - border-radius: 6px; - transform: rotate(225deg); - box-shadow: 1px -2px 2px #333; - } - - height: 620px; - margin-bottom: 150px; - margin-top: 40px; width: auto; display: flex; flex-direction: column; align-items: center; - font-size: 1.3rem; + font-size: 2.5vh; text-shadow: 0 4px 7px #333; .sure { - font-size: 1.7rem; + font-size: 3.5vh; margin-top: 2em; } @@ -145,13 +132,15 @@ color: #B84D4D; padding-top: 1em; - font-size: 1.3rem; + font-size: 2.5vh; + text-shadow: none; } } .bigtrash { - transform: scale(10); - margin-top: 7em; + position: relative; + height:60vh; + width: auto; .cls-1, .cls-2, .cls-4 { fill: none;