You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@groovy.apache.org by pa...@apache.org on 2018/12/10 07:02:32 UTC

[groovy-website] 01/06: Update css to fix ribbon scrollbar overlap

This is an automated email from the ASF dual-hosted git repository.

paulk pushed a commit to branch asf-site
in repository https://gitbox.apache.org/repos/asf/groovy-website.git

commit 85bc6e77c053fd8763db077e068cd020858c96fc
Author: Paddy <p....@gmail.com>
AuthorDate: Sat Dec 8 22:41:31 2018 -0700

    Update css to fix ribbon scrollbar overlap
    
    Previously the 'Fork me on GitHub' image overlapped the scrollbar.
    
    This was most notable on Windows, but also existed to some extent on Mac
    OS and Linux distros.
    
    Problem: The visible scrollbar did not belong to the body element, and
    so the full width of the window was not taken into account by the
    position:fixed style of the ribbon.
    
    Solution: The solution was to ensure that only the scrollbar from the
    body element is used and visible.
    
    Visually checked on Chrome/Firefox/Safar on Mac OS, Chrome/IE11 on
    Windows and Firefox on Debian.
---
 site/src/site/assets/css/style.css | 11 ++---------
 site/src/site/layouts/page.groovy  |  4 ++--
 2 files changed, 4 insertions(+), 11 deletions(-)

diff --git a/site/src/site/assets/css/style.css b/site/src/site/assets/css/style.css
index dd3f93e..5622d75 100644
--- a/site/src/site/assets/css/style.css
+++ b/site/src/site/assets/css/style.css
@@ -778,7 +778,8 @@ ul.nav-sidebar li.active a {
 }
 
 body {
-    background: #444
+    background: #444;
+    overflow: auto;
 }
 
 html.noScroll {
@@ -789,20 +790,12 @@ html.noScroll body, html.noScroll .st-container, html.noScroll .st-pusher, html.
     overflow: hidden
 }
 
-html, body, .st-container, .st-pusher, .st-content {
-    overflow: auto
-}
-
 .sign-in-fa-icon:before {
     font-family: FontAwesome;
     content: '\f090';
     padding-right: 10px;
 }
 
-#st-container {
-    height: 100%;
-}
-
 .st-content {
     background: white
 }
diff --git a/site/src/site/layouts/page.groovy b/site/src/site/layouts/page.groovy
index bff19e9..27f1ba9 100644
--- a/site/src/site/layouts/page.groovy
+++ b/site/src/site/layouts/page.groovy
@@ -32,7 +32,7 @@ body {
     div(id: 'fork-me') {
         a(href: 'https://github.com/apache/groovy') {
             img(
-                    style: "position: fixed; top: -14px; right: -14px; border: 0; z-index: 100",
+                    style: "position: fixed; top: 0px; right: 0px; border: 0; z-index: 100",
                     src: 'https://camo.githubusercontent.com/365986a132ccd6a44c23a9169022c0b5c890c387/68747470733a2f2f73332e616d617a6f6e6177732e636f6d2f6769746875622f726962626f6e732f666f726b6d655f72696768745f7265645f6161303030302e706e67', alt: 'Fork me on GitHub', 'data-canonical-src': 'https://s3.amazonaws.com/github/ribbons/forkme_right_red_aa0000.png'
             )
         }
@@ -87,4 +87,4 @@ body {
     '''
 }
 
-yieldUnescaped '</html>'
\ No newline at end of file
+yieldUnescaped '</html>'