+
+ );
}
diff --git a/src/js/renderShabad.js b/src/js/renderShabad.js
index 537cd9444..60e2753a1 100644
--- a/src/js/renderShabad.js
+++ b/src/js/renderShabad.js
@@ -1,20 +1,43 @@
-function renderShabad(gurbani) {
+function renderShabad(gurbani, nav) {
document.body.classList.remove("loading");
- $shabad.appendChild(h('div', { class: 'shabad-container' }, [ baani(gurbani), ]));
- $.each(prefs.displayOptions, function(index, option) {
- document.getElementById(option).click();
- });
- $.each(prefs.shabadToggles, function(index, option) {
- document.getElementById(option).click();
- });
+
+ let footnav = null;
+ if(typeof nav != "undefined") {
+ let link = navLink(nav);
+ let pagination = [];
+ if (typeof nav.previous != "undefined") {
+ pagination.push(
);
+ }
+
+ if (typeof nav.next != "undefined") {
+ pagination.push(
);
+ }
+ footnav = ;
+ }
+
+ $shabad.appendChild(
{[ Baani(gurbani), footnav, ]}
);
+
+ prefs
+ .displayOptions
+ .concat(prefs.shabadToggles)
+ .forEach(option => document.getElementById(option).click());
+
$controls.classList.remove('hidden');
}
-function metaData(data) {
+function navLink(nav, source) {
+ switch (nav.type) {
+ case 'shabad': return 'shabad?id=';
+ case 'ang': return `ang?source=${source}&ang=`;
+ }
+}
+
+function metaData(data, nav) {
let page_type_gurmukhi = data.source.id == 'G' ? 'AMg' : 'pMnw';
let page_type_english = data.source.id == 'G' ? 'Ang' : 'Pannaa';
let gurmukhi_meta = [];
let english_meta = [];
+
if (data.raag && data.raag.gurmukhi && data.raag.gurmukhi != "null") {
gurmukhi_meta.push(data.raag.gurmukhi);
english_meta.push(data.raag.english);
@@ -23,53 +46,121 @@ function metaData(data) {
gurmukhi_meta.push(data.writer.gurmukhi);
english_meta.push(data.writer.english);
}
+
gurmukhi_meta.push(data.source.gurmukhi);
english_meta.push(data.source.english);
- gurmukhi_meta.push('
' + page_type_gurmukhi + ' ' + data.source.pageno + '');
- english_meta.push('
' + page_type_english + ' ' + data.source.pageno + '');
+ gurmukhi_meta.push(
+ (
+
+ {`${page_type_gurmukhi} ${data.source.pageno}`}
+
+ ).outerHTML
+ );
+
+ english_meta.push(
+ (
+
+ {`${page_type_english} ${data.source.pageno}`}
+
+ ).outerHTML
+ );
+
+ if (typeof nav !== 'undefined') {
+ const link = navLink(nav, data.source.id);
+
+ if (typeof nav.previous !== 'undefined') {
+ $meta.appendChild(
);
+ }
+ }
+
+ $meta.appendChild(
+
{gurmukhi_meta.join(' - ')}
+ {english_meta.join(' - ')}
+ );
+
+ if (typeof nav !== 'undefined') {
+ const link = navLink(nav, data.source.id);
- $meta.appendChild(h('h4', { class: 'gurbani-font' }, gurmukhi_meta.join(' - ')));
- $meta.appendChild(h('h4', {}, english_meta.join(' - ')));
+ if (typeof nav.next !== 'undefined') {
+ $meta.appendChild(
);
+ }
+ }
$meta.classList.remove('hidden');
}
-function baani(gurbani) {
- return h('div', { class: 'shabad-content' } , gurbani.map(({ shabad }) => h('div', { id: 'line-' + shabad.id, class: 'line' }, [
- h('p', { class: 'gurmukhi gurbani-display gurbani-font' }, [
- h('div', { class: 'gurlipi' }, prepareLarivaar(shabad.gurbani.gurmukhi)),
- h('div', { class: 'unicode' }, prepareLarivaar(shabad.gurbani.unicode))
- ]),
- h('p', { class: 'transliteration english' }, shabad.transliteration),
- h('blockquote', { class: 'translation punjabi gurbani-font' }, [
- h('div', { class: 'gurlipi' }, shabad.translation.punjabi.bms.gurmukhi),
- h('div', { class: 'unicode' }, shabad.translation.punjabi.bms.unicode)
- ]),
- h('blockquote', { class: 'translation english' }, shabad.translation.english.ssk),
- h('blockquote', { class: 'translation spanish' }, shabad.translation.spanish),
- h('div', { class: 'share' }, [
- h('a', { class: 'copy' },
- h('i', { class: 'fa fa-fw fa-clipboard' })),
- h('a', { class: 'twitter' },
- h('i', { class: 'fa fa-fw fa-twitter' }))/*,
- h('a', { class: 'facebook' },
- h('i', { class: 'fa fa-fw fa-facebook' }))*/
- ]),
- h('textarea', {}, shabad.GurmukhiUni + "\n" + shabad.English)
- ])));
+function Baani(gurbani) {
+ const BaaniLine = ({ gurmukhi, unicode }) => (
+
+
{prepareLarivaar(gurmukhi)}
+
{prepareLarivaar(unicode)}
+
+ );
+ const EnglishTransliteration = ({ transliteration }) => (
+
{transliteration}
+ )
+ const SpanishTranslation = ({ translation }) => (
+
{translation}
+ );
+ const EnglishTranslation = ({ translation }) => (
+
{translation}
+ );
+ const PunjabiTranslation = ({ gurmukhi, unicode }) => (
+
+ {gurmukhi}
+ {unicode}
+
+ );
+
+ return (
+
+
+ {
+ gurbani.map(({ shabad }) => (
+
+ {BaaniLine(shabad.gurbani)}
+ {EnglishTransliteration(shabad)}
+ {PunjabiTranslation(shabad.translation.punjabi.bms)}
+ {EnglishTranslation({ translation: shabad.translation.english.ssk })}
+ {SpanishTranslation({ translation: shabad.translation.spanish })}
+
+
+
+ ))
+ }
+
+
+
{gurbani.map(({ shabad }) => (
+
+ {BaaniLine(shabad.gurbani)}
+
+
+
+ ))}
+
{gurbani.map(({ shabad }) => EnglishTransliteration(shabad))}
+
{gurbani.map(({ shabad }) => PunjabiTranslation(shabad.translation.punjabi.bms))}
+
{gurbani.map(({ shabad }) => EnglishTranslation({ translation: shabad.translation.english.ssk }))}
+
{gurbani.map(({ shabad }) => SpanishTranslation({ translation: shabad.translation.spanish }))}
+
+
+ );
}
function prepareLarivaar(padChhed) {
- let shabads = padChhed.split(' ');
- let newLine = '';
- [...shabads].forEach(val => {
- if(val.indexOf('॥') !== -1 || val.indexOf(']') !== -1) {
- tag = "i";
- } else {
- tag = "span";
- }
- newLine += "<" + tag + ">" + val + (tag == "i" ? " " : "") + " ";
- });
- return newLine;
+ return padChhed
+ .split(' ')
+ .map(val => (val.indexOf('॥') !== -1 || val.indexOf(']') !== -1)
+ ? `
${val} `
+ : `
${val}
`
+ )
+ .join('')
}
diff --git a/src/js/router.js b/src/js/router.js
index c3fa301ff..f8976e5a9 100644
--- a/src/js/router.js
+++ b/src/js/router.js
@@ -1,70 +1,56 @@
-// This function simply checks URL to load content into DOM
-
/* global h */
-const getQueryParams = () => location.search // "?key=val..." or "?" or ""
- .split('?') // ["", "key=val..."] or [""]
- .slice(-1)[0] // "key=val..." or ""
- .split('&') // ["key=val", ...] or [""]
- .filter(e => e !== "") // ["key=val",...] or []
- .map(e => e.split('=')) // [["key","val"],...] or []
- .reduce((o, [k, v]) => ({ ...o, [k]: v }), {}) // {key: val,...} or {}
-;
-
-const createScript = src => h('script', { src });
-const createScripts = (...srces) => srces.map(createScript);
-const replaceChild = ($target, child) => { $target.innerHTML = ''; $target.appendChild(child); };
+import {
+ NotFound,
+ SearchForm,
+ ShabadContainer,
+ Hukamnama,
+ Content,
+ SearchResults,
+ Option,
+} from './components';
+import { entries, createScript, createScripts } from './util';
const routes = {
+ // Populates the Search form.
_initForm() {
const formValues = ['q', 'type', 'source', 'ang']
.reduce((obj, val) => ({ ...obj, [val]: getParameterByName(val) || null }), {});
- const entries = obj => Object.keys(obj).map(key => [key, obj[key]]);
-
const typesToOptions = [...Khajana.TYPES, 'Ang']
- .map((string, value) => h('option', {
+ .map((children, value) => Option({
+ isSelected: parseInt(value) === parseInt(formValues.type),
value,
- ...(
- parseInt(value) === parseInt(formValues.type)
- ? { selected: true }
- : { }
- )
- }, string))
+ children,
+ }));
const sourcesToOptions = entries(Khajana.SOURCES)
- .map(([value, string]) => h('option', {
+ .map(([value, children]) => Option({
+ isSelected: value === formValues.source,
value,
- ...(
- value === formValues.source
- ? { selected: true }
- : { }
- )
- }, string))
+ children,
+ }));
const gurmukhiKeyboard = renderGurmukhiKeyboard(document.querySelector('#search'))
const [
- $$search, $$searchType, $$searchSource, $$searchTypes, $$searchSources, $$searchContainer
+ $$search, $$searchType, $$searchSource,
+ $$searchTypes, $$searchSources, $$searchContainer
] = [
- '#search', '#search-type-value', '#search-source-value', '#search-type', '#search-source', '#search-container',
+ '#search', '#search-type-value', '#search-source-value',
+ '#search-type', '#search-source', '#search-container',
].map(document.querySelector.bind(document));
$$search.value = formValues.q;
-
$$searchType.value = formValues.type;
-
$$searchSource.value = formValues.source;
-
$$searchTypes.innerHTML = typesToOptions.map(e => e.outerHTML).join('');
-
$$searchSources.innerHTML = sourcesToOptions.map(e => e.outerHTML).join('');
-
$$searchContainer.appendChild(gurmukhiKeyboard);
const mockEvent = {
currentTarget: {
- value: $$searchType.value,
+ value: $$searchType.value || 0,
form: document.querySelector('.search-form'),
}
};
@@ -72,29 +58,17 @@ const routes = {
updateSearchLang(mockEvent);
updateSearchAction(mockEvent);
},
+
['404'] ($target) {
- document.title = 'Page not found - SikhiToTheMax';
- const url = location.href;
+ this._initForm();
+ document.title = 'Page not found - SikhiToTheMax';
document.body.classList.remove('home');
- $target.innerHTML = `
-
-
-
404
-
These are not the Singhs you are looking for.
-
- The requested URL ${url} was not found on this server.
-
-
-
-
-
-
- `;
+ replaceChild($target, NotFound({ url: location.href }));
},
+
ang ($target, $scriptTarget) {
document.title = 'Ang/Page Viewer - SikhiToTheMax';
-
document.body.classList.remove('home');
this._initForm();
@@ -102,144 +76,52 @@ const routes = {
createScripts('/assets/js/renderShabad.js', '/assets/js/ang.js')
.forEach(e => document.body.insertBefore(e, $scriptTarget));
- $controls = renderControls();
-
- $shabad = h('div', { id: 'shabad', class: 'shabad display' });
-
- $meta = h('div', { class: "hidden", id: "metadata" });
-
- replaceChild($target, h('div', { }, [
- $controls,
- $meta,
- h('div', { }, [ $shabad ]),
- ]));
+ replaceChild($target, ShabadContainer({}));
},
- default ($target, $scriptTarget, { title = 'Title', content = 'Default content template' } = {}) {
- this._initForm();
+ default ($target, $scriptTarget, { title = 'Title', content = 'Default content template' } = {}) {
document.title = `${title} - SikhiToTheMax`;
-
document.body.classList.remove('home');
- replaceChild($target, h('div', { class: 'body_text' }, [
- h('h2', {}, title),
- h('div', {}, content),
- ]));
+ this._initForm();
+
+ replaceChild($target, Content({ title, content }));
},
+
home ($target, $scriptTarget) {
document.title = `SikhiToTheMax`;
+ // IE 11 doesn't support multiple args for classList.add.
+ ['home', 'hide-search-bar'].map(c => document.body.classList.add(c));
- document.body.classList.add('home', 'hide-search-bar');
-
- const entries = obj => Object.keys(obj).map(key => [key, obj[key]]);
-
- const $search = h('input', {
- name: "q"
- , id: "search"
- , class: "gurbani-font"
- , type: "search"
- , placeholder: "Koj"
- , autocapitalize: "none"
- , autocomplete: "off"
- , autocorrect: "off"
- , spellcheck: "false"
- , required: 'required'
- , title: 'Enter 3 characters minimum.'
- , pattern: '.{3,}'
- });
-
- const typesToOptions = [...Khajana.TYPES, 'Ang']
- .map((string, value) => h('option', { value }, string))
-
- const sourcesToOptions = entries(Khajana.SOURCES)
- .map(([value, string]) => h('option', { value }, string))
-
- const gurmukhiKeyboard = renderGurmukhiKeyboard($search);
-
- replaceChild($target, h('div', { class: "search-page" }, [
- h('form', { class: "search-form" , action: "/search" }, [
- h('div', { class: "flex justify-center align-center" }, [
- h('div', { }, [
- h('img', { class: "logo-long" , src: "/assets/images/sttm_logo.png" , alt: "SikhiToTheMax Logo" }),
- ]),
- ]),
- h('div', { id: "search-container" }, [
- $search,
- h(
- 'button', {
- type: "button",
- class: "gurmukhi-keyboard-toggle",
- click() { gurmukhiKeyboard.classList.toggle('active') }
- },
- [ h('i', { class: "fa fa-keyboard-o" }, []) ]
- ),
- h('button', { type: "submit" }, [
- h('i', { class: "fa fa-search" }, []),
- ]),
- gurmukhiKeyboard,
- ]),
- h('div', { class: "row search-options" }, [
- h('div', { class: "small-6 columns" }, [
- h('select', {
- name: "type",
- id: "search-type",
- change(e) {
- updateSearchLang(e);
- updateSearchAction(e);
- }
- }, typesToOptions
- ),
- ]),
- h('div', { class: "small-6 columns" }, [
- h('select', { name: "source" }, sourcesToOptions),
- ]),
- ]),
- ]),
- ]));
+ replaceChild($target, SearchForm({ }));
},
+
hukamnama ($target, $scriptTarget) {
document.title = 'Hukamnama - SikhiToTheMax';
-
document.body.classList.remove('home');
this._initForm();
- $controls = renderControls();
-
- $shabad = h('div', { id: 'shabad', class: 'shabad display' });
-
- $meta = h('div', { class: "hidden", id: "metadata" });
-
- replaceChild($target, h('div', { class: 'body_text' }, [
- h('h3', { style: "text-align: center;" }, 'Daily Hukamnama from Sri Harmandir Sahib, Amritsar'),
- $controls,
- $meta,
- h('div', { }, [ $shabad ]),
- ]));
+ replaceChild($target, Hukamnama({}));
createScripts('/assets/js/hukamnama.js', '/assets/js/renderShabad.js')
.forEach(e => document.body.insertBefore(e, $scriptTarget));
},
+
search ($target, $scriptTarget) {
document.title = 'Search Results - SikhiToTheMax';
-
document.body.classList.remove('home');
this._initForm();
- $controls = renderControls();
-
createScripts('/assets/js/renderShabad.js', '/assets/js/search.js')
.forEach(e => document.body.insertBefore(e, $scriptTarget));
- replaceChild($target, h('div', { }, [
- $controls,
- h('ul', { class: "search-results display" })
- ]));
+ replaceChild($target, SearchResults({ }));
},
+
shabad ($target, $scriptTarget) {
document.title = 'Shabad - SikhiToTheMax';
-
document.body.classList.remove('home');
this._initForm();
@@ -247,17 +129,7 @@ const routes = {
createScripts('/assets/js/renderShabad.js', '/assets/js/shabad.js')
.forEach(e => document.body.insertBefore(e, $scriptTarget));
- $controls = renderControls();
-
- $shabad = h('div', { id: 'shabad', class: 'shabad display' });
-
- $meta = h('div', { class: "hidden", id: "metadata" });
-
- replaceChild($target, h('div', { }, [
- $controls,
- $meta,
- h('div', { }, [ $shabad ]),
- ]));
+ replaceChild($target, ShabadContainer({ }));
},
};
diff --git a/src/js/search.js b/src/js/search.js
index bd4bed3c5..2dd106d46 100644
--- a/src/js/search.js
+++ b/src/js/search.js
@@ -25,41 +25,59 @@ function loadResults(offset) {
$.ajax({
url: Khajana.buildApiUrl({ q, type, source, offset }),
dataType: "json",
- success: function(data) {
+ success: function({ pageinfo: { pageresults, nextpageoffset }, shabads }) {
$("h3.loading, li.load-more").remove();
- if (data.pageinfo.pageresults > 0) {
- document.body.classList.remove("loading");
- $.each(data.shabads, function(key, val) {
- addSearchResult(val.shabad, q);
- });
- if (data.pageinfo.nextpageoffset) {
- $searchResults.appendChild(
- h('li', { class: 'load-more' },
- h('a', { class: 'load button', 'data-nextpage': data.pageinfo.nextpageoffset }, 'Load More')
- )
- );
+
+ switch (pageresults) {
+ case 0: {
+ noResults();
+ break;
+ }
+
+ // I'm feeling lucky
+ case 1: {
+ document.body.classList.remove("loading");
+ const [{ shabad }] = shabads;
+ location.href = getShabadHyperLink(shabad);
+ return;
+ }
+
+ default: {
+ document.body.classList.remove("loading");
+
+ shabads.forEach(({ shabad }) => addSearchResult(shabad, q));
+
+ if (nextpageoffset) {
+ $searchResults.appendChild(
+ h('li', { class: 'load-more' },
+ h('a', { class: 'load button', 'data-nextpage': nextpageoffset }, 'Load More')
+ )
+ );
+ }
}
- } else {
- noResults();
}
-
- $.each(prefs.displayOptions, function(index, option) {
- $("#" + option).click();
- });
- $.each(prefs.shabadToggles, function(index, option) {
- $("#" + option).click();
- })
+
+ [...prefs.displayOptions, ...prefs.shabadToggles]
+ .forEach(option => document.getElementById(option).click())
+
$controls.classList.remove('hidden');
},
error: showError
});
}
+function getShabadHyperLink (shabad) {
+ return `/shabad?id=${shabad.shabadid}&q=${q}${type ? `&type=${type}` : ''}${source ? `&source=${source}` : ''}`;
+}
+
function addSearchResult(shabad, q) {
+ const _source = Khajana.SOURCES[shabad.source.id];
+ const source = _source ? `${_source} - ${shabad.pageno}`: null;
+
$searchResults.appendChild(
h('li', { class: 'search-result' }, [
h('a', {
- href: `/shabad?id=${shabad.shabadid}&q=${q}${type ? `&type=${type}` : ''}${source ? `&source=${source}` : ''}`,
+ href: getShabadHyperLink(shabad),
class: 'gurbani-font gurbani-display',
}, [
h('div', { class: 'gurlipi' }, prepareLarivaar(shabad.gurbani.gurmukhi)),
@@ -74,16 +92,15 @@ function addSearchResult(shabad, q) {
h('blockquote', { class: 'translation english' }, shabad.translation.english.ssk),
h('blockquote', { class: 'translation spanish' }, shabad.translation.spanish),
h('div', { class: 'meta flex wrap'} , [
- h('a', { href: '#', }, `${Khajana.SOURCES[shabad.source.id]} - ${shabad.pageno}`),
+ source && h('a', { href: '#', }, source),
h('a', { href: '#', }, `${shabad.writer.english}`),
- h('a', { href: '#', }, `${shabad.raag.english}`),
+ ['No Raag', null].every(s => s !== shabad.raag.english) && h('a', { href: '#', }, `${shabad.raag.english}`),
])
])
);
}
function noResults() {
-
document.body.classList.remove("loading");
$searchResults.appendChild(H3('No results found'));
}
diff --git a/src/js/shabad.js b/src/js/shabad.js
index 3474fb7a2..ab4ebeea6 100644
--- a/src/js/shabad.js
+++ b/src/js/shabad.js
@@ -9,8 +9,9 @@ $(function() {
dataType: "json",
success: function(data) {
$shabad.innerHTML = '';
- metaData(data.shabadinfo);
- renderShabad(data.gurbani);
+ data.navigation.type = 'shabad';
+ metaData(data.shabadinfo, data.navigation);
+ renderShabad(data.gurbani, data.navigation);
},
error: showError
});
diff --git a/src/js/util.js b/src/js/util.js
new file mode 100644
index 000000000..4ef864dac
--- /dev/null
+++ b/src/js/util.js
@@ -0,0 +1,3 @@
+export const entries = obj => Object.keys(obj).map(key => [key, obj[key]]);
+export const createScript = src => h('script', { src });
+export const createScripts = (...srces) => srces.map(createScript);
\ No newline at end of file
diff --git a/src/scss/_header.scss b/src/scss/_header.scss
index 8afcb7f0e..7ba2ed38e 100644
--- a/src/scss/_header.scss
+++ b/src/scss/_header.scss
@@ -285,7 +285,7 @@
.top-bar #search {
max-width: 400px;
- width: 351px;
+ width: 356px;
}
#search-options {
diff --git a/src/scss/_panktee.scss b/src/scss/_panktee.scss
index f62e9338e..a4a8c840c 100644
--- a/src/scss/_panktee.scss
+++ b/src/scss/_panktee.scss
@@ -2,6 +2,17 @@
margin-bottom: -0.25rem;
}
+.display .split-view-baani {
+ display: none;
+}
+
+.display.split-view .split-view-baani {
+ display: block;
+}
+.display.split-view .mixed-view-baani {
+ display: none;
+}
+
.display .transliteration {
text-transform: capitalize;
}
@@ -32,14 +43,17 @@
font-style: normal;
}
-.display.larivaar .gurlipi span,
-.display.larivaar .gurlipi i,
-.display.larivaar .unicode span,
-.display.larivaar .unicode i {
- float: left;
+.display .akhar {
+ display: inline-block;
+ transition: all .25s;
+ padding-right: 0.5rem;
}
+.display.larivaar .akhar {
+ padding-right: 0;
+}
+
-.display.larivaar.larivaar_assist .gurlipi span:nth-of-type(2n),
-.display.larivaar.larivaar_assist .unicode span:nth-of-type(2n) {
+.display.larivaar.larivaar_assist .gurlipi .akhar:nth-of-type(2n),
+.display.larivaar.larivaar_assist .unicode .akhar:nth-of-type(2n) {
color: #f39c1d;
}
diff --git a/src/scss/_shabad-page.scss b/src/scss/_shabad-page.scss
index 93adea2fb..a9890b109 100644
--- a/src/scss/_shabad-page.scss
+++ b/src/scss/_shabad-page.scss
@@ -10,17 +10,87 @@ blockquote {
}
#metadata {
+ align-items: center;
border: 1px solid #cacaca;
border-radius: 2px;
+ display: flex;
margin: 1rem;
padding: 1rem;
text-align: center;
+ width: calc(100% - 2rem);
+}
+
+.shabad-nav {
+ a {
+ color: #f39c1d;
+ font-size: 50px;
+ font-weight: 500;
+ position: relative;
+
+ &:hover {
+ color: #797979;
+ }
+ }
+
+ &.right {
+ margin-left: 10px;
+ text-align: right;
+ }
+
+ &.left {
+ margin-right: 10px;
+ }
+}
+
+.meta {
+ flex-grow: 1;
+}
+
+.pagination {
+ align-items: center;
+ display: flex;
+ margin: 0;
+ padding: 0 0.5em;
+ width: 100%;
+
+ .shabad-nav {
+ flex-grow: 1;
+
+ a {
+ align-items: center;
+ display: flex;
+
+ &:hover {
+ background-color: initial;
+ }
+
+ i {
+ flex-grow: 1;
+ }
+ }
+
+ span {
+ display: none;
+ flex-grow: 1;
+ font-size: 0.35em;
+ }
+
+ &.left span {
+ margin-left: 10px;
+ }
+
+ &.right span {
+ margin-right: 10px;
+ }
+ }
}
.shabad {
display: flex;
justify-content: center;
- margin: 0 1rem;
+ margin: 0;
+ padding: 0 1rem;
+ width: 100%;
}
.shabad-container {
@@ -80,13 +150,44 @@ blockquote {
display: none;
}
+@media screen and (min-width: 350px) {
+ .pagination .shabad-nav a {
+ span {
+ display: initial;
+ }
+
+ i {
+ flex-grow: 0;
+ }
+ }
+}
+
@media screen and (min-width: 46em) {
#metadata {
margin: 1rem 2rem 1rem 3rem;
+ width: calc(100% - 5rem);
+ }
+
+ .shabad-nav,
+ .shabad-nav a {
+ margin: 0;
+ }
+
+ .pagination .shabad-nav div {
+ font-size: 0.5em;
+ top: 0.75em;
+ }
+
+ .pagination .shabad-nav.left div {
+ left: 3em;
+ }
+
+ .pagination .shabad-nav.right div {
+ right: 3em;
}
.shabad {
- margin: 0 2rem 0 3rem;
+ padding: 0 2rem 0 3rem;
}
#share-menu {
diff --git a/webpack.config.js b/webpack.config.js
index f5c6ba5e9..c7ce2235d 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -3,14 +3,13 @@ const HtmlWebpackPlugin = require('html-webpack-plugin')
module.exports = {
entry: {
- app: path.resolve(__dirname, 'src', 'js', 'index.js'),
- vendor: ['jquery', 'khajana', 'foundation'],
+ router: path.resolve(__dirname, 'src', 'js', 'router.js'),
},
output: {
path: path.resolve(__dirname, 'assets', 'js'),
- filename: '[name].[hash].min.js'
+ filename: '[name].js'
},
- plugins: [new HtmlWebpackPlugin()],
+ plugins: [],
module: {
rules: [
{
@@ -19,4 +18,4 @@ module.exports = {
}
]
}
-}
+};
\ No newline at end of file