projects / website / commitdiff
? search:
summary | shortlog | log | commit | commitdiff | tree
raw | patch | inline | side by side (parent: 413597a)
Testseite für Media-Queries
authorKai Moritz <kai@juplo.de>
Tue, 18 Feb 2014 15:32:39 +0000 (16:32 +0100)
committerKai Moritz <kai@juplo.de>
Tue, 19 Jan 2016 16:45:41 +0000 (17:45 +0100)
src/main/webapp/WEB-INF/spring/tiles.xml patch | blob | history
src/main/webapp/WEB-INF/templates/test/experimente.jsp patch | blob | history
src/main/webapp/WEB-INF/templates/testlab.jsp [new file with mode: 0644] patch | blob
src/main/webapp/WEB-INF/views/formulare.html [deleted file] patch | blob | history
src/main/webapp/WEB-INF/views/test/testlab.jsp [new file with mode: 0644] patch | blob

diff --git a/src/main/webapp/WEB-INF/spring/tiles.xml b/src/main/webapp/WEB-INF/spring/tiles.xml
index 03c04d7..5cda94a 100644 (file)
--- a/src/main/webapp/WEB-INF/spring/tiles.xml
+++ b/src/main/webapp/WEB-INF/spring/tiles.xml
@@ -26,5 +26,10 @@
     <put-attribute name="maincontent" value="/WEB-INF/templates/test/experimente.jsp" type="template"/>
   </definition>
 
     <put-attribute name="maincontent" value="/WEB-INF/templates/test/experimente.jsp" type="template"/>
   </definition>
 
+  <definition name="TESTLAB" template="/WEB-INF/templates/testlab.jsp">
+    <put-attribute name="htmlhead" value="/WEB-INF/templates/html-head.jsp" type="template"/>
+    <put-attribute name="title" value="TEST-TITLE IS MISSING" type="string"/>
+    <put-attribute name="content" value="&lt;div class='testlab'&gt;TEST-CONTENT IS MISSING&lt;div&gt;" type="string"/>
+  </definition>
 
 </tiles-definitions>
 
 </tiles-definitions>
diff --git a/src/main/webapp/WEB-INF/templates/test/experimente.jsp b/src/main/webapp/WEB-INF/templates/test/experimente.jsp
index 3a9ed9d..6245a8e 100644 (file)
--- a/src/main/webapp/WEB-INF/templates/test/experimente.jsp
+++ b/src/main/webapp/WEB-INF/templates/test/experimente.jsp
@@ -31,3 +31,7 @@
   <li><a href="${base}test/seitenaufteilung.html">Nur das Basis-Layout und die Seitenaufteilung</a></li>
   <li><a href="${base}test/seitenkopf.html">Nur das Basis-Layout und der Seitenkopf</a></li>
 </ul>
   <li><a href="${base}test/seitenaufteilung.html">Nur das Basis-Layout und die Seitenaufteilung</a></li>
   <li><a href="${base}test/seitenkopf.html">Nur das Basis-Layout und der Seitenkopf</a></li>
 </ul>
+<h2>Anderer Krams...</h2>
+<ul>
+  <li><a href="${base}test/testlab.html">Seite mit Breiten-Markierungen für den Tests von Media-Queries (Beispiel)</a></li>
+</ul>
diff --git a/src/main/webapp/WEB-INF/templates/testlab.jsp b/src/main/webapp/WEB-INF/templates/testlab.jsp
new file mode 100644 (file)
index 0000000..8f3df40
--- /dev/null
+++ b/src/main/webapp/WEB-INF/templates/testlab.jsp
@@ -0,0 +1,74 @@
+<!DOCTYPE html>
+<%@page contentType="text/html;charset=UTF-8"%>
+<%@page pageEncoding="UTF-8"%>
+<%@page session="false" %>
+<%@taglib uri="http://tiles.apache.org/tags-tiles" prefix="t" %>
+<html>
+  <head>
+    <title>juplo - <t:getAsString name="title"/></title>
+    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
+    <t:insertAttribute name="htmlhead"/>
+    <style type="text/css">
+
+      body {
+        margin: 0;
+        padding: 0;
+      }
+
+      .testlab
+      {
+        width: 100%;
+        text-indent: 0;
+        margin: 0 0 20px -320px;
+        background-color: #fff;
+      }
+      .testlab:after
+      {
+        content:"";
+        display:table;
+      }
+      .tl970
+      {
+        margin-left: 0px;
+        border-left: 970px solid green;
+        text-indent: -970px;
+        background-color: transparent;
+      }
+      .tl670
+      {
+        margin-left: -970px;
+        border-left: 670px solid yellow;
+        text-indent: -670px;
+        background-color: transparent;
+      }
+      .tl480
+      {
+        margin-left: -670px;
+        border-left: 480px solid orange;
+        text-indent: -480px;
+        background-color: transparent;
+      }
+      .tl320
+      {
+        margin-left: -480px;
+        border-left: 320px solid red;
+        text-indent: -320px;
+        background-color: transparent;
+      }
+    </style>
+  </head>
+  <body>
+    <h1><t:getAsString name="title"/></h1>
+    <div class="testlab tl970">970px
+      <div class="testlab tl670">670px
+        <div class="testlab tl480">480px
+          <div class="testlab tl320">320px
+
+            <t:insertAttribute name="content"/>
+
+          </div>
+        </div>
+      </div>
+    </div>
+  </body>
+</html>
diff --git a/src/main/webapp/WEB-INF/views/formulare.html b/src/main/webapp/WEB-INF/views/formulare.html
deleted file mode 100644 (file)
index afa587a..0000000
--- a/src/main/webapp/WEB-INF/views/formulare.html
+++ /dev/null
@@ -1,304 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
-<html xmlns="http://www.w3.org/1999/xhtml">
-<head>
-<link href='http://fonts.googleapis.com/css?family=PT+Sans:400,700,400italic,700italic' rel='stylesheet' type='text/css' />
-<link href='http://fonts.googleapis.com/css?family=PT+Serif:700' rel='stylesheet' type='text/css' />
-<title>Basiselemente - Formulare</title>
-<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
-<link rel="stylesheet" type="text/css" href="/css/base.css" />
-<link rel="stylesheet" type="text/css" href="/css/screen/fonts.css" media="screen" />
-<link rel="stylesheet" type="text/css" href="/css/screen/util.css" media="screen" /><!-- Für den Clear-Fix-Hack -->
-<link rel="stylesheet" type="text/css" href="/css/screen/formulare.css" media="screen" />
-<style type="text/css">
-body {
-border: 1em solid #fff;
-margin: 0;
-padding: 0;
-background-image: none;
-background-color: #fff;
-}
-</style>
-</head>
-<body>
-<h1>Formulare</h1>
-<div style="width: 100%; border-left: 970px solid green; padding-bottom: 20px">970px
-<div style="width: 100%; margin-left: -970px; border-left: 670px solid yellow; padding-bottom: 20px">670px
-<div style="width: 100%; margin-left: -670px; border-left: 480px solid orange; padding-bottom: 20px">480px
-<div style="width: 100%; margin-left: -480px; border-left: 320px solid red; padding-bottom: 20px">320px
-<div style="width: 75%; margin-left: -320px; background-color: #fff;">
-<form class="form" action="#" method="get">
-<h2 class="f">Anzeigetext</h2>
-<div class="f textarea">
-<label class="f info" for="textarea_01">Geben Sie hier Ihren Anzeigentext ein.</label>
-<textarea class="f error" id="textarea_01" cols="50" rows="10">Eingegebener Text</textarea>
-<span class="f error"><span class="e">&lt; </span><strong class="e">Fehler:</strong> Es wurde kein Text für die Anzeige eingegeben!</span>
-</div>
-</form>
-</div>
-<div style="width: 75%; margin-left: -320px; background-color: #fff;">
-<form class="form" action="#" method="get">
-<h2 class="f">Textformatierung</h2>
-<fieldset class="f radiobutton cf">
-<legend class="f info">
-Die zusätzlichen Gestaltungsoptionen sind nur für das Magazin wählbar.<br />
-Online erscheint die Anzeige als normaler Fließtext.
-</legend>
-<hr class="f" />
-<div class="col2">
-<div class="f">
-<input class="f" id="radio_tbox_01" type="radio" name="radio_tbox" />
-<label class="f" for="radio_tbox_01">normaler Fließtext</label>
-</div>
-<div class="f">
-<input class="f" id="radio_tbox_02" type="radio" name="radio_tbox" />
-<label class="f" for="radio_tbox_02">Text zentriert</label>
-</div>
-<div class="f">
-<input class="f" id="radio_tbox_03" type="radio" name="radio_tbox" />
-<label class="f" for="radio_tbox_03">Text fett, Negativdruck</label>
-</div>
-<div class="f">
-<input class="f" id="radio_tbox_04" type="radio" name="radio_tbox" />
-<label class="f" for="radio_tbox_04">Text fett</label>
-</div>
-<div class="f">
-<input class="f" id="radio_tbox_05" type="radio" name="radio_tbox" />
-<label class="f" for="radio_tbox_05">Text fett und rot</label>
-</div>
-</div>
-<div class="col2">
-<div class="f">
-<input class="f" id="radio_tbox_06" type="radio" name="radio_tbox" />
-<label class="f" for="radio_tbox_06">Text fett, Anzeige blau hinterlegt</label>
-</div>
-<div class="f">
-<input class="f" id="radio_tbox_07" type="radio" name="radio_tbox" />
-<label class="f" for="radio_tbox_07">Text fett, Anzeige gelb hinterlegt</label>
-</div>
-<div class="f">
-<input class="f" id="radio_tbox_08" type="radio" name="radio_tbox" />
-<label class="f" for="radio_tbox_08">Anzeige schwarz eingerahmt</label>
-</div>
-<div class="f">
-<input class="f" id="radio_tbox_09" type="radio" name="radio_tbox" />
-<label class="f" for="radio_tbox_09">Anzeige rot eingerahmt</label>
-</div>
-</div>
-</fieldset>
-</form>
-</div>
-<div style="width: 75%; margin-left: -320px; background-color: #fff;">
-<form class="form" action="#" method="get">
-<h2 class="f">Einspaltige Radiobuttons...</h2>
-<fieldset class="f radiobutton">
-<div class="f">
-<input class="f" id="radio_tbox_b01" type="radio" name="radio_tbox" />
-<label class="f" for="radio_tbox_b01">Dies ist eine etwas länglichere Beschreibung der auswählbaren Option</label>
-</div>
-<div class="f">
-<input class="f" id="radio_tbox_b02" type="radio" name="radio_tbox" />
-<label class="f" for="radio_tbox_b02">Option X</label>
-</div>
-<div class="f">
-<input class="f" id="radio_tbox_b03" type="radio" name="radio_tbox" />
-<label class="f" for="radio_tbox_b03">Dies ist eine sehr, sehr lange Beschreibung der auswählbaren Option - so lang, dass sie am Ende hoffentlich umbricht...</label>
-</div>
-</fieldset>
-<hr class="f" />
-<div class="f submit">
-<input class="f" type="submit" value="&gt; zur Übersicht" />
-<input class="f left" type="submit" value="&lt; zurück" />
-<input class="f" type="submit" value="&gt; weiter" />
-</div>
-</form>
-</div>
-<div style="width: 75%; margin-left: -320px; background-color: #fff;">
-<form class="form" action="#" method="get">
-<h2 class="f">Bild</h2>
-<fieldset class="f checkbox">
-<legend class="f">
-Du kannst Deiner Anzeige ein Bild hinzufügen.
-Das Bild erscheint nur online.
-Im Magazin erscheint die Kleinanzeige mit Hinweis auf das Onlinebild.
-</legend>
-<hr class="f" />
-<div class="f">
-<input class="f" id="checkbox_tbox_01" type="checkbox" name="checkbox_tbox" />
-<label class="f" for="checkbox_tbox_01">Ich möchte ein Bild zu dieser Anzeige hinzufügen</label>
-</div>
-<div class="f">
-<input class="f" id="checkbox_tbox_02" type="checkbox" name="checkbox_tbox" />
-<label class="f" for="checkbox_tbox_02">Ich habe die AGB für das Hochladen von Bildern gelesen und akzeptiere diese</label>
-</div>
-</fieldset>
-</form>
-</div>
-<div style="width: 75%; margin-left: -320px; background-color: #fff;">
-<form class="form" action="#" method="get">
-<h2 class="f">Alleinstehende Checkbox</h2>
-<div class="f checkbox">
-<input class="f" id="checkbox_tbox_03" type="checkbox" name="checkbox_tbox" />
-<label class="f" for="checkbox_tbox_03">Ich möchte ein Bild zu dieser Anzeige hinzufügen</label>
-</div>
-</form>
-</div>
-<div style="width: 75%; margin-left: -320px; background-color: #fff;">
-<form class="form" action="#" method="get">
-<h2 class="f">Kundendaten</h2>
-<p class="f required">
-<strong class="r">Pflichtfelder</strong> sind mit einem
-<strong class="r symbol">*</strong> markiert.
-</p>
-<div class="f text required">
-<label for="text_tbox_01" class="f"><span class="required">* </span>Nachname</label>
-<input class="f" id="text_tbox_01" type="text" value="Mustermann" />
-</div>
-<div class="f text required">
-<label for="text_tbox_02" class="f">Vorname</label>
-<input class="f" id="text_tbox_02" type="text" value="Max" />
-</div>
-<div class="f select required">
-<label for="text_tbox_03" class="f"><span class="required">* </span>Ort</label>
-<select class="f" id="text_tbox_03">
-<option>Dortmund</option>
-<option>Bochum</option>
-<option>Essen</option>
-<option>Mönchengladbach</option>
-<option>Oberhausen</option>
-<option>Castrop-Rauxel</option>
-<option>Düsseldorf</option>
-</select>
-</div>
-<div class="f text required">
-<label for="text_tbox_04" class="f"><span class="required">* </span>Straße/Hausnr.</label>
-<input class="f error" id="text_tbox_04" type="text" value="" />
-<span class="f error"><span class="e">&lt; </span><strong class="e">Fehler:</strong> Dies ist ein Pflichtfeld!</span>
-</div>
-<div class="f text required">
-<label for="text_tbox_05" class="f"><span class="required">* </span>Postleitzahl</label>
-<input class="f" id="text_tbox_05" type="text" value="" />
-</div>
-<div class="f text required">
-<label for="text_tbox_06" class="f">Telefon</label>
-<input class="f" id="text_tbox_06" type="text" value="" />
-</div>
-<hr class="f" />
-<div class="f submit">
-<input class="f" type="submit" value="&gt; weiter" />
-</div>
-</form>
-</div>
-<div style="width: 75%; margin-left: -320px; background-color: #fff;">
-<form class="form" action="#" method="get">
-<h2 class="f">Anzeige regionalisieren</h2>
-<p class="f">
-Indem Du Deine Kleinanzeige einer Stadt zuordnest, können Interessenten
-diese online leichter finden, wenn sie nur nach Kleinanzeigen aus
-bestimmten Städten suchen.
-Du kannst auch keine Stadt zuordnen, dann wird die Kleinanzeige von
-diesen Interessenten aber auch nicht gefunden.
-</p>
-<hr class="f" />
-<div class="f text">
-<label class="f" for="city">Stadt</label>
-<input id="city" type="text" class="f" />
-<p class="f info">
-Das Feld leer lassen, wenn die Anzeige nicht regionalisiert werden soll.
-</p>
-</div>
-</form>
-</div>
-<div style="width: 75%; margin-left: -320px; background-color: #fff;">
-<form class="form" action="#" method="get">
-<h2 class="f">Ein Passwort-Eingabe-Feld</h2>
-<div class="f text required">
-<label for="text_tbox_05" class="f"><span class="required">* </span>Passwort</label>
-<input class="f" id="text_tbox_05" type="password" value="t" />
-</div>
-</form>
-</div>
-<div style="width: 75%; margin-left: -320px; background-color: #fff;">
-<form class="form" action="#" method="get">
-<h2 class="f">Lade das Bild hoch</h2>
-<p class="f info">
-Du kannst ein Bild im JPEG- oder PNG-Format hochladen.
-Das Bild darf nicht größer als 8 MByte sein.
-</p>
-<div class="f file required">
-<label for="file_tbox_01" class="f"><span class="required">* </span>Bild</label>
-<input class="f" id="file_tbox_01" type="file" />
-</div>
-<hr class="f" />
-<div class="f submit">
-<input class="f" type="submit" value="&gt; Doch kein Bild" />
-<input class="f" type="submit" value="&gt; Bild hochladen" />
-</div>
-</form>
-</div>
-<div style="width: 75%; margin-left: -320px; background-color: #fff;">
-<div class="form">
-<h2 class="f">Antworten</h2>
-<p class="f required">
-<strong class="r">Pflichtfelder</strong> sind mit einem
-<strong class="r symbol">*</strong> markiert.
-</p>
-<div class="f text required">
-<label class="f" for="replyTo"><span class="required">*</span> Antwort-Adresse</label>
-<input id="replyTo" name="replyTo" class="f" tabindex="1" type="text" value=""/>
-</div>
-<div class="f text required">
-<label class="f" for="replyTo"><span class="required">*</span> Adresse wiederholen</label>
-<input id="replyToRepeated" name="replyToRepeated" class="f" tabindex="2" type="text" value=""/>
-</div>
-<div class="f text required">
-<label class="f" for="subject"><span class="required">*</span> Betreff</label>
-<input id="subject" name="subject" class="f" tabindex="3" type="text" value=""/>
-</div>
-<div class="f textarea required">
-<label class="f" for="text"><span class="required">*</span> Nachricht</label>
-<textarea id="text" name="text" class="f" tabindex="4" rows="15" cols="20"></textarea>
-</div>
-<div class="f checkbox">
-<input id="attachment1" name="attachment" class="f" tabindex="4" type="checkbox" value="true" checked="checked"/><input type="hidden" name="_attachment" value="on"/>
-<label class="f" for="attachment">Ich möchte eine Datei an die E-Mail anhängen.</label>
-</div>
-<div class="f checkbox">
-<input id="copy1" name="copy" class="f" tabindex="5" type="checkbox" value="true" checked="checked"/><input type="hidden" name="_copy" value="on"/>
-<label class="f" for="copy">Ich möchte eine Kopie der Nachricht zugesendet bekommen.</label>
-</div>
-</div>
-</div>
-<div style="width: 75%; margin-left: -320px; background-color: #fff;">
-<div class="form cf">
-<div class="col2 left">
-<h2 class="f">Weiter mit Anmeldung</h2>
-<div class="f text">
-<label class="f" for="username">Benutzername</label>
-<input class="f" name="username" id="username" type="text" tabindex="6" />
-</div>
-<div class="f text">
-<label class="f" for="password">Passwort</label>
-<input class="f" name="password" id="password" type="password" tabindex="7" />
-</div>
-</div>
-<div class="col2 right">
-<h2 class="f">Weiter ohne Anmeldung</h2>
-<!-- <a href="/kleinanzeigen/37431/lust+.html" title="Zu schwer? Hier klicken um das Bild zu wechseln!"><img src="/img/captcha.jpg" alt="Captcha" width="120" height="60" /></a> -->
-<div class="f captcha cf">
-<span class="f">Was steht da?</span>
-<img class="f" src="/img/captcha.jpg" alt="Captcha" width="120" height="60" />
-</div>
-<div class="f text">
-<label class="f" for="captcha">Lösung</label>
-<input class="f" name="captcha" id="captcha" type="text" tabindex="8" />
-</div>
-</div>
-</div>
-</div>
-</div>
-</div>
-</div>
-</div>
-</body>
-</html>
diff --git a/src/main/webapp/WEB-INF/views/test/testlab.jsp b/src/main/webapp/WEB-INF/views/test/testlab.jsp
new file mode 100644 (file)
index 0000000..4cf1c91
--- /dev/null
+++ b/src/main/webapp/WEB-INF/views/test/testlab.jsp
@@ -0,0 +1,257 @@
+<%@page contentType="text/html;charset=UTF-8"%>
+<%@page pageEncoding="UTF-8"%>
+<%@page session="false" %>
+<%@taglib uri="http://tiles.apache.org/tags-tiles" prefix="t" %>
+<t:insertDefinition name="TESTLAB">
+  <t:putAttribute name="title" value="Formulare" type="string"/>
+  <t:putAttribute name="content">
+    <form class="testlab form" action="#" method="get">
+      <h2 class="f">Anzeigetext</h2>
+      <div class="f textarea">
+        <label class="f info" for="textarea_01">Geben Sie hier Ihren Anzeigentext ein.</label>
+        <textarea class="f error" id="textarea_01" cols="50" rows="10">Eingegebener Text</textarea>
+        <span class="f error"><span class="e">&lt; </span><strong class="e">Fehler:</strong> Es wurde kein Text für die Anzeige eingegeben!</span>
+      </div>
+    </form>
+    <form class="testlab form" action="#" method="get">
+      <h2 class="f">Textformatierung</h2>
+      <fieldset class="f radiobutton cf">
+        <legend class="f info">
+          Die zusätzlichen Gestaltungsoptionen sind nur für das Magazin wählbar.<br />
+          Online erscheint die Anzeige als normaler Fließtext.
+        </legend>
+        <hr class="f" />
+        <div class="col2">
+          <div class="f">
+            <input class="f" id="radio_tbox_01" type="radio" name="radio_tbox" />
+            <label class="f" for="radio_tbox_01">normaler Fließtext</label>
+          </div>
+          <div class="f">
+            <input class="f" id="radio_tbox_02" type="radio" name="radio_tbox" />
+            <label class="f" for="radio_tbox_02">Text zentriert</label>
+          </div>
+          <div class="f">
+            <input class="f" id="radio_tbox_03" type="radio" name="radio_tbox" />
+            <label class="f" for="radio_tbox_03">Text fett, Negativdruck</label>
+          </div>
+          <div class="f">
+            <input class="f" id="radio_tbox_04" type="radio" name="radio_tbox" />
+            <label class="f" for="radio_tbox_04">Text fett</label>
+          </div>
+          <div class="f">
+            <input class="f" id="radio_tbox_05" type="radio" name="radio_tbox" />
+            <label class="f" for="radio_tbox_05">Text fett und rot</label>
+          </div>
+        </div>
+        <div class="col2">
+          <div class="f">
+            <input class="f" id="radio_tbox_06" type="radio" name="radio_tbox" />
+            <label class="f" for="radio_tbox_06">Text fett, Anzeige blau hinterlegt</label>
+          </div>
+          <div class="f">
+            <input class="f" id="radio_tbox_07" type="radio" name="radio_tbox" />
+            <label class="f" for="radio_tbox_07">Text fett, Anzeige gelb hinterlegt</label>
+          </div>
+          <div class="f">
+            <input class="f" id="radio_tbox_08" type="radio" name="radio_tbox" />
+            <label class="f" for="radio_tbox_08">Anzeige schwarz eingerahmt</label>
+          </div>
+          <div class="f">
+            <input class="f" id="radio_tbox_09" type="radio" name="radio_tbox" />
+            <label class="f" for="radio_tbox_09">Anzeige rot eingerahmt</label>
+          </div>
+        </div>
+      </fieldset>
+    </form>
+    <form class="testlab form" action="#" method="get">
+      <h2 class="f">Einspaltige Radiobuttons...</h2>
+      <fieldset class="f radiobutton">
+        <div class="f">
+          <input class="f" id="radio_tbox_b01" type="radio" name="radio_tbox" />
+          <label class="f" for="radio_tbox_b01">Dies ist eine etwas länglichere Beschreibung der auswählbaren Option</label>
+        </div>
+        <div class="f">
+          <input class="f" id="radio_tbox_b02" type="radio" name="radio_tbox" />
+          <label class="f" for="radio_tbox_b02">Option X</label>
+        </div>
+        <div class="f">
+          <input class="f" id="radio_tbox_b03" type="radio" name="radio_tbox" />
+          <label class="f" for="radio_tbox_b03">Dies ist eine sehr, sehr lange Beschreibung der auswählbaren Option - so lang, dass sie am Ende hoffentlich umbricht...</label>
+        </div>
+      </fieldset>
+      <hr class="f" />
+      <div class="f submit">
+        <input class="f" type="submit" value="&gt; zur Übersicht" />
+        <input class="f left" type="submit" value="&lt; zurück" />
+        <input class="f" type="submit" value="&gt; weiter" />
+      </div>
+    </form>
+    <form class="testlab form" action="#" method="get">
+      <h2 class="f">Bild</h2>
+      <fieldset class="f checkbox">
+        <legend class="f">
+          Du kannst Deiner Anzeige ein Bild hinzufügen.
+          Das Bild erscheint nur online.
+          Im Magazin erscheint die Kleinanzeige mit Hinweis auf das Onlinebild.
+        </legend>
+        <hr class="f" />
+        <div class="f">
+          <input class="f" id="checkbox_tbox_01" type="checkbox" name="checkbox_tbox" />
+          <label class="f" for="checkbox_tbox_01">Ich möchte ein Bild zu dieser Anzeige hinzufügen</label>
+        </div>
+        <div class="f">
+          <input class="f" id="checkbox_tbox_02" type="checkbox" name="checkbox_tbox" />
+          <label class="f" for="checkbox_tbox_02">Ich habe die AGB für das Hochladen von Bildern gelesen und akzeptiere diese</label>
+        </div>
+      </fieldset>
+    </form>
+    <form class="testlab form" action="#" method="get">
+      <h2 class="f">Alleinstehende Checkbox</h2>
+      <div class="f checkbox">
+        <input class="f" id="checkbox_tbox_03" type="checkbox" name="checkbox_tbox" />
+        <label class="f" for="checkbox_tbox_03">Ich möchte ein Bild zu dieser Anzeige hinzufügen</label>
+      </div>
+    </form>
+    <form class="testlab form" action="#" method="get">
+      <h2 class="f">Kundendaten</h2>
+      <p class="f required">
+        <strong class="r">Pflichtfelder</strong> sind mit einem
+        <strong class="r symbol">*</strong> markiert.
+      </p>
+      <div class="f text required">
+        <label for="text_tbox_01" class="f"><span class="required">* </span>Nachname</label>
+        <input class="f" id="text_tbox_01" type="text" value="Mustermann" />
+      </div>
+      <div class="f text required">
+        <label for="text_tbox_02" class="f">Vorname</label>
+        <input class="f" id="text_tbox_02" type="text" value="Max" />
+      </div>
+      <div class="f select required">
+        <label for="text_tbox_03" class="f"><span class="required">* </span>Ort</label>
+        <select class="f" id="text_tbox_03">
+          <option>Dortmund</option>
+          <option>Bochum</option>
+          <option>Essen</option>
+          <option>Mönchengladbach</option>
+          <option>Oberhausen</option>
+          <option>Castrop-Rauxel</option>
+          <option>Düsseldorf</option>
+        </select>
+      </div>
+      <div class="f text required">
+        <label for="text_tbox_04" class="f"><span class="required">* </span>Straße/Hausnr.</label>
+        <input class="f error" id="text_tbox_04" type="text" value="" />
+        <span class="f error"><span class="e">&lt; </span><strong class="e">Fehler:</strong> Dies ist ein Pflichtfeld!</span>
+      </div>
+      <div class="f text required">
+        <label for="text_tbox_05" class="f"><span class="required">* </span>Postleitzahl</label>
+        <input class="f" id="text_tbox_05" type="text" value="" />
+      </div>
+      <div class="f text required">
+        <label for="text_tbox_06" class="f">Telefon</label>
+        <input class="f" id="text_tbox_06" type="text" value="" />
+      </div>
+      <hr class="f" />
+      <div class="f submit">
+        <input class="f" type="submit" value="&gt; weiter" />
+      </div>
+    </form>
+    <form class="testlab form" action="#" method="get">
+      <h2 class="f">Anzeige regionalisieren</h2>
+      <p class="f">
+        Indem Du Deine Kleinanzeige einer Stadt zuordnest, können Interessenten
+        diese online leichter finden, wenn sie nur nach Kleinanzeigen aus
+        bestimmten Städten suchen.
+        Du kannst auch keine Stadt zuordnen, dann wird die Kleinanzeige von
+        diesen Interessenten aber auch nicht gefunden.
+      </p>
+      <hr class="f" />
+      <div class="f text">
+        <label class="f" for="city">Stadt</label>
+        <input id="city" type="text" class="f" />
+        <p class="f info">
+          Das Feld leer lassen, wenn die Anzeige nicht regionalisiert werden soll.
+        </p>
+      </div>
+    </form>
+    <form class="testlab form" action="#" method="get">
+      <h2 class="f">Ein Passwort-Eingabe-Feld</h2>
+      <div class="f text required">
+        <label for="text_tbox_05" class="f"><span class="required">* </span>Passwort</label>
+        <input class="f" id="text_tbox_05" type="password" value="t" />
+      </div>
+    </form>
+    <form class="testlab form" action="#" method="get">
+      <h2 class="f">Lade das Bild hoch</h2>
+      <p class="f info">
+        Du kannst ein Bild im JPEG- oder PNG-Format hochladen.
+        Das Bild darf nicht größer als 8 MByte sein.
+      </p>
+      <div class="f file required">
+        <label for="file_tbox_01" class="f"><span class="required">* </span>Bild</label>
+        <input class="f" id="file_tbox_01" type="file" />
+      </div>
+      <hr class="f" />
+      <div class="f submit">
+        <input class="f" type="submit" value="&gt; Doch kein Bild" />
+        <input class="f" type="submit" value="&gt; Bild hochladen" />
+      </div>
+    </form>
+    <div class="testlab form">
+      <h2 class="f">Antworten</h2>
+      <p class="f required">
+        <strong class="r">Pflichtfelder</strong> sind mit einem
+        <strong class="r symbol">*</strong> markiert.
+      </p>
+      <div class="f text required">
+        <label class="f" for="replyTo"><span class="required">*</span> Antwort-Adresse</label>
+        <input id="replyTo" name="replyTo" class="f" tabindex="1" type="text" value=""/>
+      </div>
+      <div class="f text required">
+        <label class="f" for="replyTo"><span class="required">*</span> Adresse wiederholen</label>
+        <input id="replyToRepeated" name="replyToRepeated" class="f" tabindex="2" type="text" value=""/>
+      </div>
+      <div class="f text required">
+        <label class="f" for="subject"><span class="required">*</span> Betreff</label>
+        <input id="subject" name="subject" class="f" tabindex="3" type="text" value=""/>
+      </div>
+      <div class="f textarea required">
+        <label class="f" for="text"><span class="required">*</span> Nachricht</label>
+        <textarea id="text" name="text" class="f" tabindex="4" rows="15" cols="20"></textarea>
+      </div>
+      <div class="f checkbox">
+        <input id="attachment1" name="attachment" class="f" tabindex="4" type="checkbox" value="true" checked="checked"/><input type="hidden" name="_attachment" value="on"/>
+        <label class="f" for="attachment">Ich möchte eine Datei an die E-Mail anhängen.</label>
+      </div>
+      <div class="f checkbox">
+        <input id="copy1" name="copy" class="f" tabindex="5" type="checkbox" value="true" checked="checked"/><input type="hidden" name="_copy" value="on"/>
+        <label class="f" for="copy">Ich möchte eine Kopie der Nachricht zugesendet bekommen.</label>
+      </div>
+    </div>
+    <div class="testlab form cf">
+      <div class="col2 left">
+        <h2 class="f">Weiter mit Anmeldung</h2>
+        <div class="f text">
+          <label class="f" for="username">Benutzername</label>
+          <input class="f" name="username" id="username" type="text" tabindex="6" />
+        </div>
+        <div class="f text">
+          <label class="f" for="password">Passwort</label>
+          <input class="f" name="password" id="password" type="password" tabindex="7" />
+        </div>
+      </div>
+      <div class="col2 right">
+        <h2 class="f">Weiter ohne Anmeldung</h2>
+        <!-- <a href="/kleinanzeigen/37431/lust+.html" title="Zu schwer? Hier klicken um das Bild zu wechseln!"><img src="/img/captcha.jpg" alt="Captcha" width="120" height="60" /></a> -->
+        <div class="f captcha cf">
+          <span class="f">Was steht da?</span>
+          <img class="f" src="/img/captcha.jpg" alt="Captcha" width="120" height="60" />
+        </div>
+        <div class="f text">
+          <label class="f" for="captcha">Lösung</label>
+          <input class="f" name="captcha" id="captcha" type="text" tabindex="8" />
+        </div>
+      </div>
+    </div>
+  </t:putAttribute>
+</t:insertDefinition>
Unnamed repository; edit this file 'description' to name the repository.