@import "../../../../global.less";

@dropdown-max-width: 350px;
@image-width: 451px;
@image-height: 153px;

.select2-highlighted .pull-request-list-filter {
    color: @invertedBodyTextColor;
}

.pull-request-list-filter {
    color: @bodyTextColor;

    &.avatar-with-name > .aui-avatar {
        vertical-align: text-bottom;
    }

    > .aui-icon {
        color: @aui-iconfont-secondary-color;
    }

    .name {
        margin-left: @halfSpacing;
    }

    .select2-highlighted & > .aui-icon {
        color: @invertedBodyTextColor;
    }
}

.pr-author-dropdown,
.pr-target-branch-dropdown {
    box-sizing: border-box;
    max-width: @dropdown-max-width; // max-width needed to prevent dropdown from getting wider when scrollbars appear
    width: @dropdown-max-width;
}

.pr-author-dropdown {
    .avatar-with-name > .aui-avatar {
        vertical-align: middle;
    }

    .pull-request-list-filter {
        display: inline-block;
    }

    .email-address {
        color: @secondaryTextColor;
        font-size: @font-size-small;
        margin-left: @baseSpacing;
    }

    .select2-highlighted .email-address {
        color: @invertedBodyTextColor;
    }
}

.pr-target-branch-dropdown {
    .select2-result-label {
        white-space: normal; // we want long branch names to wrap instead of getting truncated
    }

    .pull-request-list-filter {
        > .aui-icon {
            margin-top: 2px;
            position: absolute;
        }

        .name {
            display: inline-block;
            margin-left: 0;
            padding-left: @aui-icon-size-small + @halfSpacing;
        }
    }
}

.pull-request-intro {
    text-align: center;

    .intro-buttons {
        display: inline-block;
        margin-bottom: @tripleSpacing;
        position: relative;

        .help-button {
            left: 100%;
            margin-left: @baseSpacing;
            position: absolute;
            white-space: nowrap;
        }
    }

    .intro-image {
        background-image: url(images/pr-intro.svg);
        background-position: center center;
        background-repeat: no-repeat;
        background-size: @image-width @image-height;
        height: @image-height;
        margin: (5 * @baseSpacing) 0 @quadSpacing;
    }

    .intro-text {
        margin-bottom: @doubleSpacing + 3px;

        p {
            color: @adg-color-medium-gray;
        }
    }
}

.pull-request-list > .empty-banner-content {
    color: @placeholderTextColor;
    margin: @tripleSpacing 0 0;
    text-align: center;
}