Преглед изворни кода

feature: Rounded buttons... because apparently they look modern?! (#239)

* feature: Rounded buttons... because apparently they look modern?!

* bugfix: Logo in readme
James Read пре 2 година
родитељ
комит
555b6929e4
3 измењених фајлова са 4 додато и 12 уклоњено
  1. 1 2
      webui.dev/index.html
  2. 2 0
      webui.dev/js/ActionButton.js
  3. 1 10
      webui.dev/style.css

+ 1 - 2
webui.dev/index.html

@@ -153,8 +153,7 @@
 				<span class = "title">Untitled Button</span>
 			</button>
 
-			<div class = "action-button-footer">
-			</div>
+			<div class = "action-button-footer" hidden></div>
 		</template>
 
 		<template id = "tplLogRow">

+ 2 - 0
webui.dev/js/ActionButton.js

@@ -129,6 +129,8 @@ class ActionButton extends ExecutionFeedbackButton {
     if (this.popupOnStart === 'execution-button') {
       const btnExecution = document.createElement('execution-button')
       btnExecution.constructFromJson(executionTrackingId)
+      this.querySelector('.action-button-footer').hidden = false
+      this.querySelector('.action-button-footer').style.display = 'flex'
       this.querySelector('.action-button-footer').prepend(btnExecution)
 
       return

+ 1 - 10
webui.dev/style.css

@@ -252,6 +252,7 @@ action-button button {
   flex-grow: 1;
   width: 100%;
   z-index: 2;
+  border-radius: .7em;
 }
 
 action-button details {
@@ -271,14 +272,8 @@ action-button details summary div span:first-child {
 }
 
 .action-button-footer {
-  display: flex;
   text-align: left;
   font-size: smaller;
-  background-color: #efefef;
-  border-top: 0;
-  border-left: 1px solid #666;
-  border-right: 1px solid #666;
-  border-bottom: 1px solid #666;
   overflow: auto;
 }
 
@@ -544,10 +539,6 @@ div.toolbar * {
     color: white;
   }
 
-  .action-button-footer {
-    background-color: #111;
-  }
-
   button:disabled {
     background-color: black;
   }