From 25fcad568dd507d039d9e197f5eb10bc5cb0eb35 Mon Sep 17 00:00:00 2001
From: Hadi Nategh <hnategh@gmail.com>
Date: Fri, 19 Feb 2021 13:11:51 +0100
Subject: [PATCH] Some styling improvements

---
 calendar/templates/default/edit.xet  | 11 +++++------
 calendar/templates/mobile/app.css    |  4 ++--
 calendar/templates/pixelegg/app.css  |  4 ++--
 calendar/templates/pixelegg/app.less |  4 ++--
 mail/templates/mobile/app.css        | 26 +++++++++++++-------------
 mail/templates/mobile/app.less       | 12 ++++++------
 pixelegg/css/pixelegg.css            |  6 ++++++
 pixelegg/less/etemplate2.less        |  1 +
 pixelegg/less/jquery-ui.less         |  6 +++---
 9 files changed, 40 insertions(+), 34 deletions(-)

diff --git a/calendar/templates/default/edit.xet b/calendar/templates/default/edit.xet
index b14a5da593..dcc0b3ce25 100644
--- a/calendar/templates/default/edit.xet
+++ b/calendar/templates/default/edit.xet
@@ -37,7 +37,7 @@
 					<menulist>
 						<menupopup type="select-account" id="${row}[owner]" readonly="true"/>
 					</menulist>
-					<button align="center" statustext="Delete this alarm" label="Delete" id="delete_alarm[$row_cont[id]]" onclick="et2_dialog.confirm(widget,'Delete this alarm','Delete')" image="delete"/>
+					<button align="left" statustext="Delete this alarm" label="Delete" id="delete_alarm[$row_cont[id]]" onclick="et2_dialog.confirm(widget,'Delete this alarm','Delete')" image="delete"/>
 				</row>
 			</rows>
 		</grid>
@@ -60,7 +60,7 @@
 					<calendar-owner id="participant" allowFreeEntries="true" span="4" empty_label="Add new participants or resource" onchange="app.calendar.participantOnChange"/>
 					<hbox width="100%">
 						<textbox type="integer" id="quantity" min="1" size="3"/>
-						<select class="selectRole" id="role" align="center"/>
+						<select class="selectRole" id="role"/>
 						<button id="add" align="right" image="add" novalidate="1" statustext="Please first select participants on the left and then use plus button to add them" background_image="1" readonly="true" ro_image="add"/>
 					</hbox>
 				</row>
@@ -80,12 +80,12 @@
 					<menulist>
 						<menupopup id="${row}[status]" onchange="1"/>
 					</menulist>
-					<button align="center" label="Delete" id="delete[$row_cont[delete_id]]" image="delete"/>
+					<button align="left" label="Delete" id="delete[$row_cont[delete_id]]" image="delete"/>
 				</row>
 			</rows>
 		</grid>
 		<styles>
-			.selectRole select { width: 100%; }
+			select#calendar-edit_role { width: 50%; }
 		</styles>
 	</template>
 	<template id="calendar.edit.recurrence" template="" lang="" group="0" version="1.9.001">
@@ -231,9 +231,8 @@
 					<label for="location" value="Location"/>
 					<hbox span="2">
 						<textbox id="location" maxlength="255" class="et2_fullWidth"/>
-						<checkbox label="Video Conference" id="videoconference" onchange="app.calendar.videoconferenceOnChange"/>
 					</hbox>
-					<description/>
+					<checkbox label="Video Conference" id="videoconference" onchange="app.calendar.videoconferenceOnChange"/>
 					<taglist-cat id="category" height="190" empty_label="Categories" multiple="toggle" class="et2_fullWidth" rows="1" />
 				</row>
 				<row>
diff --git a/calendar/templates/mobile/app.css b/calendar/templates/mobile/app.css
index 655e159447..0d788159a1 100644
--- a/calendar/templates/mobile/app.css
+++ b/calendar/templates/mobile/app.css
@@ -2702,8 +2702,8 @@ div#calendar-container div.calendar table tbody tr.rowhilite td {
   background-color: transparent;
 }
 #calendar-sidebox_header_today {
-  width: 19px;
-  height: 20px;
+  width: 2em;
+  height: 2em;
   margin-left: 6px;
   background-image: url('../../../pixelegg/images/bullet.svg');
   text-indent: 140%;
diff --git a/calendar/templates/pixelegg/app.css b/calendar/templates/pixelegg/app.css
index 150e517f45..5f9a4c95c6 100755
--- a/calendar/templates/pixelegg/app.css
+++ b/calendar/templates/pixelegg/app.css
@@ -2690,8 +2690,8 @@ div#calendar-container div.calendar table tbody tr.rowhilite td {
   background-color: transparent;
 }
 #calendar-sidebox_header_today {
-  width: 19px;
-  height: 20px;
+  width: 2em;
+  height: 2em;
   margin-left: 6px;
   background-image: url('../../../pixelegg/images/bullet.svg');
   text-indent: 140%;
diff --git a/calendar/templates/pixelegg/app.less b/calendar/templates/pixelegg/app.less
index 03127bb46e..15f07088e8 100755
--- a/calendar/templates/pixelegg/app.less
+++ b/calendar/templates/pixelegg/app.less
@@ -1188,8 +1188,8 @@ div#calendar-container {
 	}
 }
 #calendar-sidebox_header_today {
-	width: 19px;
-	height: 20px;
+	width: 2em;
+	height: 2em;
 
 	margin-left: 6px;
 	background-image: url('../../../pixelegg/images/bullet.svg');
diff --git a/mail/templates/mobile/app.css b/mail/templates/mobile/app.css
index ceef17314e..3cc1ac6035 100644
--- a/mail/templates/mobile/app.css
+++ b/mail/templates/mobile/app.css
@@ -72,10 +72,10 @@ tr.mail.label1 td:first-child {
   border-left: 6px solid #ff0080 !important;
 }
 tr.mail.label2 td:first-child {
-  border-left: 6px solid  #ff8000 !important;
+  border-left: 6px solid #ff8000 !important;
 }
 tr.mail.label3 td:first-child {
-  border-left: 6px solid  #008000 !important;
+  border-left: 6px solid #008000 !important;
 }
 tr.mail.label4 td:first-child {
   border-left: 6px solid #0000ff !important;
@@ -472,7 +472,7 @@ div#mail-index_mailPreview > div {
   border: none;
 }
 #mail-compose_composeToolbar > button {
-  padding: .2em .4em;
+  padding: 0.2em 0.4em;
 }
 #mail-compose_composeToolbar > img {
   width: 16px;
@@ -485,7 +485,7 @@ div#mail-index_mailPreview > div {
   height: 16px !important;
 }
 #mail-compose_composeToolbar > button {
-  padding: .2em .4em;
+  padding: 0.2em 0.4em;
 }
 #mail-compose_to div.ms-sel-ctn,
 #mail-compose_cc .ms-sel-ctn,
@@ -493,7 +493,7 @@ div#mail-index_mailPreview > div {
   max-height: 75px;
 }
 #mail-display_toolbar > button > span {
-  padding: .2em .4em;
+  padding: 0.2em 0.4em;
 }
 #mail-display_toolbar > button > span > img {
   width: 16px;
@@ -516,7 +516,7 @@ div#mail-index_mailPreview > div {
   height: 35px;
 }
 #mail-index_toolbar > button > span {
-  padding: .2em .4em;
+  padding: 0.2em 0.4em;
 }
 #mail-index_toolbar > button > span > img {
   width: 16px;
@@ -1896,7 +1896,7 @@ input[type=button] {
   padding: 0px;
 }
 #mail-display_toolbar > button > span {
-  padding: .2em .4em;
+  padding: 0.2em 0.4em;
 }
 #mail-display_toolbar > button > span > img {
   width: 16px;
@@ -2108,7 +2108,7 @@ table#mail-index_previewAttachmentArea::-webkit-scrollbar-thumb:hover {
     text-align: left;
     font-weight: normal;
     padding-left: 20px;
-    background-image: url(../pixelegg/images/mail_send.png);
+    background-image: url(../pixelegg/images/mail_send.svg);
     background-position: left;
     background-repeat: no-repeat;
     background-size: 16px 16px;
@@ -2337,19 +2337,19 @@ table#mail-index_previewAttachmentArea::-webkit-scrollbar-thumb:hover {
     padding: 0 2px 2px 0;
   }
   #mail-index table.egwGridView_outer tbody tr span.deleted.status_img {
-    background-image: url(../pixelegg/images/kmmsgdel.png);
+    background-image: url(../pixelegg/images/kmmsgdel.svg);
   }
   #mail-index table.egwGridView_outer tbody tr span.unseen.status_img {
-    background-image: url(../pixelegg/images/kmmsgunseen.png);
+    background-image: url(../pixelegg/images/kmmsgunseen.svg);
   }
   #mail-index table.egwGridView_outer tbody tr span.flagged_seen.status_img {
-    background-image: url(../pixelegg/images/read_flagged_small.png);
+    background-image: url(../pixelegg/images/read_flagged_small.svg);
   }
   #mail-index table.egwGridView_outer tbody tr span.flagged_unseen.status_img {
-    background-image: url(../pixelegg/images/unread_flagged_small.png);
+    background-image: url(../pixelegg/images/unread_flagged_small.svg);
   }
   #mail-index table.egwGridView_outer tbody tr span.recent.status_img {
-    background-image: url(../pixelegg/images/kmmsgnew.png);
+    background-image: url(../pixelegg/images/kmmsgnew.svg);
   }
   #mail-index table.egwGridView_outer tbody tr span.replied.status_img {
     background-image: url(../pixelegg/images/mail_reply.svg);
diff --git a/mail/templates/mobile/app.less b/mail/templates/mobile/app.less
index acc699e693..0b626b5ef0 100644
--- a/mail/templates/mobile/app.less
+++ b/mail/templates/mobile/app.less
@@ -64,7 +64,7 @@
 					text-align: left;
 					font-weight: normal;
 					padding-left: 20px;
-					background-image: url(../pixelegg/images/mail_send.png);
+					background-image: url(../pixelegg/images/mail_send.svg);
 					background-position: left;
 					background-repeat: no-repeat;
 					background-size: 16px 16px;
@@ -298,19 +298,19 @@
 					padding:0 2px 2px 0;
 				}
 				span.deleted.status_img {
-					background-image: url(../pixelegg/images/kmmsgdel.png);
+					background-image: url(../pixelegg/images/kmmsgdel.svg);
 				}
 				span.unseen.status_img {
-					background-image: url(../pixelegg/images/kmmsgunseen.png);
+					background-image: url(../pixelegg/images/kmmsgunseen.svg);
 				}
 				span.flagged_seen.status_img {
-					background-image: url(../pixelegg/images/read_flagged_small.png);
+					background-image: url(../pixelegg/images/read_flagged_small.svg);
 				}
 				span.flagged_unseen.status_img {
-					background-image: url(../pixelegg/images/unread_flagged_small.png);
+					background-image: url(../pixelegg/images/unread_flagged_small.svg);
 				}
 				span.recent.status_img {
-					background-image: url(../pixelegg/images/kmmsgnew.png);
+					background-image: url(../pixelegg/images/kmmsgnew.svg);
 				}
 				span.replied.status_img {
 					background-image: url(../pixelegg/images/mail_reply.svg);
diff --git a/pixelegg/css/pixelegg.css b/pixelegg/css/pixelegg.css
index 65b69f2e0e..3ea28342b9 100644
--- a/pixelegg/css/pixelegg.css
+++ b/pixelegg/css/pixelegg.css
@@ -221,6 +221,7 @@
     background-color: transparent;
     background-size: contain;
     border: none;
+    opacity: 1;
   }
   .ui-datepicker .ui-datepicker-prev:hover,
   .ui-datepicker .ui-datepicker-next:hover {
@@ -1504,6 +1505,7 @@ div#ui-datepicker-div {
 }
 .ui-datepicker div.ui-timepicker-div dt.ui_tpicker_time_label {
   font-size: 0.9em;
+  margin-top: 6px;
 }
 .ui-datepicker div.ui-timepicker-div dd.ui_tpicker_time {
   padding-left: 75px;
@@ -1520,9 +1522,13 @@ div#ui-datepicker-div {
 }
 .ui-datepicker div.ui-timepicker-div div.ui_tpicker_hour_slider span.ui-slider-handle {
   background-color: #0C5DA5;
+  padding: 1px;
+  outline: none;
 }
 .ui-datepicker div.ui-timepicker-div div.ui_tpicker_minute_slider span.ui-slider-handle {
   background-color: #0C5DA5;
+  padding: 1px;
+  outline: none;
 }
 .ui-datepicker div.ui-datepicker-buttonpane {
   background-color: #679FD2;
diff --git a/pixelegg/less/etemplate2.less b/pixelegg/less/etemplate2.less
index fc24ddbdff..5c08829f4a 100755
--- a/pixelegg/less/etemplate2.less
+++ b/pixelegg/less/etemplate2.less
@@ -174,6 +174,7 @@ span.et2_date span {
 	background-color: transparent;
 	background-size: contain;
 	border: none;
+	opacity: 1;
 }
 .ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next {
 	&:hover{
diff --git a/pixelegg/less/jquery-ui.less b/pixelegg/less/jquery-ui.less
index 59b521823a..8aadf1a959 100755
--- a/pixelegg/less/jquery-ui.less
+++ b/pixelegg/less/jquery-ui.less
@@ -379,7 +379,7 @@ button.ui-button {
 		padding: 3px;
 
 		//Uhrzeit - Label
-		dt.ui_tpicker_time_label {font-size: 0.9em}
+		dt.ui_tpicker_time_label {font-size: 0.9em;margin-top:6px;}
 		//Uhrzeit
 		dd.ui_tpicker_time {
 			padding-left: 75px; background-color: @egw_color_1_a;
@@ -394,10 +394,10 @@ button.ui-button {
 
 		// Schieberegler
 		div.ui_tpicker_hour_slider {
-			span.ui-slider-handle {background-color: @egw_color_2_a;}
+			span.ui-slider-handle {background-color: @egw_color_2_a;padding: 1px;outline: none;}
 		}
 		div.ui_tpicker_minute_slider {
-			span.ui-slider-handle {background-color: @egw_color_2_a;}
+			span.ui-slider-handle {background-color: @egw_color_2_a;padding: 1px;outline: none;}
 		}
 	}