From e623bb448df52787a6cb137d8c0948d5cbaa58b6 Mon Sep 17 00:00:00 2001 From: Papick Garcia Taboada Date: Tue, 15 Mar 2016 10:55:31 +0100 Subject: [PATCH] Fixed 2px checkbox cell, streamlined both leaderboard and adminconsole table css resources --- java/com.sap.sailing.gwt.ui/Leaderboard.css | 2 +- .../gwt/ui/adminconsole/AdminConsoleTable.css | 326 +++++++++--------- .../gwt/ui/leaderboard/LeaderboardTable.css | 107 +++--- 3 files changed, 210 insertions(+), 225 deletions(-) diff --git a/java/com.sap.sailing.gwt.ui/Leaderboard.css b/java/com.sap.sailing.gwt.ui/Leaderboard.css index 2b70414a4b7..92b5cf8adae 100755 --- a/java/com.sap.sailing.gwt.ui/Leaderboard.css +++ b/java/com.sap.sailing.gwt.ui/Leaderboard.css @@ -54,7 +54,7 @@ table { .leaderboardContent td, .leaderboardContent th { vertical-align: bottom; line-height: 1.3; - padding-top: 2px; +/* padding-top: 2px; */ } .leaderboardContent-toolbar { diff --git a/java/com.sap.sailing.gwt.ui/src/main/java/com/sap/sailing/gwt/ui/adminconsole/AdminConsoleTable.css b/java/com.sap.sailing.gwt.ui/src/main/java/com/sap/sailing/gwt/ui/adminconsole/AdminConsoleTable.css index 1ae3a5988c9..15de74761f6 100644 --- a/java/com.sap.sailing.gwt.ui/src/main/java/com/sap/sailing/gwt/ui/adminconsole/AdminConsoleTable.css +++ b/java/com.sap.sailing.gwt.ui/src/main/java/com/sap/sailing/gwt/ui/adminconsole/AdminConsoleTable.css @@ -1,162 +1,164 @@ -.cellTableWidget { - border-left: 1px solid #c9caca; - border-top: 1px solid #c9caca; -} - -/** v-align images in the table header - * grey background for table header - */ -.cellTableHeader { - position: relative; - vertical-align: middle; - background-color: #e5e5e5; - border-right: 1px solid #ffffff !important; - border-top: none !important; - border-bottom: 1px solid #c9caca !important; - padding: 3px 12px; - text-align: center; -} - -.cellTableFirstColumnHeader { - position: relative; - vertical-align: middle; - background-color: #e5e5e5; - border-left: none !important; - border-right: 1px solid #ffffff !important; - border-top: none !important; - border-bottom: 1px solid #c9caca !important; - padding: 3px 12px; - text-align: center; -} - -.cellTableLastColumnHeader { - position: relative; - vertical-align: middle; - background-color: #e5e5e5; - border-right: 1px solid #c9caca !important; - border-top: none !important; - border-bottom: 1px solid #c9caca !important; - padding: 3px 12px; - text-align: center; -} - -.cellTableHeader > span > img:first-child { - position: relative; - vertical-align: middle; -} - -.cellTableEvenRow { - border-bottom: 1px solid #e5e5e5; - background-color: rgba(255,255,255,0.5); -} - -.cellTableEvenRowCell { - border-right: 1px solid #c9caca !important; - border-left: none; - border-top: none !important; - border-bottom: 1px solid #c9caca !important; - padding: 5px 10px 5px !important; - white-space: nowrap; -} - -.cellTableOddRow { - border-bottom: 1px solid #e5e5e5; - background-color: rgba(242,242,242,0.5); -} - -.cellTableOddRowCell { - border-left: none !important; - border-right: 1px solid #c9caca !important; - border-top: none !important; - border-bottom: 1px solid #c9caca !important; - padding: 5px 10px 5px !important; - white-space: nowrap; -} - -.cellTableHoveredRow { - background-color: rgba(229,242,249,0.5); - border-bottom: 1px solid #e5e5e5; -} - -.cellTableSelectedRow { - color: #000000; - background-color: rgba(229,242,249,0.5); - border-right: 2px solid #21a0e4 !important; - border-left: 2px solid #21a0e4 !important; - border: 2px solid #21a0e4; -} - -.cellTableSelectedRow > td:FIRST-CHILD { - border-left: 2px solid rgba(33,160,228,0.5) !important; -} - -.cellTableSelectedRow > td:LAST-CHILD { - border-right: 2px solid rgba(33,160,228,0.5) !important; -} - -.cellTableSelectedRowCell { - border-left: none; - border-right: 1px solid #e5e5e5; - border-top: 2px solid #21a0e4 !important; - border-bottom: 2px solid #21a0e4 !important; -} - -.cellTableRaceColumnHeader { - background-color: #e0e0e0; - padding: 3px 12px; -} - -.cellTableLegColumnHeader { - background-color: #efefef; - padding: 3px 12px; -} - -.cellTableLegDetailColumnHeader { - background-color: #f4f5f6; - padding: 3px 12px; -} - -.cellTableRaceColumn { - background-color: #e0e0e0 !important; -} - -.cellTableLegColumn { - background-color: #efefef !important; -} - -.cellTableLegDetailColumn { - background-color: #ffffff !important; -} - -.cellTableTotalColumn { - background-color: #e0e0e0 !important; -} - -.cellTableCheckboxColumnCell { - padding: 1px 1px 1px !important; - vertical-align: middle !important; - text-align: center; -} - -.cellTableCheckboxSelected { - margin-left: 0px; /* account for the selection border that pushes a selected checkbox to the side */ - margin-top: 0px; - margin-bottom: 0px; - margin-right: 2px; - height: 18px; - width: 18px; - border: solid 1px #acacac; - background-color: #cacaca; - vertical-align: middle; -} - -.cellTableCheckboxDeselected { - margin-left: 2px; /* account for the selection border that pushes a selected checkbox to the side */ - margin-top: 0px; - margin-bottom: 0px; - margin-right: 2px; - border: solid 1px #acacac; - height: 18px; - width: 18px; - vertical-align: middle; -} +.cellTableWidget { + border-left: 1px solid #c9caca; + border-top: 1px solid #c9caca; + border-collapse: collapse; +} + + + +/** v-align images in the table header + * grey background for table header + */ +.cellTableHeader { + position: relative; + vertical-align: bottom; + background-color: #e5e5e5; + border-right: 0px solid #c9caca !important; + border-top: none !important; + border-bottom: 1px solid #c9caca !important; + padding: 3px 5px; + padding-bottom: 5px; + text-align: center; + text-shadow: none !important; +} + +.cellTableFirstColumnHeader { + position: relative; + vertical-align: bottom; + background-color: #e5e5e5; + border-left: none !important; + border-right: 1px solid #c9caca !important; + border-top: none !important; + border-bottom: 1px solid #c9caca !important; + text-align: center; +} + +.cellTableLastColumnHeader { + position: relative; + vertical-align: bottom; + background-color: #e5e5e5; + border-right: 1px solid #c9caca !important; + border-top: none !important; + border-bottom: 1px solid #c9caca !important; + text-align: center; +} + +.cellTableHeader > span > img:first-child { + position: relative; + vertical-align: middle; +} + +.cellTableEvenRow { + background-color: rgba(255,255,255,0.5); +} + +.cellTableOddRow { + background-color: rgba(242,242,242,0.5); +} + +.cellTableSelectedRow { + color: #000000; + background-color: rgba(229,242,249,0.6); +} + +.cellTableSelectedRow > td:FIRST-CHILD { + border-left: 1px solid rgba(33,160,228,0.6) !important; +} + +.cellTableSelectedRow > td:LAST-CHILD { + border-right: 1px solid rgba(33,160,228,0.6) !important; +} +.cellTableSelectedRow > td { +} + +.cellTableCell { + overflow: inherit; + font-size: 12px !important; + line-height: 1.5em !important; +} +.cellTableSelectedRowCell { + border-top: 2px double #21a0e4 !important; + border-bottom: 2px double #21a0e4 !important; + padding: 7px 7px 6px 7px !important; +} + +.cellTableEvenRowCell, .cellTableOddRowCell { + border: 1px solid #c9caca; + padding: 7px; + white-space: nowrap; +} + +.cellTableCheckboxColumnCell { + padding: 1px 1px 1px !important; + vertical-align: middle !important; + text-align: center; +} + +.cellTableCheckboxSelected { + margin: auto auto; + height: 13px; + width: 13px; + border: 1px solid #fcbb22; + background-color: #fcbb22; + vertical-align: middle; +} + +.cellTableCheckboxDeselected { + margin: auto auto; + height: 13px; + width: 13px; + border: solid 1px #acacac; + vertical-align: middle; +} + +.cellTableHoveredRow { + background-color: rgba(229,242,249,0.5); + border-bottom: 1px solid #e5e5e5; +} + + +.cellTableRaceColumnHeader { + background-color: #e5e5e5; +} + +.cellTableRaceColumnHeader span:first-child{ + display: block; +} + +.cellTableRaceColumnHeader span input, .cellTableRaceColumnHeader span img{ + margin: 0 auto; +} + +.cellTableRaceColumnHeader span img { + float: left; +} + +.cellTableLegColumnHeader { + background-color: #efefef; + +} + +.cellTableLegDetailColumnHeader { + background-color: #f4f5f6; +} + +.cellTableRaceColumnHeader span > div, .cellTableLegColumnHeader span > div { + width: 19px !important; + height: 19px !important; +} + +.cellTableRaceColumn { + background-color: #e0e0e0 !important; +} + +.cellTableLegColumn { + background-color: #efefef !important; +} + +.cellTableLegDetailColumn { + background-color: #ffffff !important; +} + +.cellTableTotalColumn { + background-color: #e0e0e0 !important; +} diff --git a/java/com.sap.sailing.gwt.ui/src/main/java/com/sap/sailing/gwt/ui/leaderboard/LeaderboardTable.css b/java/com.sap.sailing.gwt.ui/src/main/java/com/sap/sailing/gwt/ui/leaderboard/LeaderboardTable.css index cf2f58f985d..11d9c412cda 100644 --- a/java/com.sap.sailing.gwt.ui/src/main/java/com/sap/sailing/gwt/ui/leaderboard/LeaderboardTable.css +++ b/java/com.sap.sailing.gwt.ui/src/main/java/com/sap/sailing/gwt/ui/leaderboard/LeaderboardTable.css @@ -1,8 +1,11 @@ .cellTableWidget { border-left: 1px solid #c9caca; border-top: 1px solid #c9caca; + border-collapse: collapse; } + + /** v-align images in the table header * grey background for table header */ @@ -10,7 +13,7 @@ position: relative; vertical-align: bottom; background-color: #e5e5e5; - border-right: 1px solid #c9caca !important; + border-right: 0px solid #c9caca !important; border-top: none !important; border-bottom: 1px solid #c9caca !important; padding: 3px 5px; @@ -46,19 +49,43 @@ } .cellTableEvenRow { - border-bottom: 1px solid #e5e5e5; - background-color: rgba(255,255,255,0.5); + background-color: rgba(255,255,255,0.5); } -.cellTableEvenRowCell { - border-right: 1px solid #c9caca !important; - border-left: none; - border-top: none !important; - border-bottom: 1px solid #c9caca !important; - padding: 7px 7px 7px; +.cellTableOddRow { + background-color: rgba(242,242,242,0.5); +} + +.cellTableSelectedRow { + color: #000000; + background-color: rgba(229,242,249,0.6); +} + +.cellTableSelectedRow > td:FIRST-CHILD { + border-left: 1px solid rgba(33,160,228,0.6) !important; +} + +.cellTableSelectedRow > td:LAST-CHILD { + border-right: 1px solid rgba(33,160,228,0.6) !important; +} +.cellTableSelectedRow > td { +} + +.cellTableCell { + overflow: inherit; + font-size: 12px !important; + line-height: 1.5em !important; +} +.cellTableSelectedRowCell { + border-top: 2px double #21a0e4 !important; + border-bottom: 2px double #21a0e4 !important; + padding: 7px 7px 6px 7px !important; +} + +.cellTableEvenRowCell, .cellTableOddRowCell { + border: 1px solid #c9caca; + padding: 7px; white-space: nowrap; - font-size: 12px !important; - line-height: 1.5 !important; } .cellTableCheckboxColumnCell { @@ -68,71 +95,27 @@ } .cellTableCheckboxSelected { - margin-left: 0px; /* account for the selection border that pushes a selected checkbox to the side */ - margin-top: 0px; - margin-bottom: 0px; - margin-right: 2px; - height: 18px; - width: 18px; - border: solid 1px #fcbb22; + margin: auto auto; + height: 13px; + width: 13px; + border: 1px solid #fcbb22; background-color: #fcbb22; vertical-align: middle; } .cellTableCheckboxDeselected { - margin-left: 2px; /* account for the selection border that pushes a selected checkbox to the side */ - margin-top: 0px; - margin-bottom: 0px; - margin-right: 2px; + margin: auto auto; + height: 13px; + width: 13px; border: solid 1px #acacac; - height: 18px; - width: 18px; vertical-align: middle; } -.cellTableOddRow { - border-bottom: 1px solid #e5e5e5; - background-color: rgba(242,242,242,0.5); -} - -.cellTableOddRowCell { - border-left: none !important; - border-right: 1px solid #c9caca !important; - border-top: none !important; - border-bottom: 1px solid #c9caca !important; - padding: 7px 7px 7px; - white-space: nowrap; - font-size: 12px !important; - line-height: 1.5 !important; -} - .cellTableHoveredRow { background-color: rgba(229,242,249,0.5); border-bottom: 1px solid #e5e5e5; } -.cellTableSelectedRow { - color: #000000; - background-color: rgba(229,242,249,0.5); - border-right: 2px solid #21a0e4 !important; - border-left: 2px solid #21a0e4 !important; - border: 2px solid #21a0e4; -} - -.cellTableSelectedRow > td:FIRST-CHILD { - border-left: 2px solid rgba(33,160,228,0.5) !important; -} - -.cellTableSelectedRow > td:LAST-CHILD { - border-right: 2px solid rgba(33,160,228,0.5) !important; -} - -.cellTableSelectedRowCell { - border-left: none; - border-right: 1px solid #e5e5e5; - border-top: 2px solid #21a0e4 !important; - border-bottom: 2px solid #21a0e4 !important; -} .cellTableRaceColumnHeader { background-color: #e5e5e5;