summaryrefslogtreecommitdiff
path: root/templates
diff options
context:
space:
mode:
authorJfriedli2021-03-18 14:18:28 +0100
committerJfriedli2021-03-18 14:18:28 +0100
commitb325dcc4523f13dfe7c741335a7bb80a91a1fac6 (patch)
tree1af6e2456419a7f3ebbb41c95fb08f5a53151212 /templates
parent81780062aea2f9de8dd704de1da7743937b79c38 (diff)
refactor index and download finished
Diffstat (limited to 'templates')
-rw-r--r--templates/base.html14
-rw-r--r--templates/download.html35
-rw-r--r--templates/index.html34
3 files changed, 49 insertions, 34 deletions
diff --git a/templates/base.html b/templates/base.html
index 576f264..8d6712c 100644
--- a/templates/base.html
+++ b/templates/base.html
@@ -13,25 +13,17 @@
13</head> 13</head>
14 14
15<body class="flex flex-col h-screen justify-between"> 15<body class="flex flex-col h-screen justify-between">
16 <header class="h-20 w-full bg-blue-100 my-0 flex justify-center"> 16 <header class="h-20 w-full bg-blue-light my-0 flex justify-center">
17 <a href='.' class="mt-8"> 17 <a href='.' class="mt-8">
18 <img class='max-h-28' src="{{ url_for('static', filename='logo.png') }}" alt="mat2 logo" /> 18 <img class='max-h-28' src="{{ url_for('static', filename='logo.png') }}" alt="mat2 logo" />
19 </a> 19 </a>
20 </header> 20 </header>
21 21
22 22 <section class="mb-auto mt-12 pt-8">
23
24 <section class="mb-auto mt-8 pt-8">
25 {% with messages = get_flashed_messages() %} 23 {% with messages = get_flashed_messages() %}
26 {% if messages %} 24 {% if messages %}
27 {% for message in messages %} 25 {% for message in messages %}
28 <div class="text-white px-6 py-4 border-0 rounded relative mb-4 bg-red-500"> 26 <div class="text-white px-6 py-4 border-0 relative mb-4 bg-red-500">
29 <span class="text-xl inline-block mr-5 align-middle">
30 <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
31 <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
32 d="M12 8v4m0 4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
33 </svg>
34 </span>
35 <span class="inline-block align-middle mr-8"> 27 <span class="inline-block align-middle mr-8">
36 {{ message }} 28 {{ message }}
37 </span> 29 </span>
diff --git a/templates/download.html b/templates/download.html
index 2313d04..77f081a 100644
--- a/templates/download.html
+++ b/templates/download.html
@@ -2,14 +2,29 @@
2 2
3{% block content %} 3{% block content %}
4<div class="grid grid-rows-1 w-50"> 4<div class="grid grid-rows-1 w-50">
5 <div class="flex justify-center"> 5 <div class="grid grid-rows-1">
6 <div class="rounded overflow-hidden shadow-lg p-4"> 6 {% if not meta_after %}
7 {% if not meta_after %}
8 <div class="px-6 py-4 grid grid-rows-1"> 7 <div class="px-6 py-4 grid grid-rows-1">
9 <h1 class="font-bold text-xl mb-2">Metadata removed</h1> 8 <div class="font-light text-center text-4xl mb-2">Cleaned Metadata</div>
10 </div> 9 </div>
10 <p class="text-gray-700 text-center text-sm text-opacity-80">
11 Successfully removed the metadata.
12 </p>
13 {% endif %}
14 {% if meta_after %}
15 <div class="px-6 py-4 grid grid-rows-1">
16 <div class="font-light text-center text-4xl mb-2">Metadata Partially Removed</div>
17 </div>
18 <p class="text-gray-700 text-center text-sm text-opacity-80">
19 Could not remove all the metadata. Consult the table below for the remaining metadata.
20 </p>
21 {% endif %}
22 </div>
23
24 <div class="flex justify-center mt-8">
25 <div class="rounded w-50 overflow-hidden shadow-lg p-4">
26 {% if not meta_after %}
11 <p class="text-gray-700 text-base text-center"> 27 <p class="text-gray-700 text-base text-center">
12 Successfully removed the metadata
13 <svg class="max-h-40 fill-current text-green-600" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" 28 <svg class="max-h-40 fill-current text-green-600" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"
14 fill="currentColor"> 29 fill="currentColor">
15 <path fill-rule="evenodd" 30 <path fill-rule="evenodd"
@@ -20,11 +35,7 @@
20 {% endif %} 35 {% endif %}
21 36
22 {% if meta_after %} 37 {% if meta_after %}
23 <div class="px-6 py-4 grid grid-rows-1">
24 <h1 class="font-bold text-xl mb-2">Metadata partially removed</h1>
25 </div>
26 <p class="text-gray-700 text-base text-center"> 38 <p class="text-gray-700 text-base text-center">
27 Could not remove all the metadata
28 <svg class="max-h-40 fill-current text-yellow-600" xmlns="http://www.w3.org/2000/svg" 39 <svg class="max-h-40 fill-current text-yellow-600" xmlns="http://www.w3.org/2000/svg"
29 viewBox="0 0 20 20" fill="currentColor"> 40 viewBox="0 0 20 20" fill="currentColor">
30 <path fill-rule="evenodd" 41 <path fill-rule="evenodd"
@@ -37,9 +48,9 @@
37 48
38 <a class="uk-flex-1" href='{{ download_uri }}'> 49 <a class="uk-flex-1" href='{{ download_uri }}'>
39 <button 50 <button
40 class="w-full bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded flex justify-center" 51 class="w-full bg-blue-dark hover:bg-blue-700 text-white py-2 px-4 rounded flex justify-center"
41 > 52 >
42 <svg class="w-4 h-4 mr-2 text-white" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"> 53 <svg class="w-4 h-4 mr-2 text-white self-center" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20">
43 <path style="fill: white" d="M13 8V2H7v6H2l8 8 8-8h-5zM0 18h20v2H0v-2z" /> 54 <path style="fill: white" d="M13 8V2H7v6H2l8 8 8-8h-5zM0 18h20v2H0v-2z" />
44 </svg> 55 </svg>
45 <span>Download Cleaned File</span> 56 <span>Download Cleaned File</span>
@@ -52,7 +63,7 @@
52 <div class="bg-white shadow-md rounded my-6"> 63 <div class="bg-white shadow-md rounded my-6">
53 <table class="text-left w-full border-collapse"> 64 <table class="text-left w-full border-collapse">
54 <div class="px-6 py-4 grid grid-rows-1"> 65 <div class="px-6 py-4 grid grid-rows-1">
55 <h1 class="font-bold text-xl mb-2">Remaining Metadata</h1> 66 <h1 class="font-light text-center text-4xl">Remaining Metadata</h1>
56 </div> 67 </div>
57 <thead> 68 <thead>
58 <tr> 69 <tr>
diff --git a/templates/index.html b/templates/index.html
index f0268f3..addf868 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -1,24 +1,36 @@
1{% extends "base.html" %} 1{% extends "base.html" %}
2{% block content %} 2{% block content %}
3<div class="flex justify-center"> 3
4<div class="grid grid-rows-1">
5 <div class="font-light text-center text-4xl mb-2">Remove Metadata</div>
6 <p class="text-gray-700 text-center text-sm text-opacity-80">
7 The file you see is just the tip of the iceberg. Remove the hidden metadata.
8 </p>
9</div>
10
11<div class="flex justify-center mt-8">
4 <div class="w-50 rounded overflow-hidden shadow-lg pb-4"> 12 <div class="w-50 rounded overflow-hidden shadow-lg pb-4">
5 <div class="px-6 py-4">
6 <div class="font-bold text-xl mb-2">Remove Metadata</div>
7 <p class="text-gray-700 text-base">
8 The file you see is just the tip of the iceberg. Remove the hidden metadata.
9 </p>
10 </div>
11 <div class="px-6 pt-4 pb-2 grid grid-rows-1"> 13 <div class="px-6 pt-4 pb-2 grid grid-rows-1">
12 <form method="post" enctype="multipart/form-data" class="grid grid-rows-1"> 14 <form method="post" enctype="multipart/form-data" class="grid grid-rows-1">
13 <input type="file" name="file" id="upload_file" accept="{{ mimetypes | join(', ') }}"> 15 <input class="border rounded" type="file" name="file" id="upload_file" accept="{{ mimetypes | join(', ') }}">
14 <button class="mt-4 bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded" type="submit" 16 <button
15 value="Upload">Remove Metadata</button> 17 class="w-full mt-4 bg-blue-dark hover:bg-blue-700 text-white py-2 px-4 rounded flex justify-center"
18 type="submit"
19 value="Upload"
20 >
21 <svg class="w-4 h-4 mr-2 text-white self-center" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
22 <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16" />
23 </svg>
24 <span>
25 Remove Metadata
26 </span>
27 </button>
16 </form> 28 </form>
17 </div> 29 </div>
18 </div> 30 </div>
19</div> 31</div>
20<button 32<button
21 class="p-0 w-10 h-10 absolute sm:bottom-8 md:bottom-16 sm:right-8 md:right-16 bg-blue-300 hover:bg-blue-400 rounded-full active:shadow-lg mouse shadow transition ease-in duration-200 focus:outline-none"> 33 class="p-0 w-10 h-10 absolute bottom-8 md:bottom-16 lg:bottom-24 right-8 md:right-16 lg:right-24 bg-blue-300 hover:bg-blue-400 rounded-full active:shadow-lg mouse shadow transition ease-in duration-200 focus:outline-none">
22 <a href="/info" role="link" class="w-6 h-6 text-white inline-block font-bold"> 34 <a href="/info" role="link" class="w-6 h-6 text-white inline-block font-bold">
23 ? 35 ?
24 </a> 36 </a>