Remove user-select defaulted to none for the whole page
Intent of "user-select: none" is to disallow the text selection on the
timeline. This CL moves the rule to ".panels" selector, achieving the
same effect but without needing to sprinkle "user-select: text" all
over the other CSS rules. Additional class "track-title" was added to
allow selecting name of the track group; this hasn't been done for
tracks because they implement drag'n'drop behaviour.
Change-Id: Ida0ab5a92b6a0d443474b60787ded0536b2d248d
diff --git a/ui/src/assets/common.scss b/ui/src/assets/common.scss
index a067051..f98aa30 100644
--- a/ui/src/assets/common.scss
+++ b/ui/src/assets/common.scss
@@ -87,7 +87,6 @@
width: 100%;
padding: 0;
margin: 0;
- user-select: none;
overscroll-behavior: none;
}
@@ -185,9 +184,6 @@
}
.alerts {
- * {
- user-select: text;
- }
grid-area: alerts;
background-color: #f2f2f2;
>div {
@@ -449,6 +445,7 @@
.panels {
grid-area: space;
+ user-select: none;
}
.panel {
@@ -498,15 +495,10 @@
color: hsl(213, 22%, 40%);
}
span.code {
- user-select: text;
flex-grow: 1;
}
}
-.query-error {
- user-select: text;
-}
-
button.query-ctrl {
background: #262f3c;
color: white;
@@ -620,6 +612,10 @@
min-height: 40px;
transition: background-color .4s;
+ .track-title {
+ user-select: text;
+ }
+
.chip {
background-color: #bed6ff;
border-radius: 3px;
@@ -785,7 +781,6 @@
}
}
span {
- user-select: text;
flex-grow: 1;
}
}
diff --git a/ui/src/assets/details.scss b/ui/src/assets/details.scss
index b7bfad8..a191ffa 100644
--- a/ui/src/assets/details.scss
+++ b/ui/src/assets/details.scss
@@ -98,7 +98,6 @@
font-family: 'Roboto Condensed', sans-serif;
font-weight: 300;
color: #3c4b5d;
- user-select: text;
.material-icons {
@include transition(0.3s);
@@ -381,7 +380,6 @@
display: grid;
grid-template-rows: auto 1fr;
font-family: 'Roboto Condensed', sans-serif;
- user-select: text;
header {
position: sticky;
diff --git a/ui/src/assets/flags_page.scss b/ui/src/assets/flags_page.scss
index 3a1d897..3750dbd 100644
--- a/ui/src/assets/flags_page.scss
+++ b/ui/src/assets/flags_page.scss
@@ -14,7 +14,6 @@
.flags-page {
overflow-y: scroll;
- user-select: text;
}
.flags-content {
diff --git a/ui/src/assets/metrics_page.scss b/ui/src/assets/metrics_page.scss
index 4881d46..e9ccf58 100644
--- a/ui/src/assets/metrics_page.scss
+++ b/ui/src/assets/metrics_page.scss
@@ -40,7 +40,6 @@
font-family: 'Roboto Mono';
line-height: 1.5em;
border-radius: 5px;
- user-select: text;
overflow-x: auto;
&.metric-error {
color: #EF6C00;
diff --git a/ui/src/assets/modal.scss b/ui/src/assets/modal.scss
index fe1bc87..f65961e 100644
--- a/ui/src/assets/modal.scss
+++ b/ui/src/assets/modal.scss
@@ -183,7 +183,6 @@
.modal-pre {
white-space: pre-line;
font-size: 13px;
- user-select: text;
}
.modal-logs, .modal-bash {
@@ -192,7 +191,6 @@
background: #eee;
font-size: 10px;
font-family: var(--monospace-font);
- -webkit-user-select: text;
margin-top: 10px;
margin-bottom: 10px;
min-height: 50px;
diff --git a/ui/src/assets/record.scss b/ui/src/assets/record.scss
index df6935d..9e06aa9 100644
--- a/ui/src/assets/record.scss
+++ b/ui/src/assets/record.scss
@@ -928,7 +928,6 @@
margin: var(--record-section-padding);
background-color: #111;
border-radius: 4px;
- user-select: text;
box-shadow: 0 0 12px #999;
@keyframes ripple{
diff --git a/ui/src/assets/sidebar.scss b/ui/src/assets/sidebar.scss
index db8428f..230b3fa 100644
--- a/ui/src/assets/sidebar.scss
+++ b/ui/src/assets/sidebar.scss
@@ -207,7 +207,6 @@
white-space: break-spaces;
font-family: 'Roboto Condensed', sans-serif;
word-break: break-all;
- user-select: text;
font-weight: 300;
letter-spacing: 0;
margin-top: -10px;
@@ -227,7 +226,6 @@
height: - var(--sidebar-padding-bottom);
grid-template-columns: repeat(4, min-content);
grid-gap: 10px;
- user-select: text;
> button {
color: hsl(217, 39%, 94%);
diff --git a/ui/src/assets/trace_info_page.scss b/ui/src/assets/trace_info_page.scss
index 38c6f9d..84ee72f 100644
--- a/ui/src/assets/trace_info_page.scss
+++ b/ui/src/assets/trace_info_page.scss
@@ -16,7 +16,6 @@
overflow-y: auto;
overflow-x: hidden;
padding: 0 20px;
- user-select: text;
section {
margin: 20px auto;
diff --git a/ui/src/frontend/track_group_panel.ts b/ui/src/frontend/track_group_panel.ts
index bf9c9c1..e5f6631 100644
--- a/ui/src/frontend/track_group_panel.ts
+++ b/ui/src/frontend/track_group_panel.ts
@@ -129,10 +129,8 @@
m('.fold-button',
m('i.material-icons',
this.trackGroupState.collapsed ? EXPAND_DOWN : EXPAND_UP)),
- m('h1',
- {
- title: name,
- },
+ m('h1.track-title',
+ {title: name},
name,
('namespace' in this.summaryTrackState.config) &&
m('span.chip', 'metric')),
