From 970f93c9ac0d4972087bf108bd8ff834fd24b1b9 Mon Sep 17 00:00:00 2001
From: s2545411 <d.mysliwiec@student.utwente.nl>
Date: Tue, 19 Oct 2021 17:39:56 +0200
Subject: [PATCH] Scale clear data page
---
pages/Clear-Data.vue | 227 ++++++++++++++++++++-----------------------
1 file changed, 108 insertions(+), 119 deletions(-)
diff --git a/pages/Clear-Data.vue b/pages/Clear-Data.vue
index 7ca50d0..b8eee73 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;
--
GitLab