I'm using Vue.js with vue-i18n to switch languages on my project without the need to refresh. However, when i want to switch between Arabic and anything else i need to change the website's design from (right to left) to (left to right) or vice versa.
It is currently made so that i would need a refresh to load my rtl.scss file:
This is the code that loads css on refresh:
let locale = VueCookie.get('locale') || 'en'
if (locale === 'ar') {
require('rtl.scss')
}
This is the code that makes the page refresh:
if (newLocale === 'ar' || oldLocale === 'ar') {
window.location.reload()
}