Fix tablet alignment issues for event logs
This will make sure our event log content is properly aligned
on tablet and desktop views. It will also make the date/time value
on the server overview page always display underneath the 'BMC time'
label in a destkop view–currently the date value will wrap to a
new line if the string is too long.
- Update markup to use Foundation grid layout classes on the
server overview event log table
Tested: Event log tables on server overview page and event
log page
Signed-off-by: Yoshie Muranaka <yoshiemuranaka@gmail.com>
Change-Id: I7d765ebbe679f954e606d1d25e2182d983a7b3f3
diff --git a/app/server-health/styles/log.scss b/app/server-health/styles/log.scss
index aa505e3..bf2d27f 100644
--- a/app/server-health/styles/log.scss
+++ b/app/server-health/styles/log.scss
@@ -255,9 +255,6 @@
text-transform: uppercase;
font-weight: 700;
min-width: 103px;
- @include mediaQuery(medium) {
- margin: 0 1em 0 1.5em;
- }
&.high-priority {
color: darken($highPriorityColor, 5%);
}
@@ -272,17 +269,6 @@
}
}
- //Event description
- .event__description {
- font-weight: 400;
- margin-left: 1em;
- @include mediaQuery(small) {
- margin-left: 1.5em;
- margin-right: 1em;
- }
- word-break: break-all;
- }
-
//Event ID
.event__id {
@include fontCourierBold;
@@ -292,12 +278,12 @@
}
.event__timestamp {
- text-align: right;
+ text-align: left;
@include fontCourierBold;
font-size: .9em;
color: $darkgrey;
max-width: 18em;
- @media (min-width: 1105px) {
+ @include mediaQuery(medium) {
float: right;
}
}
@@ -382,6 +368,14 @@
display: inline-block;
}
}
+
+/*p*/.event__description {
+ margin-bottom: 0;
+ line-height: 1.7;
+ font-weight: 400;
+ word-break: break-word;
+}
+
//end event-log__events