diff --git a/demo/styles/demo.scss b/demo/styles/demo.scss index f386d9fac211e731daa3b03cd39796f67eae55ba..c89e954363c7a2d1c5dbaf96c480a94eb5578296 100644 --- a/demo/styles/demo.scss +++ b/demo/styles/demo.scss @@ -1,14 +1,6 @@ @import "./base"; @import "../../src/sholo"; -$container-width: 500px !default; -$logo-font-size: 55px !default; -$button-font-size: 13px !default; -$dark-button-bg: #2d2d2d !default; -$dark-button-text: #ffffff !default; -$light-button-bg: #f5f5f5 !default; -$light-button-text: #2d2d2d !default; - img.emoji { height: 1em; width: 1em; @@ -66,7 +58,7 @@ section { padding: 10px; h1 { - font-size: $logo-font-size; + font-size: 55px; .emoji { font-size: 45px; diff --git a/index.html b/index.html index d901eab5967d7843a6a600cfeb405f6f7204e383..3416869d325e122a98c34d9e2d321433c96000e4 100644 --- a/index.html +++ b/index.html @@ -277,11 +277,37 @@ const lastActiveElement = driver.getLastHighlightedElement(); activeElement.getScreenCoordinates(); // Gets screen co-ordinates of the active element activeElement.hidePopover(); // Hide the popover activeElement.showPopover(); // Show the popover + +activeElement.getNode(); // Gets the DOM Element behind this element +

You can use a variety of options to achieve whatever you may want. I have some plans on improving it further, make sure to keep an eye on the github page

+
+
+

Contributing

+

You can find the contribution instructions on the github page. Feel free to submit an issue, create a pull request or spread the word

+
+
+
+

A product by Kamran produced out of boredom and frustration in cold Berlin after he gave up on trying to find a perfect solution to integrate journey introduction and overlays.

+ Follow @kamranahmedse + + Follow +
+ + diff --git a/src/core/element.js b/src/core/element.js index 6689635e6b216318915287965353b6eb65b3b399..b8a9c7b657fde464b7208723a467d4b88e2937aa 100644 --- a/src/core/element.js +++ b/src/core/element.js @@ -173,6 +173,14 @@ export default class Element { } } + /** + * Gets the DOM Element behind this element + * @returns {Node|HTMLElement|*} + */ + getNode() { + return this.node; + } + hidePopover() { if (!this.popover) { return;