diff --git a/README.md b/README.md index 878189ca..dfe89ca6 100644 --- a/README.md +++ b/README.md @@ -1,4 +1,4 @@ -# h5ai v0.8   ·   a beautified Apache index +# h5ai v0.9   ·   a beautified Apache index ## Screenshots @@ -47,6 +47,18 @@ please respect their rights. ## Changelog +### v0.9 +*2011-07-18* + +* linked hover states between crumb, extended view and tree +* fixed size of tree view (now there's a ugly scrollbar, hopefully will be fixed) +* refactored js to improve performance and cleaned code +* added caching for folder status codes and content +* added fr translation by [Nicolas](http://github.com/Nicosmos) +* added nl translation by [Stefan de Konink](http://github.com/skinkie) +* added sv translation by Oscar Carlsson + + ### v0.8 *2011-07-08* diff --git a/build.properties b/build.properties index fd2c5bf0..6e8dd4ac 100644 --- a/build.properties +++ b/build.properties @@ -3,7 +3,7 @@ custom = true # project project.name = h5ai -project.version = 0.8 +project.version = 0.9 # src diff --git a/src/h5ai/css/inc/extended.less b/src/h5ai/css/inc/extended.less index 84e09398..e0368e4b 100644 --- a/src/h5ai/css/inc/extended.less +++ b/src/h5ai/css/inc/extended.less @@ -12,51 +12,56 @@ white-space: nowrap; clear: both; - &.header a { - padding-bottom: 18px; - color: #555; - opacity: 0.4; - cursor: pointer; - .transition( all 0.2s ease-in-out ); - - &:visited { + &.header { + a, a:active, a:visited { + padding-bottom: 18px; color: #555; - } - &:hover { - color: #555; - opacity: 0.9; - } - img { - width: 12px; - height: 12px; - padding: 0 8px; + text-decoration: none; + opacity: 0.4; + cursor: pointer; + .transition( all 0.2s ease-in-out ); + + &:hover { + color: #555; + opacity: 0.9; + } + img { + width: 12px; + height: 12px; + padding: 0 8px; + } } } &.entry { border-bottom: 1px solid #ddd; - a { + a, a:active, a:visited { display: block; + color: #555; + text-decoration: none; cursor: pointer; - - &:hover { + + &:hover, &.hover { background-color: #f6f6f6; color: #e80; } } &.error { - > a, > a:visited { - color: #999; - + a, a:active, a:visited { + color: #aaa; + .label { - opacity: 0.7; - .hint { + margin-left: 12px; font-size: 0.9em; - font-style: italic; color: #c55; } } + &:hover, &.hover { + opacity: 1; + background-color: #f6f6f6; + color: #e80; + } } } } @@ -115,7 +120,7 @@ #extended.icons-view { display: none; - padding: 10px; + padding: 3px; border: 1px solid #eee; border-radius: 15px; @@ -131,7 +136,7 @@ &.entry { float: left; - a { + a, a:active, a:visited { display: block; margin: 8px; padding: 8px; @@ -139,12 +144,14 @@ height: 120px; float: left; text-align: center; + text-decoration: none; overflow: hidden; border-radius: 5px; + color: #555; cursor: pointer; border: 2px solid rgba(0,0,0,0); - &:hover { + &:hover, &.hover { color: #e80; border-color: #eee; background-color: #f6f6f6; @@ -170,18 +177,22 @@ } } &.error { - > a, > a:visited { - color: #999; - + a, a:active, a:visited { + color: #aaa; + text-decoration: none; + .label { - opacity: 0.7; - .hint { + padding: 0 6px; font-size: 0.9em; - font-style: italic; color: #c55; } } + &:hover, &.hover { + color: #e80; + border-color: #eee; + background-color: #f6f6f6; + } } } } diff --git a/src/h5ai/css/inc/tree.less b/src/h5ai/css/inc/tree.less index 5b31d8b6..7ccf94c3 100644 --- a/src/h5ai/css/inc/tree.less +++ b/src/h5ai/css/inc/tree.less @@ -2,7 +2,10 @@ #tree { position: fixed; left: -200px; - top: 80px; + display: none; + left: 0; + top: 0; + overflow: auto; font-size: 0.85em; padding: 16px 32px 16px 16px; background-color: rgb(241,241,241); @@ -43,15 +46,18 @@ opacity: 0.3; } } - > a, > a.visited { + > a, > a:active, > a.visited { margin-left: 16px; padding: 4px 6px; border: 1px solid rgba(0,0,0,0); .border-radius( 5px ); display: block; + color: #555; + text-decoration: none; opacity: 0.7; - &:hover { + &:hover, &.hover { + color: #e80; background-color: rgba(255,255,255,0.5); opacity: 1; } @@ -70,7 +76,6 @@ .hint { display: inline-block; margin-left: 12px; - font-style: italic; font-size: 0.9em; color: #ccc; img { @@ -84,15 +89,18 @@ display: none; } &.current { - > a, > a:visited { - border: 1px solid rgba(0,0,0,0.1); + > a, > a:active, > a:visited { + border: 1px solid rgb(221,221,221); background-color: rgba(255,255,255,0.5); opacity: 1; } } &.error { - > a, > a:visited { + > a, > a:active, > a:visited { color: #999; + &:hover, &.hover { + color: #e80; + } } .hint { color: #c55; diff --git a/src/h5ai/css/main.less b/src/h5ai/css/main.less index 0e305b2f..7f6d1a7a 100644 --- a/src/h5ai/css/main.less +++ b/src/h5ai/css/main.less @@ -14,6 +14,7 @@ html.no-js { } } + body { font-family: Ubuntu, sans-serif; font-size: 16px; @@ -22,16 +23,6 @@ body { } -a, a:visited { - color: #555; - text-decoration: none; - - &:hover { - color: #e80; - } -} - - body > nav { position: fixed; z-index: 1; @@ -41,7 +32,7 @@ body > nav { font-size: 0.85em; background-color: rgb(241,241,241); border-bottom: 2px solid rgb(210,210,210); - + span.jsDisabledFallback { display: block; height: 30px; @@ -49,45 +40,27 @@ body > nav { padding: 0 10px; color: #999; } - li { + a, a:active, a:visited { + color: #555; cursor: pointer; + text-decoration: none; opacity: 0.7; .transition( all 0.2s ease-in-out ); - &.crumb { - float: left; - border-right: 1px solid rgb(231,231,231); - .hint { - margin-left: 8px; - font-style: italic; - color: #999; - } - img.hint { - width: 10px; - height: 10px; - vertical-align: baseline; - padding: 0px; - } - } - &.current { - background-color: rgba(255,255,255,0.5); - opacity: 1.0; - } - &.view { - float: right; - border-left: 1px solid rgb(230,230,230); - } - &:hover, &:hover a { - background-color: rgba(255,255,255,0.5); - color: #e80; - opacity: 1.0; - } - } - a { display: block; height: 30px; line-height: 30px; padding: 0 10px; + + &:hover, &.hover { + color: #e80; + background-color: rgba(255,255,255,0.5); + opacity: 1.0; + } + } + .current a { + background-color: rgba(255,255,255,0.5); + opacity: 1.0; } img { width: 16px; @@ -95,11 +68,30 @@ body > nav { vertical-align: bottom; padding: 0 6px 6px 0; } + .crumb { + float: left; + border-right: 1px solid rgb(231,231,231); + .hint { + margin-left: 8px; + font-style: italic; + color: #999; + } + img.hint { + width: 10px; + height: 10px; + vertical-align: baseline; + padding: 0px; + } + } + .view { + float: right; + border-left: 1px solid rgb(231,231,231); + } } #content { - max-width: 980px; + max-width: 960px; margin: 0 auto; > header { @@ -136,8 +128,9 @@ body > footer { font-size: 0.85em; text-align: center; - a, a:visited { + a, a:active, a:visited { color: #555; + text-decoration: none; .transition( all 0.2s ease-in-out ); &:hover { @@ -151,15 +144,14 @@ body > footer { position: absolute; left: 6px; bottom: 6px; - float: left; + opacity: 0.4; + .transition( all 0.2s ease-in-out ); img { width: 20px; height: 20px; - opacity: 0.4; - .transition( all 0.2s ease-in-out ); } - &:hover img { + &:hover { opacity: 0.8; } } diff --git a/src/h5ai/footer.html b/src/h5ai/footer.html index 9625cdf0..14e1afb0 100644 --- a/src/h5ai/footer.html +++ b/src/h5ai/footer.html @@ -11,7 +11,7 @@ html5-storage html5-css3 - h5ai + h5ai %BUILD_VERSION% using Faenza icons diff --git a/src/h5ai/header.html b/src/h5ai/header.html index 6318639d..c5fa6eab 100644 --- a/src/h5ai/header.html +++ b/src/h5ai/header.html @@ -13,12 +13,9 @@ -