#145 add comments for devices

This commit is contained in:
Gary Sharp
2025-07-17 11:40:50 +10:00
parent 2184c9e22e
commit f8fd1a58a3
35 changed files with 2047 additions and 614 deletions
+144 -2
View File
@@ -206,6 +206,146 @@
border-top: none;
background-color: #eee;
}
#DeviceDetailTab-CommentsAndJobs {
display: grid;
grid-template-columns: auto;
}
#DeviceDetailTab-CommentsAndJobs.canShowComments.canShowJobs {
grid-template-columns: 375px auto;
}
#DeviceDetailTab-CommentsAndJobs.canShowComments.canShowJobs > #DeviceDetailTab-Comments {
grid-column: 1;
}
#DeviceDetailTab-CommentsAndJobs.canShowComments.canShowJobs > #DeviceDetailTab-JobsContainer {
grid-column: 2;
}
#DeviceDetailTab-CommentsAndJobs.cannotShowComments div.jobTable {
border: 1px solid #ccc;
}
#DeviceDetailTab-CommentsContainer {
max-height: 650px;
}
#DeviceDetailTab-JobsContainer {
max-height: 650px;
overflow: auto;
}
#Comments {
box-sizing: border-box;
height: 100%;
min-height: 373px;
padding-bottom: 51px;
border: 1px solid #ccc;
background-color: #fff;
position: relative;
}
#Comments div.commentInput {
border-top: 1px solid #ccc;
box-sizing: border-box;
width: 100%;
height: 51px;
padding: 5px;
position: absolute;
bottom: 0;
display: grid;
grid-template-columns: auto 40px;
}
#Comments div.commentInput textarea.commentInput {
grid-column: 1;
border: 0;
padding: 0;
margin: 0;
width: 100%;
height: 40px;
min-height: 40px;
overflow: auto;
resize: none;
}
#Comments div.commentInput button {
grid-column: 2;
appearance: none;
font-size: 1.5em;
display: block;
border: 1px solid #fff;
background-color: #fff;
}
#Comments div.commentInput button:not([disabled]):hover,
#Comments div.commentInput button:not([disabled]):focus {
color: #335A87;
background-color: #ededed;
border: 1px solid #ccc;
}
#Comments div.commentInput button[disabled] {
color: rgba(51, 51, 51, 0.2);
cursor: default;
}
#Comments div.commentOutput {
height: 100%;
overflow: auto;
background-color: #fafafa;
color: #000;
}
#Comments div.commentOutput > div {
padding: 3px;
margin: 4px 6px;
border-bottom: 1px solid #ccc;
}
#Comments div.commentOutput > div span.author {
color: #444;
display: block;
font-weight: 600;
font-size: 0.95em;
float: left;
}
#Comments div.commentOutput > div span.timestamp {
display: block;
float: right;
font-size: 0.9em;
font-style: italic;
}
#Comments div.commentOutput > div div.comment {
clear: both;
display: block;
margin-left: 4px;
}
#Comments div.commentOutput > div div.comment p {
line-height: 1.2em;
padding-bottom: 0.2em;
}
#Comments div.commentOutput > div div.comment h1,
#Comments div.commentOutput > div div.comment h2,
#Comments div.commentOutput > div div.comment h3,
#Comments div.commentOutput > div div.comment h4,
#Comments div.commentOutput > div div.comment h5 {
font-family: "Segoe UI", Arial, Verdana, Tahoma, sans-serif;
font-weight: 600;
font-size: 14px;
margin: 2px 0 !important;
}
#Comments div.commentOutput > div div.comment hr {
margin-top: 0.2em;
}
#Comments div.commentOutput > div div.comment code {
font-size: 0.9em;
}
#Comments div.commentOutput > div:hover span.remove {
opacity: 0.5;
}
#Comments div.commentOutput > div span.remove {
font-size: 1.2em;
color: #e51400;
margin-left: 6px;
cursor: pointer;
opacity: 0;
}
#Comments div.commentOutput > div span.remove:hover {
opacity: 1;
}
#Comments div.commentOutput > div:last-child {
border-bottom: none;
}
#Comments.cannotAddComments {
padding-bottom: 0;
}
#Device_Show_Policies_Profile_Actions_Update_Dialog .profile-list,
#Device_Show_Policies_Batch_Actions_Update_Dialog .profile-list {
max-height: 300px;
@@ -230,8 +370,10 @@
padding-top: 0.5em;
}
#DeviceDetailTab-JobsContainer div.jobTable {
margin: -1px;
border: 1px solid #ddd;
min-height: 320px;
border-top: 1px solid #ccc;
border-right: 1px solid #ccc;
border-bottom: 1px solid #ccc;
}
#DeviceDetailTab-JobsContainer .dataTables_wrapper .dataTables_filter {
margin-top: -24px;
+170 -2
View File
@@ -179,6 +179,172 @@
}
}
#DeviceDetailTab-CommentsAndJobs {
display: grid;
grid-template-columns: auto;
&.canShowComments.canShowJobs {
grid-template-columns: 375px auto;
& > #DeviceDetailTab-Comments {
grid-column: 1;
}
& > #DeviceDetailTab-JobsContainer {
grid-column: 2;
}
}
&.cannotShowComments div.jobTable {
border: 1px solid @SubtleBorderColour;
}
}
#DeviceDetailTab-CommentsContainer {
max-height: 650px;
}
#DeviceDetailTab-JobsContainer {
max-height: 650px;
overflow: auto;
}
#Comments {
box-sizing: border-box;
height: 100%;
min-height: 373px;
padding-bottom: 51px;
border: 1px solid @SubtleBorderColour;
background-color: @white;
position: relative;
div.commentInput {
border-top: 1px solid @SubtleBorderColour;
box-sizing: border-box;
width: 100%;
height: 51px;
padding: 5px;
position: absolute;
bottom: 0;
display: grid;
grid-template-columns: auto 40px;
textarea.commentInput {
grid-column: 1;
border: 0;
padding: 0;
margin: 0;
width: 100%;
height: 40px;
min-height: 40px;
overflow: auto;
resize: none;
}
button {
grid-column: 2;
appearance: none;
font-size: 1.5em;
display: block;
border: 1px solid @white;
background-color: @white;
&:not([disabled]) {
&:hover, &:focus {
color: @HyperLinkColour;
background-color: @SubtleColour;
border: 1px solid @SubtleBorderColour;
}
}
&[disabled] {
color: fade(@HeaderBackgroundColour, 20%);
cursor: default;
}
}
}
div.commentOutput {
height: 100%;
overflow: auto;
background-color: @BackgroundColourLight;
color: @black;
& > div {
padding: 3px;
margin: 4px 6px;
border-bottom: 1px solid @SubtleBorderColour;
span.author {
color: #444;
display: block;
font-weight: @FontWeightBodyBold;
font-size: 0.95em;
float: left;
}
span.timestamp {
display: block;
float: right;
font-size: 0.90em;
font-style: italic;
}
div.comment {
clear: both;
display: block;
margin-left: 4px;
p {
line-height: 1.2em;
padding-bottom: .2em;
}
h1, h2, h3, h4, h5 {
font-family: @FontFamilyBody;
font-weight: 600;
font-size: 14px;
margin: 2px 0 !important;
}
hr {
margin-top: .2em;
}
code {
font-size: .9em;
}
}
&:hover {
span.remove {
opacity: .5;
}
}
span.remove {
font-size: 1.2em;
color: @StatusRemove;
margin-left: 6px;
cursor: pointer;
opacity: 0;
&:hover {
opacity: 1;
}
}
&:last-child {
border-bottom: none;
}
}
}
&.cannotAddComments {
padding-bottom: 0;
}
}
#Device_Show_Policies_Profile_Actions_Update_Dialog, #Device_Show_Policies_Batch_Actions_Update_Dialog {
.profile-list {
max-height: 300px;
@@ -206,8 +372,10 @@
#DeviceDetailTab-JobsContainer {
div.jobTable {
margin: -1px;
border: 1px solid #ddd;
min-height: 320px;
border-top: 1px solid @SubtleBorderColour;
border-right: 1px solid @SubtleBorderColour;
border-bottom: 1px solid @SubtleBorderColour;
}
.dataTables_wrapper {
File diff suppressed because one or more lines are too long
+7
View File
@@ -219,6 +219,13 @@
#UserDetailTab-CommentsAndJobs.cannotShowComments div.jobTable {
border: 1px solid #ccc;
}
#UserDetailTab-CommentsContainer {
max-height: 650px;
}
#UserDetailTab-JobsContainer {
max-height: 650px;
overflow: auto;
}
#Comments {
box-sizing: border-box;
height: 100%;
+9
View File
@@ -191,6 +191,15 @@
}
}
#UserDetailTab-CommentsContainer {
max-height: 650px;
}
#UserDetailTab-JobsContainer {
max-height: 650px;
overflow: auto;
}
#Comments {
box-sizing: border-box;
height: 100%;
File diff suppressed because one or more lines are too long