rewrite image editor, make images editable at projects and studios

website/agenda/planung/css/admin.css

@@ -235,25 +235,26 @@ li.ui-menu-item{
 	color:green;
 }
 
+#content div.ok,
+#content div.warn,
+#content div.error{
+    font-weight:bold;
+    margin:0.5rem;
+    padding:1rem;
+}
+
 div.ok{
-    border:2px solid #aca;
-	background:#cfc;
-	background: linear-gradient(to right, #cfc, white);
-	opacity:0.8;
+    color:white;
+	background:#0c0;
 }
 
 div.warn{
-    border:2px solid #ff0;
 	background:#ff0;
-	background: linear-gradient(to right, #ff3, white);
-	opacity:0.8;
 }
 
 div.error{
-    border:2px solid #f99;
-	background:#fcc;
-	background: linear-gradient(to right, #fcc, white);
-	opacity:0.8;
+    color:white;
+	background:#d00;
 }
 
 #content button,
@@ -435,3 +436,6 @@ input[type='checkbox']{
     clear:both;
 }
 
+#content input[readonly] {
+    border: 0;
+}

website/agenda/planung/css/image_manager.css

@@ -1,3 +1,7 @@
+input.field{
+	width:30em;
+}
+
 #content div.image{
 	display:inline-block;
 	vertical-alignment:top;
@@ -11,11 +15,6 @@
 	vertical-align:bottom;
 }
 
-#content .image_detail{
-	width:150px;
-	height:150px;
-}
-
 #content .close{
 	text-align:right;
 	padding:0;
@@ -24,25 +23,51 @@
 	float:right;
 }
 
-form table{
-	width:100%;
-	height:100%;
+#content div.image:hover{
+    cursor:pointer;
+	background-color:#39a1f4;
+    font-weight:bold;
+    opacity:0.9;
+    filter:contrast(120%);
+    box-shadow: 0 5px 11px 0 rgba(0,0,0,.18),0 4px 15px 0 rgba(0,0,0,.15);
 }
 
-input.field{
-	width:30em;
-}
-
-
 #content div.image .label{
 	text-align:center;
 	background-color:#333;
 	color:#fff;
 	vertical-align:bottom;
-	opacity:0.8;
+	opacity:0.9;
 	padding:6px;
 	width:138px;
 	margin:0;
 }
 
+#content div.image.active .label{
+	background-color:#39a1f4;
+    font-weight:bold;
+}
 
+#content div.image.active{
+    border:1px solid #39a1f4;
+    box-shadow: 0 5px 11px 0 rgba(0,0,0,.18),0 4px 15px 0 rgba(0,0,0,.15);
+}
+
+#imageEditor{
+    min-height:800px;
+    height:100%;
+}
+
+#content #imageEditor input, 
+#content #imageEditor select, 
+#content #imageEditor textarea{
+    margin-left:0;
+    margin-bottom:1rem;
+    padding:1rem;
+}
+
+#content label{
+    margin-top:1rem;
+    text-transform: uppercase;
+    color:#333;
+}

website/agenda/planung/css/projects.css

@@ -17,11 +17,6 @@
     clear:both;
 }
 
-#content div.view img{
-    max-width:50px;
-    max-height:50px;
-}
-
 #content div.editor div.right{
 	float:right;
 	padding:0;