/*
 * Wiki resource styles.
 */

// Import plugin vars
@import "../variables";
@import "../mixins";


// -
// Summary
// ---

.wiki-contents {
    display: inline-block;
    /*border: 1px solid #ccc;*/
    width: 50%;

    background: $gray-lighter;
    border-radius: 4px;
    margin-top: $component-margin-bottom;

    @media (max-width: map-get($grid-breakpoints, 'sm')) {
        width: 100%;
    }
}

.wiki-contents-title {
    display: flex;
    justify-content: space-between;
    align-items: center;

    margin: 0;
    padding: 10px $card-spacer-x;

    + .wiki-contents-items {
        border-top: 1px solid #ddd;
        padding-top: 10px;
        padding-bottom: 10px;
    }
}

.wiki-contents-items {
    list-style-type: none;
    margin: 0;
    padding: 0;
}

.wiki-contents-item {
    display: block;

    .btn-link {
        display: block;
        text-align: left;
        padding: 4px $card-spacer-x;
        white-space: normal;
    }

    .numbering {
        font-weight: bold;
        color: $heading-numbering-bg; // find better. This may be an inaccessible color
        margin-right: 5px;

        &:after {
            content: $heading-numbering-separator;
        }
    }

    // add indent
    .wiki-contents-items {
        margin-left: 15px;
    }
}


// -
// Sections
// ---

.wiki-section {
    margin-bottom: $component-margin-bottom;
    &.wiki-section-invisible {
        .wiki-section-title {
            background-color: $state-danger-bg;
        }
    }
}

.wiki-section-title {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: left;

    border-bottom: 1px solid $heading-numbering-bg;
}

.wiki-section-actions {
    margin-left: auto; // stack to the right
}

/* End: Wiki overview section */

/* Wiki section form */
.wiki-section-form {
    .wiki-section-form-buttons {
        .btn {
            margin-left: 20px;
        }
    }
}
/* End: Wiki overview section */

/* Revision comparison */
.wiki-version-compare {
    .diff-html-changed, .diff-html-added, .diff-html-removed {
        padding: 2px;
        margin: 2px;
        display: inline-block;
    }

    .diff-html-changed {
        background-color: $state-warning-bg;
        border: 1px solid $state-warning-border;
    }

    .diff-html-added {
        background-color: $state-success-bg;
        border: 1px solid $state-success-border;
        text-decoration: none;
    }
    .diff-html-removed {
        background-color: $state-danger-bg;
        border: 1px solid $state-danger-border;
    }

    .diff-html-simple {
        padding:0;
        margin: 0 5px -2px 0;
        display: inline-block;
        min-width: 15px;
        min-height: 15px;
        line-height: 15px;
        content: '\00a0'
    }
    .diff-html-legend {
        background-color: var(--#{$prefix}tertiary-bg);
        border: var(--#{$prefix}border-width) solid var(--#{$prefix}border-color);
        margin-top: 15px;
        padding: 10px;
    }
}
/* End: Revision comparison */
