akveo / nebular

:boom: Customizable Angular UI Library based on Eva Design System :new_moon_with_face::sparkles:Dark Mode
https://akveo.github.io/nebular
MIT License
8.04k stars 1.51k forks source link

customized login style #3252

Open suranan opened 2 months ago

suranan commented 2 months ago

Issue type

I'm submitting a ... (check one with "x")

Issue description

Current behavior:

I am customizing Login page by following document custom-auth-components (https://akveo.github.io/nebular/docs/auth/custom-auth-components#custom-auth-components, https://github.com/akveo/nebular/blob/master/src/playground/without-layout/smart-home/auth/login/login.component.html). but I facing issue

  1. If 'nb-alert' is an Angular component, then verify that it is part of this module.
  2. If 'nb-alert' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.

2 <nb-alert *ngIf="showMessages.error && errors?.length && !submitted" outline="danger" role="alert">

Expected behavior:

Steps to reproduce:

Related code:

insert short code snippets here

Other information:

npm, node, OS, Browser

<!--
Node, npm: `node --version` and `npm --version`
OS: Windows (7/8/10). Linux (incl. distribution). macOS (El Capitan? Sierra?)
Browser: Chrome/Safari/Firefox/etc?
-->

Angular, Nebular

<!--
Check your `package-lock.json` or locate a `package.json` in the `node_modules` folder.
-->
sebastianapw commented 2 months ago

@suranan Did you import the NbAlertModule into your Modules file? E.g. if you've created an auth module for your project you should have a file called auth.module.ts. In it you would need to import the required modules. Here is a shortened version of my auth.module.ts file

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { RouterModule } from '@angular/router';
import { NbAuthModule } from '@nebular/auth';
import {
  NbAlertModule,
} from '@nebular/theme';

@NgModule({
  declarations: [],
  imports: [
    CommonModule,
    FormsModule,
    ReactiveFormsModule,
    CommonModule,
    NbAlertModule, <-- add this to your modules.ts imports 
  ],
})
export class AuthModule {}

This should fix the error. Hope it helps.