[prev in list] [next in list] [prev in thread] [next in thread]
List: kde-commits
Subject: [websites/inqlude] /: Fix issues of two-column layout
From: Nanduni Indeewaree Nimalsiri <nandunibw () gmail ! com>
Date: 2016-10-15 22:49:43
Message-ID: E1bvXlv-0003rJ-87 () code ! kde ! org
[Download RAW message or body]
Git commit 70b043a932ed6a0e8f74e66eeb0f4e25e7e05600 by Nanduni Indeewaree Nimalsiri.
Committed on 24/08/2016 at 01:15.
Pushed by cschumac into branch 'master'.
Fix issues of two-column layout
* Sort the latest releases correctly to make the newest to be on top.
* Render the side-bar without boxes, just using titles and space.
* Change the font size of the body to be same as the one-column layout.
This makes it easy to read.
* Add 'All' topic at the top of the topics list which goes to the complete list with \
all libraries.
* Make the 'last updated' text to appear only on the home page, not on any of the \
other pages.
* Link the Inqlude logo to the home page.
Resolves: #69
M +11 -14 lib/manifest_handler.rb
M +0 -8 lib/view.rb
M +1 -3 view/two-column/about.html.haml
C +11 -10 view/two-column/all.html.haml [from: view/two-column/group.html.haml - \
080% similarity] M +3 -11 view/two-column/contribute.html.haml
M +1 -4 view/two-column/get.html.haml
M +7 -1 view/two-column/group.html.haml
M +8 -3 view/two-column/index.html.haml
M +45 -50 view/two-column/layout.html.haml
M +1 -3 view/two-column/library.html.haml
M +55 -77 view/two-column/public/inqlude.css
M +1 -1 view/two-column/search.html.haml
M +7 -1 view/two-column/topic.html.haml
http://commits.kde.org/websites/inqlude/70b043a932ed6a0e8f74e66eeb0f4e25e7e05600
diff --git a/lib/manifest_handler.rb b/lib/manifest_handler.rb
index 6b54dfd..f6b97a6 100644
--- a/lib/manifest_handler.rb
+++ b/lib/manifest_handler.rb
@@ -55,29 +55,26 @@ class ManifestHandler
end
def latest_libraries
- recent_releases = Array.new
+ releases = Array.new
+ is_kde_added = false
libraries.select do |library|
if library.latest_manifest.has_version? && library.latest_manifest.group != \
"kde-frameworks"
- recent_releases.push library
+ releases.push library
+ elsif library.latest_manifest.has_version? && library.latest_manifest.group == \
"kde-frameworks" + if !is_kde_added
+ is_kde_added = true
+ releases.push library
+ end
end
end
- recent_releases.sort! {|a,b| a.latest_manifest.release_date <=> \
b.latest_manifest.release_date}
- recent_releases.reverse!
+ releases.sort! {|a,b| a.latest_manifest.release_date <=> \
b.latest_manifest.release_date} + releases.reverse!
- return recent_releases[0 .. 4]
+ return releases[0 .. 4]
end
- def is_kde_latest?
- latest_libraries.select do |library|
- if group("kde-frameworks")[1].latest_manifest.release_date > \
library.latest_manifest.release_date
- return true
- end
- end
- return false
- end
-
def group name
return @libraries.select do |l|
manifest = l.latest_manifest
diff --git a/lib/view.rb b/lib/view.rb
index de3541d..72b7275 100644
--- a/lib/view.rb
+++ b/lib/view.rb
@@ -252,10 +252,6 @@ class View
@manifest_handler.latest_libraries
end
- def is_kde_latest?
- @manifest_handler.is_kde_latest?
- end
-
def group_title
if @group_name == "kde-frameworks"
return "KDE Frameworks"
@@ -308,10 +304,6 @@ class View
doc.to_html
end
- def kde_frameworks_release_date
- @manifest_handler.group("kde-frameworks")[1].latest_manifest.release_date
- end
-
def topics
['API', 'Artwork', 'Bindings', 'Communication', 'Data', 'Desktop', \
'Development', 'Graphics', 'Logging', 'Mobile', 'Multimedia', 'Printing', 'QML', \
'Scripting', 'Security', 'Text', 'Web', 'Widgets'] end
diff --git a/view/two-column/about.html.haml b/view/two-column/about.html.haml
index d86b9b0..8d1e25b 100644
--- a/view/two-column/about.html.haml
+++ b/view/two-column/about.html.haml
@@ -1,9 +1,7 @@
%home
= link_to "Home", "index"
-%h4 About Inqlude
-
-%hr
+%h3 About Inqlude
%p
The goal of Inqlude is to provide a comprehensive listing of all
diff --git a/view/two-column/group.html.haml b/view/two-column/all.html.haml
similarity index 80%
copy from view/two-column/group.html.haml
copy to view/two-column/all.html.haml
index 17a958e..068fa64 100644
--- a/view/two-column/group.html.haml
+++ b/view/two-column/all.html.haml
@@ -1,11 +1,10 @@
%home
= link_to "Home", "index"
-%h4
- = group_title
+%h3 All libraries
%table.table-hover.col-sm-12
- - group.each do |library|
+ - libraries.each do |library|
%tr
%td.name
- if library.latest_manifest.display_name
@@ -15,7 +14,6 @@
%td.summary
= library.manifests.last.summary
%td.platforms
- %link{:href => \
"http://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.6.3/css/font-awesome.min.css", \
:rel => "stylesheet"}
- if library.manifests.last.platforms.include? 'Linux'
%i.fa.fa-linux
- if library.manifests.last.platforms.include? 'OS X'
@@ -25,7 +23,7 @@
- if library.manifests.last.platforms.include? 'Android'
%i.fa.fa-android
- if library.manifests.last.platforms.include? 'iOS'
- %img{:src => "apple.ico", :height => "15%;"}
+ %img{:src => "ios.ico", :height => "15%;"}
%td.topics
- if library.manifests.last.topics
- library.manifests.last.topics.each do |topic|
@@ -39,8 +37,11 @@
= license + ", "
- else
= license
-%br
-
-%p
- #{group.count} libraries listed in group #{group_title}.
-
+
+:javascript
+ $('table.table-hover.col-sm-12 tr').click( function() {
+ window.location = $(this).find('a').attr('href');
+ }).hover( function() {
+ $(this).toggleClass('hover');
+ });
+
\ No newline at end of file
diff --git a/view/two-column/contribute.html.haml \
b/view/two-column/contribute.html.haml index 7884e5e..a9ae6bd 100644
--- a/view/two-column/contribute.html.haml
+++ b/view/two-column/contribute.html.haml
@@ -1,9 +1,7 @@
%home
= link_to "Home", "index"
-%h4 Contributing data about libraries
-
-%hr
+%h3 Contributing data about libraries
%p
To get a complete overview about all available Qt based libraries, we need
@@ -24,12 +22,9 @@
You can contribute meta data by providing patches to the inqlude-data
repository. Use the github mechanisms or just send patches by email.
Contributions are welcome.
-
%br
-%h4 Contributing to the Inqlude tools
-
-%hr
+%h3 Contributing to the Inqlude tools
%p
The command line tool is developed in another git repository at
@@ -44,12 +39,9 @@
Especially welcome are contributions for adding support for native
package systems on the variety of Linux distributions and other systems
out there.
-
%br
-%h4 Mailing list
-
-%hr
+%h3 Mailing list
%p
If you want to discuss any aspects of Inqlude, get in contact with us, have
diff --git a/view/two-column/get.html.haml b/view/two-column/get.html.haml
index 6c2060d..0761db6 100644
--- a/view/two-column/get.html.haml
+++ b/view/two-column/get.html.haml
@@ -1,10 +1,7 @@
%home
= link_to "Home", "index"
-%h4
- How to get libraries
-
-%hr
+%h3 How to get libraries
%p
This page is about how to use Inqlude as a user, a developer using Qt
diff --git a/view/two-column/group.html.haml b/view/two-column/group.html.haml
index 17a958e..02b93a7 100644
--- a/view/two-column/group.html.haml
+++ b/view/two-column/group.html.haml
@@ -1,7 +1,7 @@
%home
= link_to "Home", "index"
-%h4
+%h3
= group_title
%table.table-hover.col-sm-12
@@ -44,3 +44,9 @@
%p
#{group.count} libraries listed in group #{group_title}.
+:javascript
+ $('table.table-hover.col-sm-12 tr').click( function() {
+ window.location = $(this).find('a').attr('href');
+ }).hover( function() {
+ $(this).toggleClass('hover');
+ });
diff --git a/view/two-column/index.html.haml b/view/two-column/index.html.haml
index ef3981c..b7b1889 100644
--- a/view/two-column/index.html.haml
+++ b/view/two-column/index.html.haml
@@ -1,4 +1,4 @@
-%h4
+%h3
Stable libraries
%table.table-hover.col-sm-12
@@ -36,7 +36,7 @@
- else
= license
-%h4
+%h3
Developer releases
%table.table-hover.col-sm-12
@@ -142,7 +142,7 @@
- else
= license
-%h4
+%h3
Unreleased libraries
%table.table-hover.col-sm-12
@@ -180,6 +180,11 @@
- else
= license
+%hr
+
+%span.footer
+ Last updated on #{Date.today}
+
:javascript
$('table.table-hover.col-sm-12 tr').click( function() {
window.location = $(this).find('a').attr('href');
diff --git a/view/two-column/layout.html.haml b/view/two-column/layout.html.haml
index a8fe905..3c8b5c6 100644
--- a/view/two-column/layout.html.haml
+++ b/view/two-column/layout.html.haml
@@ -17,14 +17,14 @@
= link_to "Alpha", "about"
%h1
%span.logo><
- \#in
+ = link_to "#in", "index"
%span.logo.green><
- q
+ = link_to "q", "index"
%span.logo><
- lude
+ = link_to "lude", "index"
%h2
- %span.subtitle
- The Qt library archive
+ %span.subtitle><
+ = link_to "The Qt library archive", "index"
.col-sm-4.right
- if enable_search
@@ -33,60 +33,55 @@
%br{ :clear => "all" }
.container-fluid.content
+
.col-sm-3.side-bar
+ %p{:class => "description"}
+ Inqlude provides a comprehensive listing of all existing libraries for \
developers of applications using the #{link_to "Qt toolkit", \
"http://qt-project.org"}. Inqlude is run by the community and open for contributions. \
+ %ul.titles-list
+ %li
+ = link_to "About", "about"
+ %li
+ = link_to "How to get libraries", "get"
+ %li
+ = link_to "How to contribute", "contribute"
- .col-sm-12.description
- %p
- Inqlude provides a comprehensive listing of all existing libraries for \
developers of applications using the #{link_to "Qt toolkit", \
"http://qt-project.org"}. Inqlude is run by the community and open for contributions. \
- %ul.titles-list
- %li
- = link_to "About", "about"
- %li
- = link_to "How to get libraries", "get"
- %li
- = link_to "How to contribute", "contribute"
-
- .col-sm-12.latest-releases
- %p{:class => "title"}
- Latest releases
- .col-sm-12.latest-releases-content
- %table
- %tr
- %td
- - latest_libraries.each do |library|
- - if library.latest_manifest.display_name
- = link_to_library(library.latest_manifest.name, \
library.latest_manifest.display_name)
- - else
- = link_to_library(library.latest_manifest.name, \
library.latest_manifest.name)
- %date
- = '(' + library.latest_manifest.release_date + ')'
- %br
- - if is_kde_latest?
- = link_to_group('kde-frameworks', 'KDE Frameworks')
- %date
- = '(' + kde_frameworks_release_date + ')'
+ %p{:class => "title"} Latest releases
+ %hr
+ %ul.side-list
+ %li
+ - latest_libraries.each do |library|
+ - if library.latest_manifest.group == "kde-frameworks"
+ = link_to_group('kde-frameworks', 'KDE Frameworks')
+ -else
+ - if library.latest_manifest.display_name
+ = link_to_library(library.latest_manifest.name, \
library.latest_manifest.display_name) + - else
+ = link_to_library(library.latest_manifest.name, \
library.latest_manifest.name) + %date
+ = '(' + library.latest_manifest.release_date + ')'
+ %br
- .col-sm-12.topics
- %p{:class => "title"}
- Topics
- %ul.topics-list
- %li
- - topics.each do |topic|
- = link_to_topic(topic)
- %number
- = ' (' + no_of_libraries(topic).to_s + ')'
- %br
+ %p{:class => "title"} Topics
+ %hr
+ %ul.side-list
+ %li
+ = link_to "All", "all"
+ %number
+ = ' (' + libraries.length.to_s + ')'
+ %li
+ - topics.each do |topic|
+ = link_to_topic(topic)
+ %number
+ = ' (' + no_of_libraries(topic).to_s + ')'
+ %br
.col-sm-9.main-pane
= yank
%br{ :clear => "all" }
- %hr
-
- %span.footer
- Last updated on #{Date.today}
-
+ %hr
+
.col-sm-12.legal
Inqlude is a
= link_to "KDE project", "http://kde.org"
diff --git a/view/two-column/library.html.haml b/view/two-column/library.html.haml
index 8492d2d..2d10e05 100644
--- a/view/two-column/library.html.haml
+++ b/view/two-column/library.html.haml
@@ -1,14 +1,12 @@
%home
= link_to "Home", "index"
-%h4
+%h3
-if m.display_name
= m.display_name
-else
= m.name
-%hr
-
%p
= m.summary
diff --git a/view/two-column/public/inqlude.css b/view/two-column/public/inqlude.css
index 6133d5a..d15eafc 100644
--- a/view/two-column/public/inqlude.css
+++ b/view/two-column/public/inqlude.css
@@ -2,6 +2,7 @@ body {
color: #111;
margin: 0px;
font-family: 'Droid Sans', arial, serif;
+ font-size: 155%;
}
a:link {
@@ -46,11 +47,8 @@ a:active {
h1 {
font-family: monospace;
- font-size: 200%;
- font-weight: normal;
+ font-size: 180%;
margin-bottom: 0px;
- padding-top: 5px;
- margin-left: 40px;
}
h1 .logo {
@@ -58,13 +56,8 @@ h1 .logo {
font-weight: bold;
}
-h1 .green {
- color: #80C342;
-}
-
h2 {
margin-top: -5px;
- margin-left: 40px;
}
h2 .subtitle {
@@ -72,14 +65,35 @@ h2 .subtitle {
font-size: 78%;
}
-h3, h4, h6 {
- font-weight: bold;
+.logo a {
+ color: #111;
+ text-decoration: none;
+}
+.logo.green a {
+ color: #80C342;
+ text-decoration: none;
+}
+.subtitle a {
+ color: #111;
+ text-decoration: none;
+}
+
+h3 {
+ font-weight: bold;
+ font-size: 140%;
+ margin-top: 0px;
+ padding-bottom: 15px;
+}
+
+h4 {
+ font-weight: bold;
+ font-size: 120%;
}
.container-fluid.header {
-webkit-box-shadow: 0px 6px 0px rgba(50, 50, 50, 0.5);
-moz-box-shadow: 0px 6px 0px rgba(50, 50, 50, 0.5);
- box-shadow: 0px 3px 10px rgba(25, 25, 25, 0.3);
+ box-shadow: 0px 2px 4px rgba(0,0,0,.2);
background-color: #eee;
padding-left: 0px;
padding-right: 0px;
@@ -89,92 +103,57 @@ h3, h4, h6 {
margin-top: 0px;
padding: 0px;
padding-bottom: 5px;
- padding-left: 10px;
+ padding-left: 55px;
}
.col-sm-4.right {
+ float: right;
text-align: right;
- padding-top: 45px;
+ padding-top: 40px;
+ padding-right: 30px;
}
.container-fluid.content {
- padding-right: 10px;
- padding-left: 10px;
+ padding-right: 15px;
+ padding-left: 15px;
}
.col-sm-3.side-bar {
- padding: 0px;
- padding-left: 15px;
- padding-top: 25px;
+ padding: 20px;
+ padding-top: 30px;
}
-.col-sm-12.description {
+.description {
text-align: justify;
- background-color: #eee;
- margin-bottom: 25px;
- padding: 15px;
- padding-bottom: 10px;
-}
-
-.title {
- background-color: #a4d477;
- font-weight: bold;
- padding: 0px;
- padding-left: 5px;
- width: 100%;
}
-.col-sm-12.latest-releases {
- background-color: #eee;
- margin-bottom: 25px;
- padding: 0px;
-}
-
-.col-sm-12.latest-releases-content {
- padding-left: 35px;
- padding-bottom: 10px;
-}
-
-.col-sm-12.topics {
- background-color: #eee;
- margin-bottom: 5px;
- padding: 0px;
-}
-
-.col-sm-12.topics-content{
- padding-top: 5px;
- padding-left: 30px;
+ul.titles-list {
+ list-style-type: circle;
+ padding-left: 15px;
}
-.col-sm-9.main-pane {
- padding-top: 25px;
- padding-left: 25px;
- padding-right: 15px;
+.title {
+ font-weight: bold;
+ margin-top: 30px;
}
-.inner-pane.col-sm-12 {
- text-align: justify;
- padding: 30px;
- padding-top: 0px;
+ul.side-list {
+ list-style-type: none;
+ padding-left: 0px;
}
date {
float: right;
- margin-left: 30px;
}
number {
font-size: 80%;
}
-ul.titles-list {
- list-style-type: circle;
- padding-left: 25px;
-}
-
-ul.topics-list {
- list-style-type: none;
- padding-left: 40px;
+.col-sm-9.main-pane {
+ padding-top: 30px;
+ padding-left: 15px;
+ padding-right: 20px;
}
table.table-hover.col-sm-12 {
@@ -186,7 +165,7 @@ table.table-hover.col-sm-12 tr:hover td {
cursor: pointer;
}
-tr:nth-child(even) {
+tr:nth-child(odd) {
background-color: #eee;
}
@@ -234,10 +213,6 @@ td.licenses {
font-size: 80%;
}
-.library-short-meta-data {
- font-style: italic;
-}
-
home {
float: right;
font-style: italic;
@@ -247,7 +222,6 @@ home {
float: right;
font-size: 80%;
font-style: italic;
- padding-right: 30px;
}
.edit-link {
@@ -257,8 +231,8 @@ home {
.col-sm-12.legal {
text-align: center;
- font-size: 90%;
- margin-bottom: 15px;
+ font-size: 75%;
+ padding-bottom: 10px;
}
.attribute {
@@ -285,3 +259,7 @@ i.fa {
font-size: 16px;
margin-left: 2px;
}
+
+hr {
+ margin-top: 0px;
+}
diff --git a/view/two-column/search.html.haml b/view/two-column/search.html.haml
index 1d2829d..fd46b23 100644
--- a/view/two-column/search.html.haml
+++ b/view/two-column/search.html.haml
@@ -2,7 +2,7 @@
= link_to "Home", "index"
.col-sm-12.inner-box
- %h4 Search results
+ %h3 Search results
%hr
diff --git a/view/two-column/topic.html.haml b/view/two-column/topic.html.haml
index 0ac849c..529e4bd 100644
--- a/view/two-column/topic.html.haml
+++ b/view/two-column/topic.html.haml
@@ -1,7 +1,7 @@
%home
= link_to "Home", "index"
-%h4
+%h3
= t
%table.table-hover.col-sm-12
@@ -38,4 +38,10 @@
= license + ", "
- else
= license
+:javascript
+ $('table.table-hover.col-sm-12 tr').click( function() {
+ window.location = $(this).find('a').attr('href');
+ }).hover( function() {
+ $(this).toggleClass('hover');
+ });
\ No newline at end of file
[prev in list] [next in list] [prev in thread] [next in thread]
Configure |
About |
News |
Add a list |
Sponsored by KoreLogic