Cannot get Demo to run

[mccare]

Describe the bug
The simple slider demo just displays boxes, no slides

To Reproduce
vue-cli 3.3.0

vue create slider
cd slider
npm install hooper
edit HelloWorld.vue and replace most of the template with

   <hooper>
      <slide>
        1
      </slide>
     <slide>
        2
      </slide>
     <slide>
        3
      </slide>
     <slide>
        4
      </slide>
    </hooper>

(and add the import and component stuff for Hooper and Slide)

Expected behavior
I would expect to see one "slide" with one number and that I could then scroll through the rest of the slides.

Screenshots

Desktop (please complete the following information):

• OS: macOS 10.14.2
• Browser Chrome
• Version 71

Additional context
I've tried the demo, too, but same behaviour. Don't know what I'm missing...

[ismail9k]

For your problem, I think you need to include the stylesheet file (hoopoe.css), and everything will work just fine.

[mccare]

Yes, got it! I've created a very small PR to fix this in the docs.
Btw, the standard vue-cli template will have

li { margin: 0 10px }

in the style section (for the HelloWorld.vue). This then produces a slider that 'moves to the right' on each slide since the elements on the left still have some space (the margin namely) and hooper uses the li element for slider. Maybe clear the li elements in hooper.css of formatting so no side effects of existing formating will be there?