-
-
- {% include glossary.html headings = headings %}
-
-
- {% assign char_arr = headings | split: '' %}
- {% for char in char_arr %}
- {{char}}
-
-
- {% endfor %} + +1&&void 0!==arguments[1]?arguments[1]:{};if(t(this,s),this.options=s.extend(n,o),this.sidebar="string"==typeof e?document.querySelector(e):e,void 0===this.sidebar)throw new Error("There is no specific sidebar element.");this.sidebarInner=!1,this.container=this.sidebar.parentElement,this.affixedType="STATIC",this.direction="down",this.support={transform:!1,transform3d:!1},this._initialized=!1,this._breakpoint=!1,this._resizeListeners=[],this.dimensions={translateY:0,topSpacing:0,bottomSpacing:0,sidebarHeight:0,sidebarWidth:0,containerTop:0,containerHeight:0,viewportHeight:0,viewportTop:0,lastViewportTop:0},["handleEvent"].forEach(function(t){i[t]=i[t].bind(i)}),this.initialize()}return e(s,[{key:"initialize",value:function(){var t=this;if(this._setSupportFeatures(),this.options.innerWrapperSelector&&(this.sidebarInner=this.sidebar.querySelector(this.options.innerWrapperSelector),null===this.sidebarInner&&(this.sidebarInner=!1)),!this.sidebarInner){var e=document.createElement("div");for(e.setAttribute("class","inner-wrapper-sticky"),this.sidebar.appendChild(e);this.sidebar.firstChild!=e;)e.appendChild(this.sidebar.firstChild);this.sidebarInner=this.sidebar.querySelector(".inner-wrapper-sticky")}if(this.options.containerSelector){var i=document.querySelectorAll(this.options.containerSelector);if((i=Array.prototype.slice.call(i)).forEach(function(e,i){e.contains(t.sidebar)&&(t.container=e)}),!i.length)throw new Error("The container does not contains on the sidebar.")}"function"!=typeof this.options.topSpacing&&(this.options.topSpacing=parseInt(this.options.topSpacing)||0),"function"!=typeof this.options.bottomSpacing&&(this.options.bottomSpacing=parseInt(this.options.bottomSpacing)||0),this._widthBreakpoint(),this.calcDimensions(),this.stickyPosition(),this.bindEvents(),this._initialized=!0}},{key:"bindEvents",value:function(){window.addEventListener("resize",this,{passive:!0}),window.addEventListener("scroll",this,{passive:!0}),this.sidebar.addEventListener("update"+i,this),this.options.resizeSensor&&"undefined"!=typeof ResizeSensor&&(new ResizeSensor(this.sidebarInner,this.handleEvent),new ResizeSensor(this.container,this.handleEvent))}},{key:"handleEvent",value:function(t){this.updateSticky(t)}},{key:"calcDimensions",value:function(){if(!this._breakpoint){var t=this.dimensions;t.containerTop=s.offsetRelative(this.container).top,t.containerHeight=this.container.clientHeight,t.containerBottom=t.containerTop+t.containerHeight,t.sidebarHeight=this.sidebarInner.offsetHeight,t.sidebarWidth=this.sidebar.offsetWidth,t.viewportHeight=window.innerHeight,this._calcDimensionsWithScroll()}}},{key:"_calcDimensionsWithScroll",value:function(){var t=this.dimensions;t.sidebarLeft=s.offsetRelative(this.sidebar).left,t.viewportTop=document.documentElement.scrollTop||document.body.scrollTop,t.viewportBottom=t.viewportTop+t.viewportHeight,t.viewportLeft=document.documentElement.scrollLeft||document.body.scrollLeft,t.topSpacing=this.options.topSpacing,t.bottomSpacing=this.options.bottomSpacing,"function"==typeof t.topSpacing&&(t.topSpacing=parseInt(t.topSpacing(this.sidebar))||0),"function"==typeof t.bottomSpacing&&(t.bottomSpacing=parseInt(t.bottomSpacing(this.sidebar))||0)}},{key:"isSidebarFitsViewport",value:function(){return this.dimensions.sidebarHeight=t.containerBottom?(t.translateY=t.containerBottom-i,e="CONTAINER-BOTTOM"):n>=t.containerTop&&(t.translateY=n-t.containerTop,e="VIEWPORT-TOP"):t.containerBottom<=s?(t.translateY=t.containerBottom-i,e="CONTAINER-BOTTOM"):i+t.translateY<=s?(t.translateY=s-i,e="VIEWPORT-BOTTOM"):t.containerTop+t.translateY<=n&&(e="VIEWPORT-UNBOTTOM"),t.translateY=Math.max(0,t.translateY),t.translateY=Math.min(t.containerHeight,t.translateY),t.lastViewportTop=t.viewportTop,e}},{key:"_getStyle",value:function(t){if(void 0!==t){var e={inner:{},outer:{}},i=this.dimensions;switch(t){case"VIEWPORT-TOP":e.inner={position:"fixed",top:this.options.topSpacing,left:i.sidebarLeft-i.viewportLeft,width:i.sidebarWidth};break;case"VIEWPORT-BOTTOM":e.inner={position:"fixed",top:"auto",left:i.sidebarLeft,bottom:this.options.bottomSpacing,width:i.sidebarWidth};break;case"CONTAINER-BOTTOM":case"VIEWPORT-UNBOTTOM":var n=this._getTranslate(0,i.translateY+"px");e.inner=n?{transform:n}:{position:"absolute",top:i.translateY,width:i.sidebarWidth}}switch(t){case"VIEWPORT-TOP":case"VIEWPORT-BOTTOM":case"VIEWPORT-UNBOTTOM":case"CONTAINER-BOTTOM":e.outer={height:i.sidebarHeight,position:"relative"}}return e.outer=s.extend({height:"",position:""},e.outer),e.inner=s.extend({position:"relative",top:"",left:"",bottom:"",width:"",transform:this._getTranslate()},e.inner),e}}},{key:"stickyPosition",value:function(t){if(!this._breakpoint){t=t||!1;var e=this.getAffixType(),n=this._getStyle(e);if((this.affixedType!=e||t)&&e){var o="affix."+e.toLowerCase().replace("viewport-","")+i;s.eventTrigger(this.sidebar,o),"STATIC"===e?s.removeClass(this.sidebar,this.options.stickyClass):s.addClass(this.sidebar,this.options.stickyClass);for(var r in n.outer)this.sidebar.style[r]=n.outer[r];for(var a in n.inner){var c="number"==typeof n.inner[a]?"px":"";this.sidebarInner.style[a]=n.inner[a]+c}var p="affixed."+e.toLowerCase().replace("viewport","")+i;s.eventTrigger(this.sidebar,p)}else this._initialized&&(this.sidebarInner.style.left=n.inner.left);this.affixedType=e}}},{key:"_widthBreakpoint",value:function(){window.innerWidth<=this.options.minWidth?(this._breakpoint=!0,this.affixedType="STATIC",this.sidebar.removeAttribute("style"),s.removeClass(this.sidebar,this.options.stickyClass),this.sidebarInner.removeAttribute("style")):this._breakpoint=!1}},{key:"updateSticky",value:function(){var t=this,e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};this._running||(this._running=!0,function(e){requestAnimationFrame(function(){switch(e){case"scroll":t._calcDimensionsWithScroll(),t.observeScrollDir(),t.stickyPosition();break;case"resize":default:t._widthBreakpoint(),t.calcDimensions(),t.stickyPosition(!0)}t._running=!1})}(e.type))}},{key:"_setSupportFeatures",value:function(){var t=this.support;t.transform=s.supportTransform(),t.transform3d=s.supportTransform(!0)}},{key:"_getTranslate",value:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:0,e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:0,i=arguments.length>2&&void 0!==arguments[2]?arguments[2]:0;return this.support.transform3d?"translate3d("+t+", "+e+", "+i+")":!!this.support.translate&&"translate("+t+", "+e+")"}},{key:"destroy",value:function(){window.removeEventListener("resize",this),window.removeEventListener("scroll",this),this.sidebar.classList.remove(this.options.stickyClass),this.sidebar.style.minHeight="",this.sidebar.removeEventListener("update"+i,this);var t={inner:{},outer:{}};t.inner={position:"",top:"",left:"",bottom:"",width:"",transform:""},t.outer={height:"",position:""};for(var e in t.outer)this.sidebar.style[e]=t.outer[e];for(var n in t.inner)this.sidebarInner.style[n]=t.inner[n];this.options.resizeSensor&&"undefined"!=typeof ResizeSensor&&(ResizeSensor.detach(this.sidebarInner,this.handleEvent),ResizeSensor.detach(this.container,this.handleEvent))}}],[{key:"supportTransform",value:function(t){var e=!1,i=t?"perspective":"transform",n=i.charAt(0).toUpperCase()+i.slice(1),s=["Webkit","Moz","O","ms"],o=document.createElement("support").style;return(i+" "+s.join(n+" ")+n).split(" ").forEach(function(t,i){if(void 0!==o[t])return e=t,!1}),e}},{key:"eventTrigger",value:function(t,e,i){try{var n=new CustomEvent(e,{detail:i})}catch(t){(n=document.createEvent("CustomEvent")).initCustomEvent(e,!0,!0,i)}t.dispatchEvent(n)}},{key:"extend",value:function(t,e){var i={};for(var n in t)void 0!==e[n]?i[n]=e[n]:i[n]=t[n];return i}},{key:"offsetRelative",value:function(t){var e={left:0,top:0};do{var i=t.offsetTop,n=t.offsetLeft;isNaN(i)||(e.top+=i),isNaN(n)||(e.left+=n)}while(t=t.offsetParent);return e}},{key:"addClass",value:function(t,e){s.hasClass(t,e)||(t.classList?t.classList.add(e):t.className+=" "+e)}},{key:"removeClass",value:function(t,e){s.hasClass(t,e)&&(t.classList?t.classList.remove(e):t.className=t.className.replace(new RegExp("(^|\\b)"+e.split(" ").join("|")+"(\\b|$)","gi")," "))}},{key:"hasClass",value:function(t,e){return t.classList?t.classList.contains(e):new RegExp("(^| )"+e+"( |$)","gi").test(t.className)}}]),s}()}();return window.StickySidebar=i,i});
\ No newline at end of file
diff --git a/static/site.css b/static/site.css
index dd60cece..25246989 100644
--- a/static/site.css
+++ b/static/site.css
@@ -11,7 +11,7 @@ body {
img.logo {
float: left;
vertical-align: middle;
- width: 15%;
+ width: 150px;
}
.row {
@@ -35,7 +35,7 @@ body {
float: right;
width: 100%;
}
-
+
.right-rtl {
float: right;
width: 25%;
@@ -45,16 +45,15 @@ body {
}
@media screen and (max-width: 768px) {
-
+
img.logo {
float: left;
vertical-align: middle;
- width: 25%;
- }
+ width: 120px;
+ }
.row {
background: grey;
- width: 100%;
margin-left: .5cm;
margin-right: 1cm;
}
- {% endfor %} + +
+
+
+
+
diff --git a/assets/css/glossary.scss b/assets/css/glossary.scss
index 34749477..30d060b2 100644
--- a/assets/css/glossary.scss
+++ b/assets/css/glossary.scss
@@ -48,9 +48,9 @@ a:hover {
.button-ltr,
.button-rtl {
- width: 134px;
- height: 58px;
- padding-top: 22px;
+ width: 202px;
+ height: 84px;
+ padding-top: 16px;
padding-left: 68px;
font-family: 'Helvetica Neue', Helvetica, Arial, serif;
font-size: 20px;
@@ -76,55 +76,65 @@ a:hover {
display: block;
}
+ .sidebar{
+ will-change: min-height;
+ }
+
+ .sidebar__inner{
+ transform: translate(0, 0); /* For browsers don't support translate3d. */
+ transform: translate3d(0, 0, 0);
+ will-change: position, transform;
+ }
+
.sticky-home,
.sticky-ltr,
.sticky-rtl {
- position: sticky;
z-index: 0;
- top: 0;
- overflow: scroll;
- overflow-x: hidden;
- height: 95%;
background-color: grey;
color: white;
text-align: center;
- vertical-align: middle;
- align-contents: center;
- padding-top: 30px;
- padding-bottom: 30px;
- bottom: 30px;
}
.sticky-home {
float: right;
- margin-right: 1cm;
+ // margin-right: 1cm;
right: 0;
width: 20%;
}
.sticky-ltr {
float: right;
- margin-right: 1cm;
+ // margin-right: 1cm;
right: 0;
width: 6%;
}
.sticky-rtl {
float: left;
- margin-left: 1cm;
+ // margin-left: 1cm;
left: 0;
width: 6%;
}
+ .letter {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ font-size: 20px;
+ border: 1px solid grey;
+ background-color: grey;
+ color: white;
+ }
+
.lang_links,
.letter_links {
font-family: Arial, Helvetica, sans-serif;
text-align: center;
vertical-align: middle;
text-decoration: none;
- font-size: 24;
+ font-size: px;
color: white;
- margin: 20px 0% 30px 0%;
+ margin: 10px 0% 10px 0%;
}
.lang_links {
@@ -139,8 +149,6 @@ a:hover {
}
#content-wrapper {
- padding-top: 30px;
- border-top: solid 1px #fff;
margin-right: 0cm;
margin-left: 0cm;
}
@@ -156,8 +164,7 @@ a:hover {
#main-content-home {
float: left;
- width: 60%;
- max-width: 100%;
+ max-width: 73%;
padding: 1cm 1cm 1cm 1cm;
margin-left: 1cm;
}
@@ -175,8 +182,7 @@ a:hover {
#main-content-ltr,
#main-content-rtl {
padding: .5cm 1cm 1cm 1cm;
- width: 75%;
- max-width: 85%;
+ max-width: 87%;
}
#main-content-home,
@@ -191,9 +197,9 @@ a:hover {
.button-ltr,
.button-rtl {
- width: 134px;
- height: 58px;
- padding-top: 22px;
+ width: 202px;
+ height: 84px;
+ padding-top: 16px;
padding-left: 68px;
font-family: 'Helvetica Neue', Helvetica, Arial, serif;
font-size: 20px;
@@ -222,40 +228,38 @@ a:hover {
.sticky-home {
display: none;
- margin-right: 1cm;
}
.sticky-ltr,
.sticky-rtl {
- position: sticky;
z-index: 0;
- top: 8;
- overflow: scroll;
- overflow-x: hidden;
- height: 110%;
- width: 12%;
background-color: grey;
color: white;
text-align: center;
- vertical-align: middle;
- padding-bottom: 40px;
- padding-top: 30px;
}
.sticky-ltr {
float: right;
- margin-right: 0cm;
right: 0;
bottom: 30px;
}
.sticky-rtl {
float: left;
- margin-left: .5cm;
left: 0;
bottom: 30px;
}
+ .letter {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ font-size: 14px;
+ border: 1px solid grey;
+ background-color: grey;
+ color: white;
+ }
+
.lang_links { }
.letter_links {
@@ -266,10 +270,7 @@ a:hover {
text-decoration: none;
}
- #content-wrapper {
- padding-top: 30px;
- border-top: solid 1px #fff;
- }
+ #content-wrapper { }
.clearfix:after {
display: block;
@@ -283,24 +284,21 @@ a:hover {
#main-content-home {
float: left;
- width: 77%;
- max-width: 80%;
+ max-width: 99%;
padding: 1cm 1cm 1cm 1cm;
margin-left: .5cm;
}
#main-content-ltr {
float: left;
- width: 65%;
- max-width: 80%;
+ max-width: 87%;
padding: 1cm .5cm 1cm 1cm;
margin-left: .5cm;
}
#main-content-rtl {
float: right;
- width: 65%;
- max-width: 80%;
+ max-width: 87%;
padding: 1cm 1cm 1cm .5cm;
margin-right: .5cm;
}
diff --git a/assets/js/sticky-sidebar.min.js b/assets/js/sticky-sidebar.min.js
new file mode 100644
index 00000000..f8f10e8c
--- /dev/null
+++ b/assets/js/sticky-sidebar.min.js
@@ -0,0 +1,8 @@
+/**
+ * sticky-sidebar - A JavaScript plugin for making smart and high performance.
+ * @version v3.2.0
+ * @link https://github.com/abouolia/sticky-sidebar
+ * @author Ahmed Bouhuolia
+ * @license The MIT License (MIT)
+**/
+!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e():"function"==typeof define&&define.amd?define(e):t.StickySidebar=e()}(this,function(){"use strict";function t(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}var e=function(){function t(t,e){for(var i=0;i
+ {% include glossary.html headings = headings %}
+
+