Short-List der Nachhaltigkeitsaspekte

.short-list {
    font-family: 'Roboto Condensed', sans-serif;
    font-weight: 400;
    font-size: $font-size-lg;
    width: 100%;

    caption {
        padding-top: $spacer * 1.5;
        text-align: right;

        .color-legend + .color-legend {
            margin-left: $spacer * 3;
        }
    }

    th,
    td {
        border-left: 1px solid $primary;
        border-right: 1px solid $primary;
        font-weight: 500;
        line-height: 1.2;
        padding: ($spacer * .75) $spacer;
        text-align: center;
        word-break: keep-all;

        &:first-child {
            border-left: none;
            text-align: left;
            width: 99%;
        }

        &:last-child {
            border-right: none;
        }
    }

    thead {
        background-color: $gray-100;
        border-bottom: 1px solid $primary;

        th:first-child {
            text-align: left;
        }
    }

    &__primary-scope th {
        color: $primary;
        font-weight: 500;
    }

    &__secondary-scope th {
        color: $form-label-color;
        font-family: $font-family-base;
        font-size: $form-label-font-size;
        font-weight: normal;
    }

    tbody {

        tr {
            border-bottom: 1px solid $primary;
        }

        th {
            font-weight: 500 !important;
            text-align-last: left;
        }
    }
}

Varianten

Standard

Nachhaltigkeitsaspekt Auswirkungs-Wesentlichkeit Finanzielle Wesentlichkeit Stakeholder Bedeutung
  Wesentlichkeit Score Schwellenwert Wesentlichkeit Score Schwellenwert  
Klimawandel Wesentlich 4,67 2,50 Wesentlich 4,04 2,50 5
Energie Wesentlich 4,67 2,50 Wesentlich 4,50 2,50 5
Mitarbeiterentwicklung Wesentlich 3,67 2,50 Wesentlich 3,20 2,50 2
Arbeitssicherheit & Gesundheit Wesentlich 4,33 2,50 Unwesentlich 1,20 2,50 4
Menschenrechte Wesentlich 4,00 2,50 Wesentlich 4,67 3,22 3
Datenverantwortung Wesentlich 3,40 2,50 Unwesentlich 2,40 2,50 4
Recycling & Kreislaufwirtschaft Wesentlich 3,20 2,50 Wesentlich 2,80 2,50 3
<div class="table-responsive">
    <table class="short-list">
        <thead>
            <tr class="short-list__primary-scope">
                <th scope="col">Nachhaltigkeitsaspekt</th>
                <th scope="col" colspan="3">Auswirkungs-Wesentlichkeit</th>
                <th scope="col" colspan="3">Finanzielle Wesentlichkeit</th>
                <th scope="col">Stakeholder Bedeutung</th>
            </tr>
            <tr class="short-list__secondary-scope">
                <th scope="col">&nbsp;</th>
                <th scope="col">Wesentlichkeit</th>
                <th scope="col">Score</th>
                <th scope="col">Schwellenwert</th>
                <th scope="col">Wesentlichkeit</th>
                <th scope="col">Score</th>
                <th scope="col">Schwellenwert</th>
                <th scope="col">&nbsp;</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <th scope="row">Klimawandel</th>
                <td>
                    Wesentlich
                </td>
                <td>4,67</td>
                <td>2,50</td>
                <td>
                    Wesentlich
                </td>
                <td>4,04</td>
                <td>2,50</td>
                <td>5</td>
            </tr>
            <tr>
                <th scope="row">Energie</th>
                <td>
                    Wesentlich
                </td>
                <td>4,67</td>
                <td>2,50</td>
                <td>
                    Wesentlich
                </td>
                <td>4,50</td>
                <td>2,50</td>
                <td>5</td>
            </tr>
            <tr>
                <th scope="row">Mitarbeiterentwicklung</th>
                <td>
                    Wesentlich
                </td>
                <td>3,67</td>
                <td>2,50</td>
                <td>
                    Wesentlich
                </td>
                <td>3,20</td>
                <td>2,50</td>
                <td>2</td>
            </tr>
            <tr>
                <th scope="row">Arbeitssicherheit &amp; Gesundheit</th>
                <td>
                    Wesentlich
                </td>
                <td>4,33</td>
                <td>2,50</td>
                <td>
                    Unwesentlich
                </td>
                <td>1,20</td>
                <td>2,50</td>
                <td>4</td>
            </tr>
            <tr>
                <th scope="row">Menschenrechte</th>
                <td>
                    Wesentlich
                </td>
                <td>4,00</td>
                <td>2,50</td>
                <td>
                    Wesentlich
                </td>
                <td>4,67</td>
                <td>3,22</td>
                <td>3</td>
            </tr>
            <tr>
                <th scope="row">Datenverantwortung</th>
                <td>
                    Wesentlich
                </td>
                <td>3,40</td>
                <td>2,50</td>
                <td>
                    Unwesentlich
                </td>
                <td>2,40</td>
                <td>2,50</td>
                <td>4</td>
            </tr>
            <tr>
                <th scope="row">Recycling &amp; Kreislaufwirtschaft</th>
                <td>
                    Wesentlich
                </td>
                <td>3,20</td>
                <td>2,50</td>
                <td>
                    Wesentlich
                </td>
                <td>2,80</td>
                <td>2,50</td>
                <td>3</td>
            </tr>
        </tbody>
    </table>
</div>

Varianten