I'm learning angular.
I'm using angle 6
I'm trying to make the LTE Admin login page
I imported these files into angular.json
"styles": [
"node_modules/admin-lte/bower_components/bootstrap/dist/css/bootstrap.min.css",
"node_modules/admin-lte/bower_components/font-awesome/css/font-awesome.min.css",
"node_modules/admin-lte/bower_components/Ionicons/css/ionicons.min.css",
"node_modules/admin-lte/bower_components/jvectormap/jquery-jvectormap.css",
"node_modules/admin-lte/dist/css/AdminLTE.min.css",
"node_modules/admin-lte/dist/css/skins/_all-skins.min.css",
"node_modules/admin-lte/plugins/iCheck/square/blue.css",
"src/styles.css"
],
"scripts": [
"node_modules/admin-lte/bower_components/jquery/dist/jquery.min.js",
"node_modules/admin-lte/bower_components/jquery-ui/jquery-ui.min.js",
"node_modules/bootstrap/dist/js/bootstrap.min.js",
"node_modules/admin-lte/dist/js/adminlte.min.js",
"node_modules/admin-lte/bower_components/fastclick/lib/fastclick.js",
"node_modules/admin-lte/bower_components/jquery-slimscroll/jquery.slimscroll.min.js",
"node_modules/admin-lte/plugins/iCheck/icheck.min.js"
]
But the gray area of the background is not working across the page and it seems that even the bootstrap is not working, whereas this same import works for the page in general, but I want to leave the login well formatted, just as it is in the original
This is my setup
Grayishalfwaydownthepage
Andthisistheoriginal
Allwellformatted
AndthisisthecodethatIenteredlogin.component.html
<body class="hold-transition login-page">
<div class="login-box">
<div class="login-logo">
<a href="../../index2.html"><b>Admin</b>LTE</a>
</div>
<!-- /.login-logo -->
<div class="login-box-body">
<p class="login-box-msg">Sign in to start your session</p>
<form action="../../index2.html" method="post">
<div class="form-group has-feedback">
<input type="email" class="form-control" placeholder="Email">
<span class="glyphicon glyphicon-envelope form-control-feedback"></span>
</div>
<div class="form-group has-feedback">
<input type="password" class="form-control" placeholder="Password">
<span class="glyphicon glyphicon-lock form-control-feedback"></span>
</div>
<div class="row">
<div class="col-xs-8">
<div class="checkbox icheck">
<label>
<input type="checkbox"> Remember Me
</label>
</div>
</div>
<!-- /.col -->
<div class="col-xs-4">
<button type="submit" class="btn btn-primary btn-block btn-flat">Sign In</button>
</div>
<!-- /.col -->
</div>
</form>
<div class="social-auth-links text-center">
<p>- OR -</p>
<a href="#" class="btn btn-block btn-social btn-facebook btn-flat"><i class="fa fa-facebook"></i> Sign in using
Facebook</a>
<a href="#" class="btn btn-block btn-social btn-google btn-flat"><i class="fa fa-google-plus"></i> Sign in using
Google+</a>
</div>
<!-- /.social-auth-links -->
<a href="#">I forgot my password</a><br>
<a href="register.html" class="text-center">Register a new membership</a>
</div>
<!-- /.login-box-body -->
</div>
<!-- /.login-box -->
</body>