open-vault/ui/app/styles/components/modal.scss
claire bontempo 34630f6557
UI/Add CSV export, update history and current tabs (#13812)
* add timestamp to attribution

* create usage stat component

* updates stat text boxes

* remove flex-header css

* remove comment

* add empty state if no data

* update monthly serializer

* remove empty state - unnecessary

* change tab to 'history'

* add usage stats to history view

* change css styling for upcased grey subtitle

* correctly exports namespace and auth data

* close modal on download

* test making a service?

* fix monthly attrs

* update csv content format

* remove component and make downloadCsv a service

* update function name

* wip//add warning labels, fixing up current and history tabs

* wip//clean up serializer fix with real data

* fix link styling:

* add conditionals for no data, add warning for 1.9 counting changes

* naming comment

* fix tooltip formatting

* fix number format and consolidate actions

* remove outdated test

* add revokeObjectURL and rename variable

* fix errors and empty state views when no activity data at all

* fix end time error

* fix comment

* return truncating to serializer

* PR review cleanup

* return new object
2022-02-02 11:46:59 -08:00

93 lines
1.4 KiB
SCSS

.modal-background {
background: rgb(235, 238, 242, 0.9);
}
.modal-card {
box-shadow: $box-shadow-highest;
border: 1px solid $grey-light;
max-height: calc(100vh - 70px);
margin-top: 60px;
&-head {
border-radius: 0;
background-color: $grey-lightest;
border-bottom: 1px solid $grey-light;
}
&-foot {
border-radius: 0;
border: 0;
background-color: $white;
}
&-title.title {
margin: 0;
}
.copy-text {
background-color: $grey-lightest;
padding: $spacing-s;
margin-bottom: $spacing-s;
code {
overflow: scroll;
max-width: calc(100% - 36px);
background-color: inherit;
}
}
.copy-close {
margin-top: $spacing-s;
}
}
.modal-card-title.title {
display: flex;
align-items: center;
}
pre {
background-color: inherit;
}
.is-highlight {
.modal-card-head {
background: $yellow-010;
border: 1px solid $yellow-100;
}
.modal-card-title {
color: $yellow-dark;
}
}
.modal-confirm-section .is-help {
color: $grey;
margin: $spacing-xxs 0;
strong {
color: inherit;
}
}
.modal-confirm-section {
margin: $spacing-xl 0 $spacing-m;
}
.modal-card-foot-outlined {
background: #f7f8fa;
border-top: 1px solid #bac1cc;
}
.modal-radio-button {
display: flex;
align-items: baseline;
margin-bottom: $spacing-xs;
input {
top: 2px;
}
.helper-text {
margin-left: 10px;
}
}