gitlab-org--gitlab-foss/app/assets/stylesheets/pages/reports.scss
Jarek Ostrowski 7a796c76c2 Align merge request icons and text
Align icons left
Align text left
Adjust padding to be consistent
Make icons same 24 size
Add changelog mr number
Add right margin to widget status container
Add left margin inside widget icon container
Prepend left padding for error message
Only give button left margin, some have buttons
Prettify
Adjust test summary icons
Prettify
Fix empty line before lint
Remove author
Switch to use gl-padding
Use utility classes instead
Prettify
Change loading icon size to md
Update summary_row.vue
2019-07-16 17:31:12 +00:00

147 lines
2.5 KiB
SCSS

.split-report-section {
border-bottom: 1px solid $gray-darker;
.report-block-container {
max-height: 500px;
overflow: auto;
}
.space-children,
.space-children > span {
display: flex;
align-self: center;
}
.media {
align-items: center;
padding: 10px;
line-height: 20px;
/*
This fixes the wrapping div of the icon in the report header.
Apparently the borderless status icons are half the size of the status icons with border.
This means we have to double the size of the wrapping div for borderless icons.
*/
.space-children:first-child {
width: 32px;
height: 32px;
align-items: center;
justify-content: center;
margin-right: 5px;
margin-left: 1px;
}
}
.code-text {
width: 100%;
flex: 1;
}
}
.mr-widget-grouped-section {
.report-block-container {
max-height: 170px;
overflow: auto;
}
.report-block-list-issue-parent {
padding: $gl-padding-top $gl-padding;
border-top: 1px solid $border-color;
}
.report-block-list-icon .loading-container {
position: relative;
left: -2px;
}
}
.report-block-container {
border-top: 1px solid $border-color;
padding: $gl-padding - 2;
background-color: $gray-light;
// Clean MR widget CSS
line-height: 20px;
}
.report-block-list {
list-style: none;
padding: 0 1px;
margin: 0;
.license-item {
line-height: $gl-padding-32;
.license-packages {
font-size: $label-font-size;
}
}
}
.report-block-list-icon {
display: flex;
&.failed svg {
color: $red-500;
}
&.success svg {
color: $green-500;
}
&.neutral svg {
color: $gray-700;
}
.ci-status-icon {
svg {
width: 24px;
height: 24px;
}
}
}
.report-block-list-issue {
display: flex;
}
.is-dismissed .report-block-list-issue-description,
.is-dismissed .vulnerability-name-button {
text-decoration: line-through;
}
.report-block-list-issue-description-text::after {
content: '\00a0';
}
.report-block-list-issue-description {
align-content: space-around;
align-items: flex-start;
flex-wrap: wrap;
display: flex;
align-self: center;
}
.report-block {
.break-link {
word-wrap: break-word;
word-break: break-all;
}
}
.report-block-issue-code {
width: 600px;
}
.modal-security-report-dast {
.modal-dialog {
width: $modal-lg;
max-width: $modal-lg;
}
// This is temporary till we get the new modals hooked up
&.modal-hide-footer .modal-footer {
display: none;
}
}