diff --git a/app/assets/stylesheets/pages/_home.scss b/app/assets/stylesheets/pages/_home.scss index a3fa38e..ba27993 100755 --- a/app/assets/stylesheets/pages/_home.scss +++ b/app/assets/stylesheets/pages/_home.scss @@ -31,3 +31,5 @@ video { display: flex; justify-content: space-between; } + + diff --git a/app/javascript/components/banner.js b/app/javascript/components/banner.js new file mode 100644 index 0000000..57535ed --- /dev/null +++ b/app/javascript/components/banner.js @@ -0,0 +1,13 @@ +import Typed from 'typed.js'; + +function loadDynamicBannerText() { + new Typed('#banner-typed-text', { + strings: ["Language is not a barrier anymore", "Stay connected"], + typeSpeed: 50, + loop: true + }); +} + +export { loadDynamicBannerText }; + + diff --git a/app/javascript/packs/application.js b/app/javascript/packs/application.js index d7551ce..3b0a613 100644 --- a/app/javascript/packs/application.js +++ b/app/javascript/packs/application.js @@ -2,6 +2,9 @@ import "bootstrap"; import { triggerModalEvent } from "../components/modal.js"; +import { loadDynamicBannerText } from '../components/banner'; +loadDynamicBannerText(); + triggerModalEvent(); const settingsPage = document.getElementById('settings-page'); diff --git a/app/views/pages/home.html.erb b/app/views/pages/home.html.erb index 97289e0..cefdfde 100644 --- a/app/views/pages/home.html.erb +++ b/app/views/pages/home.html.erb @@ -1,5 +1,8 @@