From: Roland Häder Date: Sun, 23 Apr 2017 11:19:32 +0000 (+0200) Subject: Please cherry-pick: X-Git-Url: https://git.mxchange.org/?a=commitdiff_plain;h=00b47b81539eddf8d9300ada51dd063d93719dc4;p=addressbook-war.git Please cherry-pick: - updated design, now looks more modern Signed-off-by: Roland Häder --- diff --git a/web/resources/css/cssLayout.css b/web/resources/css/cssLayout.css index cf19d773..69402ba6 100644 --- a/web/resources/css/cssLayout.css +++ b/web/resources/css/cssLayout.css @@ -4,7 +4,7 @@ div, table { } /**/ -#title { +#page_title { border-bottom: 1px solid #AFAFAF; } @@ -16,7 +16,7 @@ div, table { margin: 0px 0px 10px 0px; } -#footer { +#page_footer { position: relative; background-color: #c2dfef; padding: 5px; @@ -70,17 +70,22 @@ table, .table, .table_medium { width: 500px; } +.table_footer { + margin: 2px; +} + .table_medium { - width: 620px; + width: 650px; } -.table_big { +.table_full { width: 100%; } .table_row { width: 100%; min-height: 20px; + margin: 2px; } .table_left { @@ -89,16 +94,12 @@ table, .table, .table_medium { float: left; } -.table_right, .table_right_aligned { +.table_right { width: 200px; min-height: 20px; float: right; } -.table_right_aligned { - text-align: right; -} - .table_left25 { width: 20px; min-height: 20px; @@ -118,7 +119,19 @@ table, .table, .table_medium { } .table_right_medium { - width: 250px; + width: 300px; + min-height: 20px; + float: right; +} + +.table_left25_medium { + width: 150px; + min-height: 20px; + float: left; +} + +.table_right75_medium { + width: 490px; min-height: 20px; float: right; } @@ -163,16 +176,47 @@ ul.footer_nav li.footer_copyright { padding-left: 5px; } +.menu_header { + font-weight: bold; +} + .table_header, .table_label, .message_header { text-align: center; font-weight: bold; } +.table_data_label, .table_data_field { + display: block; + border: 1px solid #aaaaaa; + border-top-right-radius: 8px; + border-bottom-left-radius: 8px; +} + +.table_data_label { + font-weight: bold; + background-image: linear-gradient(#eeeeee, #bbbbbb); + height: 16px; + padding-left: 4px; +} + +.table_data_field { + background-color: #f5f5f5; + vertical-align: top; + padding-top: 1px; + padding-bottom: 1px; + padding-left: 2px; + padding-right: 1px; + margin-top: 2px; + min-height: 15px; +} + #content_header { - background-color: #dddddd; + border-color: #888888; + background-image: linear-gradient(#eeeeee, #aaaaaa); font-weight: bold; font-size: 18px; margin-bottom: 20px; + padding-left: 5px; } .table_header_column { @@ -195,6 +239,10 @@ ul.footer_nav li.footer_copyright { color: red; } +.errors:hover { + cursor: not-allowed; +} + .fatals { color: red; font-weight: bold; @@ -208,45 +256,42 @@ ul.footer_nav li.footer_copyright { color: gold; } +.message_box, .message_box_mini { + border: 1px solid #888888; + border-top-right-radius: 8px; + border-bottom-left-radius: 8px; + background-color: #f0f0fa; +} + .message_box { width: 400px; } +.message_box_mini { + width: 160px; +} + .message_header { - background-color: #dddddd; + border-bottom: 1px solid #888888; + background-image: linear-gradient(#eeeeee, #aaaaaa); } .okay { color: #00aa00; } -.user_status_confirmed { +.user_status_confirmed, .customer_status_confirmed, .recruiter_status_confirmed { color: #00aa00; } -.user_status_unconfirmed { +.user_status_unconfirmed, .customer_status_unconfirmed { color: #00aaaa; } -.user_status_unconfirmed { +.user_status_locked, .customer_status_locked, .recruiter_status_locked { color: #aa0000; } -.data_label, .data_field { - display: block; - width: 100%; - height: 14px; - padding: 1px; - margin: 1px; - border: 1px solid #aaaaaa; - vertical-align: top; -} - -.data_label { - font-weight: bold; - background-color: #dddddd; -} - .unlink_link { color: #aaaa00; } @@ -255,8 +300,62 @@ ul.footer_nav li.footer_copyright { color: #aa0000; } +.right_space { + margin-right: 2px; +} + +#content_header, .input, .select, .submit, .reset, .delete_button, .unlink_button, .fieldset { + border: 1px solid #888888; + border-top-right-radius: 8px; + border-bottom-left-radius: 8px; +} + +.checkbox { + border: 1px solid #888888; +} + +input, textarea, select, option { + background-color: #fbfbfb; +} + +.submit, .reset, .delete_button, .unlink_button { + cursor: pointer; +} + +input:hover, textarea:hover, select:hover, option:hover { + border-color: #666666; + background-color: #eeeeee; +} + +.delete_button:hover { + border-color: #dd0000; + background-color: #aa0000; + color: #eeeeee; +} + +.unlink_button:hover { + border-color: #dddd00; + background-color: #cccc00; + color: #eeeeee; +} + .delete_button { - border: #ff0000 1px groove; + border-color: #ee0000; background-color: #880000; color: #ffffff; } + +.unlink_button { + border-color: #eeee00; + background-color: #aaaa00; + color: #ffffff; +} + +.fieldset { + padding: 5px; +} + +.input { + padding-left: 4px; + padding-right: 4px; +} diff --git a/web/resources/css/default.css b/web/resources/css/default.css index 2c2688d1..3d226fe7 100644 --- a/web/resources/css/default.css +++ b/web/resources/css/default.css @@ -7,6 +7,7 @@ body { } h1 { + border-bottom: 1px solid #AFAFAF; font-size: 16px; font-weight: bold; margin: 0px; @@ -15,13 +16,11 @@ h1 { a:link, a:visited { color: #045491; - font-weight : bold; text-decoration: none; } a:link:hover, a:visited:hover { color: #045491; - font-weight : bold; text-decoration : underline; }