Hey @mattfox,

Yes, you can add custom login page. Probably, you will need to create a custom AngularJS component, depending on how much you want to customize it. Here is an example:

HTML

<div class="login-container" flex="100" layout="row" layout-wrap>

    <div flex="100" flex-gt-sm="50">
        <img class="rc-login-img" src="/rest/v2/file-stores/public/img/school-login.jpg" alt="Login">
    </div>
    
    <div flex="100" flex-gt-sm="50" layout="row" layout-wrap layout-align="center center" md-colors="::{background: 'blue-800'}">
        <div flex="100" layout="row" layout-wrap layout-align="center center">
            <img class="mt-10" src="../../resources/svg/logo.svg" alt="Logo" height="70">
        </div>

        <div flex="100" class="mt-10" layout="row" layout-wrap layout-align="center center">
            <md-card flex="100" flex-gt-sm="60" flex-gt-md="50">
                <md-card-title>
                    <md-card-title-text>
                        <span class="md-headline">Login</span>
                    </md-card-title-text>
                </md-card-title>
                <md-card-content layout="column">
                    <ma-login on-success="$ctrl.onSuccess($user, $state)">
                        <ma-logged-in class="already-logged-in" ng-if="$ctrl.User.current && $ctrl.User.current.username !== 'guest'">
                            <span ma-tr="login.aleadyLoggedIn" ma-tr-args="[$ctrl.User.current.username]"></span>
                            <a ui-sref="actions">Go to Action Submission</a>
                        </ma-logged-in>

                        <a ui-sref="customRegister" tabindex="5" ma-tr="login.emailVerification.registerUser"></a>
                        <a ui-sref="forgotPassword({username: username})" tabindex="4" ma-tr="login.forgotYourPassword"></a>
                    </ma-login>
                </md-card-content>
            </md-card>
        </div>
    </div>
</div>

Javascript

define(['angular', 'require'], function(angular, require) {
    'use strict';
    
customLogin.$inject = ['maUser', '$injector'];
function customLogin(maUser, $injector) {

    this.maUiLoginRedirector = $injector.has('maUiLoginRedirector') && $injector.get('maUiLoginRedirector');

    this.onSuccess = (user, state) => {
        if (state.params.redirectTo) {
            state.go(state.params.redirectTo, JSON.parse(state.params.withParams));
        } else {
            return this.maUiLoginRedirector.redirect(user);
        }
    };

}

return {
    bindings: {
    },
    controller: customLogin,
    templateUrl: require.toUrl('./login.html')
};

});

You need to create a custom route for this component in the User Module:

define([
    'angular',
    'require',
    './components/customLogin.js',
    ],
function(angular, require, customLogin) {
'use strict';

var dukeEnergyModule = angular.module('dukeEnergyModule', ['maUiApp'])
    .component('customLogin', customLogin)

dukeEnergyModule.config(['maUiMenuProvider', function(maUiMenuProvider) {
    maUiMenuProvider.registerMenuItems([
        {
            name: 'customLogin',
            url: '/user-login?redirectTo=&withParams=',
            template: '<custom-login></custom-login>',
            menuIcon: 'fa-certificate',
            menuText: 'Login',
            weight: 100,
            menuHidden: true,
            params: {
                noPadding: false,
                hideFooter: false,
            },
        }
    ])
}]);

Finally, you need to add this url in administration > System setting > UI module settings

If you need more details, I will be happy to help

Luis