Fix Provider examples

- Update provider example to be simpler

docs/advanced.md

@@ -50,31 +50,20 @@ which can be used to show custom page numbers or add other elements to the UI.
 The example below will display the current slide out of the total amount of slides.
 
 ```js
-import React, { useEffect, useRef, useState } from 'react'
+import React from 'react'
 import { css } from '@emotion/core'
 
 function AtTheBottomCenter ({ children }) {
-  const ref = useRef();
-  const [left, setLeft] = useState(0)
-
-  useEffect(function WindowSize () {
-    const bodyWidth = document.body.clientWidth
-    const width = ref.current.clientWidth
-
-    setLeft((bodyWidth / 2) - (width / 2))
-  })
-
-  const css = css`
-    position: absolute;
-    bottom: 0;
+  const css = {
+    position: 'absolute',
+    left: 0,
+    right: 0,
+    bottom: 0,
     color: #ffffff;
-  `
+    textAlign: 'center',
+  }
 
-  return <div
-    ref={ref}
-    css={ css }
-    style={{ left }}
-    >
+  return <div css={ css }>
     { children }
   </div>
 }