Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Unable to apply nebular styles to any component

See original GitHub issue

Issue type

I’m submitting a …

[ X] bug report
feature request

Issue description

Current behavior: I have an existing project in which I want to add nebular components.

I have successfully added a stepper, but none of the Nebular styles are applied to any element of the stepper (including buttons).

I have followed the instructions on how to integrate the styles, but it is not working as expected. The bootstrap styles do work as expected.

I’ve also tried to manually add the bundled css file to index.html, but it does not work anyways.

Finally, I’ve also started from scratch with the ngx-admin starter app, and I’ve imported all stylings from that project (where styling was working). Still Nebular components are not styled in the project in which I would like to integrate Nebular.

Expected behavior: Following the step-by-step guide on how to integrate Nebular should result in the styles properly applied.

Steps to reproduce:

Start a new project with ng new my-project. Add Bootstrap and NgBootstrap.
Import all bootstrap style as scss in a styles.scss file, and add such styles.scss file to angular.json.
Follow the step by step guide on how to integrate Nebular in an existing project.

I’ve added the stepper and the button, and none of the elements is properly styled.

Other information:

See the stackblitz example.

Angular, Nebular

v. 2.0.0-rc.10

Issue Analytics

State:
Created 5 years ago
Comments:10

Top GitHub Comments

7reactions

ghostcommented, Jul 19, 2019

Hi there! I was following your guide to add the nebular theme to my project and create a page! I installed nebular using the angular CLI as suggested in this doc -> https://akveo.github.io/nebular/docs/guides/install-nebular#using-angular-cli and I successfully created the page while following this doc -> https://akveo.github.io/nebular/docs/guides/create-nebular-page#create-nebular-page.

While the page got created the styles were not applied to the text as shown in the docs! Could you please point me in the right direction if i have to install the styles seperately? Thanks in advance!

4reactions

nnixaacommented, Sep 14, 2018

Hi @ilDon, have you followed the documentation here https://akveo.github.io/nebular/docs/guides/add-into-existing-project#create-a-page? The NbLayoutComponent is a required one for styles to apply.

Top Results From Across the Web

Angular Nebular styles does not apply for NbChatComponent

Functionality is working as expected, but the styles are not applied to the component. Below are the steps I followed. npm install --save...

Enable Customizable Theme - Nebular

Enable Customizable Themes. Nebular styles come as a css file by default. In order to be able to customize theme variables, scss files...

Install Nebular - GitHub Pages

Please note, this tutorial explains how to install Nebular modules into your project. If you want to re-use any of ngx-admin custom components...

Nebular - 3.5.0-4.0.0 Migration - GitHub Pages

4. Migrate Theme ... This step depends on your setup. In case when you use a CSS version of styles from prebuilt/THEME_NAME.css -...

Enable Multiple Runtime Themes - Nebular

Assuming you already have the themes.scss file with the default theme enabled, let's add a second theme: @forward '@nebular/theme/styles/theming'; ...