Giter Club home page Giter Club logo

coreui-free-angular-admin-template's Issues

side menu items in RTL should stick to right

Hi.

Thank you for this great theme.

when I set dir="rtl"

image

this happens in sidemenu:

image

while it's ok in ltr mode:

image

the problems are

  • items must stick to right (right now they're overlapping arrow icon in items with submenu)
  • sidebar minimizer arrow should point and stick to other direction

How to convert angular cli to web pack

I created asp.net core 2.0 project with angular 4. Now i want to add core UI layout to that project. but in my project i does not have any angular CLI. only have the web pack. how i convert this?

Sidebar component for each page route

I was trying to get a sidebar template for each page route navigate on top navbar and each page is in it own module.
i'm been trying to get this feature for somedays and can't worked out the bugs yet.

overlapping dashboard content on side menubar

screenshot from 2017-10-29 17-29-42
hello,
i am facing one issue that is when i put my table or any large amount of data which has width too much it directly overlap that content on side menu bar means right side space it limited when when i put my data & make horizontal scroll it directly goes out of that div & content goes on left side menubar. check above screenshot

Not able to create shared component

Hi, I am not able to create a shared component which can be used in multiple views. Here is what I did

  1. Created a separate component inside components folder and added this component in index files and app.module
  2. I am trying to call that component from an HTML file which is inside a different module which is in views folder.

Here is the error I am receiving. Is that the right place to create a shared component? I did try creating a shared component inside views folder still no luck. Please suggest me where I am doing wrong. Thanks.

screen shot 2017-10-19 at 10 03 01 pm

Sidenav toggle issue

Hai,

Is there option to side nav toggle without closing all icons. If it should viewing icons as a side nav it could be better. please let me know regards this option.

[Angular 5] Error: Cannot find module '@angular-devkit/core'

Node.js: 8.9.4 x64
npm: 5.6.0

Repro steps:

  1. git clone https://github.com/mrholek/CoreUI-Angular.git
  2. cd CoreUI-Angular/Angular5_CLI_Starter
  3. npm install
  4. npm start

Result:

module.js:540
    throw err;
    ^

Error: Cannot find module '@angular-devkit/core'
    at Function.Module._resolveFilename (module.js:538:15)
    at Function.Module._load (module.js:468:25)
    at Module.require (module.js:587:17)
    at require (internal/module.js:11:18)
    at Object.<anonymous> (C:\Dev\CoreUI-Angular\Angular5_CLI_Starter\node_modules\@angular-devkit\schematics\src\tree\virtual.js:10:16)
    at Module._compile (module.js:643:30)
    at Object.Module._extensions..js (module.js:654:10)
    at Module.load (module.js:556:32)
    at tryModuleLoad (module.js:499:12)
    at Function.Module._load (module.js:491:3)

bug RTL version

Hi, when use RTL version template navbar It does not function well. responsive method when of change to tablet or mobilephone state It does not function like picture.
ip6

Horizontal bar chart is not working

A horizontal bar chart is not working. Cart.js supports horizontal bar chart but there is no support here. Is there need of including something or its issue with the code. Please help

Great project - but missing information

After having used many Bootstrap templates, CoreUI-Angular is a refreshing change - because you have all the components in the framework of your choice (Angular in mine).

However, there seems to be some disparity and missing information. The disparity is between what is on the demo site - http://coreui.io/demo/Angular2_Demo/ - and the source code available in this repository.

Is the complete set of information available in the PRO version of CoreUI?

How to use bootstrap alerts?

Your current documentation shows how to use bootstrap alerts with Jquery only. How can they be used in Angular2+?

modal popup backdrop issue

hello,
i am facing one issue that is when i login for first time & generate modal popup dynamically, modal popup executes properly but when i click i on button to close modal popup modal closes but background remains transparent and i cant perform any operation ,means i am facing backdrop issue. when i inspect element & check "" this remains as it is. this doesn't remove from DOM on close button. but when i refresh the page all working fine & this line "" is also remove from DOM.

errorbackdrop

following is the code & screenshot

<div bsModal #moduleStatusModal="bs-modal" class="modal fade" [config]="{backdrop: 'static'}" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
       <div class="modal-dialog modal-success" role="document">
           <div class="modal-content">
               <div class="modal-header">
                   <i class="fa fa-check-circle-o fa-3x" aria-hidden="true"></i>
                   <h5 class="modal-title">heading goes here</h5>
                   <span> </span>
               </div>
               <div class="modal-body text-center">
                   <div class="finish-info text-center">
                      content goes here
                   </div>
                   <div>
                       content goes here
                   <hr>
                   <button class="btn btn-primary text-center" (click)="moduleComplete()">{{'Stepper.Next' | translate}}</button>
               </div>
           </div>
       </div>

ts file code

moduleComplete() { this.moduleStatusModal.hide(); }

Cannot find module 'copy-webpack-plugin Error

After runing "npm install" and "ng serve" for Angular4_CLI_Full_Project I'm getting:

Cannot find module 'copy-webpack-plugin Error

and can not find any solution to it (I have no problem starting Angular4_CLI_Starter-maybe worth to mention)

Table columns sizing is not working with col-*

I have a table like this:

<table class="table table-bordered table-striped">
            <thead>
              <tr>
                <th class="col-5">Name</th>
                <th class="col-3">Login</th>
                <th class="col-3">Role</th>
                <th class="col-1"></th>
              </tr>
            </thead>
            <tbody>
             <tr>
                <td>Juliano</td>
                <td>juliano</td>
                <td>Supervisor</td>
                <td>
                  <a class="float-right holder-icon-link" href="null"><i class="fa fa-trash fa-lg"></i></a>
                  <a class="float-right holder-icon-link" ng-reflect-router-link="/users/edit,4" href="#/users/edit/4"><i class="fa fa-pencil fa-lg"></i></a></td>
              </tr>

            </tbody>
          </table>

However the columns are not respecting the sizes I've set on each <th></th>. The first column is taking almost all of the available space and the others are using just the space necessary for its content. Why?

sidebar-compact doesn't work with sidebar-minimized

Dear Team,
Really your theme is awesome, and it help me a lot to understand Angular 2+

I found an issue, when applying "sidebar-compact" on body then try to minimize the sidebar menu by pressing the button at the bottom to minimize it, I got the issue as show in the attached image

thank you for your great theme
sidebar-compact

Error: Cannot find module '@angular-devkit/core'

Node -v = v8.9.4
npm -v = 4.3.0

Error:
module.js:540
throw err;
^

Error: Cannot find module '@angular-devkit/core'
at Function.Module._resolveFilename (module.js:538:15)
at Function.Module._load (module.js:468:25)
at Module.require (module.js:587:17)
at require (internal/module.js:11:18)
at Object. (C:\wamp\www\ngApi\node_modules@angular-devkit\schematics\src\tree\virtual.js:10:16)
at Module._compile (module.js:643:30)
at Object.Module._extensions..js (module.js:654:10)
at Module.load (module.js:556:32)
at tryModuleLoad (module.js:499:12)
at Function.Module._load (module.js:491:3)

Activated Route gives net::ERR_ABORTED

When I try to load page pagename with id parameter like pagename/1 (pagename/:id route), it shows net::ERR_ABORTED error, not being able to load css and js resources of the template.

image

We know that resources are stored in localhost:4200/assets directory, not in localhost:4200/pagename/assets.

full screen code is not working properly

hello,
i am embedding screenfull.js in this plugin to make image full-screen. but i am facing one issue that is that when i click on the image it take only the size of right side area. means, it restrict somewhere the left sidebar & top bar is fixed so my full-screen div not go in fullscreen mode
![Uploading Screenshot from 2017-11-22 18-20-32.png…](this is what getting the output)
![Uploading Screenshot from 2017-11-22 18-21-21.png…](expected output)

Question about moving children out of elements and remark about non ES6 syntax

image

Now we have this in all app components.

My question, is there a reason behind moving children out of the element and then removing that element? This seems detrimental to the initial performance (while the idea may have been to make a dom tree more shallow for future performance, correct me if I'm wrong)


Also, linter immediately complains about these things (these are just some remarks, I'm not complaining):

  • If you are using ngOnInit() in the component, the class must implement OnInit interface
  • All component class names must be suffixed with Component
  • If variables are not reassigned, you should use const instead of var (actually, you should never use var nowadays)

So, I fixed up the class and ended up with this:
image

Dropdown doesn't work

I've cloned the latest sources for Angular4_CLI_Starter and tried to add Single button dropdown example from the documentation to the dashboard.component.html . It doesn't work - dropdown button appears but if you click it, nothing happens.

BTW it shows the dropdown if I add show class to dropdownMenuButton in the Chrome inspect mode.

Please help.

Seems modules are not loading.

I have a problem,
if I try to do something like {{mycontent | json}} I get an error:

Template parse errors:
The pipe 'json' could not be found

If I try to do a reactive form I get:

Error: Template parse errors:
Can't bind to 'formControl' since it isn't a known property of 'input'.

I do import the modules on the same page:
import { NgModule, Component, Pipe, OnInit } from "@angular/core";
import { FormGroup, FormControl, FormsModule } from "@angular/forms";
import { BrowserModule } from "@angular/platform-browser";

@NgModule({
imports: [CommonModule, FormsModule, BrowserModule]
})

Seems to me the modules loading does not work, or I don't understand how.
If I get an angular seed project it works out of the box.

Thanks in advance,
Rares

Collapse elements do not work

There are two problems regarding Collapse elements (http://coreui.io/docs/components/collapse/):

  1. Anchor tag is routing to another page called #collapseOne due to href attribute:
    <a data-toggle="collapse" href="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
  2. JavaScript function provided in the docs ($('.collapse').collapse()) does not work. Instead, it gives an error like that:
    Property 'collapse' does not exist on type 'JQuery<HTMLElement>'.

How does CoreUI compare to GenesisUI

CoreUI and GenesisUI both seem like the same framework (which you work on). Can you explain the differences and why you would choose one over the other.

No interaction possible after opening a modal

It is no longer possible to click anything on the page once a modal is opened. You can only dismiss it by pressing Escape. This seems to be the case with all current versions of CoreUI, not just Angular. Even the documentation page for modals has this problem. Click the "Launch demo modal" button on the above page and try to click anything.

The issue is with this recent addition to the theme's core/_temp.scss:

.modal-open .modal {
  display: block;
}

Not sure why this was even added, but this causes all modals defined on the page to have display: block; when any one modal is open. This means only the last modal defined on the page would be interactive.

Temporary workaround - add the following to your _custom.css:

// Fix for error in CoreUI
.modal-open {
  .modal {
    display: none !important;
  }
  .modal.show {
    display: block !important;
  }
}

collapse other section when one is extended

hello i am using your Admin Template & it's a great template. but i am facing one problem while customising your template. you have provided slide bar, where list menu's present. i want to make that menu collapsible means when i click on a menu that menu should open but other opened menu should close or collapse.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.