gui work

Signed-off-by: Stephan Richter <s.richter@srsoftware.de>

frontend/src/Components/Menu.svelte

@@ -45,7 +45,9 @@ onMount(fetchModules);
     <a href="#" onclick={() => go('/bookmark')}>{t('bookmarks')}</a>
     <a href="#" onclick={() => go('/notes')}>{t('notes')}</a>
     <a href="https://svelte.dev/tutorial/svelte/state" target="_blank">{t('tutorial')}</a>
-    {#each modules as module,i}<a href={module.url}>{module.name}</a>{/each}
+    {#each modules as module,i}
+    {#if module.name.trim()}<a href={module.url}>{module.name}</a>{/if}
+    {/each}
     {#if user.name }
     <a onclick={logout}>{t('logout')}</a>
     {/if}

legacy/src/main/resources/css/comfort/style.css

@@ -524,3 +524,81 @@ table #preview-source{
 		border: 0 none;
 	}
 }
+
+
+body{
+	background: #0f3a09;
+}
+a{
+	color: #0c0061;
+}
+
+code{
+	background: #cccccc;
+	border-color: #0f3a09;
+}
+
+.pending a{
+	color: #45513a;
+}
+.open>a{
+	color: #0f3a09;
+}
+
+.completed>a:after{
+	content: " ✓";
+}
+
+.canceled>a{
+	color: #414141;
+}
+
+li:hover > a,
+a:hover{
+	color: red;
+}
+
+fieldset,table{
+	background: rgba(255,255,255,0.49);
+}
+
+legend{
+	background: #82987f;
+}
+
+.share, .share>legend{
+		background:#8cff7e;
+}
+
+.button{
+	background: white;
+}
+
+#announce a{
+	color:black;
+}
+
+table.diagram .step,
+body > a.symbol {
+	background: white;
+}
+
+.right a {
+	background: white;
+	color: red;
+}
+
+.infos span{
+	background: lime;
+}
+.warnings span{
+	background: yellow;
+}
+
+.errors span{
+	background: orange;
+}
+
+.search label{
+	color: white;
+}

web/src/main/resources/web/css/basic.css

@@ -0,0 +1,643 @@
+@font-face {
+	font-family: "awesome";
+	src: url("/fontawesome-webfont.woff");
+}
+
+a{
+	text-decoration:none;
+}
+body{
+	margin-left: 160px;
+	margin-top: 25px;
+	font-family: sans-serif;
+	position: relative;
+}
+code{
+	display: inline-block;
+	padding: 5px;
+	border: 1px solid;
+	border-radius: 5px;
+}
+
+body > a.symbol {
+	padding: 5px;
+	border-radius: 5px;
+}
+
+body > h2{
+	color: #67a05f;
+}
+
+body.user.login{
+	width: 100%;
+	max-width: 400px;
+	margin: 0 auto;
+	text-align: center;
+}
+img#logo{
+	position: fixed;
+	top: 10px;
+	right: 10px;
+	z-index: -1;
+}
+
+blockquote{
+	font-style: italic;
+}
+
+
+nav,
+#main_menu{
+	position: fixed;
+	top:0;
+	left:0;
+	bottom:0;
+	width: 150px;
+}
+
+nav a,
+#main_menu a{
+	display: block;
+	text-align: center;
+	overflow: hidden;
+}
+
+.hidden{
+	display: none;
+}
+
+td{
+	position: relative;
+}
+
+fieldset{
+	position: relative;
+	margin-top: 5px;
+	vertical-align: top;
+}
+
+.hover:hover .hidden{
+	display: inherit;
+}
+
+nav a,
+.button{
+	padding:2px;
+	margin: 1px 0;
+	border-radius: 5px;
+	border: 1px solid black;
+	white-space: pre;
+	display: inline-block;
+}
+
+nav a{
+    display: block;
+}
+
+.symbol{
+	font-family: awesome;
+	font-size: 22px;
+}
+
+.right{
+	position: absolute;
+	right: 0;
+	top: 0;
+}
+
+.right a {
+	border: 1px solid;
+	border-radius: 5px;
+	padding: 0 5px;
+}
+
+
+.right-fix{
+	position: fixed;
+	right: 0;
+	top: 0;
+	overflow: hidden;
+	max-height: 25px;
+	border: 1px solid red;
+	border-radius: 5px;
+	background: white;
+	z-index: 10;
+}
+
+.canceled{
+	text-decoration: line-through
+}
+
+.hover:hover{
+	max-height: unset !important;
+	max-width: unset !important;
+}
+
+fieldset textarea{
+	width: 100%;
+	height: 200px;
+	font-size: 16px;
+}
+img{
+	max-width: 100%;
+}
+
+.infos {
+	margin: 5px;
+}
+
+.errors span,
+.infos span{
+	margin: 2px;
+	padding: 5px;
+}
+
+.copytext{
+	position: fixed;
+	width: 90px;
+	left: -100px;
+}
+
+.poll td>*{
+	margin: 15px;
+	padding: 15px;
+}
+
+.poll td.poll_status>*{
+	margin: 5px;
+	padding: 5px;
+}
+
+.poll td.poll_status>a{
+	display: inline-block;
+}
+
+.poll table{
+	border-spacing: 0;
+}
+
+.poll tr{
+	border-spacing: 0;
+}
+
+.poll td{
+	border-style: solid;
+	border-width: 1px 0 0 0;
+	border-color: black;
+}
+
+.poll .disabled{
+	text-decoration: line-through;
+}
+
+img[src*="pos=right"] {
+  float:right;
+  margin: 5px 0 5px 5px;
+}
+
+img[src*="pos=left"] {
+  float:left;
+  margin: 5px 5px 5px 0;
+}
+
+img[src*="width=100"]{
+	max-width: 100px;
+}
+img[src*="width=200"]{
+	max-width: 200px;
+}
+img[src*="width=300"]{
+	max-width: 300px;
+}
+img[src*="width=400"]{
+	max-width: 400px;
+}
+img[src*="width=500"]{
+	max-width: 500px;
+}
+img[src*="width=600"]{
+	max-width: 600px;
+}
+img[src*="width=700"]{
+	max-width: 700px;
+}
+img[src*="width=800"]{
+	max-width: 800px;
+}
+img[src*="width=900"]{
+	max-width: 900px;
+}
+img[src*="width=50%"]{
+	max-width: 50%;
+}
+
+img[src*="width=33%"]{
+	max-width: 33%;
+}
+
+img[src$="width=25%"]{
+	max-width: 25%;
+}
+
+footer,
+#announce{
+	position: absolute;
+	right: 3px;
+	bottom: -40px;
+}
+
+span.hover_h {
+	display: block;
+}
+
+label{
+	display: block;
+	position: relative;
+}
+
+legend{
+	padding: 0 5px;
+	border-radius: 5px;
+}
+
+.search input {
+	margin: 5px 0 0 5px;
+	width: 62%;
+}
+
+.search label input{
+	width: 10px;
+}
+
+.search label{
+	display: none;
+}
+
+.search:hover label{
+	display: block;
+}
+
+.search button{
+	width: 40px;
+	font-size: 14px;
+	padding: 0;
+}
+
+.share{
+	height: 35px;
+	overflow: hidden;
+}
+
+.share:hover{
+	height: inherit;
+}
+
+.bookmark textarea[name=comment]{
+	max-height: 50px;
+}
+
+.bookmark textarea[name=comment]:hover{
+	max-height: unset;
+}
+
+.bookmark fieldset input{
+	width: 100%;
+}
+
+.notes .note{
+	border: 1px solid;
+	border-radius: 5px;
+}
+
+.warnings span{
+	background: yellow;
+}
+
+.errors span{
+	background: orange;
+}
+
+.tasks li{
+	margin: 5px;
+	padding-right: 80px;
+}
+.project-view{
+	min-width: 100%;
+}
+.project-view span.hover_h{
+	position: absolute;
+	right: 0;
+}
+
+.note td.code {
+	width: 50%;
+}
+
+.note td.code textarea {
+	min-height: 200px;
+		width: 100%;
+}
+
+.add_positions > ul,
+.requirements > ul {
+	max-height: 400px;
+	overflow: auto;
+}
+
+td input,
+table.vertical{
+	width: 100%;
+}
+
+.document td label{
+	width: unset;
+}
+
+.document.view .add_positions img{
+	display: none;
+}
+
+td input[type=checkbox]{
+	width: unset;
+}
+
+table.vertical span.right{
+	position: fixed;
+	top: 25px;
+	left: 60px;
+	right: 5px;
+	text-align: right;
+}
+
+img[src*="pos=right"] {
+  float:right;
+  margin: 5px 0 5px 5px;
+}
+
+img[src*="pos=left"] {
+  float:left;
+  margin: 5px 5px 5px 0;
+}
+
+img[src*="width=100"]{
+	max-width: 100px;
+}
+img[src*="width=200"]{
+	max-width: 200px;
+}
+img[src*="width=300"]{
+	max-width: 300px;
+}
+img[src*="width=400"]{
+	max-width: 400px;
+}
+img[src*="width=500"]{
+	max-width: 500px;
+}
+img[src*="width=600"]{
+	max-width: 600px;
+}
+img[src*="width=700"]{
+	max-width: 700px;
+}
+img[src*="width=800"]{
+	max-width: 800px;
+}
+img[src*="width=900"]{
+	max-width: 900px;
+}
+img[src*="width=50%"]{
+	max-width: 50%;
+}
+
+img[src*="width=33%"]{
+	max-width: 33%;
+}
+
+img[src$="width=25%"]{
+	max-width: 25%;
+}
+
+#preview,
+#preview-source{
+	display: inline-block;
+	max-width: calc(50% - 20px);
+	vertical-align: bottom; 
+}
+
+table #preview,
+table #preview-source{
+	display: inherit;
+	max-width: unset;
+	vertical-align: inherit;
+}
+
+#preview.loading{
+	opacity: 0.2;
+}
+
+.easylist fieldset a.button {
+	width: 70%;
+	display: inline-block;
+	text-align: center;
+	padding: 10px;
+}
+
+@media (min-width: 1100px){
+	.share{
+		position: absolute;
+		right: 0;
+		top: 8px;
+	}
+}
+
+@media (max-width: 1000px){
+	*[hide="12"]{
+		display: none;
+	}
+}
+
+@media (max-width: 900px){
+	*[hide="11"]{
+		display: none;
+	}
+	#preview,
+	#preview-source{
+		display: block;
+		max-width: unset;
+	}
+}
+
+@media (max-width: 800px){
+	*[hide="10"]{
+		display: none;
+	}
+}
+
+@media (max-width: 700px){
+	*[hide="9"]{
+		display: none;
+	}
+	body{
+	    margin-left: 50px;
+	    margin-top: 60px;
+	}
+	#main_menu{
+ 		max-width: 50px;
+ 		z-index: 10;
+		overflow: hidden;
+		background: inherit;
+	}
+	#main_menu:hover{
+		max-width: unset;
+	}
+
+	nav a,
+	#main_menu .button{
+	    padding: 6px 0;
+	}
+	.search button{
+	    display: none;
+	}
+	.search:hover button{
+	    display: inline;
+	}
+}
+
+@media (max-width: 600px){
+	*[hide="8"]{
+		display: none;
+	}
+}
+
+@media (max-width: 500px){
+	*[hide="7"]{
+		display: none;
+	}
+}
+
+@media (max-width: 400px){
+	*[hide="6"]{
+		display: none;
+	}
+}
+
+@media print{
+	fieldset.note span.right,
+	#logo, #main_menu {
+		display: none;
+	}
+	fieldset.process, fieldset.database{
+		page-break-after: always;
+	}
+	.export>fieldset{
+		border: 0 none;
+	}
+}
+
+
+body{
+	background: #0f3a09;
+}
+a{
+	color: #0c0061;
+}
+
+code{
+	background: #cccccc;
+	border-color: #0f3a09;
+}
+
+.pending a{
+	color: #45513a;
+}
+.open>a{
+	color: #0f3a09;
+}
+
+.completed>a:after{
+	content: " ✓";
+}
+
+.canceled>a{
+	color: #414141;
+}
+
+li:hover > a,
+a:hover{
+	color: red;
+}
+
+fieldset,table{
+	background: rgba(255,255,255,0.49);
+}
+
+legend{
+	background: #82987f;
+}
+
+.share, .share>legend{
+		background:#8cff7e;
+}
+nav a,
+.button{
+	background: white;
+}
+
+#announce a{
+	color:black;
+}
+
+table.diagram .step,
+body > a.symbol {
+	background: white;
+}
+
+.right a {
+	background: white;
+	color: red;
+}
+
+.infos span{
+	background: lime;
+}
+.warnings span{
+	background: yellow;
+}
+
+.errors span{
+	background: orange;
+}
+
+.search label{
+	color: white;
+}
+
+li.task button.symbol:nth-child(7){
+    position: absolute;
+    right: 30px;
+}
+li.task button.symbol:nth-child(6){
+    position: absolute;
+    right: 60px;
+}
+li.task button.symbol:nth-child(5){
+    position: absolute;
+    right: 90px;
+}
+li.task button.symbol:nth-child(4){
+    position: absolute;
+    right: 120px;
+}
+li.task button.symbol:nth-child(3){
+    position: absolute;
+    right: 150px;
+}
+li.task button.symbol:nth-child(2){
+    position: absolute;
+    right: 180px;
+}
+li.task button.symbol:nth-child(1){
+    position: absolute;
+    right: 210px;
+}

web/src/main/resources/web/themes.json

@@ -9,5 +9,8 @@
   {
     "value" : "default",
     "caption": "default"
+  },
+  {
+    "value": "basic"
   }
 ]