From 8ded3e955d33c04a3be8b23e4cc9c3be0be94b7d Mon Sep 17 00:00:00 2001
From: Milan <mc@radiopiloten.de>
Date: Sat, 13 Mar 2021 16:01:19 +0100
Subject: [PATCH] buttons: use .text and .primary

---
 website/agenda/planung/css/default.css        | 36 ++++++++---
 .../agenda/planung/templates/edit-event.html  | 63 ++++++++++++-------
 .../agenda/planung/templates/edit-series.html |  8 ++-
 .../agenda/planung/templates/projects.html    |  8 +--
 .../planung/templates/studio-timeslots.html   |  2 +-
 website/agenda/planung/templates/studios.html | 14 ++---
 .../planung/templates/user-settings.html      |  4 +-
 .../agenda/planung/templates/user-stats.html  |  3 +-
 website/agenda/planung/templates/users.html   |  6 +-
 9 files changed, 90 insertions(+), 54 deletions(-)

diff --git a/website/agenda/planung/css/default.css b/website/agenda/planung/css/default.css
index 37d9d05..fc61796 100644
--- a/website/agenda/planung/css/default.css
+++ b/website/agenda/planung/css/default.css
@@ -368,7 +368,7 @@ div.badge-error {
 #content button,
 #content select,
 #content input {
-    padding: 6px;
+    padding: 0.5rem;
 }
 
 #content div.flex {
@@ -460,6 +460,20 @@ table.tablesorter tr {
     background-color: #1678c2;
 }
 
+#content button.text,
+#content #dialog button.dialog-cancel{
+    color:#2196f3;
+    background:none;
+    box-shadow:none;
+    transition: all 0.1s linear;
+}
+#content button.text:hover{
+    color:#1678c2;
+    background:none;
+    box-shadow:none;
+    transition: all 0.1s linear;
+}
+
 #content .button {
     cursor: pointer;
 }
@@ -468,24 +482,28 @@ table.tablesorter tr {
 #content input[type="submit"],
 #content input[type="file"],
 #content button{
-    font-weight:bold !important;
     display: inline-block;
     border: 0;
-    padding-left: 16px;
-    padding-right: 16px;
-    margin: 4px;
+    padding-left: 0.4rem;
+    padding-right: 0.4rem;
+    margin: 0.3rem;
     text-align: center;
     text-decoration: none;
-    min-width: 64px;
-    font-weight: 500;
-    border-radius: 4px;
+    min-width: 5rem;
+    border-radius: 0.3rem;
     color: #fff;
-    height: 36px;
+    height: 2.3rem;
     position: relative;
     transition: background-color .3s cubic-bezier(.05, .05, .05, 1),
         box-shadow .3s cubic-bezier(.05, .05, .05, 1);
 }
 
+#content button.primary {
+    border: 1px solid #167ec2;
+    box-shadow: 0 5px 11px 0 rgba(0, 0, 0, .18), 
+                0 4px 15px 0 rgba(0, 0, 0, .15);
+}
+
 #content input[type="submit"]:hover,
 #content input[type="file"]:hover,
 #content button:focus {
diff --git a/website/agenda/planung/templates/edit-event.html b/website/agenda/planung/templates/edit-event.html
index 54d79e6..829d5b5 100644
--- a/website/agenda/planung/templates/edit-event.html
+++ b/website/agenda/planung/templates/edit-event.html
@@ -70,8 +70,10 @@
 <div class="buttons">
     <TMPL_IF series_id>
         <TMPL_IF .allow.read_series>
-        <button onclick="view_series_details('<TMPL_VAR series_id>','<TMPL_VAR .studio_id>','<TMPL_VAR .project_id>')" style="float:left">
-            <TMPL_VAR .loc.button_edit_series>
+        <button 
+            onclick="view_series_details('<TMPL_VAR series_id>','<TMPL_VAR .studio_id>','<TMPL_VAR .project_id>')" 
+            style="float:left"
+            ><TMPL_VAR .loc.button_edit_series>
         </button>
         </TMPL_IF>
     </TMPL_IF>
@@ -86,11 +88,16 @@
     <TMPL_IF new_event>
     	<TMPL_IF .allow.delete_schedule>
             <button
-                onclick="load('series.cgi?project_id=<TMPL_VAR project_id>&studio_id=<TMPL_VAR studio_id>&series_id=<TMPL_VAR series_id>&start=<TMPL_VAR start escape=url>&exclude=1&show_hint_to_add_schedule=1#tabs-schedule')"><TMPL_VAR .loc.button_delete_from_schedule></button>
+                class="text"
+                onclick="load('series.cgi?project_id=<TMPL_VAR project_id>&studio_id=<TMPL_VAR studio_id>&series_id=<TMPL_VAR series_id>&start=<TMPL_VAR start escape=url>&exclude=1&show_hint_to_add_schedule=1#tabs-schedule')"
+            ><TMPL_VAR .loc.button_delete_from_schedule></button>
         </TMPL_IF>
     <TMPL_ELSE>
         <TMPL_IF .allow.assign_series_events>
-            <button onclick="selectChangeSeries('changeSeriesId');return false;"><TMPL_VAR loc.button_assign_series></button>
+            <button 
+                class="text"
+                onclick="selectChangeSeries('changeSeriesId');return false;"
+            ><TMPL_VAR loc.button_assign_series></button>
         </TMPL_IF>
     </TMPL_IF>
 
@@ -98,7 +105,10 @@
         <!--
         <button onclick="$('#copy_from_source').toggle();$('#change_series').hide();return false;"><TMPL_VAR .loc.button_copy_existing_event></button>
         -->
-        <button onclick="selectRerun('rerunEventId', <TMPL_VAR start_date>)"><TMPL_VAR .loc.button_rerun></button>
+        <button 
+            class="text"
+            onclick="selectRerun('rerunEventId', <TMPL_VAR start_date>)"
+        ><TMPL_VAR .loc.button_rerun></button>
     </TMPL_IF>
 
     <TMPL_UNLESS new_event>
@@ -108,7 +118,9 @@
                 <input type="hidden" name="studio_id"  value="<TMPL_VAR .studio_id>">
                 <input type="hidden" name="series_id"  value="<TMPL_VAR .series_id>">    
                 <input type="hidden" name="event_id"   value="<TMPL_VAR .event_id>">
-                <button type="submit"><TMPL_VAR .loc.button_upload></button>
+                <button 
+                    class="text"
+                    type="submit"><TMPL_VAR .loc.button_upload></button>
             </form>
         </TMPL_IF>
 
@@ -119,11 +131,13 @@
                 <input type="hidden" name="event_id"   value="<TMPL_VAR .event_id>">
                 <input type="hidden" name="series_id"  value="<TMPL_VAR .series_id>">    
                 <input type="hidden" name="action"     value="download">    
-                <button type="submit"><TMPL_VAR .loc.button_download></button>
+                <button 
+                    class="text"
+                    type="submit"><TMPL_VAR .loc.button_download></button>
             </form>
         </TMPL_IF>
         
-        <button onclick="copyEventToClipboard();"><TMPL_VAR .loc.button_copy_to_clipboard></button>
+        <button class="text" onclick="copyEventToClipboard();"><TMPL_VAR .loc.button_copy_to_clipboard></button>
     </TMPL_UNLESS>
 
     <!--
@@ -136,18 +150,21 @@
 
     <TMPL_IF .allow.read_event>
         <button target="_blank"
+            class="text"
             onclick="load('event-history.cgi?project_id=<TMPL_VAR project_id>&studio_id=<TMPL_VAR studio_id>&series_id=<TMPL_VAR series_id>&event_id=<TMPL_VAR event_id>');"
         ><TMPL_VAR .loc.button_show_changes></button>
     </TMPL_IF>
 
     <TMPL_IF .allow.read_event>
         <button target="_blank"
+            class="text"
             onclick="window.open('/programm/sendung/<TMPL_VAR event_id>.html', '_blank');"
         ><TMPL_VAR .loc.button_show_event></button>
     </TMPL_IF>
 
     <TMPL_IF .allow.read_comment>
         <button id="showComment" 
+            class="text"
             onclick="showEventComments('<TMPL_VAR id>')"
         ><TMPL_VAR .loc.label_comments></button>
     </TMPL_IF>
@@ -155,7 +172,6 @@
 </div>
 
 <div>
-
     <!-- import rerun from old event of series or any event of any project -->
     <TMPL_IF .allow.update_event>
         <div id="selectRerun" style="display:none;" class="select panel">
@@ -183,7 +199,7 @@
                                 
                 <input id="rerunEventId" value="-1" style="display:none" onchange="copyFromEvent('rerunEventId')">
 
-                <div id="import_rerun" class="active" style="display:none;"></div>
+                <div id="import_rerun" class="active text" style="display:none;"></div>
                 <button onclick="hideSelectRerun('rerunEventId')"><TMPL_VAR .loc.button_cancel></button>
             </div>
         </div>
@@ -198,7 +214,7 @@
             <div class="panel-body">
                 <div id="changeSeriesContainer"> </div>
                 <input id="changeSeriesId" value="-1" style="display:none">
-                <button onclick="hideChangeSeries()"><TMPL_VAR .loc.button_cancel></button>
+                <button onclick="hideChangeSeries()" ><TMPL_VAR .loc.button_cancel></button>
                 <button onclick="changeSeries()"><TMPL_VAR .loc.button_assign></button>
             </div>
         </div>
@@ -206,8 +222,10 @@
 
 
     <!-- edit event -->
-<div id="edit_event" style="padding:0">    
-<form id="event_<TMPL_VAR event_id>" method="post" action="event.cgi?project_id=<TMPL_VAR .project_id>&studio_id=<TMPL_VAR .studio_id>&series_id=<TMPL_VAR .series_id><TMPL_UNLESS new_event>&event_id=<TMPL_VAR .event_id></TMPL_UNLESS>" >
+<div id="edit_event" class="panel">    
+<form id="event_<TMPL_VAR event_id>" method="post" 
+    action="event.cgi?project_id=<TMPL_VAR .project_id>&studio_id=<TMPL_VAR .studio_id>&series_id=<TMPL_VAR .series_id><TMPL_UNLESS new_event>&event_id=<TMPL_VAR .event_id></TMPL_UNLESS>"
+>
     <input type="hidden" name="project_id" value="<TMPL_VAR .project_id>">
     <input type="hidden" name="studio_id"  value="<TMPL_VAR .studio_id>">
     <input type="hidden" name="series_id"  value="<TMPL_VAR .series_id>">    
@@ -220,26 +238,26 @@
     <div class="buttons" style="text-align:center;clear:both">
         <TMPL_IF show_new_event_from_schedule>
             <TMPL_IF .allow.create_event_from_schedule>
-                <button type="submit" name="action" value="create_event_from_schedule"
+                <button type="submit" name="action" value="create_event_from_schedule" class="primary"
                     onclick="leavePage();return true"
                 ><TMPL_VAR .loc.button_create></button>
              </TMPL_IF>
         <TMPL_ELSIF show_new_event>
             <TMPL_IF .allow.create_event>
-                <button type="submit" name="action" value="create_event"
+                <button type="submit" name="action" value="create_event" class="primary"
                     onclick="leavePage();return true"
                 ><TMPL_VAR .loc.button_create></button>
              </TMPL_IF>
         <TMPL_ELSE>
             <TMPL_IF .allow.update_event>
-                <button type="submit" name="action" value="save"
+                <button type="submit" name="action" value="save" class="primary"
                     onclick="leavePage();return true"
                 ><TMPL_VAR .loc.button_save></button>
             </TMPL_IF>
         </TMPL_IF>
         <TMPL_IF .allow.delete_event>
             <TMPL_UNLESS new_event>
-                <button type="submit" name="action" value="delete"
+                <button type="submit" name="action" value="delete"  class="text"
                     onclick="commitForm('event_<TMPL_VAR event_id>','delete','delete event');return false;"
                 ><TMPL_VAR .loc.button_delete></button>
             </TMPL_UNLESS>
@@ -275,7 +293,8 @@
 
                 <TMPL_UNLESS has_single_events>
                 <TMPL_IF .allow.update_event_field_episode>
-                    <TMPL_VAR .loc.label_episode> <input name="episode" value="<TMPL_VAR episode>" class="episode" placeholder="episode">
+                    <span class="label"><TMPL_VAR .loc.label_episode></span>
+                    <input name="episode" value="<TMPL_VAR episode>" class="episode" placeholder="episode">
                 <TMPL_ELSE>
                     <TMPL_VAR .loc.label_episode>: <TMPL_VAR episode>
                 </TMPL_IF>
@@ -296,18 +315,18 @@
         <tr> 
             <td class="label"><TMPL_VAR .loc.label_when></td> 
             <td>
-                <TMPL_VAR .loc.label_start>
+                <span class="label"><TMPL_VAR .loc.label_start>:</span>
                 <span id="start_date_weekday"></span>
                 <input id="start_date" class="date" name="start_date" value="<TMPL_VAR start>" onchange="onDateModified()" placeholder="<TMPL_VAR .loc.label_when>">
 
-                <TMPL_VAR .loc.label_duration> 
+                <span class="label"><TMPL_VAR .loc.label_duration>:</span>
                 <select id="duration" name="duration" onchange="onDateModified()"> minutes
                 <TMPL_LOOP durations>
                     <option value="<TMPL_VAR value>" <TMPL_IF selected>selected="selected"</TMPL_IF>><TMPL_VAR name></option>
                 </TMPL_LOOP>
                 </select>
 
-                <TMPL_VAR .loc.label_end>
+                <span class="label"><TMPL_VAR .loc.label_end>:</span>
                 <span id="end_date" class="date" name="end_date" ><TMPL_VAR end></span>
 
             </td>
@@ -536,7 +555,7 @@
              </TMPL_IF>
         <TMPL_ELSE>
             <TMPL_IF .allow.update_event>
-                <button type="submit" name="action" value="save"
+                <button type="submit" class="primary" name="action" value="save"
                     onclick="leavePage();return true"
                 ><TMPL_VAR .loc.button_save></button>
             </TMPL_IF>
diff --git a/website/agenda/planung/templates/edit-series.html b/website/agenda/planung/templates/edit-series.html
index 14c3319..d881645 100644
--- a/website/agenda/planung/templates/edit-series.html
+++ b/website/agenda/planung/templates/edit-series.html
@@ -60,7 +60,7 @@
 	            <input  type="hidden" name="project_id" value="<TMPL_VAR .project_id>">
 	            <input  type="hidden" name="studio_id"  value="<TMPL_VAR .studio_id>">
 	            <input  type="hidden" name="series_id"  value="<TMPL_VAR .series_id>">
-	            <button type="submit" name="action"     value="rebuild_episodes"><TMPL_VAR .loc.button_rebuild_episodes></button>
+	            <button type="submit" name="action"     value="rebuild_episodes" class="text"><TMPL_VAR .loc.button_rebuild_episodes></button>
 	        </form>
 	    </TMPL_IF>
 
@@ -176,7 +176,9 @@
 
 		    <div class="buttons">
 			    <TMPL_IF .allow.update_series_template>
-				    <button type=submit name="action" value="save"><TMPL_VAR .loc.button_save_template></button>
+				    <button type=submit name="action" value="save"
+                        class="primary"
+                    ><TMPL_VAR .loc.button_save_template></button>
 			    </TMPL_IF>
 			    <!--
 			    <button onclick="cancel_edit_series('<TMPL_VAR series_id>');return false;">cancel</button>
@@ -302,7 +304,7 @@
 					</div>
 					<TMPL_IF .allow.delete_schedule>
 					<div class="cell delete"><br>
-					    <button type="submit" name="action" value="delete_schedule" 
+					    <button type="submit" class="text" name="action" value="delete_schedule" 
                             onclick="commitForm('schedule_<TMPL_VAR schedule_id>','delete_schedule','<TMPL_VAR .loc.button_delete_schedule>');return false;"
                         ><TMPL_VAR .loc.button_delete_schedule></button>
                     </div>
diff --git a/website/agenda/planung/templates/projects.html b/website/agenda/planung/templates/projects.html
index 5ab596a..905bd7a 100644
--- a/website/agenda/planung/templates/projects.html
+++ b/website/agenda/planung/templates/projects.html
@@ -44,7 +44,7 @@
     <div class="panel-header">
         <div class="title"><TMPL_VAR title></div>
         <TMPL_IF .allow.update_project>
-            <button onclick="edit_project('<TMPL_VAR project_id>')"
+            <button class="text" onclick="edit_project('<TMPL_VAR project_id>')"
             ><TMPL_VAR .loc.button_edit></button>
         </TMPL_IF>
     </div>
@@ -66,7 +66,7 @@
                 </td><td>
                 <TMPL_IF .allow.update_project>
                     <button onclick="edit_project_assignments('<TMPL_VAR project_id>')"
-                        style="float:left"
+                        class="text" style="float:left"
                     ><TMPL_VAR .loc.button_change></button>
                 </TMPL_IF>
                 
@@ -112,7 +112,7 @@
                     <TMPL_IF .allow.delete_project>
                     <td>
                         <div class="right">
-                            <button type=submit name="action" value="delete"
+                            <button type=submit class="text" name="action" value="delete"
                             onclick="commitForm('project_<TMPL_VAR project_id>','delete','<TMPL_VAR .loc.button_delete>');return false;"
                             ><TMPL_VAR .loc.button_delete></button>
                         </div>
@@ -159,7 +159,7 @@
                             <input type="hidden" name="pid"        value="<TMPL_VAR pid>">
                             <input type="hidden" name="sid"        value="<TMPL_VAR sid>">
                             <input type="hidden" name="action"     value="unassign_studio">
-                            <button type="submit"
+                            <button type="submit" class="text"
                                 onclick="commitForm($(this).parent(),'unassign_studio','<TMPL_VAR .loc.button_unassign_studio>');return false;"
                             ><TMPL_VAR .loc.button_unassign_studio></button>
                         </form>
diff --git a/website/agenda/planung/templates/studio-timeslots.html b/website/agenda/planung/templates/studio-timeslots.html
index d5803a0..37cd1eb 100644
--- a/website/agenda/planung/templates/studio-timeslots.html
+++ b/website/agenda/planung/templates/studio-timeslots.html
@@ -65,7 +65,7 @@
 					<div class="cell"> <button type="submit" name="action" value="save_schedule"><TMPL_VAR .loc.button_save></button>   </div>
 					<TMPL_IF .allow.delete_schedule>
 					<div class="cell">
-                        <button type="submit" name="action" value="delete_schedule" 
+                        <button class="text" type="submit" name="action" value="delete_schedule" 
                             onclick="commitForm('form_schedule_<TMPL_VAR schedule_id>','delete_schedule','<TMPL_VAR .loc.button_delete>');return false;"
                         ><TMPL_VAR .loc.button_delete></button> 
                     </div>
diff --git a/website/agenda/planung/templates/studios.html b/website/agenda/planung/templates/studios.html
index 1bdba91..411d33c 100644
--- a/website/agenda/planung/templates/studios.html
+++ b/website/agenda/planung/templates/studios.html
@@ -17,7 +17,7 @@
 		        <tr>
 			        <td></td>
 			        <td class="buttons">
-				        <button onclick="cancel_edit_studio('new');return false;"><TMPL_VAR .loc.button_cancel></button>
+				        <button class="text" onclick="cancel_edit_studio('new');return false;"><TMPL_VAR .loc.button_cancel></button>
 				        <button type=submit name="action" value="save"><TMPL_VAR .loc.button_create></button>
 			        </td>
 		        </tr>
@@ -39,7 +39,7 @@
 	    </TMPL_IF>
 
         <TMPL_IF .allow.read_event>
-            <button target="_blank"
+            <button target="_blank" class="text"
                 onclick="load('event-history.cgi?project_id=<TMPL_VAR .project_id>&studio_id=<TMPL_VAR id>');"
             ><TMPL_VAR .loc.button_show_changes></button>
         </TMPL_IF>
@@ -84,13 +84,9 @@
 				    <td></td>
 				    <td class="buttons">
 					    <button type=submit name="action" value="save"><TMPL_VAR .loc.button_save></button>
-				    </td>
-				    <td>
-					    <div class="right">
-					        <button type=submit name="action" value="delete"
-                            onclick="commitForm('studio_<TMPL_VAR id>','delete','<TMPL_VAR .loc.button_delete>');return false;"
-                            ><TMPL_VAR .loc.button_delete></button>
-                        </div>
+				        <button type=submit class="text" name="action" value="delete"
+                        onclick="commitForm('studio_<TMPL_VAR id>','delete','<TMPL_VAR .loc.button_delete>');return false;"
+                        ><TMPL_VAR .loc.button_delete></button>
 				    </td>
 			    </tr>
 		    </table>
diff --git a/website/agenda/planung/templates/user-settings.html b/website/agenda/planung/templates/user-settings.html
index 1562e27..f079b76 100644
--- a/website/agenda/planung/templates/user-settings.html
+++ b/website/agenda/planung/templates/user-settings.html
@@ -45,7 +45,7 @@ div.col {
 <TMPL_INCLUDE status.html>
 
 <form method="post">
-    <input type="hidden" name="action" value="save">
+    <input class="primary" type="hidden" name="action" value="save">
     <button onclick="$(this).submit()">
         <TMPL_VAR loc.button_colors_save>
     </button>
@@ -149,4 +149,4 @@ div.col {
 </form>
 
 </body>
-</html>
\ No newline at end of file
+</html>
diff --git a/website/agenda/planung/templates/user-stats.html b/website/agenda/planung/templates/user-stats.html
index 5346305..578cd7b 100644
--- a/website/agenda/planung/templates/user-stats.html
+++ b/website/agenda/planung/templates/user-stats.html
@@ -26,7 +26,8 @@ table#user_stats_table input{
 <hr>
 <TMPL_INCLUDE status.html>
 
-    <button onclick="load('user-stats.cgi?project_id=<TMPL_VAR .project_id>&studio_id=<TMPL_VAR .studio_id>&action=show-active-users');">
+    <button class="text"
+        onclick="load('user-stats.cgi?project_id=<TMPL_VAR .project_id>&studio_id=<TMPL_VAR .studio_id>&action=show-active-users');">
         <TMPL_VAR .loc.button_show_active_users>
     </button>
 
diff --git a/website/agenda/planung/templates/users.html b/website/agenda/planung/templates/users.html
index a39b604..49723dc 100644
--- a/website/agenda/planung/templates/users.html
+++ b/website/agenda/planung/templates/users.html
@@ -100,7 +100,7 @@
 		<tr>	<td><TMPL_VAR .loc.label_password></td>	    <td><input name="user_password"  value="<TMPL_VAR password>"></td>	</tr>
 		<tr>	<td><TMPL_VAR .loc.label_password2></td>	<td><input name="user_password2" value="<TMPL_VAR password2>"></td>	</tr>
 		<tr>	<td class="buttons" colspan="3">
-				<button onclick="cancel_edit_user('new');return false;"><TMPL_VAR .loc.button_cancel></button>
+				<button onclick="cancel_edit_user('new');return false;" class="text"><TMPL_VAR .loc.button_cancel></button>
 				<button type=submit name="action" value="save"><TMPL_VAR .loc.button_create_user></button>
 			</td>
 		</tr>
@@ -159,11 +159,11 @@
 
 	<td>
 		<TMPL_IF allow.update_user>
-			<button onclick="edit_user('<TMPL_VAR id>')"><TMPL_VAR .loc.button_edit_user></button>
+			<button class="text" onclick="edit_user('<TMPL_VAR id>')"><TMPL_VAR .loc.button_edit_user></button>
 		</TMPL_IF>
 
 		<TMPL_IF allow.update_user_role>
-			<button onclick="edit_roles('<TMPL_VAR id>')"><TMPL_VAR .loc.button_edit_roles></button>
+			<button class="text" onclick="edit_roles('<TMPL_VAR id>')"><TMPL_VAR .loc.button_edit_roles></button>
 		</TMPL_IF>
 		<!--	</div> -->
 	</td>