
Product
Introducing Module Reachability: Focus on the Vulnerabilities That Matter
Module Reachability filters out unreachable CVEs so you can focus on vulnerabilities that actually matter to your application.
angular-material-rail-drawer
Advanced tools
**Package Name:** [angular-material-rail-drawer](https://npmjs.com/package/angular-material-rail-drawer)
Package Name: angular-material-rail-drawer
I personally dislike the new syntax introduced in Angular V17. I believe the direction Angular is taking with this version is not in the best interest of the framework. As a result, I have decided not to continue supporting or maintaining this package.
Angular Material Navigation drawer — Adding support mode = “Rail” (mini variant behaviour)
Since 2016, the Angular community has been shouting out of a mini variant for material design.
NPM:
npm i angular-material-rail-drawer
Yarn:
yarn add angular-material-rail-drawer
Read example for more information
module.ts
import { DrawerRailModule } from 'angular-material-rail-drawer';
component.html
<mat-sidenav mode="rail" opened="true">
If "strictTemplates": true
is activated in tsconfig.json, overwriting mode is not possible. In this case you can use the following selector:
component.html
<mat-sidenav rail-mode opened="true">
This extension adds on an existing mode
the Material documentation remains the same.
On top of all the standard Drawer API from google https://material.angular.io/components/sidenav/api. I've added 4 extra API so you have more control over the animation and size.
Input | description | default |
---|---|---|
openAnimation | Angular Animation settings for opening | sidebarOpen(maxWidth) |
closeAnimation | Angular Animation settings for closing | sidebarClose(minWidth) |
closeWidth | min width (small view) | "60px" |
expandedWidth | max width for the expanded view | "200px" |
extra note the default animation time is set to 100ms
Notes: Angular material open state
Close === mini
& Opened === expanded
Angular material mini variant github issue: https://github.com/angular/components/issues/1728
FAQs
**Package Name:** [angular-material-rail-drawer](https://npmjs.com/package/angular-material-rail-drawer)
We found that angular-material-rail-drawer demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Product
Module Reachability filters out unreachable CVEs so you can focus on vulnerabilities that actually matter to your application.
Product
Socket is introducing a new way to organize repositories and apply repository-specific security policies.
Company News
Socket’s acquisition of Coana brings best-in-class reachability analysis to application security teams globally, cementing Socket’s position as the leader in software supply chain security.