Fixed modals' background.

Author: ozasadnyy

_config.yml

@@ -1,7 +1,7 @@
 # Plugins
 gems:
 - jekyll-sitemap
-safe: true
+safe: false
 
 # Build Settings
 markdown: kramdown

_data/sessions.yml

@@ -3,6 +3,7 @@
   title: "Coffee Break"
   place: "Hall"
   service: true
+  description: "The best time to talk with speakers and attendees"
 -
   id: 503
   title: "Lunch Break"

_includes/navigation.html

@@ -23,7 +23,7 @@
             {% endfor %}
         </ul>
         {% for rightNavigationButton in site.rightNavigationButtons %}
-        <a href="{% if rightNavigationButton.permalink != null %} {{ rightNavigationButton.permalink | prepend: site.baseurl }} {% else %} {{ rightNavigationButton.link }} {% endif %}" class="{% if forloop.index == 1 %}right-nav-button-rightest {% endif %}right-nav-button right-nav-button-hidden btn btn-primary waves-effect waves-button waves-light waves-float pull-right hidden-xs hidden-sm" {% if rightNavigationButton.link != null %}target="_blank"{% endif %}>
+        <a href="{% if rightNavigationButton.permalink != null %} {{ rightNavigationButton.permalink | prepend: site.baseurl }} {% else %} {{ rightNavigationButton.link }} {% endif %}" class="right-nav-button right-nav-button-hidden btn btn-primary waves-effect waves-button waves-light waves-float pull-right hidden-xs hidden-sm" {% if rightNavigationButton.link != null %}target="_blank"{% endif %}>
             {{ rightNavigationButton.text }}
         </a>
         {% endfor %}

_includes/schedule.html

@@ -63,7 +63,7 @@ <h5 class="slot-title" itemprop="name">{{ session.title }}</h5>
                                     <div class="slot-content">
                                         <h5 class="slot-title" itemprop="name">{{ session.title }}</h5>
                                         {% if session.description != null %}
-                                        <p class="theme-description"><br>{{ session.description }}</p>
+                                        <p class="service-description">{{ session.description }}</p>
                                         {% endif %}
                                     </div>
                                 </div>

_sass/main.scss

@@ -6,7 +6,7 @@
 @import "vendor/animate";
 @import "vendor/waves";
 
-// Partialsas
+// Partials
 @import "partials/global";
 @import "partials/buttons";
 @import "partials/helper";

_sass/partials/_modal.scss

@@ -1,6 +1,7 @@
 $modal-color: #757575;
 $modal-highlight-color: #212121;
 .modal {
+    z-index: 1050;
     .icon-cross {
         width: 19px;
         height: 19px;
@@ -22,6 +23,14 @@ $modal-highlight-color: #212121;
         }
     }
 }
+.modal-backdrop {
+    position: fixed;
+    top: 0;
+    bottom: 0;
+    right: 0;
+    left: 0;
+    z-index: 1040;
+}
 .modal-content {
     border-radius: 4px;
     box-shadow: 0 5px 15px rgba(0, 0, 0, .3);
@@ -49,10 +58,10 @@ $modal-highlight-color: #212121;
     }
     .theme-description {
         margin: 12px 0 20px;
-    } 
+    }
     .theme-presentation {
         font-size: 15px;
-    } 
+    }
     .people-details {
         .row {
             margin-top: 20px;
@@ -70,7 +79,7 @@ $modal-highlight-color: #212121;
         .details {
             padding-left: 30px;
             @media (max-width: 767px) {
-                padding: 0;    
+                padding: 0;
             }
         }
         .name {
@@ -87,13 +96,13 @@ $modal-highlight-color: #212121;
             padding: 0;
             list-style: none;
             @media (max-width: 767px) {
-                text-align: center;    
+                text-align: center;
             }
             li {
                 display: inline-block;
                 padding-right: 3px;
             }
-        }      
+        }
     }
 }
 .modal-ribbon-wrapper {
@@ -102,4 +111,4 @@ $modal-highlight-color: #212121;
         margin-right: 7px;
         font-size: 14px;
     }
-}
+}

_sass/partials/_navigation.scss

@@ -143,6 +143,9 @@ nav {
     transition: $base-transition;
     opacity: 1;
     display: block;
+    &:nth-of-type(1) {
+        margin-right: 65px;
+    }
     a {
         font-size: $base-font-size * 90 / 100;
     }
@@ -151,9 +154,6 @@ nav {
         transform: translateY(-50px);
     }
 }
-.right-nav-button-rightest {
-    margin: 11px 65px 0 0;
-}
 .icon-menu {
     width: 20px;
     height: 20px;

_sass/partials/_schedule.scss

@@ -185,3 +185,6 @@ $small-label-width: 80px;
     right: 15px;
     top: 20px;
 }
+.service-description {
+    margin-top: 15px;
+}