Improve form styling
Change-Id: I4c16a0d27d2fd583495df878ba50cb1a5185dbe4
diff --git a/plugin/templates/export.html b/plugin/templates/export.html
index b6979db..d8e8bb9 100644
--- a/plugin/templates/export.html
+++ b/plugin/templates/export.html
@@ -1,48 +1,43 @@
<!DOCTYPE html>
<!-- TODO: style, localization, remove 'Zu Testzwecken' in the end, ...-->
<html>
-<head>
-<meta charset="UTF-8">
-<title>Export Template</title>
-<script src="https://korap.ids-mannheim.de/js/korap-plugin-0.2.js"></script>
-</head>
-<body>
+ <head>
+ <meta charset="UTF-8">
+ <title>Export Template</title>
+ <script src="https://korap.ids-mannheim.de/js/korap-plugin-0.2.js"></script>
+ <link type="text/css" rel="stylesheet" href="https://korap.ids-mannheim.de/css/kalamar-plugin-0.2.css" />
+ </head>
+ <body style="padding: .5em">
-<form id ="frmid" action="http://localhost:7777/export" method="POST">
- Zu Testzwecken: <br/>
- <ul>
- <li> <a onclick="KorAPlugin.requestMsg({'action':'get', 'key':'KQ'}, function (d) { document.write(JSON.stringify(d.value))})">Get KQ</a> </li>
- </ul>
- <label for="q"> Suchanfrage:</label>
- <input id="q" name="q" value="Wasser">
- <label for="ql"> Suchanfragesprache:</label>
- <input id="ql" name="ql" value="poliqarp">
- <input type="hidden" id="cq" name="cq" value="">
- <br/>
- <br/>
- <br/>
- <!--
- <label for="fname">Dateiname:</label>
- <input type="text" id="fname" name="fname" required> <br/>
--->
- Dateiformat:
- <input type="radio" id="formatjson" name="format" value="json">
- <label for="formatjson">JSON</label>
- <input type="radio" checked="checked" id="formathtml" name="format" value="rtf">
- <label for="formatrtf">RTF</label><br/>
-
- <div>
- <br/>
- <label>
+ <form id="frmid" class="form-table" action="http://localhost:7777/export" method="POST">
+ <fieldset>
+ <legend>Export</legend>
+ Zu Testzwecken: <br/>
+ <ul>
+ <li> <a onclick="KorAPlugin.requestMsg({'action':'get', 'key':'KQ'}, function (d) { document.write(JSON.stringify(d.value))})">Get KQ</a> </li>
+ </ul>
+
+ <label for="q">Suchanfrage</label>
+ <input id="q" name="q" value="Wasser">
+ <label for="ql">Suchanfragesprache</label>
+ <input id="ql" name="ql" value="poliqarp">
+ <input type="hidden" id="cq" name="cq" value="">
+
+ <label for="format">Dateiformat</label>
+ <input type="radio" id="formatjson" name="format" value="json">
+ <label for="formatjson">JSON</label>
+ <input type="radio" checked="checked" id="formathtml" name="format" value="rtf">
+ <label for="formatrtf">RTF</label>
+
+ <div>
+ <label>
<input type="checkbox" name="islimit" checked="checked" value="limited">
Beschränken auf
- <input name="hitc" type="number" min="1" max="1000" value="20">
+ <input name="hitc" type="number" min="1" max="1000" value="20">
Treffer
- </label>
- <br/>
- <br/>
- </div>
- <button> Exportieren </button>
-</form>
-</body>
+ </label>
+ </div>
+ <input type="submit" value="Exportieren">
+ </form>
+ </body>
</html>