diff options
Diffstat (limited to 'openstack-dashboard/media/dashboard/css/openstack.css')
-rw-r--r-- | openstack-dashboard/media/dashboard/css/openstack.css | 783 |
1 files changed, 783 insertions, 0 deletions
diff --git a/openstack-dashboard/media/dashboard/css/openstack.css b/openstack-dashboard/media/dashboard/css/openstack.css new file mode 100644 index 00000000..dfbe3797 --- /dev/null +++ b/openstack-dashboard/media/dashboard/css/openstack.css @@ -0,0 +1,783 @@ +@import url("reset.css"); + +/*================== + === Misc/General + ==================*/ + +body { + background: #f1f4f6; + font: 14px/18px "Lucida Grande", "Lucida Sans", sans-serif; + margin: 0; +} + +p { margin-bottom: 10px; } +h1{ font-size: 26px; color: #333; } +h2{ font-size: 22px; color: #333; } +h3{ font-size: 18px; color: #333; } +h4{ font-size: 14px; color: #333; } + +a { color: #06C; text-decoration: none;} +a:hover { color: #005ab4; text-decoration: underline; } + +#wrapper { + width: 960px; + margin: 0 auto; +} + +.ui-state-highlight, .ui-state-error { + font-size: 14px; + width: 625px; + float: left; + padding: 17px 20px; + margin-bottom: 25px; +} + +.ui-state-highlight { background: #fcf8d7 !important; } + +.ui-state-highlight.success { + background: #baffd4 !important; + border: 1px solid #72df9b; +} + +.ui-state-error { + background: #f99 !important; +} + +.ui-state-highlight p { + padding-bottom: 0; + margin: 0; +} + +.close { + float: right; + cursor: pointer; +} + +p .ui-icon { + float: left; + margin-right: 10px; +} + + +/*================== + === Header + ==================*/ + +#header { + font-family: "Helvetica Neue", "Helvetica", Arial; + margin-top: 20px; + height: 69px; +} + +#header h1 a { + background: url(../img/logo.gif) no-repeat top left; + color: #6e6d6e; + height: 50px; + display: block; + font-weight: bold; + float: left; + padding: 25px 0 0 85px; + text-decoration: none; + margin-bottom: 20px; +} +#header h1 a span { font-weight: normal; } + +#user_info { + float: right; + width: 190px; +} + +#user_info ul { + font-size: 12px; + float: left; + list-style: disc; + margin-left: 30px; +} + + +/*================== + === Content + ==================*/ + +#content_wrap { + background: #fff; + float: left; + width: 960px; + position: relative; + margin: 0 0 25px; + border: 1px solid #ddd; + -webkit-border-radius: 10px; + -moz-border-radius: 10px; + border-radius: 10px; +} + +#content { + float: left; + padding: 25px; + width: 670px; +} + +#welcome { + float: left; + width: 309px; +} + +/* Home Page */ + + +#content.home #page_head, #content.login #page_head { + width: 870px; + float: left; +} + +#content.home { + width: 910px; +} +.block { + background-color: #dff2ff; + border: 1px solid #b1e7ff; + width: 445px; + float: left; +} + +.block h3 { + background: url(../img/table_header_bg.png) repeat-x; + font-size: 14px; + padding: 5px 0 5px 10px; + color: #fff; + text-shadow: #000 0 0 3px; + width: 435px; +} + +#content.home #projects { + float: left; + width: 445px; + margin: 0 0 10px; +} +#content.home #projects li { + border-bottom: 1px solid #bce3ff; + margin: 0; +} + +.block ul li.odd { + background: #d2edff; +} + +#content.home #projects a { + display: block; + background: url(/media/dashboard/img/server_icon.png) no-repeat 13px 9px; + padding: 5px 0 5px 58px; + font-weight: bold; +} + +#content.home #projects a:hover { + color: #052a3d; + background-color: #b8e1ff; + text-decoration: none; +} + +span.data { + color: #0d66a9; + font-size: 11px; + display: block; +} + +#home_login .error, #home_login .errorlist { + color: #fff; + background: #ef767d; + text-align: center; + border-top: 1px solid #d60004; + border-bottom: 1px solid #d60004; + width: 435px; + margin: 0 0 10px -20px; + padding: 5px; +} + +#home_login fieldset { + width: 400px; + padding: 20px; +} + +#home_login label { + display: block; + margin: 0 0 5px 0; +} + +#home_login input { + height: 25px; + font-size: 18px; + margin-bottom: 20px; + width: 396px; +} + +#home_login input[type="submit"], #lnk_register { + float: right; + height: 31px; + background: url(/media/dashboard/img/login_btn.png) top left repeat-x; + border: 1px solid #206cb5; + color: #fff; + font-weight: bold; + width: 121px; + font-size: 16px; + text-shadow: #06416e -1px -1px 2px; + cursor: pointer; + margin: 0; + -webkit-border-radius: 3px; + -moz-border-radius: 3px; + -border-radius: 3px; +} + +#lnk_register { + float: none; + padding: 8px 30px; + font-size: 14px; + text-decoration: none; + margin-left: 39px; +} + +#home_login input[type="submit"]:hover, #lnk_register:hover { + background-position: center left; +} + +#home_login input[type="submit"]:active, #lnk_register:active { + background-position: bottom left; +} + +#home_login.reset input[type="submit"]{ + font-size: 12px; +} + +#home_login div a { + margin: 0; + padding: 0; + color: #FF8885; + display: inline; +} + +#home_login div a:hover { + color: red; +} + +#forgot_password { + margin-top: 7px; + float: left; + font-size: 12px; +} + +.home_block { + width: 388px; + float: left; + margin-left: 25px; + padding: 25px; + background: #f1f1f1; + margin-bottom: 25px; + -webkit-border-radius: 5px; + -moz-border-radius: 5px; + border-radius: 5px; + +} + +.home_block ul { + margin-left: 33px; + list-style: disc; + color: #999; + margin-top: 13px; +} + +.home_block ul li { + margin-bottom: 5px; +} + +/* User Roles Manager */ + +#user_edit { + width: 628px; +} + +#user_edit .form-row { + margin-bottom: 20px; + float: left; +} + +#user_edit #user_name { + float: left; + margin-top: 10px; +} + +#user_edit label { + float: left; + width: 60px; +} + +#user_edit h2 { + font-size: 11px; + text-align: left; + padding-left: 10px; +} + +#user_edit h3 { + width: 658px; +} + +#user_edit input { + width: 150px; +} + +#user_edit select.filtered { + width: 270px; +} + +#user_edit input[type="submit"] { + height: 31px; + margin-right: 0; +} + + +/* regions */ + +#region_selector { + background: #f1f1f1; + padding: 10px; + float: left; + width: 700px; + -webkit-border-top-right-radius: 10px; + -moz-border-radius-topright: 10px; + border-top-right-radius: 10px; +} + +span#project_name { + float: left; +} + +#region_form { + float: right; +} + +#region_form label { + font-weight: bold; +} +#region_form select { + min-width: 150px; + padding-left: 10px; + margin-left: 5px; +} + +#page_head { + background: #f1f1f1; + float: left; + width: 630px; + margin: 0 0 25px; + padding: 20px; +} + +#page_head p { + margin-top: 11px; + font-size: 16px; + line-height: 21px; + color: #777; +} + +#page_head em { + color: #444; +} + +.dash_block { + float: left; + width: 267px; + background-color: #dff2ff; + border: 1px solid #b1e7ff; + padding: 20px; + margin-left: 52px; + font-size: 12px; + line-height: 23px; +} + +.dash_block.first { + margin-left: 0; +} + +.dash_block h3 { + background: url(../img/table_header_bg.png) repeat-x 0; + font-size: 14px; + padding: 5px 0 5px 10px; + color: #fff; + text-shadow: #000 0 0 3px; + margin-top: -22px; + margin-left: -20px; + width: 297px; + margin-bottom: 11px; +} + +/* Tables */ + +#content table { + width: 100%; + font-size: 12px; + margin-bottom: 25px; +} + +#content th { + background: url(../img/table_header_bg.png) repeat-x left; + padding: 5px; + border-right: 1px solid #ccc; + color: #fff; +} + +#content tr td { + background: #deeefc; + text-align: center; + height: 20px; + vertical-align: middle; + padding: 5px; +} + +#content tr td.odd { + background: #edf4ff; +} + +#content tr.odd td { + background: #c8deff; +} + +#content tr.odd td.odd { + background: #d2e5ff; +} + +td#actions { + width: 200px; + text-align: center; +} + +input[type="submit"], input[type="button"], a.launch, a.console, a.reply, .new_thread a, .edit_btns input { + background: url(../img/btn_bg.png) top left repeat-x; + border: 1px solid #95bfff; + cursor: pointer; + color: #417aa6; + font-weight: bold; + height: 30px; + font-size: 12px; + margin: 5px; + float: left; + display: block; + padding: 5px; + -webkit-border-radius: 5px; + -moz-border-radius: 5px; + border-radius: 5px; +} + +input[type="submit"]:hover, input[type="button"]:hover, a.launch:hover, a.console:hover, a.reply:hover, .new_thread a:hover { + background: url(../img/btn_bg.png) repeat-x left -30px; +} + +input[type="submit"]:active, input[type="button"]:active, a.launch:active, a.console:active, a.reply:active, .new_thread a:active { + background: url(../img/btn_bg.png) repeat-x left -60px; +} + +a.console, a.launch, a.reply, .new_thread a { + height: 18px !important; + width: 80% !important; +} + +input.delete, input.detach { + width: 95%; +} + +#right_content td.image_location { + text-align: left; +} + +h3.image_list_heading { + margin-bottom: 10px; + float: left; +} + + +/* Instances and Images */ + +h3.image_list_heading { + margin-bottom: 10px; +} + +#instances table, #image_launch { + clear: both; +} + +td.detail_wrapper { + padding: 0 !important; + text-align: left !important; + +} +div.image_detail, div.instance_detail { + background: url(/media/dashboard/img/image_detail.png) top left no-repeat; + height: 90px; + width: 674px; + padding: 8px 8px 16px 8px; + margin: 0 -9px 0 -10px; +} + +.image_detail_item, .instance_detail_item { + clear: both; +} + +.image_detail .column, .instance_detail .column { + float: left; + width: 265px; +} + +.image_detail #last.column { + width: 144px; + float: left; +} +.image_detail .label, .instance_detail .label { + font-weight: bold; + width: 85px; + float: left; +} + +.image_detail .data, .instance_detail .data{ + color: #666; + float: left; +} + +.instance_detail #last.column input, .instance_detail #last.column a { + width: 110px !important; + text-align: center; + margin: 0 0 5px 0; +} + +.instance_detail #last.column { + width: 117px; + float: right; +} +.instance_detail #last.column a { + padding: 2px 0 0 0; + height: 22px !important; + font-size: 10px; +} + +#edit_image_link, #edit_instance_link { + float: left; + font-size: 10px; + margin-left: -45px; + color: #579aff; + margin-top: -25px; +} + +#edit_image_link:hover { + color: #1d77ff; +} + +.instance_detail #last.column #edit_instance_link { + float: right; + margin: 6px 6px 0 0; +} + +.privacy { + padding: 5px; + text-transform: uppercase; + text-align: center; + float: right; + width: 102px; +} + +#public.privacy { + background: #c1e3d0; + border: 1px solid #78ca91; + color: #38a74f; +} + +#private.privacy { + background: #e3c1c1; + border: 1px solid #ca7878; + color: #a63737; +} + +.image_detail .launch { + text-align: center; + width: 100px !important; + margin: 15px 0 0 31px; +} + +.instance_detail .form-terminate input.terminate{ + clear: both; + margin: -25px 0 0 0px !important; +} + +.image_detail .delete input, #user_edit .deletelink, #update_profile input[type="reset"], .image_detail .image_privacy input, .instance_detail .form-terminate input[type="submit"], .cancel a { + background: none; + border: none; + color: #FF8885; + text-decoration: underline; + margin-top: -10px; + font-size: 9px; +} + +.image_detail .delete input:hover, .image_detail input.private:hover, #user_edit .deletelink:hover, #update_profile input[type="reset"]:hover, .instance_detail .form-terminate input[type="submit"]:hover, .cancel a:hover { + color: red; +} + +.cancel { + margin-top: 5px; + float: left; +} + +#actions a.console, #actions a.terminate { + width: 87px !important; + float: left; +} + + +/* General Sidebar Navigation */ + +#sidebar { + background: #b0cdeb; + float: left; + width: 240px; + margin-right: 0; + margin-top: 0; + margin-left: 0; + -webkit-border-bottom-left-radius: 10px; + -moz-border-radius-bottomleft: 10px; + border-bottom-left-radius: 10px; +} + +#navigation li h3 a{ + background: url(../img/nav_bg.png) repeat-x top left; + padding: 10px 0 13px 0; + text-align: center; + font-size: 14px; + display: block; + text-shadow: #252525 0 0 3px; + color: #fff; +} +#navigation li h3.active a{ background-position: 0 -41px; } + +#navigation li.first h3 a, #sidebar{ + -webkit-border-top-left-radius: 10px; + -moz-border-radius-topleft: 10px; + border-top-left-radius: 10px; + margin-top: -1px; +} + + +/* Sidebar Projects Navigation */ + +#projects a { color: #416c82; } + +#projects .project h4 a { + background: #e6e6e6; + color: #888; + display: block; + text-transform: uppercase; + font-size: 13px; + border-top: 1px solid #d4d4d4; + border-bottom: 1px solid #d4d4d4; + margin: 10px 0 10px 0; + padding: 5px 0 5px 10px; +} +#projects .project h4 a:hover { background: #eee; } + +#projects .project.active h4 a { + background: #689fce; + border-top: 1px solid #4681b2; + border-bottom: 1px solid #4681b2; + color: #fff; +} +#projects .project.active h4 a:hover { background: #7fc1f8; } + + +#projects .project { margin-bottom: 20px; } + +#projects .project ul li { + padding-left: 24px; + line-height: 23px; +} + +#projects .project ul li a{ + padding: 5px 5px 5px 10px; + display: block; + font-weight: bold; +} +#projects .project ul li a:hover { background: #f7f7f7; } + +#projects .project ul li.active a { + background: #fff; + border-bottom: 1px solid #999; + border-left: 1px solid #e1e1e1; +} + +#projects .project h4 a.manage_link{ + background: #c9c9c9 url(../img/gears.png) center 4px no-repeat !important; + width: 22px; + height: 20px; + float: right; + margin-top: -40px; + text-indent: -9999px; + border-left: 1px solid #b7b7b7; + border-bottom: none; + border-top: none; +} +#projects .project a.manage_link:hover { + background-color: #f1f1f1 !important; + border-color: #b7b7b7; +} +#projects .project.active a.manage_link { background-color: #5393c9 !important; border-color: #4c83af;} +#projects .project.active a.manage_link:hover { + background-color: #80afd6 !important; + border-color: #b7b7b7; +} + + +/* Footer */ + +#footer { + clear: both; + margin-bottom: 50px; +} + +.sitemap a { + font-weight: bold; +} + +.sitemap .sub ul a { + font-size: 12px; + font-weight: normal; +} + +/* forms */ +.dash_block form textarea, .dash_block form input[type="text"] { + padding: 5px; + width: 250px; +} +.dash_block form select { width: 264px;} +.dash_block form input[type="submit"] { + float: right; + margin-right: 23px; + margin-top: 15px; +} + +.dash_block input.create, .dash_block input.attach { + float: right; + width: 100px; + margin-right: 9px; +} + +.dash_block label { + font-weight: bold; + font-size: 14px; + clear: both; + display: block; + margin-top: 10px; +} + +.dash_block ul.errorlist, table.form .errorlist { + background: #fec6c6; + border: 1px solid #ff8e8e; + margin-left: -21px; + padding: 5px; + margin-bottom: 5px; +} + +form.edit_instance input[type="submit"], form.edit_image input[type="submit"] { + margin-right: 4px; +}
\ No newline at end of file |