Hey Ken,
This is neat. Unfortunately, it conflicts with the work Jiri Tomasek has
done and pushed already (commit 0ca429ae536e1d15b9b2f480381e96a433f790d8).
Could you please rebase & send it again?
Also, I think the instances/_list partial would appreciate the love, too.
Right now when you're on the filter view on the pools page, both the
Deployments and the Pools tabs have pretty tables, but the one under
Instances is still unstyled.
Cheers,
Thomas
On 06/29/2011 09:27 AM, kkeiter(a)redhat.com wrote:
From: Kenneth Keiter<kkeiter(a)redhat.com>
---
src/app/stylesheets/layout.scss | 103 +++++++++++++++++++-
src/app/views/deployments/_list.haml | 2 +-
src/app/views/hardware_profiles/_list.haml | 2 +-
src/app/views/layouts/_filter_table.haml | 5 +-
src/app/views/pool_families/_list.haml | 2 +-
.../views/pool_families/_provider_accounts.haml | 2 +-
src/app/views/provider_accounts/_list.haml | 2 +-
src/app/views/providers/_list.haml | 2 +-
src/app/views/realms/_list.haml | 2 +-
src/app/views/roles/_list.haml | 2 +-
src/app/views/suggested_deployables/index.haml | 2 +-
src/app/views/users/_list.haml | 2 +-
12 files changed, 114 insertions(+), 14 deletions(-)
diff --git a/src/app/stylesheets/layout.scss b/src/app/stylesheets/layout.scss
index 18fff1c..726d8d6 100644
--- a/src/app/stylesheets/layout.scss
+++ b/src/app/stylesheets/layout.scss
@@ -1,6 +1,6 @@
/* ###########################################################################
Generated SCSS for Aeolus UI [aeolus_ui]
-Compiled on 2011-06-16 22:42:20 -0700
+Compiled on Tue Jun 28 23:45:57 -0700 2011
########################################################################### */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
@@ -2331,6 +2331,107 @@ ul.deployment-array.small + ul.deployment-array.small{
}
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+Flat Table Component -- v.0.0.1 [flat_table] (flat_table.scss)
+~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
+
+$font-family-primary: Helvetica, Arial, "Lucida Grande", sans-serif;
+
+/* padding configuration */
+$th_padding: 8px 10px 8px 10px;
+$td_padding: 8px;
+
+/* color configuration */
+$cell_color_base: #ffffff;
+$cell_color_header: #cccccc;
+$cell_color_stripe: #efefef;
+$cell_color_selected: #f9fafe;
+$cell_color_gradient: 5%;
+
+$cell_header_text_color: #666666;
+
+/* useful mixins */
+@mixin gradient-bg($from, $to){
+ background-color: $cell_color_base;
+ background-image: -webkit-gradient(linear, 0 0, 0 100%, from($from), to($to));
+ background-image: -moz-linear-gradient($from, $to);
+ background-image: -o-linear-gradient($from, $to);
+ background-image: linear-gradient($from, $to);
+}
+
+/* Flat Table ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
+table.flat{
+
+ border-collapse: separate;
+ font-family: $font-family-primary;
+
+ /* header */
+
+ th{
+ @include gradient-bg($cell_color_base, $cell_color_header);
+ text-align: center;
+ font-size: 11px;
+ color: $cell_header_text_color;
+ font-weight: bold;
+ text-shadow: 0px 1px 0px #ffffff;
+ padding: $th_padding;
+ border-bottom: 1px solid #D6DADD;
+ border-left: 1px solid darken(#E9EAEC, $cell_color_gradient);
+ }
+
+ th.ignore{
+ background-color: transparent;
+ background-image: none;
+ border: 0;
+ }
+
+ th.ignore + th{
+ -webkit-border-top-left-radius: 5px;
+ -moz-border-radius-topleft: 5px;
+ border-top-left-radius: 5px;
+ }
+
+ td{
+ $cell_color_end: darken($cell_color_base, $cell_color_gradient);
+ border-spacing: 0px;
+ text-align: center;
+ padding: $td_padding;
+ border-top: 1px solid #fff;
+ font-size: 12px;
+ color: #333;
+ @include gradient-bg($cell_color_base, $cell_color_end);
+ border-top: 1px solid #fff;
+ border-left: 1px solid #fff;
+ border-bottom: 1px solid darken($cell_color_end, $cell_color_gradient);
+ border-right: 1px solid darken($cell_color_end, $cell_color_gradient);
+ }
+
+ tr{
+ height: 30px;
+ }
+
+ tr.stripe{
+ td{
+ $cell_color_end: darken($cell_color_stripe, $cell_color_gradient);
+ @include gradient-bg($cell_color_stripe, $cell_color_end);
+ border-bottom: 1px solid darken($cell_color_stripe, $cell_color_gradient);
+ border-right: 1px solid darken($cell_color_stripe, $cell_color_gradient);
+ }
+ }
+
+ tr.selected{
+ td{
+ $cell_color_end: darken($cell_color_selected, $cell_color_gradient);
+ @include gradient-bg($cell_color_selected, $cell_color_end);
+ border-top: 1px solid #fff;
+ border-left: 1px solid #fff;
+ border-bottom: 1px solid darken($cell_color_end, $cell_color_gradient);
+ border-right: 1px solid darken($cell_color_end, $cell_color_gradient);
+ }
+ }
+
+}
+
+/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Page Footer -- v.0.0.1 [footer] (footer.scss)
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
diff --git a/src/app/views/deployments/_list.haml b/src/app/views/deployments/_list.haml
index 874b21c..6ea9e62 100644
--- a/src/app/views/deployments/_list.haml
+++ b/src/app/views/deployments/_list.haml
@@ -13,7 +13,7 @@
= @deployments.count.to_s + " results"
= text_field_tag :q, @search_term || "Search result for...", :disabled
=> true
- %table#deployments_table
+ %table#deployments_table.flat
%tr
%th
= check_box_tag "all"
diff --git a/src/app/views/hardware_profiles/_list.haml
b/src/app/views/hardware_profiles/_list.haml
index b7a4322..98b2e95 100644
--- a/src/app/views/hardware_profiles/_list.haml
+++ b/src/app/views/hardware_profiles/_list.haml
@@ -9,7 +9,7 @@
= render :partial => 'layouts/select_all_none'
- %table#hardware_profiles_table.checkbox_table
+ %table#hardware_profiles_table.checkbox_table.flat
%thead
%tr
%th.ignore
diff --git a/src/app/views/layouts/_filter_table.haml
b/src/app/views/layouts/_filter_table.haml
index 1c50d2d..d8847cb 100644
--- a/src/app/views/layouts/_filter_table.haml
+++ b/src/app/views/layouts/_filter_table.haml
@@ -10,10 +10,9 @@
%p
= link_to('Share this view', '#')
= link_to('Add/Remove Columns', '#')
- %table(class="#{lower_class}_table")
+ %table.flat(class="#{lower_class}_table")
%thead
%tr
- columns.each do |column|
- %th
- = column[:name]
+ %th= column[:name]
= rows.collect {|row| capture_haml(row,&block)}.to_s
\ No newline at end of file
diff --git a/src/app/views/pool_families/_list.haml
b/src/app/views/pool_families/_list.haml
index 5ada358..e4b5ec1 100644
--- a/src/app/views/pool_families/_list.haml
+++ b/src/app/views/pool_families/_list.haml
@@ -9,7 +9,7 @@
= render :partial => 'layouts/select_all_none'
- %table#pool_families_table.checkbox_table
+ %table#pool_families_table.checkbox_table.flat
%thead
%tr
%th.ignore
diff --git a/src/app/views/pool_families/_provider_accounts.haml
b/src/app/views/pool_families/_provider_accounts.haml
index ea21e4d..f06c4f4 100644
--- a/src/app/views/pool_families/_provider_accounts.haml
+++ b/src/app/views/pool_families/_provider_accounts.haml
@@ -7,7 +7,7 @@
= restful_submit_tag "Remove selected", 'destroy',
multi_destroy_provider_accounts_pool_families_path(:pool_family_id =>
@pool_family.id), 'DELETE', :id => 'delete_button', :class =>
'button'
= #submit_tag "Remove selected"
- %table#provider_accounts_table
+ %table#provider_accounts_table.flat
= sortable_table_header @provider_accounts_header
- @pool_family.provider_accounts.each do |provider_account|
%tr
diff --git a/src/app/views/provider_accounts/_list.haml
b/src/app/views/provider_accounts/_list.haml
index 214f7be..50b2e25 100644
--- a/src/app/views/provider_accounts/_list.haml
+++ b/src/app/views/provider_accounts/_list.haml
@@ -9,7 +9,7 @@
= render :partial => 'layouts/select_all_none'
- %table#provider_accounts_table.checkbox_table
+ %table#provider_accounts_table.checkbox_table.flat
%thead
%tr
%th.ignore
diff --git a/src/app/views/providers/_list.haml b/src/app/views/providers/_list.haml
index 8d0d25d..7d48eca 100644
--- a/src/app/views/providers/_list.haml
+++ b/src/app/views/providers/_list.haml
@@ -9,7 +9,7 @@
= render :partial => 'layouts/select_all_none'
- %table#providers_table.checkbox_table
+ %table#providers_table.checkbox_table.flat
%thead
%tr
%th.ignore
diff --git a/src/app/views/realms/_list.haml b/src/app/views/realms/_list.haml
index 94b0ca6..fc51d7e 100644
--- a/src/app/views/realms/_list.haml
+++ b/src/app/views/realms/_list.haml
@@ -9,7 +9,7 @@
= render :partial => 'layouts/select_all_none'
- %table#realms_table.checkbox_table
+ %table#realms_table.checkbox_table.flat
%thead
%tr
%th.ignore
diff --git a/src/app/views/roles/_list.haml b/src/app/views/roles/_list.haml
index dc7251b..cb2be24 100644
--- a/src/app/views/roles/_list.haml
+++ b/src/app/views/roles/_list.haml
@@ -8,7 +8,7 @@
= submit_tag "Delete", :id => 'delete_button', :class =>
'button'
= render :partial => 'layouts/select_all_none'
- %table#roles_table.checkbox_table
+ %table#roles_table.checkbox_table.flat
%thead
%tr
%th.ignore
diff --git a/src/app/views/suggested_deployables/index.haml
b/src/app/views/suggested_deployables/index.haml
index 3a43440..c0d304e 100644
--- a/src/app/views/suggested_deployables/index.haml
+++ b/src/app/views/suggested_deployables/index.haml
@@ -12,7 +12,7 @@
= render :partial => 'layouts/select_all_none'
= filter_table(@header, @suggested_deployables, :form_header => form_header) do
|deployable|
- %table#deployables_table.checkbox_table
+ %table#deployables_table.checkbox_table.flat
%tr
%td
- selected = params[:select] == 'all'
diff --git a/src/app/views/users/_list.haml b/src/app/views/users/_list.haml
index 69a9c06..841a8e1 100644
--- a/src/app/views/users/_list.haml
+++ b/src/app/views/users/_list.haml
@@ -9,7 +9,7 @@
= render :partial => 'layouts/select_all_none'
- %table#users_table.checkbox_table
+ %table#users_table.checkbox_table.flat
%thead
%tr
%th.ignore
--
No trees were killed to send this message, but a large number of
electrons were terribly inconvenienced.