@import '_vars';
@import '_mixins';

.title {
    & {
        @include hover-visible('.title-edit', inline);
        position: relative;
    }

    &-edit {
        color: $color-border-dark;
        cursor: pointer;
        padding: .6rem .25rem;
    }

    &-name {
        display: inline;
        font-size: 1.2rem;
        font-weight: normal;
    }

    &-view {
        @include truncate;
        border-bottom: 1px solid transparent;
        border-top: 0;
        padding: .375rem 0;
        position: absolute;
    }
}

h3 {
    &.fallback {
        color: $color-text-decent;
    }
}