Static website for reading / listening to The Noble Quran
0x1eef
11bd1105fb
When changing between languages, the transition between pages can cause UI glitches, where text could change font for a brief second. The fix makes the main content invisible by default, and applies the 'invisible' class just before switching languages. After the main content has rendered, the 'invisible' class is removed. These changes effectively remove the UI glitches that were present when switching languages. |
||
---|---|---|
.bundle | ||
.github | ||
.husky | ||
nanoc | ||
packages | ||
src | ||
tasks | ||
.babelrc | ||
.editorconfig | ||
.env.sample | ||
.eslintrc.js | ||
.gitignore | ||
.gitmodules | ||
.prettierignore | ||
.prettierrc | ||
.projectile | ||
.rubocop.yml | ||
Gemfile | ||
Gemfile.lock | ||
LICENSE | ||
nanoc.yaml | ||
package-lock.json | ||
package.json | ||
Rakefile.rb | ||
README.md | ||
Rules | ||
tsconfig.json | ||
VERSION | ||
webpack.config.js |
About
This repository contains the source code of al-quran.reflectslight.io, a static website for reading The Quran. After the website is built, the build directory consists of HTML, CSS, JavaScript and other static assets that can be hosted by a regular web server (eg nginx, apache, etc).
Stack
The following languages and tools have to be installed before the website can be built:
- Ruby 3.1, or later.
- NodeJS v18.15, or later.
- tidy-html5
There is a good chance there's a package available for tidy-html5 on your operating system of choice.
Local development
1. Clone
git clone https://github.com/ReflectsLight/al-quran.git
cd al-quran
2. Install Ruby, NodeJS packages
bundle install
npm i
3. Build website
# Build once
rake build
# Build whenever a change is detected
rake build:watch
4. Start server on localhost
rake server
Thanks
First and foremost, Alhamdulillah.
-
Thanks to the following graphic artists:
-
Thanks to the following translators:
- English (The Clear Quran) by Dr. Mustafa Khattab