Merge pull request #578 from github/fileview-hover-fix
Fileview hover fix
This commit is contained in:
@@ -0,0 +1,25 @@
|
||||
# https://help.github.com/articles/dealing-with-line-endings
|
||||
# Set default behaviour, in case users don't have core.autocrlf set.
|
||||
* text=auto
|
||||
|
||||
# Explicitly declare text files we want to always be normalized and converted
|
||||
# to native line endings on checkout.
|
||||
*.txt text
|
||||
*.md text
|
||||
*.rb text
|
||||
*.js text
|
||||
*.html text
|
||||
*.yml text
|
||||
*.mustache text
|
||||
*.css text
|
||||
Rakefile text
|
||||
Gemfile text
|
||||
LICENSE text
|
||||
COPYRIGHT text
|
||||
gollum text
|
||||
.gitattributes text
|
||||
.gitignore text
|
||||
|
||||
# Denote all files that are truly binary and should not be modified.
|
||||
*.png binary
|
||||
*.jpg binary
|
||||
@@ -22,7 +22,7 @@ module Gollum
|
||||
def new_page page
|
||||
name = page.name
|
||||
url = url_for_page page
|
||||
%Q( <li class="file"><a href="#{url}">#{name}</a></li>\n)
|
||||
%Q( <li class="file"><a href="#{url}"><span class="icon"></span>#{name}</a></li>)
|
||||
end
|
||||
|
||||
def new_folder folder_path
|
||||
@@ -38,10 +38,7 @@ module Gollum
|
||||
end
|
||||
|
||||
def end_folder
|
||||
<<-HTML
|
||||
</ol>
|
||||
</li>
|
||||
HTML
|
||||
"</ol></li>\n"
|
||||
end
|
||||
|
||||
def url_for_page page
|
||||
@@ -85,13 +82,11 @@ module Gollum
|
||||
# Handle special case of only one folder.
|
||||
if (count - folder_start == 1)
|
||||
page = @pages[ folder_start ]
|
||||
name = page.name
|
||||
url = url_for_page page
|
||||
html += <<-HTML
|
||||
<li>
|
||||
<label>#{::File.dirname(page.path)}</label> <input type="checkbox" #{@checked} />
|
||||
<ol>
|
||||
<li class="file"><a href="#{url}">#{name}</a></li>
|
||||
#{new_page page}
|
||||
</ol>
|
||||
</li>
|
||||
HTML
|
||||
|
||||
@@ -1,121 +1,128 @@
|
||||
*, html {
|
||||
font-family: Verdana, Arial, Helvetica, sans-serif;
|
||||
}
|
||||
|
||||
#results a:hover {
|
||||
background-color: #4c4c4c;
|
||||
}
|
||||
|
||||
#home_button {
|
||||
position: absolute;
|
||||
top: 10px;
|
||||
left: 50%;
|
||||
}
|
||||
|
||||
#home_button .minibutton {
|
||||
font-size: 1em;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
#results {
|
||||
position: absolute;
|
||||
top: 60px;
|
||||
left: 10px;
|
||||
}
|
||||
|
||||
body, form, ul, li, p, h1, h2, h3, h4, h5 {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
body {
|
||||
background-color: #606061;
|
||||
color: #ffffff;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
img {
|
||||
border: none;
|
||||
}
|
||||
|
||||
p {
|
||||
font-size: 1em;
|
||||
margin: 0 0 1em 0;
|
||||
}
|
||||
|
||||
html { font-size: 100%; /* IE hack */ }
|
||||
body { font-size: 1em; /* Sets base font size to 16px */ }
|
||||
table { font-size: 100%; /* IE hack */ }
|
||||
input, select, textarea, th, td { font-size: 1em; }
|
||||
|
||||
/* Prevent wrapping on large file names. */
|
||||
li.file {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
/* CSS Tree menu styles */
|
||||
ol.tree
|
||||
{
|
||||
padding: 0 0 0 30px;
|
||||
width: 300px;
|
||||
}
|
||||
li
|
||||
{
|
||||
position: relative;
|
||||
margin-left: -15px;
|
||||
list-style: none;
|
||||
}
|
||||
li.file
|
||||
{
|
||||
margin-left: -1px !important;
|
||||
height: 1.5em;
|
||||
}
|
||||
li.file a
|
||||
{
|
||||
background: url(../images/fileview/document.png) 0 0 no-repeat;
|
||||
color: #fff;
|
||||
padding-left: 21px;
|
||||
text-decoration: none;
|
||||
display: block;
|
||||
}
|
||||
li.file a[href *= '.pdf'] { background: url(../images/fileview/document.png) 0 0 no-repeat; }
|
||||
li.file a[href *= '.html'] { background: url(../images/fileview/document.png) 0 0 no-repeat; }
|
||||
li.file a[href $= '.css'] { background: url(../images/fileview/document.png) 0 0 no-repeat; }
|
||||
li.file a[href $= '.js'] { background: url(../images/fileview/document.png) 0 0 no-repeat; }
|
||||
li input
|
||||
{
|
||||
position: absolute;
|
||||
left: 0;
|
||||
margin-left: 0;
|
||||
opacity: 0;
|
||||
z-index: 2;
|
||||
cursor: pointer;
|
||||
height: 1em;
|
||||
width: 1em;
|
||||
top: 0;
|
||||
}
|
||||
li input + ol
|
||||
{
|
||||
background: url(../images/fileview/toggle-small-expand.png) 40px 0 no-repeat;
|
||||
margin: -1.188em 0 0 -44px; /* 15px */
|
||||
height: 1.5em;
|
||||
}
|
||||
li input + ol > li { display: none; margin-left: -14px !important; padding-left: 1px; }
|
||||
li label
|
||||
{
|
||||
background: url(../images/fileview/folder-horizontal.png) 15px 1px no-repeat;
|
||||
cursor: pointer;
|
||||
display: block;
|
||||
padding-left: 37px;
|
||||
}
|
||||
|
||||
li input:checked + ol
|
||||
{
|
||||
background: url(../images/fileview/toggle-small.png) 40px 5px no-repeat;
|
||||
margin: -1.5em 0 0 -44px; /* 20px */
|
||||
padding: 1.563em 0 0 80px;
|
||||
height: auto;
|
||||
}
|
||||
li input:checked + ol > li { display: block; margin: 0 0 0.125em; /* 2px */}
|
||||
li input:checked + ol > li:last-child { margin: 0 0 0.063em; /* 1px */ }
|
||||
|
||||
*, html {
|
||||
font-family: Verdana, Arial, Helvetica, sans-serif;
|
||||
}
|
||||
|
||||
#results a:hover {
|
||||
background-color: #4c4c4c;
|
||||
}
|
||||
|
||||
#home_button {
|
||||
position: absolute;
|
||||
top: 10px;
|
||||
left: 50%;
|
||||
}
|
||||
|
||||
#home_button .minibutton {
|
||||
font-size: 1em;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
#results {
|
||||
position: absolute;
|
||||
top: 60px;
|
||||
left: 10px;
|
||||
}
|
||||
|
||||
body, form, ul, li, p, h1, h2, h3, h4, h5 {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
body {
|
||||
background-color: #606061;
|
||||
color: #ffffff;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
img {
|
||||
border: none;
|
||||
}
|
||||
|
||||
p {
|
||||
font-size: 1em;
|
||||
margin: 0 0 1em 0;
|
||||
}
|
||||
|
||||
html { font-size: 100%; /* IE hack */ }
|
||||
body { font-size: 1em; /* Sets base font size to 16px */ }
|
||||
table { font-size: 100%; /* IE hack */ }
|
||||
input, select, textarea, th, td { font-size: 1em; }
|
||||
|
||||
/* Prevent wrapping on large file names. */
|
||||
li.file {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
/* CSS Tree menu styles */
|
||||
ol.tree
|
||||
{
|
||||
padding: 0 0 0 30px;
|
||||
width: 300px;
|
||||
}
|
||||
li
|
||||
{
|
||||
position: relative;
|
||||
margin-left: -15px;
|
||||
list-style: none;
|
||||
}
|
||||
li.file
|
||||
{
|
||||
margin-left: -1px !important;
|
||||
height: 1.5em;
|
||||
}
|
||||
li.file a
|
||||
{
|
||||
color: #fff;
|
||||
text-decoration: none;
|
||||
display: inline-block;
|
||||
}
|
||||
li.file a span.icon
|
||||
{
|
||||
width: 14px;
|
||||
height: 18px;
|
||||
background: url(../images/fileview/document.png) 0 0 no-repeat;
|
||||
display: inline-block;
|
||||
margin-right: 7px;
|
||||
vertical-align: text-top;
|
||||
}
|
||||
li.file a[href *= '.pdf'] span.icon { background: url(../images/fileview/document.png) 0 0 no-repeat; }
|
||||
li.file a[href *= '.html'] span.icon { background: url(../images/fileview/document.png) 0 0 no-repeat; }
|
||||
li.file a[href $= '.css'] span.icon { background: url(../images/fileview/document.png) 0 0 no-repeat; }
|
||||
li.file a[href $= '.js'] span.icon { background: url(../images/fileview/document.png) 0 0 no-repeat; }
|
||||
li input
|
||||
{
|
||||
position: absolute;
|
||||
left: 0;
|
||||
margin-left: 0;
|
||||
opacity: 0;
|
||||
z-index: 2;
|
||||
cursor: pointer;
|
||||
height: 1em;
|
||||
width: 1em;
|
||||
top: 0;
|
||||
}
|
||||
li input + ol
|
||||
{
|
||||
background: url(../images/fileview/toggle-small-expand.png) 40px 0 no-repeat;
|
||||
margin: -1.188em 0 0 -44px; /* 15px */
|
||||
height: 1.5em;
|
||||
}
|
||||
li input + ol > li { display: none; margin-left: -14px !important; padding-left: 1px; }
|
||||
li label
|
||||
{
|
||||
background: url(../images/fileview/folder-horizontal.png) 15px 1px no-repeat;
|
||||
cursor: pointer;
|
||||
display: block;
|
||||
padding-left: 37px;
|
||||
}
|
||||
|
||||
li input:checked + ol
|
||||
{
|
||||
background: url(../images/fileview/toggle-small.png) 40px 5px no-repeat;
|
||||
margin: -1.5em 0 0 -44px; /* 20px */
|
||||
padding: 1.563em 0 0 80px;
|
||||
height: auto;
|
||||
}
|
||||
li input:checked + ol > li { display: block; margin: 0 0 0.125em; /* 2px */}
|
||||
li input:checked + ol > li:last-child { margin: 0 0 0.063em; /* 1px */ }
|
||||
|
||||
|
||||
@@ -1,3 +1,5 @@
|
||||
<ol class="tree">
|
||||
<li class="file"><a href="0">0</a></li>
|
||||
</ol>
|
||||
<li class="file">
|
||||
<a href="0"><span class="icon"></span>0</a>
|
||||
</li>
|
||||
</ol>
|
||||
|
||||
@@ -1,8 +1,11 @@
|
||||
<ol class="tree">
|
||||
<li>
|
||||
<label>folder0</label> <input type="checkbox" checked />
|
||||
<ol>
|
||||
<li class="file"><a href="folder0/0">0</a></li>
|
||||
</ol>
|
||||
</li>
|
||||
</ol>
|
||||
<li>
|
||||
<label>folder0</label>
|
||||
<input type="checkbox" />
|
||||
<ol>
|
||||
<li class="file">
|
||||
<a href="folder0/0"><span class="icon"></span>0</a>
|
||||
</li>
|
||||
</ol>
|
||||
</li>
|
||||
</ol>
|
||||
|
||||
@@ -1,8 +1,11 @@
|
||||
<ol class="tree">
|
||||
<li>
|
||||
<label>.</label> <input type="checkbox" checked />
|
||||
<ol>
|
||||
<li class="file"><a href="folder0">folder0</a></li>
|
||||
</ol>
|
||||
</li>
|
||||
</ol>
|
||||
<li>
|
||||
<label>.</label>
|
||||
<input type="checkbox" />
|
||||
<ol>
|
||||
<li class="file">
|
||||
<a href="folder0"><span class="icon"></span>folder0</a>
|
||||
</li>
|
||||
</ol>
|
||||
</li>
|
||||
</ol>
|
||||
|
||||
@@ -1,12 +1,20 @@
|
||||
<ol class="tree">
|
||||
<li>
|
||||
<label>folder0</label> <input type="checkbox" checked />
|
||||
<ol>
|
||||
<li class="file"><a href="folder0/0">0</a></li>
|
||||
</ol>
|
||||
<li>
|
||||
<label>folder0</label>
|
||||
<input type="checkbox" />
|
||||
<ol>
|
||||
<li class="file">
|
||||
<a href="folder0/0"><span class="icon"></span>0</a>
|
||||
</li>
|
||||
<li>
|
||||
<label>folder1</label> <input type="checkbox" checked />
|
||||
<ol>
|
||||
<li class="file"><a href="folder1/1">1</a></li>
|
||||
</ol>
|
||||
</ol>
|
||||
</li>
|
||||
<li>
|
||||
<label>folder1</label>
|
||||
<input type="checkbox" />
|
||||
<ol>
|
||||
<li class="file">
|
||||
<a href="folder1/1"><span class="icon"></span>1</a>
|
||||
</li>
|
||||
</ol>
|
||||
</li>
|
||||
</ol>
|
||||
|
||||
@@ -1,13 +1,23 @@
|
||||
<ol class="tree">
|
||||
<li class="file"><a href="root">root</a></li>
|
||||
<li>
|
||||
<label>folder0</label> <input type="checkbox" checked />
|
||||
<ol>
|
||||
<li class="file"><a href="folder0/0">0</a></li>
|
||||
</ol>
|
||||
<li class="file">
|
||||
<a href="root"><span class="icon"></span>root</a>
|
||||
</li>
|
||||
<li>
|
||||
<label>folder0</label>
|
||||
<input type="checkbox" />
|
||||
<ol>
|
||||
<li class="file">
|
||||
<a href="folder0/0"><span class="icon"></span>0</a>
|
||||
</li>
|
||||
<li>
|
||||
<label>folder1</label> <input type="checkbox" checked />
|
||||
<ol>
|
||||
<li class="file"><a href="folder1/1">1</a></li>
|
||||
</ol>
|
||||
</ol>
|
||||
</li>
|
||||
<li>
|
||||
<label>folder1</label>
|
||||
<input type="checkbox" />
|
||||
<ol>
|
||||
<li class="file">
|
||||
<a href="folder1/1"><span class="icon"></span>1</a>
|
||||
</li>
|
||||
</ol>
|
||||
</li>
|
||||
</ol>
|
||||
|
||||
@@ -1,28 +1,41 @@
|
||||
<ol class="tree">
|
||||
<li>
|
||||
<label>folder0</label>
|
||||
<input type="checkbox" />
|
||||
<ol>
|
||||
<li>
|
||||
<label>folder0</label> <input type="checkbox" checked />
|
||||
<label>folder1</label>
|
||||
<input type="checkbox" />
|
||||
<ol>
|
||||
<li>
|
||||
<label>folder1</label> <input type="checkbox" checked />
|
||||
<ol>
|
||||
<li>
|
||||
<label>folder2</label> <input type="checkbox" checked />
|
||||
<ol>
|
||||
<li class="file"><a href="folder0/folder1/folder2/0">0</a></li>
|
||||
<li>
|
||||
<label>folder2</label>
|
||||
<input type="checkbox" />
|
||||
<ol>
|
||||
<li class="file">
|
||||
<a href="folder0/folder1/folder2/0"><span class="icon"></span>0</a>
|
||||
</li>
|
||||
</ol>
|
||||
</li>
|
||||
<li>
|
||||
<label>folder3</label>
|
||||
<input type="checkbox" />
|
||||
<ol>
|
||||
<li class="file">
|
||||
<a href="folder0/folder1/folder3/1"><span class="icon"></span>1</a>
|
||||
</li>
|
||||
</ol>
|
||||
</li>
|
||||
</ol>
|
||||
</li>
|
||||
<li>
|
||||
<label>folder3</label> <input type="checkbox" checked />
|
||||
<ol>
|
||||
<li class="file"><a href="folder0/folder1/folder3/1">1</a></li>
|
||||
</ol>
|
||||
</ol>
|
||||
</li>
|
||||
<li>
|
||||
<label>folder4</label>
|
||||
<input type="checkbox" />
|
||||
<ol>
|
||||
<li class="file">
|
||||
<a href="folder4/2"><span class="icon"></span>2</a>
|
||||
</li>
|
||||
</ol>
|
||||
</li>
|
||||
</ol>
|
||||
</li>
|
||||
<li>
|
||||
<label>folder4</label> <input type="checkbox" checked />
|
||||
<ol>
|
||||
<li class="file"><a href="folder4/2">2</a></li>
|
||||
</ol>
|
||||
</ol>
|
||||
</li>
|
||||
</ol>
|
||||
|
||||
+17
-1
@@ -68,10 +68,26 @@ def write file, content
|
||||
end
|
||||
end
|
||||
|
||||
@@format_xslt = File.expand_path(File.join(File.dirname(__FILE__), 'format.xslt'))
|
||||
|
||||
def to_html html
|
||||
# Remove blank nodes for proper formatting
|
||||
doc = Nokogiri.XML(html) do |cfg|
|
||||
cfg.default_xml.noblanks
|
||||
end
|
||||
|
||||
# Save as XHTML
|
||||
doc.to_xml( { :save_with => Nokogiri::XML::Node::SaveOptions::DEFAULT_XHTML, :indent => 2, :encoding => 'UTF-8' } )
|
||||
end
|
||||
|
||||
def check name, pages_array
|
||||
pages = FakePages.new pages_array
|
||||
expected = read name
|
||||
actual = view pages
|
||||
actual = to_html view pages
|
||||
|
||||
# Uncomment when updating tests
|
||||
# write name, actual
|
||||
|
||||
assert_equal expected, actual
|
||||
end
|
||||
|
||||
|
||||
Reference in New Issue
Block a user