Add <popups> and styles

diff --git a/Styles/service.style b/Styles/service.style
index 9081fd6..d043889 100644 (file)
--- a/Styles/service.style
+++ b/Styles/service.style
@@ -102,6 +102,18 @@ img.calendar {
 <img class="calendar" src="<root_prefix>pix/calendar.gif" onclick="event.cancelBubble=true;popcalendar('%0');">
 </define-tag>
 
 <img class="calendar" src="<root_prefix>pix/calendar.gif" onclick="event.cancelBubble=true;popcalendar('%0');">
 </define-tag>
 

+<define-tag popups>
+<script type="text/javascript" src="<root_prefix>jquery.udraggable.js"></script>
+<script type="text/javascript" src="<root_prefix>jquery.event.ue.js"></script>
+<script type="text/javascript">
+$(function(){
+    $('div.popup').udraggable({
+        'handle': 'div.popup_title'
+    })
+});
+</script>
+</define-tag>
+

 <define-tag future>
 <?php
 $dir = getcwd();
 <define-tag future>
 <?php
 $dir = getcwd();

diff --git a/src/infodrom.css b/src/infodrom.css
index cb5063c..fb6744a 100644 (file)
--- a/src/infodrom.css
+++ b/src/infodrom.css
@@ -146,6 +146,33 @@ input.button:hover {
   background-color: #bfbfbf;
 }
 
   background-color: #bfbfbf;
 }
 

+/*
+ * Popups
+ */
+div.popup {
+  background: white;
+  border: 1px solid #CCC;
+  height: auto;
+  position: absolute;
+}
+div.popup_title {
+  width: 100%;
+  cursor: move;
+  background: #EEE;
+  margin-bottom: 5px;
+  font-weight: bold;
+  padding-bottom: 1px;
+}
+div.popup_body {
+  padding-left: 2px;
+  padding-right: 2px;
+  padding-bottom: 4px;
+}
+div.popup label {
+  margin-top: 2px;
+  display: block;
+}
+

 /*
  * Calendar
  */
 /*
  * Calendar
  */