src/sass/_bidAudit.scss
.bid-audit-page {
.ba-subheading {
display: flex;
justify-content: space-between;
align-items: baseline;
padding-top: 15px;
}
.ba-audit-info {
color: $color-gray;
font-size: 16px;
}
.ba-audit-sub-info {
color: $color-gray;
font-size: 12px;
}
.ba-scroll-container {
overflow: auto;
height: 1300px;
}
.ba-label {
width: fit-content;
padding-right: 10px;
}
.bid-audit-form {
.bid-audit-options {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(400px, 1fr));
.filter-div {
font-size: 15px;
width: 400px;
}
}
}
}
.ba-run-audit {
cursor: pointer;
a {
text-decoration-line: none;
}
}
.ba-card {
background-color: $color-white;
border: 1px solid $bg-gray-dark-3;
border-left: 8px solid $blue-primary;
margin-block: 20px;
padding-left: 1em;
padding-right: 1em;
}
.ba-flex-end {
display: flex;
justify-content: end;
}
.ba-delete-button-wrapper {
display: flex;
justify-content: flex-end;
}
.ba-delete-button {
background-color: transparent;
color: $primary-blue;
&:hover {
background-color: transparent;
color: $primary-blue;
}
}
.position-content--container {
.position-content--details {
.definitions {
.truncate {
.at-grade-container {
display: flex;
justify-content: space-between;
div:first-child {
margin-right: 10px;
}
div:not(:first-child) {
min-width: 90px;
}
.tm-checkbox {
display: flex;
align-items: center;
justify-content: center;
}
.bid-audit-headers {
margin-top: 0;
}
.bid-audit-card-rows {
display: flex;
justify-content: flex-start;
width: 400px;
.bid-audit-contents-container {
width: 60px;
@media screen and (max-width: 1350px) {
width: 40px;
}
.bid-audit-rows-headers {
margin-bottom: 5px;
width: 250px;
}
.bid-audit-rows-details {
width: 300px;
@media screen and (max-width: 1190px) {
width: 200px;
}
}
}
}
.edit-at {
position: absolute;
top: 30;
right: 0;
font-weight: 400;
font-size: 16px;
}
@media screen and (max-width: 1400px) {
div:not(:first-child) {
min-width: 50px;
}
.bid-audit-card-rows {
display: flex;
justify-content: flex-start;
width: 350px;
}
}
@media screen and (max-width: 1350px) {
.bid-audit-card-rows {
display: flex;
justify-content: flex-start;
width: 300px;
}
}
@media screen and (max-width: 1180px) {
.bid-audit-card-rows {
display: flex;
justify-content: flex-start;
width: 250px;
}
}
@media screen and (max-width: 1130px) {
div:not(:first-child) {
min-width: 30px;
}
.bid-audit-card-rows {
display: flex;
justify-content: flex-start;
width: 230px;
}
}
}
}
}
}
}
$bid-audit-input-width: 460px;
.bid-audit-modal-wrapper {
background-color: white;
border-radius: 5px;
padding: 30px;
font-size: 16px;
width: auto !important;
min-width: 500px;
min-height: 200px;
.ba-modal-title {
font-size: 20px;
font-weight: 500;
text-align: center;
}
.ba-form {
padding: 30px 0 10px;
}
.ba-modal-div {
width: 100%;
display: flex;
align-items: center;
justify-content: center;
padding-top: 5px;
min-height: 50px;
>div:first-child {
width: 215px;
text-align: end;
padding-right: 15px;
}
.react-datepicker__input-container {
display: flex;
justify-content: end;
input {
text-align: left;
width: $bid-audit-input-width;
height: 44px;
padding-left: 40px;
}
}
}
.date-picker-validation-container {
position: relative;
.fa-calendar {
position: absolute;
left: 15px;
top: 18px;
color: gray;
z-index: 1;
}
.fa-close {
position: absolute;
right: 10px;
top: 18px;
color: gray;
z-index: 1;
}
}
.bid-audit-modal-word-count,
.bid-audit-modal-number {
display: flex;
width: $bid-audit-input-width;
}
.bid-audit-modal-word-count {
justify-content: flex-end;
font-size: 14px;
margin-bottom: -16px;
}
.bid-audit-modal-description-text {
text-align: center;
height: 44px;
}
}
.bid-data-heading {
height: 75px;
display: flex;
justify-content: space-between;
background-color: $bg-blue-dark-1;
color: $color-white;
margin: 20px 30px 20px 20px;
border-radius: 5px;
padding-left: 5px;
padding-right: 5px;
span {
align-self: center;
}
}
.bid-data-shuffle {
text-decoration: none;
cursor: pointer;
}
.bid-data-shuffle:hover {
color: $blue-primary-light;
}
.bid-data-shuffle-disabled {
color: currentColor;
cursor: not-allowed;
opacity: 0.5;
text-decoration: none;
}
.bid-data--results {
padding: 0 35px 20px;
.bid-data-scroll-container {
overflow: auto;
height: 900px;
}
.bid-data-custom-table {
width: 100%;
border-collapse: collapse;
margin-top: 10px;
th {
color: $color-white;
background-color: $tertiary-cool-blue;
// Position sticky not supported on ie11
// Position sticky has partial support on browsers (Must target th; not thead)
position: -webkit-sticky;
position: sticky;
top: 0;
border: none;
&:nth-child(10) {
min-width: 130px;
}
}
tr {
height: 50px;
}
tbody {
td {
border: none;
border-bottom: 1px solid $bg-gray-dark-3;
}
}
.position-row {
// Position sticky not supported on ie11
// Position sticky has partial support on browsers (Must target th; not thead)
position: -webkit-sticky;
position: sticky;
top: 55px;
td {
font-weight: bold;
background-color: $bg-blue-dark-1;
color: $color-white;
&:nth-child(4) {
min-width: 250px;
}
}
}
}
}
.ba-data-htf {
cursor: pointer;
text-decoration: none;
}
.ba-data-htf:hover {
color: $blue-primary-light;
}
.ba-htf-help-text {
text-align: center;
padding: 20px 0;
margin-top: 20px 0;
border-top: 1px solid gray;
border-bottom: 1px solid gray;
}
.ba-data-form--actions {
margin-top: 20px;
display: flex;
justify-content: flex-end;
}
.ba-table-tab {
padding: 10px 20px;
font-weight: bold;
}
.ba-table-tab-active {
border-bottom: 3px solid $primary-blue;
color: $primary-blue;
}
.ba-navTabs {
display: flex;
border-bottom: 2px solid $bg-gray-dark-3;
.ba-tab {
padding-left: 0px;
padding-right: 0px;
}
>div:not(:last-child) {
margin-right: 15px;
}
}
.ba-mds-table {
width: 100%;
border-collapse: collapse;
margin-top: 10px;
th {
color: $color-white;
background-color: $tertiary-cool-blue;
border: none;
padding: 8px;
height: 50px;
text-align: left;
font-weight: bold;
// Position sticky not supported on ie11
// Position sticky has partial support on browsers (Must target th; not thead)
position: -webkit-sticky;
position: sticky;
top: 0;
}
td {
border: none;
border-bottom: 1px solid $bg-gray-dark-3;
padding: 8px;
text-align: left;
vertical-align: top;
}
}