[ct] Add Chromium Builds page, fix some style nits in element.
Change-Id: Ic2efc69e955b81fdf03d1d94166257a022b7a729
Reviewed-on: https://skia-review.googlesource.com/c/buildbot/+/304037
Reviewed-by: Ravi Mistry <rmistry@google.com>
diff --git a/ct/go/ctfe/chromium_builds/chromium_builds.go b/ct/go/ctfe/chromium_builds/chromium_builds.go
index d243e81..d2ca82e 100644
--- a/ct/go/ctfe/chromium_builds/chromium_builds.go
+++ b/ct/go/ctfe/chromium_builds/chromium_builds.go
@@ -57,9 +57,7 @@
func ReloadTemplates(resourcesDir string) {
addTaskTemplate = template.Must(template.ParseFiles(
- filepath.Join(resourcesDir, "templates/chromium_builds.html"),
- filepath.Join(resourcesDir, "templates/header.html"),
- filepath.Join(resourcesDir, "templates/titlebar.html"),
+ filepath.Join(resourcesDir, "dist", "chromium_builds.html"),
))
runsHistoryTemplate = template.Must(template.ParseFiles(
filepath.Join(resourcesDir, "templates/chromium_build_runs_history.html"),
diff --git a/ct/modules/chromium-builds-sk/chromium-builds-sk.js b/ct/modules/chromium-builds-sk/chromium-builds-sk.js
index 986be7a..ecc8482 100644
--- a/ct/modules/chromium-builds-sk/chromium-builds-sk.js
+++ b/ct/modules/chromium-builds-sk/chromium-builds-sk.js
@@ -70,8 +70,8 @@
</td>
</tr>
<tr>
- <td colspan="2" class="center">
- <div class="triggering-spinner">
+ <td colspan=3 class=center
+ <div class=triggering-spinner>
<spinner-sk .active=${el._triggeringTask} alt="Trigger task"></spinner-sk>
</div>
<button id=submit ?disabled=${el._triggeringTask} @click=${el._validateTask}>Queue Task
@@ -79,7 +79,7 @@
</td>
</tr>
<tr>
- <td colspan=2 class=center>
+ <td colspan=3 class=center>
<button id=view_history @click=${el._gotoRunsHistory}>View runs history</button>
</td>
</tr>
diff --git a/ct/modules/chromium-builds-sk/chromium-builds-sk.scss b/ct/modules/chromium-builds-sk/chromium-builds-sk.scss
index 1a103eb..d59de9c 100644
--- a/ct/modules/chromium-builds-sk/chromium-builds-sk.scss
+++ b/ct/modules/chromium-builds-sk/chromium-builds-sk.scss
@@ -3,6 +3,7 @@
chromium-builds-sk {
background-color: var(--surface);
color: var(--on-surface);
+
table.options {
padding-left: 2em;
margin: 1em;
@@ -11,8 +12,9 @@
select-sk {
* {
- padding: 0;
+ padding: 0;
}
+
[selected] {
background-color: var(--primary-variant);
}
@@ -37,11 +39,30 @@
}
td.center {
- text-align:center;
- padding-top:2em;
+ text-align: center;
+ padding-top: 2em;
+ }
+
+ .rev-detail-container {
+ position: relative;
+ text-align: center;
+ width: 350px;
+ height: 100px;
+ }
+
+ .loading-rev-spinner {
+ margin: auto;
+ vertical-align: middle
+ }
+
+ .rev-detail {
+ position: absolute;
+ top: 0px;
+ left: 0px;
+ text-align: start;
}
}
.darkmode chromium-builds-sk table.options {
background-color: var(--surface-2dp);
-}
+}
\ No newline at end of file
diff --git a/ct/pages/chromium_builds.html b/ct/pages/chromium_builds.html
new file mode 100644
index 0000000..da8108a
--- /dev/null
+++ b/ct/pages/chromium_builds.html
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html>
+<head>
+ <title>Chromium Builds</title>
+ <link rel="shortcut icon" href="/res/img/favicon.ico">
+</head>
+<body>
+ <ct-scaffold-sk app_title="Cluster Telemetry 3.0">
+ <h2>Add a New Chromium Build</h2>
+ <chromium-builds-sk></chromium-builds-sk>
+ </ct-scaffold-sk>
+</body>
+</html>
\ No newline at end of file
diff --git a/ct/pages/chromium_builds.js b/ct/pages/chromium_builds.js
new file mode 100644
index 0000000..e31f9b6
--- /dev/null
+++ b/ct/pages/chromium_builds.js
@@ -0,0 +1,2 @@
+import '../modules/chromium-builds-sk';
+import '../modules/ct-scaffold-sk';