topList format

config/layouts/sitzung.json

+{
+  "type":"xsplit",
+  "cut":35,
+  "left":
+  {
+    "type":"panel",
+    "name":"topListe"
+  },
+  "right":
+  {
+    "type" : "ysplit",
+    "cut" : 30,
+    "up" :
+    {
+      "type":"panel","name":"clock"
+    },
+    "down":
+    {
+      "type":"panel","name":"mensaPlan"
+    }
+  }
+}

panels/mensaPlan/style.less

@@ -13,7 +13,7 @@
 	color: #000000;
 }
 
-#head {
+#mensaPlanTitleBar {
 	text-align: center;
 }
 

panels/topListe/script.js

+this.loaded = function(panel, config) {
+
+$(function() {
+    $( "#sortable" ).sortable();
+    $( "#sortable" ).disableSelection();
+  });
+
+}
\ No newline at end of file

panels/topListe/style.less

+#topListe{
+	position:relative;
+	width:100%;
+	height:100%;
+}
+
+#currentTop {
+	background-color: #ffffff;
+	float:left;
+	position:relative;
+	top:0;
+	width: 100%;
+	height: 25%;
+}
+
+#topName{
+	float: left;
+	background-color: #ffffff;
+	width: 100%;
+	height: 25%;
+	font-size: 300%;
+	text-align: center;
+}
+
+#topDescription{
+	float: left;
+	background-color: #ffffff;
+	width: 100%;
+	height: 25%;
+	font-size: 200%;
+}
+
+#topListSortable{
+	float: left;
+	width: 100%;
+	height: 25%;
+}
+
+#sortable {
+	font-weight: bold;
+	color: #ffffff;
+	list-style-type: decimal;
+	font-size: 200%;
+	float:left;
+}

panels/topListe/template.html

+<div id="topListe">
+<div id="currentTop">
+	<div id="topName">
+		TEST1
+	</div>
+	<div id="topDescription">
+	TEST2
+	</div>
+</div>
+<div id="topListSortable">
+	<ol id="sortable">
+		<li class="ui-state-default">Item 1</li>
+		<li class="ui-state-default">Item 2</li>
+		<li class="ui-state-default">Item 3</li>
+		<li class="ui-state-default">Item 4</li>
+		<li class="ui-state-default">Item 5</li>
+		<li class="ui-state-default">Item 6</li>
+		<li class="ui-state-default">Item 7</li>
+	</ol>
+</div>
\ No newline at end of file