Fix css button alignment

redhat-developer · Jul 28, 2020 · 46520a1 · 46520a1
1 parent 9c00ad0
commit 46520a1
Show file tree

Hide file tree

Showing 2 changed files with 32 additions and 6 deletions.
diff --git a/package.json b/package.json
@@ -185,6 +185,11 @@
         "category": "Tekton",
         "enablement": "tekton:tkn"
       },
+      {
+        "command": "tekton.pipeline.wizard.start",
+        "title": "Start Wizard",
+        "category": "Tekton"
+      },
       {
         "command": "tekton.explorerView.delete",
         "title": "Delete",

diff --git a/src/webview/pipeline/app/style.css b/src/webview/pipeline/app/style.css
@@ -84,9 +84,9 @@ body {
 .startButton-disable {
   height: 16px;
   margin: -20px -50px;
-  position: fixed;
+  position: relative;
+  bottom: 3%;
   /* top:33%; */
-  bottom: 40px;
   left: 50%;
   background: #848484;
   color: var(--vscode-button-foreground);
@@ -103,9 +103,9 @@ body {
 .startButton {
   height: 16px;
   margin: -20px -50px;
-  position: fixed;
-  /* top:33%; */
-  bottom: 40px;
+  position: relative;
+  bottom: 3%;
+  /* bottom: 40px; */
   left: 50%;
   background: var(--vscode-button-background);
   color: var(--vscode-button-foreground);
@@ -163,8 +163,29 @@ body {
 .close-button {
   cursor: pointer;
   position: absolute;
-  right: 10px;
+  right: 291px;
   top: -32px;
+  /* right: 10px;
+  top: -32px; */
+}
+
+
+@media screen and (min-width: 357px) {
+  .close-button {
+    right: 179px;
+  }
+}
+
+@media screen and (min-width: 550px) {
+  .close-button {
+    right: 167px;
+  }
+}
+
+@media screen and (min-width: 700px) {
+  .close-button {
+    right: 10px;
+  }
 }
 
 .close-button-div {