mirror of
https://github.com/betagouv/mon-entreprise
synced 2025-02-09 00:35:00 +00:00
Remplacement de Montant par Value Rétablissement des explications simu salarié Possibilité de définir des objegtifs secondaires qui sont calculés mais pas affichés par targetSelectuon
117 lines
2.2 KiB
CSS
117 lines
2.2 KiB
CSS
.distribution-chart__item {
|
|
display: flex;
|
|
margin: 1.5em 0;
|
|
min-height: 3.5em;
|
|
padding: 0;
|
|
width: 100%;
|
|
border: none;
|
|
align-items: center;
|
|
|
|
position: relative;
|
|
}
|
|
.distribution-chart__bar-container {
|
|
display: flex;
|
|
align-items: center;
|
|
flex: 1;
|
|
}
|
|
|
|
.distribution-chart__bar {
|
|
border-radius: 0.4em;
|
|
min-height: 1.5em;
|
|
}
|
|
|
|
.distribution-chart__item-content {
|
|
flex: 1;
|
|
}
|
|
|
|
.distribution-chart__counterparts {
|
|
width: 28em;
|
|
line-height: 1.2em;
|
|
}
|
|
|
|
@media screen and (max-width: 600px) {
|
|
.distribution-chart__item {
|
|
flex-direction: column;
|
|
align-items: stretch;
|
|
}
|
|
.distribution-chart__legend {
|
|
align-items: center !important;
|
|
justify-content: flex-start !important;
|
|
position: initial !important;
|
|
flex-direction: column !important;
|
|
padding-right: 0 !important;
|
|
width: auto !important;
|
|
height: initial !important;
|
|
}
|
|
.distribution-chart__counterparts {
|
|
display: flex;
|
|
flex-direction: column;
|
|
margin: auto;
|
|
width: auto;
|
|
margin-bottom: 1rem;
|
|
text-align: center;
|
|
align-items: center;
|
|
}
|
|
.distribution-chart__bar {
|
|
/* Enable printing of background color */
|
|
min-height: 1.5em !important;
|
|
}
|
|
|
|
.distribution-chart__branche-name {
|
|
font-size: inherit !important;
|
|
}
|
|
}
|
|
@media print {
|
|
.distribution-chart__bar {
|
|
box-shadow: inset 0 0 0 1000px var(--colour);
|
|
}
|
|
}
|
|
|
|
.distribution-chart__legend {
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
color: rgba(0, 0, 0, 0.7);
|
|
padding: 0.4em 0;
|
|
padding-right: 1em;
|
|
justify-content: space-evenly;
|
|
width: 6em;
|
|
flex-grow: 0;
|
|
flex-shrink: 0;
|
|
}
|
|
|
|
.distribution-chart__icon {
|
|
font-size: 200%;
|
|
height: 1.2em;
|
|
}
|
|
|
|
.distribution-chart__total {
|
|
border-top: 1px dotted rgba(0, 0, 0, 0.7);
|
|
color: black;
|
|
margin-top: 1em;
|
|
padding-top: 0.8em;
|
|
}
|
|
.distribution-chart__total {
|
|
display: grid;
|
|
grid-template-columns: 1fr auto auto;
|
|
grid-column-gap: 1em;
|
|
grid-row-gap: 0.4em;
|
|
align-items: flex-end;
|
|
text-align: right;
|
|
margin-bottom: 1em;
|
|
}
|
|
|
|
.distribution-chart__total-border {
|
|
grid-column: 2 / span 2;
|
|
border-top: solid 1px rgba(0, 0, 0, 0.7);
|
|
}
|
|
|
|
/* IE11 Special */
|
|
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
|
|
.distribution-chart__total > * {
|
|
margin: 8px;
|
|
}
|
|
.distribution-chart__total-border {
|
|
border: none;
|
|
}
|
|
}
|