Saurabh Kumar Suman
Saurabh Kumar Suman

Reputation: 121

Unable to get the ripple effects in lumX?

I have installed all components and am trying out the various components mentioned in the CSS section of docs (http://ui.lumapps.com/css/buttons)

but the button get the shadow on hover, but do not ripple when clicked.

Here is the code:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>lumx Trial</title>
    <!-- Head -->
    <link rel="stylesheet" href="bower_components/lumx/dist/lumx.css">
    <link rel="stylesheet" href="bower_components/mdi/materialdesignicons.css">
    <link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Roboto:300,400,500,700">
</head>
<body>

    <div class="mb">
        <button class="btn btn--xs btn--blue btn--raised" lx-ripple>Button</button>
        <button class="btn btn--s btn--blue btn--raised" lx-ripple>Button</button>
        <button class="btn btn--m btn--blue btn--raised" lx-ripple>Button</button>
        <button class="btn btn--l btn--blue btn--raised" lx-ripple>Button</button>
        <button class="btn btn--xl btn--blue btn--raised" lx-ripple>Button</button>
    </div>



    <!-- Before body closing tag -->
    <script src="bower_components/jquery/dist/jquery.js"></script>
    <script src="bower_components/velocity/velocity.js"></script>
    <script src="bower_components/moment/min/moment-with-locales.js"></script>
    <script src="bower_components/angular/angular.js"></script>
    <script src="bower_components/lumx/dist/lumx.js"></script>
</body>
</html>

Upvotes: 1

Views: 399

Answers (1)

Saurabh Kumar Suman
Saurabh Kumar Suman

Reputation: 121

Sorry, My bad. I hadn't added the angular module!

Upvotes: 1

Related Questions