diff --git a/datamodels/2.x/itop-portal-base/portal/public/css/portal.css b/datamodels/2.x/itop-portal-base/portal/public/css/portal.css index 508c49f5a..965e0beea 100644 --- a/datamodels/2.x/itop-portal-base/portal/public/css/portal.css +++ b/datamodels/2.x/itop-portal-base/portal/public/css/portal.css @@ -1172,6 +1172,7 @@ table .group-actions { position: relative; display: inline-block; margin-left: 60px; + max-width: calc(100% - 60px); background-color: #585653; color: #FFFFFF; } @@ -1224,6 +1225,11 @@ table .group-actions { } .caselog-thread--block-entry-content > p:last-of-type { margin-bottom: 0px; + /* Force user-generated tables to fit within the container as they often have an hard-coded width */ +} +.caselog-thread--block-entry-content table { + width: unset !important; + max-width: max-content; } .caselog-thread--block-entry-date { margin-top: 5px; diff --git a/datamodels/2.x/itop-portal-base/portal/public/css/portal.scss b/datamodels/2.x/itop-portal-base/portal/public/css/portal.scss index 51bbedc2d..caa3de4bf 100644 --- a/datamodels/2.x/itop-portal-base/portal/public/css/portal.scss +++ b/datamodels/2.x/itop-portal-base/portal/public/css/portal.scss @@ -1225,10 +1225,10 @@ table .group-actions .item-action-wrapper .panel-body > p:last-child{ position: absolute; top: 0px; left: 0px; - width: 40px; - height: 40px; + width: $messaging-block-medallion-size; + height: $messaging-block-medallion-size; text-align: center; - line-height: 40px; + line-height: $messaging-block-medallion-size; font-size: 18px; color: $messaging-self-secondary-color; /* .caselog-thread--block-entries color */ @@ -1248,7 +1248,8 @@ table .group-actions .item-action-wrapper .panel-body > p:last-child{ .caselog-thread--block-entries{ position: relative; display: inline-block; - margin-left: 60px; + margin-left: $messaging-block-entries-margin-x; + max-width: calc(100% - #{$messaging-block-entries-margin-x}); background-color: $messaging-self-primary-color; color: $messaging-self-secondary-color; } @@ -1312,6 +1313,11 @@ table .group-actions .item-action-wrapper .panel-body > p:last-child{ > p:last-of-type{ margin-bottom: 0px; } + /* Force user-generated tables to fit within the container as they often have an hard-coded width */ + table { + width: unset !important; + max-width: max-content; + } } .caselog-thread--block-entry-date{ margin-top: 5px; @@ -1344,7 +1350,7 @@ table .group-actions .item-action-wrapper .panel-body > p:last-child{ } .caselog-thread--block-entries{ margin-left: initial; - margin-right: 60px; + margin-right: $messaging-block-entries-margin-x; text-align: right; .caselog-thread--block-entry{ diff --git a/datamodels/2.x/itop-portal-base/portal/public/css/variables.scss b/datamodels/2.x/itop-portal-base/portal/public/css/variables.scss index ffb3e8c01..5bcce1d65 100644 --- a/datamodels/2.x/itop-portal-base/portal/public/css/variables.scss +++ b/datamodels/2.x/itop-portal-base/portal/public/css/variables.scss @@ -943,6 +943,8 @@ $hr-border: $gray-lighter !default; // //## +$messaging-block-medallion-size: 40px !default; +$messaging-block-entries-margin-x: 60px !default; $messaging-self-primary-color: $combodo-dark-gray !default; $messaging-self-secondary-color: $white !default; $messaging-1st-peer-primary-color: $white !default;