@ovh-ux/ng-ovh-responsive-page-switcher

It detects available width for displaying page in 2 distinct modes

Usage no npm install needed!

<script type="module">
  import ovhUxNgOvhResponsivePageSwitcher from 'https://cdn.skypack.dev/@ovh-ux/ng-ovh-responsive-page-switcher';
</script>

README

ng-ovh-responsive-page-switcher

It detects available width for displaying page in 2 distinct modes

npm version Downloads Dependencies Dev Dependencies Gitter

Install

yarn add @ovh-ux/ng-ovh-responsive-page-switcher

Usage

import angular from 'angular';
import ngOvhResponsivePageSwitcher from '@ovh-ux/ng-ovh-responsive-page-switcher';

angular.module('myApp', [ngOvhResponsivePageSwitcher]);

Directives responsive-switch and responsive-switch-page will be used. responsive-switch-page requires responsive-switch, so first we create this directive :

<div data-responsive-switch>
    <div data-responsive-switch-page class="responsive-switch-page-left"></div>
    <div data-responsive-switch-page class="responsive-switch-page-right"></div>
</div>

Test

yarn test

Related

ng-ovh-responsive-page-switcher module depends on different modules :

Note : ng-ovh-responsive-page-switcher is suitable with ng-ovh-responsive-popover.

Module Components

directive

Name Description
responsiveSwitch Create the container of the page to switch (animate) and manage the display
responsiveSwitchPage Create a page to display

Contributing

Always feel free to help out! Whether it's filing bugs and feature requests or working on some of the open issues, our contributing guide will help get you started.

License

BSD-3-Clause © OVH SAS