From: Jiri Tomasek jtomasek@redhat.com
unified clearfixes, loading tabs
removed all font family variables, moved them to fonts css
added separate buttons css
fixed buttons alignment, obj_actions as class
aligned provider_dropdown properly
badges
content-sections fixup --- src/app/stylesheets/_buttons.scss | 345 +++++++ src/app/stylesheets/_custom.scss | 187 ++++ src/app/stylesheets/_fonts.scss | 18 + src/app/stylesheets/_header.scss | 445 ++++++++++ src/app/stylesheets/_helpers.scss | 7 + src/app/stylesheets/_mixins.scss | 30 + src/app/stylesheets/_reset.scss | 186 ++++ src/app/stylesheets/custom.scss | 199 ----- src/app/stylesheets/header.scss | 463 ---------- src/app/stylesheets/layout.scss | 937 +------------------- src/app/stylesheets/login.scss | 2 + src/app/views/catalogs/_section_header.html.haml | 2 +- src/app/views/catalogs/edit.html.haml | 2 +- src/app/views/catalogs/new.html.haml | 2 +- src/app/views/catalogs/show.html.haml | 2 +- .../views/deployables/_new_from_image.html.haml | 1 - .../views/deployables/_section_header.html.haml | 2 +- src/app/views/deployables/show.html.haml | 6 +- src/app/views/deployments/_alerts_show.html.haml | 5 +- src/app/views/deployments/_header_show.html.haml | 7 +- src/app/views/deployments/_launch_new.html.haml | 2 +- .../deployments/launch_from_catalog.html.haml | 2 +- src/app/views/deployments/show.html.haml | 7 +- src/app/views/hardware_profiles/_form.html.haml | 41 +- .../hardware_profiles/_section_header.html.haml | 2 +- src/app/views/hardware_profiles/edit.html.haml | 9 +- src/app/views/hardware_profiles/new.html.haml | 2 +- src/app/views/hardware_profiles/show.html.haml | 2 +- src/app/views/images/edit_xml.html.haml | 2 +- src/app/views/images/import.html.haml | 2 +- src/app/views/images/new.html.haml | 3 +- src/app/views/images/overview.html.haml | 2 +- src/app/views/images/show.html.haml | 11 +- .../views/layouts/_admin_content_tabs.html.haml | 1 - src/app/views/layouts/_admin_users_tabs.html.haml | 1 - src/app/views/layouts/_filter_table.html.haml | 3 +- .../views/layouts/_pretty_filter_toggle.html.haml | 6 +- src/app/views/layouts/_tabpanel.html.haml | 27 +- src/app/views/layouts/application.html.haml | 5 - src/app/views/permissions/_form.html.haml | 4 +- src/app/views/permissions/_new.html.haml | 2 +- src/app/views/pool_families/_list.html.haml | 16 +- .../views/pool_families/_section_header.html.haml | 2 +- .../pool_families/add_provider_accounts.html.haml | 11 +- src/app/views/pool_families/edit.html.haml | 2 +- src/app/views/pool_families/new.html.haml | 2 +- src/app/views/pool_families/show.html.haml | 3 +- src/app/views/pools/_alerts_index.html.haml | 5 +- src/app/views/pools/_alerts_show.html.haml | 5 +- src/app/views/pools/_edit.html.haml | 4 +- src/app/views/pools/_form.html.haml | 2 +- src/app/views/pools/_header_index.html.haml | 4 +- src/app/views/pools/_header_show.html.haml | 6 +- src/app/views/pools/show.html.haml | 7 +- .../provider_accounts/_section_header.html.haml | 2 +- src/app/views/provider_accounts/edit.html.haml | 2 +- src/app/views/provider_accounts/new.html.haml | 2 +- src/app/views/provider_accounts/show.html.haml | 2 +- .../provider_realms/_section_header.html.haml | 2 +- src/app/views/provider_realms/show.html.haml | 2 +- src/app/views/providers/_section_header.html.haml | 2 +- src/app/views/providers/edit.html.haml | 16 +- src/app/views/providers/new.html.haml | 2 +- src/app/views/realms/_section_header.html.haml | 2 +- src/app/views/realms/edit.html.haml | 5 +- src/app/views/realms/new.html.haml | 2 +- src/app/views/realms/show.html.haml | 2 +- src/app/views/roles/_form.html.haml | 10 +- src/app/views/roles/_section_header.html.haml | 2 +- src/app/views/roles/edit.html.haml | 10 +- src/app/views/roles/show.html.haml | 2 +- src/app/views/settings/index.html.haml | 16 +- src/app/views/settings/self_service.html.haml | 4 +- src/app/views/users/_list.html.haml | 4 +- src/app/views/users/_section_header.html.haml | 2 +- src/app/views/users/edit.html.haml | 2 +- src/app/views/users/new.html.haml | 2 +- src/app/views/users/show.html.haml | 6 +- src/config/locales/en.yml | 1 + .../step_definitions/hardware_profile_steps.rb | 2 +- src/public/javascripts/application.js | 6 +- src/public/stylesheets/960.css | 440 --------- src/public/stylesheets/buttons.css | 394 -------- src/public/stylesheets/facebox.css | 101 --- src/public/stylesheets/layout.css | 270 ------ src/public/stylesheets/layout_ie7.css | 2 +- src/public/stylesheets/reset.css | 171 ---- 87 files changed, 1426 insertions(+), 3117 deletions(-) create mode 100644 src/app/stylesheets/_buttons.scss create mode 100644 src/app/stylesheets/_custom.scss create mode 100644 src/app/stylesheets/_fonts.scss create mode 100644 src/app/stylesheets/_header.scss create mode 100644 src/app/stylesheets/_helpers.scss create mode 100644 src/app/stylesheets/_mixins.scss create mode 100644 src/app/stylesheets/_reset.scss delete mode 100644 src/app/stylesheets/custom.scss delete mode 100644 src/app/stylesheets/header.scss delete mode 100644 src/public/stylesheets/960.css delete mode 100644 src/public/stylesheets/buttons.css delete mode 100644 src/public/stylesheets/facebox.css delete mode 100644 src/public/stylesheets/layout.css delete mode 100644 src/public/stylesheets/reset.css
diff --git a/src/app/stylesheets/_buttons.scss b/src/app/stylesheets/_buttons.scss new file mode 100644 index 0000000..3f6703b --- /dev/null +++ b/src/app/stylesheets/_buttons.scss @@ -0,0 +1,345 @@ +/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ +Application Button Set +~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ + +/* ------------------------------------------ + * CSS3 GITHUB BUTTONS (Nicolas Gallagher) + * Licensed under Unlicense + * http://github.com/necolas/css3-github-buttons + * --------------------------------------- */ + + +/* ============================================================================= + Base Button + ========================================================================== */ + +.button { + position: relative; + overflow: visible; + display: inline-block; + padding: 0.5em 1em; + border: 1px solid #d4d4d4; + margin: 0; + text-decoration: none; + text-align: center; + text-shadow: 1px 1px 0 #fff; + font:11px/normal sans-serif; + color: #333; + white-space: nowrap; + cursor: pointer; + outline: none; + background-color: #ececec; + background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#f4f4f4), to(#ececec)); + background-image: -moz-linear-gradient(#f4f4f4, #ececec); + background-image: -ms-linear-gradient(#f4f4f4, #ececec); + background-image: -o-linear-gradient(#f4f4f4, #ececec); + background-image: linear-gradient(#f4f4f4, #ececec); + -moz-background-clip: padding; /* for Firefox 3.6 */ + background-clip: padding-box; + border-radius: 0.2em; + /* IE hacks */ + zoom: 1; + *display: inline; +} + +.button:hover, +.button:focus, +.button:active, +.button.active { + border-color: #3072b3; + border-bottom-color: #2a65a0; + text-decoration: none; + text-shadow: -1px -1px 0 rgba(0,0,0,0.3); + color: #fff; + background-color: #3c8dde; + background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#599bdc), to(#3072b3)); + background-image: -moz-linear-gradient(#599bdc, #3072b3); + background-image: -o-linear-gradient(#599bdc, #3072b3); + background-image: linear-gradient(#599bdc, #3072b3); +} + +.button:active, +.button.active { + border-color: #2a65a0; + border-bottom-color: #3884cd; + background-color: #3072b3; + background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#3072b3), to(#599bdc)); + background-image: -moz-linear-gradient(#3072b3, #599bdc); + background-image: -ms-linear-gradient(#3072b3, #599bdc); + background-image: -o-linear-gradient(#3072b3, #599bdc); + background-image: linear-gradient(#3072b3, #599bdc); +} + +/* overrides extra padding on button elements in Firefox */ +.button::-moz-focus-inner { + padding: 0; + border: 0; +} + +/* ============================================================================= + Button extensions + ========================================================================== */ + +/* Primary button + ========================================================================== */ + +.button.primary { + font-weight: bold; +} + +/* Danger button + ========================================================================== */ + +.button.danger { + color: #900; +} + +.button.danger:hover, +.button.danger:focus, +.button.danger:active { + border-color: #b53f3a; + border-bottom-color: #a0302a; + color: #fff; + background-color: #dc5f59; + background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#dc5f59), to(#b33630)); + background-image: -moz-linear-gradient(#dc5f59, #b33630); + background-image: -ms-linear-gradient(#dc5f59, #b33630); + background-image: -o-linear-gradient(#dc5f59, #b33630); + background-image: linear-gradient(#dc5f59, #b33630); +} + +.button.danger:active, +.button.danger.active { + border-color: #a0302a; + border-bottom-color: #bf4843; + background-color: #b33630; + background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#b33630), to(#dc5f59)); + background-image: -moz-linear-gradient(#b33630, #dc5f59); + background-image: -ms-linear-gradient(#b33630, #dc5f59); + background-image: -o-linear-gradient(#b33630, #dc5f59); + background-image: linear-gradient(#b33630, #dc5f59); +} + +/* Pill button + ========================================================================== */ + +.button.pill { + border-radius: 50em; +} + +/* Disabled button + ========================================================================== */ + +.button.disable { + opacity: 0.5; +} + +/* Big button + ========================================================================== */ + +.button.big { + font-size: 14px; +} + +.button.big.icon:before { + top: 0; +} + +/* ============================================================================= + Button groups + ========================================================================== */ + +/* Standard group + ========================================================================== */ + +.button-group { + display: inline-block; + list-style: none; + padding: 0; + margin: 0; + /* IE hacks */ + zoom: 1; + *display: inline; +} + +.button + .button, +.button + .button-group, +.button-group + .button, +.button-group + .button-group { + margin-left: 15px; +} + +.button-group li { + float: left; + padding: 0; + margin: 0; +} + +.button-group .button { + float: left; + margin-left: -1px; +} + +.button-group > .button:not(:first-child):not(:last-child), +.button-group li:not(:first-child):not(:last-child) .button { + border-radius: 0; +} + +.button-group > .button:first-child, +.button-group li:first-child .button { + margin-left: 0; + border-top-right-radius: 0; + border-bottom-right-radius: 0; +} + +.button-group > .button:last-child, +.button-group li:last-child > .button { + border-top-left-radius: 0; + border-bottom-left-radius: 0; +} + +/* Minor group + ========================================================================== */ + +.button-group.minor-group .button { + border: 1px solid #d4d4d4; + text-shadow: none; + background-image: none; + background-color: #fff; +} + +.button-group.minor-group .button:hover, +.button-group.minor-group .button:focus { + background-color: #599bdc; +} + +.button-group.minor-group .button:active, +.button-group.minor-group .button.active { + background-color: #3072b3; +} + +.button-group.minor-group .button.icon:before { + opacity: 0.8; +} + +/* ============================================================================= + Button container (mixing buttons and groups, e.g., nav bar) + ========================================================================== */ + +.button-container .button, +.button-container .button-group { + vertical-align: top; +} + +/* ============================================================================= + Conductor customizations + ========================================================================== */ + +/* Button_to helper in button-group fix + ========================================================================== */ +.button-group .button_to:not(:only-child) div .button.pill{ + -webkit-border-radius: 0em 50em; + -moz-border-radius: 0em 50em 50em 0em; + border-radius: 0em 50em 50em 0em; +} + +/* Launch deployment button + ========================================================================== */ +#launch_deployment_button{ + @include display_inline_block; + vertical-align: middle; + margin: 0px 0px 0px 10px; + padding: 13px 12px 9px 46px; + font-weight: bold; + font-size: 14px; + color: white; + text-decoration: none; + border: 1px solid #669933; + -webkit-border-radius: 0.2em; -moz-border-radius: 0.2em; border-radius: 0.2em; + + background: #5AB45C url(../../images/deployment_large_icon_provider_white.png) no-repeat 12px center; /* Old browsers */ + background: url(../../images/deployment_large_icon_provider_white.png) 12px center no-repeat, -moz-linear-gradient(top, #ace3ac 0%, #5ab45c 100%); /* FF3.6+ */ + background: url(../../images/deployment_large_icon_provider_white.png) 12px center no-repeat, -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ace3ac), color-stop(100%,#5ab45c)); /* Chrome,Safari4+ */ + background: url(../../images/deployment_large_icon_provider_white.png) 12px center no-repeat, -webkit-linear-gradient(top, #ace3ac 0%,#5ab45c 100%); /* Chrome10+,Safari5.1+ */ + background: url(../../images/deployment_large_icon_provider_white.png) 12px center no-repeat, -o-linear-gradient(top, #ace3ac 0%,#5ab45c 100%); /* Opera 11.10+ */ + background: url(../../images/deployment_large_icon_provider_white.png) 12px center no-repeat, -ms-linear-gradient(top, #ace3ac 0%,#5ab45c 100%); /* IE10+ */ + background: url(../../images/deployment_large_icon_provider_white.png) 12px center no-repeat, linear-gradient(top, #ace3ac 0%,#5ab45c 100%); /* W3C */ + filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ace3ac', endColorstr='#5ab45c',GradientType=0 ); /* IE6-9 */ + &:active{ + background: #458944; /* Old browsers */ + background: url(../../images/deployment_large_icon_provider_white.png) 12px center no-repeat, -moz-linear-gradient(top, #9ecc9b 0%, #458944 100%); /* FF3.6+ */ + background: url(../../images/deployment_large_icon_provider_white.png) 12px center no-repeat, -webkit-gradient(linear, left top, left bottom, color-stop(0%,#9ecc9b), color-stop(100%,#458944)); /* Chrome,Safari4+ */ + background: url(../../images/deployment_large_icon_provider_white.png) 12px center no-repeat, -webkit-linear-gradient(top, #9ecc9b 0%, #458944 100%); /* Chrome10+,Safari5.1+ */ + background: url(../../images/deployment_large_icon_provider_white.png) 12px center no-repeat, -o-linear-gradient(top, #9ecc9b 0%, #458944 100%); /* Opera 11.10+ */ + background: url(../../images/deployment_large_icon_provider_white.png) 12px center no-repeat, -ms-linear-gradient(top, #9ecc9b 0%, #458944 100%); /* IE10+ */ + background: url(../../images/deployment_large_icon_provider_white.png) 12px center no-repeat, linear-gradient(top, #9ecc9b 0%, #458944 100%); /* W3C */ + filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9ecc9b', endColorstr='#458944',GradientType=0 ); /* IE6-9 */ + -webkit-box-shadow: inset 1px 1px 2px 0px #333; -moz-box-shadow: inset 1px 1px 2px 0px #333; box-shadow: inset 1px 1px 2px 0px #333; + } + &[type=submit][disabled=disabled], + &[disabled=disabled], + &.disabled{ + cursor: default; + zoom: 1; + filter: alpha(opacity=50); + -moz-opacity:0.5; + opacity: 0.5; + } +} + +/* Pretty/Filter view toggle + ========================================================================== */ +span.view-toggle{ + @include display_inline_block; +} + +a.view-toggle{ + background: url('../../images/button-viewtoggle.png') no-repeat top left; + display: block; + float:left; + width: 38px; + height: 27px; +} + +a.view-toggle.pretty{ + &:active{ + background-position: -75px 0px; + } +} + +a.view-toggle.filter{ + width: 36px; + background-position: -39px 0px; + &:active{ + background-position: -114px 0px; + } +} + +a.view-toggle.pretty.active{ + background-position: -75px 0px; +} + +a.view-toggle.filter.active{ + background-position: -114px 0px; +} + +/* Return to div + ========================================================================== */ +div.return_to{ + @include display_inline_block; + + a{ + background: #cccccc; + color: black; + text-decoration: none; + font-weight: bold; + padding: 3px 6px; + -webkit-border-radius: 12px; -moz-border-radius: 12px; border-radius: 12px; + border: none; + } +} + +.return_to + .button-group, +.return_to + .button{ + margin-left: 15px; +} diff --git a/src/app/stylesheets/_custom.scss b/src/app/stylesheets/_custom.scss new file mode 100644 index 0000000..ec407bc --- /dev/null +++ b/src/app/stylesheets/_custom.scss @@ -0,0 +1,187 @@ +.pool_details { + color: #333; + text-decoration: none; +} + +/*launch time params*/ +.hidden { + display: none; +} + +table.light_table tbody { + tr.collapsed { + display: none; + } + + ul li { + list-style-type: none; + } +} + +.launch-time-params h2 { + font-size: 16px; + font-weight: normal; + text-align: center; +} + +$services_width: 250px; +$services_border: 1px solid #b0b0b0; +$services_background: #efefef; + +form.generic section.services { + position: relative; + border: $services_border; + margin: 1em; + padding: 0 0 1em; + -webkit-border-radius: 1em; + -moz-border-radius: 1em; + border-radius: 1em; + min-height: 300px; + background: $services_background; + overflow: hidden; + + .labels { + margin-top: 64px; + width: 250px; + float: left; + + h4.service { + font-size: 14px; + font-weight: normal; + position: relative; + z-index: 1; + $left_padding: 26px; + padding: 0.5em 0 0.5em $left_padding; + width: $services_width - $left_padding + 1px; + border-bottom: 1px solid transparent; + + &:hover { + background: darken($services_background, 20%); + cursor: pointer; + } + &.selected { + background: $services_background; + border-bottom: $services_border; + cursor: default; + } + &.filled-out { + background-image: url('../../images/filled_out_params_indicator.png'); + background-repeat: no-repeat; + background-position: 8px center; + } + } + } + + .params-container { + margin-left: 250px; + + .parameters { + display: none; + top: 88px; + left: $services_width; + padding: 1em; + } + } + + #service-headers { + position: absolute; + z-index: 0; + background: transparent url('../../images/services_bg.png') repeat top center; + top: 0; + left: 0; + height: 100%; + border-right: $services_border; + width: $services_width; + + $left-corners: 1em 0 0 1em; + -webkit-border-radius: $left-corners; + -moz-border-radius: $left-corners; + border-radius: $left-corners; + } + + + header { + background-image: none; + background: #dddddd; + margin-left: $services_width; + padding: 1em; + height: 40px; + + $topright-corner: 0 1em 0 0; + -webkit-border-radius: $topright-corner; + -moz-border-radius: $topright-corner; + border-radius: $topright-corner; + + h3 { + font-size: 22px; + font-weight: normal; + } + } + + label { + display: block; + float: left; + min-width: 120px; + text-align: right; + padding: 6px 7px 5px 0px; + font-size: 14px; + text-shadow: 0px 1px 0px #ffffff; + font-weight: normal; + } +} + +.catalog_deployments_and_images{ + color: #606060; + position: relative; + h1{ + font-size: 16px; + } + h2{ + font-size: 12px; + padding-left: 10px; + padding-top: 10px; + } + h3{ + font-size: 12px; + padding-left: 10px; + } + ul li{ + padding-left: 10px; + padding-top:5px; + list-style-type: none; + } +} + +#no-catalog-entry { + margin-bottom: 30px; +} + +.instance_details, .confirm_instances_termination { + + h3{ + font-size: 22px; + font-weight: normal; + margin-bottom: 10px; + } + + ul li { + list-style-type: none; + margin: 10px 15px; + font-weight: bold; + span { + font-weight: normal; + } + } + + ol{ + margin: 15px; + li { + margin:10px 15px; + } + } +} + +.pagination{ + margin-top: 10px; + text-align: center; +} diff --git a/src/app/stylesheets/_fonts.scss b/src/app/stylesheets/_fonts.scss new file mode 100644 index 0000000..e20293f --- /dev/null +++ b/src/app/stylesheets/_fonts.scss @@ -0,0 +1,18 @@ +@font-face { + font-family: 'Overpass'; + src: url("../../fonts/overpass_regular-web.eot"); + src: local("Overpass"), url("../../fonts/overpass_regular-web.eot?#iefix") format("eot"), url("../../fonts/overpass_regular-web.woff") format("woff"), url("../../fonts/overpass_regular-web.ttf") format("truetype"), url("../../fonts/overpass_regular-web.svg#webfontLTZe4IYH") format("svg"); + font-weight: normal; + font-style: normal; } + + +@font-face { + font-family: 'Overpass'; + src: url("../../fonts/overpass_bold-web.eot"); + src: local("Overpass Bold"), local("Overpass-Bold"), url("../../fonts/overpass_bold-web.eot?#iefix") format("eot"), url("../../fonts/overpass_bold-web.woff") format("woff"), url("../../fonts/overpass_bold-web.ttf") format("truetype"), url("../../fonts/overpass_bold-web.svg#webfontzAU82Ltw") format("svg"); + font-weight: bold; + font-style: normal; } + +$font-family-base: "Lucida Sans Unicode", "Lucida Grande", Verdana, Arial, Helvetica, sans-serif; +$font-family-em: "Lucida Sans", "Lucida Sans Unicode", "Lucida Grande", Verdana, Arial, Helvetica, sans-serif; +$font-family-primary: "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; diff --git a/src/app/stylesheets/_header.scss b/src/app/stylesheets/_header.scss new file mode 100644 index 0000000..0e4c1f1 --- /dev/null +++ b/src/app/stylesheets/_header.scss @@ -0,0 +1,445 @@ +/* Adapted normalization */ + +.hidden { + display: none; } + +.shell-design { + section { + display: none; + &.active { + display: block; } } + article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { + display: block; } + a { + color: #36c; + &:visited { + color: #36c; } + &:hover { + color: #000; } + &:focus { + outline: none; + box-shadow: 0 0 3px 3px #fa0; } + &:hover, &:active { + outline: none; } } + b, strong { + font-weight: bold; } + img { + border: 0; + -ms-interpolation-mode: bicubic; + vertical-align: middle; } + svg:not(:root) { + overflow: hidden; } } + +/* Some header-specific styling */ + +header.shell-design { + height: 5.5em; + background-color: #1a1f22; + position: relative; + color: #fff; + border-bottom: .4em solid #060807; + border-top: .4em solid #060807; + box-shadow: inset 0em -0.1em #181c1e, inset 0px -2em 5em #101214; + h1 { + font-size: 1em; + text-transform: uppercase; + position: absolute; + top: .9em; + left: 0; + line-height: 1.5em; + text-indent: 2em; + color: #fff; + em { + border-left: .1em solid #fff; + padding-left: .25em; + margin-left: .25em; + font-style: normal; } } + > article { + margin: 0 auto; + max-width: 80em; + line-height: 2em; + position: relative; + padding: 0em; + padding-left: 20em; } } + +/* Navigation */ + +nav#appnav { + display: table; + font-weight: normal; + border: .2em solid #181c1e; + border-bottom: none transparent 0px; + margin-top: 2.25em; + border-radius: .25em .25em 0em 0em; + white-space: nowrap; + > ul { + > li { + > ul > li a { + color: #777; } + display: block; + vertical-align: top; + float: left; + a { + display: block; + width: 100%; + text-decoration: none; + clear: both; + padding: 0em; + text-indent: 1.5em; + text-transform: capitalize; + position: relative; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + &.selected{ background-color: #444; } + } + > a { + color: #bbb; + padding: .75em 1em; + text-align: center; + text-indent: 0em; + border-style: none solid; + border-width: 0px .1em; + border-color: transparent #181c1e; + background-color: #1f2123; + box-shadow: inset 0px -3.5em 2em -2em #15191b; + &:active { + color: #fff; + background-color: #4a4e50; } + &:hover { + /*box-shadow*/ + -webkit-box-shadow: 0em 0em 1em rgba(0, 0, 0, 0.32); + -moz-box-shadow: 0em 0em 1em rgba(0, 0, 0, 0.32); + box-shadow: 0em 0em 1em rgba(0, 0, 0, 0.32); + cursor: pointer; } + &:focus, &:active { + box-shadow: inset 0px -4em 3em -2em rgba(0, 0, 0, 0.4); } } + position: relative; + &:hover { + > a { + box-shadow: inset 0px -4em 3em -2em rgba(0, 0, 0, 0.4); } + li:hover > a, > a { + background-color: #4a4e50; + color: #fff; } } + a { + &:hover, &:focus { + background-color: #4a4e50; + color: #fff; } } + &:first-child > a { + /*border-radius*/ + -webkit-border-radius: .225em 0em 0em 0em; + -moz-border-radius: .225em 0em 0em 0em; + border-radius: .225em 0em 0em 0em; + border-left: 0px transparent none; } + &:last-child > a { + /*border-radius*/ + -webkit-border-radius: 0em .225em 0em 0em; + -moz-border-radius: 0em .225em 0em 0em; + border-radius: 0em .225em 0em 0em; + border-right: 0px transparent none; } + > ul > li:last-child > a { + /*border-radius*/ + -webkit-border-radius: 0em 0em .25em .25em; + -moz-border-radius: 0em 0em .25em .25em; + border-radius: 0em 0em .25em .25em; } } + display: table-row; } + ul a:after { + z-index: 3; + content: ""; + width: 100%; + height: 50%; + top: 0; + left: 0; + right: 0; + display: block; + position: absolute; } + > ul > li { + a:focus ~ ul, &:hover ul { + background-color: white; + /*box-shadow*/ + -webkit-box-shadow: 0em 0.025em 0.5em rgba(0, 0, 0, 0.5); + -moz-box-shadow: 0em 0.025em 0.51em rgba(0, 0, 0, 0.5); + box-shadow: 0em 0.025em 0.51em rgba(0, 0, 0, 0.5); + /*border-radius*/ + -webkit-border-radius: 0em 0em .25em .25em; + -moz-border-radius: 0em 0em .25em .25em; + border-radius: 0em 0em .25em .25em; + display: block; + width: 100%; + top: 0em; + left: 0; } } } + +/* I'm doubtful that this actually matches anythign */ + +.no-boxshadow header nav#appnav > ul > li:hover ul { + border: 1px solid #ccc; + margin: -0.1px; } + +header.shell-design { + nav#appnav > ul > li { + &:hover > ul { + z-index: 9999 !important; + /*painfully silly hack*/ + margin-top: -0.25em; + padding-top: 0em !important; + } + > ul > li:hover { + position: relative; } + &:hover > ul > li > ul { + position: absolute; + box-shadow: none; + background-color: transparent; + top: 0em; + left: 100%; + padding-top: 0em; + > li { + display: none; } } + a:focus ~ ul, &:hover > ul { + z-index: 1; + padding-top: 1em; + display: block; + position: absolute; + top: 3.5em; + opacity: 1; } + a:focus ~ li ul li, &:hover > ul > li:hover > ul > li { + display: block; } + a:focus ~ li ul, &:hover > ul > li:hover ul { + /*box-shadow*/ + -webkit-box-shadow: 0.025em 0.025em 0.51em rgba(0, 0, 0, 0.5); + -moz-box-shadow: 0.025em 0.025em 0.51em rgba(0, 0, 0, 0.5); + box-shadow: 0.025em 0.025em 0.51em rgba(0, 0, 0, 0.5); + /*border-radius*/ + -webkit-border-radius: 0em .25em .25em 0em; + -moz-border-radius: 0em .25em .25em 0em; + border-radius: 0em .25em .25em 0em; + background-color: white; + z-index: 1; + opacity: 1; } + > { + ul { + > li { + > ul li { + &:first-child a { + /*border-radius*/ + -webkit-border-radius: .0em .25em 0em 0em; + -moz-border-radius: .0em .25em 0em 0em; + border-radius: .0em .25em 0em 0em; } + &:last-child a { + /*border-radius*/ + -webkit-border-radius: 0em 0em .25em .0em; + -moz-border-radius: 0em 0em .25em .0em; + border-radius: 0em 0em .25em .0em; } + &:first-child:hover a:after { + z-index: 9; + display: block; + position: absolute; + top: .5em; + left: 0em; + content: ""; + height: 0; + width: 0; + border-width: .5em 0em .5em .5em; + border-style: solid none solid solid; + border-color: transparent transparent transparent #fff; } } + ul { + &:before { + z-index: 2; + display: block; + position: absolute; + top: 0em; + left: -0.14em; + content: ""; + height: 0; + width: 0; + border-width: 1em 0em 1em 1em; + border-style: solid none solid solid; + border-color: transparent transparent transparent transparent; } + &:after { + z-index: 1; + display: block; + position: absolute; + top: .5em; + left: -1em; + content: ""; + height: 0; + width: 0; + opacity: 1; + z-index: 2; + border-width: .5em 0em .5em .5em; + border-style: solid none solid solid; + border-color: transparent transparent transparent #ccc; } } + a:hover ~ ul:before, &:hover ul:before { + top: 0em; + border: solid 1em #4a4e50; + left: -1.98em; } + a:hover ~ ul:after, &:hover ul:after { + top: 0em; + border-color: transparent transparent transparent #4a4e50; + left: 0em; + content: ""; + height: 0; + width: 0; + border-width: 1em 0em 1em 1em; + border-style: solid none solid solid; } } + position: absolute; + left: 0; + display: none; + line-height: 2em !important; + min-width: 16em; + max-width: 22em; } + a.active { + position: relative; + &:after { + z-index: 9; + position: absolute; + top: 3.1em; + left: 50%; + margin-left: -0.55em; + display: block; + content: ""; + width: 0; + height: 0; + border-width: 0em .55em .55em .55em; + border-style: none solid solid solid; + border-color: transparent transparent #fff transparent; } } } + position: relative; } + &.shell-design > article section:last-child { + text-align: right; + position: absolute; + top: -1.75em; + right: 0em; + margin: 0 auto; + display: block; + a { + border: 0.1em solid rgba(255, 255, 255, 0.12); + color: #ccc !important; + border-radius: 0em 0em .5em .5em; + color: #fff; + text-decoration: none; + background-color: #181c1e; + box-shadow: inset 0px 1.5em 1em -1em rgba(222, 222, 255, 0.1); + display: inline-block; + padding: .1em 1em; + position: relative; + margin: 1.25em .1em; + &:last-child { + padding-right: 2em; + &:after { + content: ""; + display: block; + height: 0px; + width: 0px; + position: absolute; + top: .75em; + right: .5em; + border-style: solid solid none solid; + border-width: .5em .5em 0em .5em; + border-color: #666 transparent transparent; } } + &:first-child { + padding-left: 3em; + &:after { + /*content: "!";*/ + color: #2e4e66; + text-align: center; + background-color: #ccc !important; + width: 1em; + height: 1em; + border-radius: 50%; + position: absolute; + top: .25em; + left: .5em; + line-height: 1em; + font-size: 1.5em; + display: block; + background-color: transparent; + z-index: 2; } } } } } + +/* + header nav#appnav > ul > li > ul > li +*/ + +/* The below is good */ + +/* Some new stuff */ + +/* Is this legit? */ + +.shell-design { + * { + /* + this is life saving but locks us into > ie8 will consider this polyfil for lt-ie8 + https://github.com/Schepp/box-sizing-polyfill + */ + -moz-box-sizing: border-box !important; + -webkit-box-sizing: border-box !important; + box-sizing: border-box !important; + background-repeat: no-repeat; + vertical-align: middle; + font-family: overpass; } + a { + &:hover, &:focus, &:active { + color: #fa0; } + &:focus { + outline: none !important; } + &:link { + color: #36c; } } + article { + &:before { + content: ""; + display: table; } + &:after { + content: ""; + display: table; + clear: both; } } } + +/* Wait, do we actually want this? */ + +/* User dropdown menu definition */ + +section#usermenu { + position: absolute; + left: 80%; + width: 20%; + padding: 5px 2px 5px 2px; + cursor: pointer; + z-index: 9999; + > a { + width: 100%; } + > ul { + list-style-type: none; + display: none; + border: none; + padding: 0em; + margin: 0em; + top: 4em; + float: left; + position: absolute; + z-index: 9999; + width: 100%; + &:before { + display: none; + content: none; } } + &:hover > ul { + display: block; + } + > ul { + > li { + padding: 0em; + margin: 0em; + border-color: transparent !important; + background-image: none !important; + box-shadow: none !important; } + li { + a { + margin: 0em; + padding: .5em 2em; + border-radius: 0; + border-color: transparent !important; + box-shadow: none !important; + &:hover { + color: #FFF !important; + text-decoration: underline; } } + &:last-child a { + border-radius: 0em 0em .51em .51em; } + a:after { + content: none; } } } } diff --git a/src/app/stylesheets/_helpers.scss b/src/app/stylesheets/_helpers.scss new file mode 100644 index 0000000..46b1e97 --- /dev/null +++ b/src/app/stylesheets/_helpers.scss @@ -0,0 +1,7 @@ +/* ####################################################################################################### +HELPERS +####################################################################################################### */ + +.clearfix { @include clearfix; } + +.align-center{ text-align: center; } diff --git a/src/app/stylesheets/_mixins.scss b/src/app/stylesheets/_mixins.scss new file mode 100644 index 0000000..011b2f3 --- /dev/null +++ b/src/app/stylesheets/_mixins.scss @@ -0,0 +1,30 @@ +/* ####################################################################################################### +MIXINS +####################################################################################################### */ + +@mixin display_inline_block { + display: -moz-inline-stack; + display: inline-block; + vertical-align: top; + zoom: 1; + *display: inline; +} + +@mixin clearfix { + *zoom: 1; + &:before, &:after { + display: table; + content: ""; + } + &:after { + clear: both; + } +} + +@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); +} diff --git a/src/app/stylesheets/_reset.scss b/src/app/stylesheets/_reset.scss new file mode 100644 index 0000000..4d2ce40 --- /dev/null +++ b/src/app/stylesheets/_reset.scss @@ -0,0 +1,186 @@ +/* ################################################################################################### +XHTML, HTML4, HTML5 Reset +################################################################################################### */ + +a, +abbr, +acronym, +address, +applet, +article, +aside, +audio, +b, +big, +blockquote, +body, +canvas, +caption, +center, +cite, +code, +dd, +del, +details, +dfn, +dialog, +div, +dl, +dt, +em, +embed, +fieldset, +figcaption, +figure, +font, +footer, +form, +h1, +h2, +h3, +h4, +h5, +h6, +header, +hgroup, +hr, +html, +i, +iframe, +img, +ins, +kbd, +label, +legend, +li, +mark, +menu, +meter, +nav, +object, +ol, +output, +p, +pre, +progress, +q, +rp, +rt, +ruby, +s, +samp, +section, +small, +span, +strike, +strong, +sub, +summary, +sup, +table, +tbody, +td, +tfoot, +th, +thead, +time, +tr, +tt, +u, +ul, +var, +video, +xmp { + border: 0; + margin: 0; + padding: 0; + font-size: 100%; + outline: none; +} + +article, +aside, +details, +figcaption, +figure, +footer, +header, +hgroup, +menu, +nav, +section { +/* + Override the default (display: inline) for + browsers that do not recognize HTML5 tags. + + IE8 (and lower) requires a shiv: + http://ejohn.org/blog/html5-shiv +*/ + display: block; +} + +b, +strong { +/* + Makes browsers agree. + IE + Opera = font-weight: bold. + Gecko + WebKit = font-weight: bolder. +*/ + font-weight: bold; +} + +img { + color: transparent; + font-size: 0; + vertical-align: middle; +/* + For IE. + http://css-tricks.com/ie-fix-bicubic-scaling-for-images +*/ + -ms-interpolation-mode: bicubic; +} + +li { +/* + For IE6 + IE7. +*/ + display: list-item; +} + +table { + border-collapse: collapse; + border-spacing: 0; +} + +th, +td, +caption { + font-weight: normal; + vertical-align: top; + text-align: left; +} + +svg { +/* + For IE9. +*/ + overflow: hidden; +} + +form{ + display: inline; +} + +button::-moz-focus-inner, input[type="button"]::-moz-focus-inner, input[type="submit"]::-moz-focus-inner, input[type="reset"]::-moz-focus-inner { + padding: 0 !important; + border: 0 none !important; +} +button, input[type="button"], input[type="submit"], input[type="reset"] { + cursor: pointer; +} + +// prevent image UUID's to overflow the layout +h1,h2,h3,h4,h5,h6{ word-wrap: break-word; } + +//rails creates div inside button_to form. Make it inline +form.button_to > div {display: inline;} diff --git a/src/app/stylesheets/custom.scss b/src/app/stylesheets/custom.scss deleted file mode 100644 index 93b85c0..0000000 --- a/src/app/stylesheets/custom.scss +++ /dev/null @@ -1,199 +0,0 @@ -/*fixes the button_to helper used in button-group problem*/ -.button-group .button_to:not(:only-child) div .button.pill{ - -webkit-border-radius: 0em 50em; - -moz-border-radius: 0em 50em 50em 0em; - border-radius: 0em 50em 50em 0em; -} - -.pool_details { - color: #333; - text-decoration: none; -} - -.loading_tabs { - height: 30px; - display:block; - background: url(../../images/loading.gif) no-repeat center; -} - -.hidden { - display: none; -} - -table.light_table tbody { - tr.collapsed { - display: none; - } - - ul li { - list-style-type: none; - } -} - -.launch-time-params h2 { - font-size: 16px; - font-weight: normal; - text-align: center; -} - -$services_width: 250px; -$services_border: 1px solid #b0b0b0; -$services_background: #efefef; - -form.generic section.services { - position: relative; - border: $services_border; - margin: 1em; - padding: 0 0 1em; - -webkit-border-radius: 1em; - -moz-border-radius: 1em; - border-radius: 1em; - min-height: 300px; - background: $services_background; - overflow: hidden; - - .labels { - margin-top: 64px; - width: 250px; - float: left; - - h4.service { - font-size: 14px; - font-weight: normal; - position: relative; - z-index: 1; - $left_padding: 26px; - padding: 0.5em 0 0.5em $left_padding; - width: $services_width - $left_padding + 1px; - border-bottom: 1px solid transparent; - - &:hover { - background: darken($services_background, 20%); - cursor: pointer; - } - &.selected { - background: $services_background; - border-bottom: $services_border; - cursor: default; - } - &.filled-out { - background-image: url('../../images/filled_out_params_indicator.png'); - background-repeat: no-repeat; - background-position: 8px center; - } - } - } - - .params-container { - margin-left: 250px; - - .parameters { - display: none; - top: 88px; - left: $services_width; - padding: 1em; - } - } - - #service-headers { - position: absolute; - z-index: 0; - background: transparent url('../../images/services_bg.png') repeat top center; - top: 0; - left: 0; - height: 100%; - border-right: $services_border; - width: $services_width; - - $left-corners: 1em 0 0 1em; - -webkit-border-radius: $left-corners; - -moz-border-radius: $left-corners; - border-radius: $left-corners; - } - - - header { - background-image: none; - background: #dddddd; - margin-left: $services_width; - padding: 1em; - height: 40px; - - $topright-corner: 0 1em 0 0; - -webkit-border-radius: $topright-corner; - -moz-border-radius: $topright-corner; - border-radius: $topright-corner; - - h3 { - font-size: 22px; - font-weight: normal; - } - } - - label { - display: block; - float: left; - min-width: 120px; - text-align: right; - padding: 6px 7px 5px 0px; - font-size: 14px; - text-shadow: 0px 1px 0px #ffffff; - font-weight: normal; - } -} - -.catalog_deployments_and_images{ - color: #606060; - position: relative; - h1{ - font-size: 16px; - } - h2{ - font-size: 12px; - padding-left: 10px; - padding-top: 10px; - } - h3{ - font-size: 12px; - padding-left: 10px; - } - ul li{ - padding-left: 10px; - padding-top:5px; - list-style-type: none; - } -} - -#no-catalog-entry { - margin-bottom: 30px; -} - -.instance_details, .confirm_instances_termination { - - h3{ - font-size: 22px; - font-weight: normal; - margin-bottom: 10px; - } - - ul li { - list-style-type: none; - margin: 10px 15px; - font-weight: bold; - span { - font-weight: normal; - } - } - - ol{ - margin: 15px; - li { - margin:10px 15px; - } - } -} - -.pagination{ - margin-top: 10px; - text-align: center; -} diff --git a/src/app/stylesheets/header.scss b/src/app/stylesheets/header.scss deleted file mode 100644 index dca6cc2..0000000 --- a/src/app/stylesheets/header.scss +++ /dev/null @@ -1,463 +0,0 @@ -/* @font-face setup */ - -@font-face { - font-family: 'Overpass'; - src: url("../../fonts/overpass_regular-web.eot"); - src: local("Overpass"), url("../../fonts/overpass_regular-web.eot?#iefix") format("eot"), url("../../fonts/overpass_regular-web.woff") format("woff"), url("../../fonts/overpass_regular-web.ttf") format("truetype"), url("../../fonts/overpass_regular-web.svg#webfontLTZe4IYH") format("svg"); - font-weight: normal; - font-style: normal; } - - -@font-face { - font-family: 'Overpass'; - src: url("../../fonts/overpass_bold-web.eot"); - src: local("Overpass Bold"), local("Overpass-Bold"), url("../../fonts/overpass_bold-web.eot?#iefix") format("eot"), url("../../fonts/overpass_bold-web.woff") format("woff"), url("../../fonts/overpass_bold-web.ttf") format("truetype"), url("../../fonts/overpass_bold-web.svg#webfontzAU82Ltw") format("svg"); - font-weight: bold; - font-style: normal; } - - -/* Adapted normalization */ - -.hidden { - display: none; } - -.shell-design { - section { - display: none; - &.active { - display: block; } } - article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { - display: block; } - a { - color: #36c; - &:visited { - color: #36c; } - &:hover { - color: #000; } - &:focus { - outline: none; - box-shadow: 0 0 3px 3px #fa0; } - &:hover, &:active { - outline: none; } } - b, strong { - font-weight: bold; } - img { - border: 0; - -ms-interpolation-mode: bicubic; - vertical-align: middle; } - svg:not(:root) { - overflow: hidden; } } - -/* Some header-specific styling */ - -header.shell-design { - height: 5.5em; - background-color: #1a1f22; - position: relative; - color: #fff; - border-bottom: .4em solid #060807; - border-top: .4em solid #060807; - box-shadow: inset 0em -0.1em #181c1e, inset 0px -2em 5em #101214; - h1 { - font-size: 1em; - text-transform: uppercase; - position: absolute; - top: .9em; - left: 0; - line-height: 1.5em; - text-indent: 2em; - color: #fff; - em { - border-left: .1em solid #fff; - padding-left: .25em; - margin-left: .25em; - font-style: normal; } } - > article { - margin: 0 auto; - max-width: 80em; - line-height: 2em; - position: relative; - padding: 0em; - padding-left: 20em; } } - -/* Navigation */ - -nav#appnav { - display: table; - font-weight: normal; - border: .2em solid #181c1e; - border-bottom: none transparent 0px; - margin-top: 2.25em; - border-radius: .25em .25em 0em 0em; - white-space: nowrap; - > ul { - > li { - > ul > li a { - color: #777; } - display: block; - vertical-align: top; - float: left; - a { - display: block; - width: 100%; - text-decoration: none; - clear: both; - padding: 0em; - text-indent: 1.5em; - text-transform: capitalize; - position: relative; - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - &.selected{ background-color: #444; } - } - > a { - color: #bbb; - padding: .75em 1em; - text-align: center; - text-indent: 0em; - border-style: none solid; - border-width: 0px .1em; - border-color: transparent #181c1e; - background-color: #1f2123; - box-shadow: inset 0px -3.5em 2em -2em #15191b; - &:active { - color: #fff; - background-color: #4a4e50; } - &:hover { - /*box-shadow*/ - -webkit-box-shadow: 0em 0em 1em rgba(0, 0, 0, 0.32); - -moz-box-shadow: 0em 0em 1em rgba(0, 0, 0, 0.32); - box-shadow: 0em 0em 1em rgba(0, 0, 0, 0.32); - cursor: pointer; } - &:focus, &:active { - box-shadow: inset 0px -4em 3em -2em rgba(0, 0, 0, 0.4); } } - position: relative; - &:hover { - > a { - box-shadow: inset 0px -4em 3em -2em rgba(0, 0, 0, 0.4); } - li:hover > a, > a { - background-color: #4a4e50; - color: #fff; } } - a { - &:hover, &:focus { - background-color: #4a4e50; - color: #fff; } } - &:first-child > a { - /*border-radius*/ - -webkit-border-radius: .225em 0em 0em 0em; - -moz-border-radius: .225em 0em 0em 0em; - border-radius: .225em 0em 0em 0em; - border-left: 0px transparent none; } - &:last-child > a { - /*border-radius*/ - -webkit-border-radius: 0em .225em 0em 0em; - -moz-border-radius: 0em .225em 0em 0em; - border-radius: 0em .225em 0em 0em; - border-right: 0px transparent none; } - > ul > li:last-child > a { - /*border-radius*/ - -webkit-border-radius: 0em 0em .25em .25em; - -moz-border-radius: 0em 0em .25em .25em; - border-radius: 0em 0em .25em .25em; } } - display: table-row; } - ul a:after { - z-index: 3; - content: ""; - width: 100%; - height: 50%; - top: 0; - left: 0; - right: 0; - display: block; - position: absolute; } - > ul > li { - a:focus ~ ul, &:hover ul { - background-color: white; - /*box-shadow*/ - -webkit-box-shadow: 0em 0.025em 0.5em rgba(0, 0, 0, 0.5); - -moz-box-shadow: 0em 0.025em 0.51em rgba(0, 0, 0, 0.5); - box-shadow: 0em 0.025em 0.51em rgba(0, 0, 0, 0.5); - /*border-radius*/ - -webkit-border-radius: 0em 0em .25em .25em; - -moz-border-radius: 0em 0em .25em .25em; - border-radius: 0em 0em .25em .25em; - display: block; - width: 100%; - top: 0em; - left: 0; } } } - -/* I'm doubtful that this actually matches anythign */ - -.no-boxshadow header nav#appnav > ul > li:hover ul { - border: 1px solid #ccc; - margin: -0.1px; } - -header.shell-design { - nav#appnav > ul > li { - &:hover > ul { - z-index: 9999 !important; - /*painfully silly hack*/ - margin-top: -0.25em; - padding-top: 0em !important; - } - > ul > li:hover { - position: relative; } - &:hover > ul > li > ul { - position: absolute; - box-shadow: none; - background-color: transparent; - top: 0em; - left: 100%; - padding-top: 0em; - > li { - display: none; } } - a:focus ~ ul, &:hover > ul { - z-index: 1; - padding-top: 1em; - display: block; - position: absolute; - top: 3.5em; - opacity: 1; } - a:focus ~ li ul li, &:hover > ul > li:hover > ul > li { - display: block; } - a:focus ~ li ul, &:hover > ul > li:hover ul { - /*box-shadow*/ - -webkit-box-shadow: 0.025em 0.025em 0.51em rgba(0, 0, 0, 0.5); - -moz-box-shadow: 0.025em 0.025em 0.51em rgba(0, 0, 0, 0.5); - box-shadow: 0.025em 0.025em 0.51em rgba(0, 0, 0, 0.5); - /*border-radius*/ - -webkit-border-radius: 0em .25em .25em 0em; - -moz-border-radius: 0em .25em .25em 0em; - border-radius: 0em .25em .25em 0em; - background-color: white; - z-index: 1; - opacity: 1; } - > { - ul { - > li { - > ul li { - &:first-child a { - /*border-radius*/ - -webkit-border-radius: .0em .25em 0em 0em; - -moz-border-radius: .0em .25em 0em 0em; - border-radius: .0em .25em 0em 0em; } - &:last-child a { - /*border-radius*/ - -webkit-border-radius: 0em 0em .25em .0em; - -moz-border-radius: 0em 0em .25em .0em; - border-radius: 0em 0em .25em .0em; } - &:first-child:hover a:after { - z-index: 9; - display: block; - position: absolute; - top: .5em; - left: 0em; - content: ""; - height: 0; - width: 0; - border-width: .5em 0em .5em .5em; - border-style: solid none solid solid; - border-color: transparent transparent transparent #fff; } } - ul { - &:before { - z-index: 2; - display: block; - position: absolute; - top: 0em; - left: -0.14em; - content: ""; - height: 0; - width: 0; - border-width: 1em 0em 1em 1em; - border-style: solid none solid solid; - border-color: transparent transparent transparent transparent; } - &:after { - z-index: 1; - display: block; - position: absolute; - top: .5em; - left: -1em; - content: ""; - height: 0; - width: 0; - opacity: 1; - z-index: 2; - border-width: .5em 0em .5em .5em; - border-style: solid none solid solid; - border-color: transparent transparent transparent #ccc; } } - a:hover ~ ul:before, &:hover ul:before { - top: 0em; - border: solid 1em #4a4e50; - left: -1.98em; } - a:hover ~ ul:after, &:hover ul:after { - top: 0em; - border-color: transparent transparent transparent #4a4e50; - left: 0em; - content: ""; - height: 0; - width: 0; - border-width: 1em 0em 1em 1em; - border-style: solid none solid solid; } } - position: absolute; - left: 0; - display: none; - line-height: 2em !important; - min-width: 16em; - max-width: 22em; } - a.active { - position: relative; - &:after { - z-index: 9; - position: absolute; - top: 3.1em; - left: 50%; - margin-left: -0.55em; - display: block; - content: ""; - width: 0; - height: 0; - border-width: 0em .55em .55em .55em; - border-style: none solid solid solid; - border-color: transparent transparent #fff transparent; } } } - position: relative; } - &.shell-design > article section:last-child { - text-align: right; - position: absolute; - top: -1.75em; - right: 0em; - margin: 0 auto; - display: block; - a { - border: 0.1em solid rgba(255, 255, 255, 0.12); - color: #ccc !important; - border-radius: 0em 0em .5em .5em; - color: #fff; - text-decoration: none; - background-color: #181c1e; - box-shadow: inset 0px 1.5em 1em -1em rgba(222, 222, 255, 0.1); - display: inline-block; - padding: .1em 1em; - position: relative; - margin: 1.25em .1em; - &:last-child { - padding-right: 2em; - &:after { - content: ""; - display: block; - height: 0px; - width: 0px; - position: absolute; - top: .75em; - right: .5em; - border-style: solid solid none solid; - border-width: .5em .5em 0em .5em; - border-color: #666 transparent transparent; } } - &:first-child { - padding-left: 3em; - &:after { - /*content: "!";*/ - color: #2e4e66; - text-align: center; - background-color: #ccc !important; - width: 1em; - height: 1em; - border-radius: 50%; - position: absolute; - top: .25em; - left: .5em; - line-height: 1em; - font-size: 1.5em; - display: block; - background-color: transparent; - z-index: 2; } } } } } - -/* - header nav#appnav > ul > li > ul > li -*/ - -/* The below is good */ - -/* Some new stuff */ - -/* Is this legit? */ - -.shell-design { - * { - /* - this is life saving but locks us into > ie8 will consider this polyfil for lt-ie8 - https://github.com/Schepp/box-sizing-polyfill - */ - -moz-box-sizing: border-box !important; - -webkit-box-sizing: border-box !important; - box-sizing: border-box !important; - background-repeat: no-repeat; - vertical-align: middle; - font-family: overpass; } - a { - &:hover, &:focus, &:active { - color: #fa0; } - &:focus { - outline: none !important; } - &:link { - color: #36c; } } - article { - &:before { - content: ""; - display: table; } - &:after { - content: ""; - display: table; - clear: both; } } } - -/* Wait, do we actually want this? */ - -/* User dropdown menu definition */ - -section#usermenu { - position: absolute; - left: 80%; - width: 20%; - padding: 5px 2px 5px 2px; - cursor: pointer; - z-index: 9999; - > a { - width: 100%; } - > ul { - list-style-type: none; - display: none; - border: none; - padding: 0em; - margin: 0em; - top: 4em; - float: left; - position: absolute; - z-index: 9999; - width: 100%; - &:before { - display: none; - content: none; } } - &:hover > ul { - display: block; - } - > ul { - > li { - padding: 0em; - margin: 0em; - border-color: transparent !important; - background-image: none !important; - box-shadow: none !important; } - li { - a { - margin: 0em; - padding: .5em 2em; - border-radius: 0; - border-color: transparent !important; - box-shadow: none !important; - &:hover { - color: #FFF !important; - text-decoration: underline; } } - &:last-child a { - border-radius: 0em 0em .51em .51em; } - a:after { - content: none; } } } } diff --git a/src/app/stylesheets/layout.scss b/src/app/stylesheets/layout.scss index 430ee1b..f469b9b 100644 --- a/src/app/stylesheets/layout.scss +++ b/src/app/stylesheets/layout.scss @@ -1,266 +1,20 @@ +@import "reset"; +@import "mixins"; +@import "helpers"; +@import "fonts"; +@import "buttons"; +@import "header"; +@import "custom"; + /* ########################################################################### -Generated SCSS for Aeolus UI [aeolus_ui] -Compiled on Wed Jul 13 12:26:53 -0700 2011 +SCSS for Aeolus UI ########################################################################### */
-/*VARIABLES AND MIXINS*/ -@mixin display_inline_block { - display: -moz-inline-stack; - display: inline-block; - vertical-align: top; - zoom: 1; - *display: inline; -} - -@mixin clearfix { - *zoom: 1; - &:before, &:after { - display: table; - content: ""; - } - &:after { - clear: both; - } -} - -.clearfix { - @include clearfix; -} - -/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ -Page Layout -- v.0.0.2 [layout] (reset.css) -~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ - -/* `XHTML, HTML4, HTML5 Reset -----------------------------------------------------------------------------------------------------*/ - -a, -abbr, -acronym, -address, -applet, -article, -aside, -audio, -b, -big, -blockquote, -body, -canvas, -caption, -center, -cite, -code, -dd, -del, -details, -dfn, -dialog, -div, -dl, -dt, -em, -embed, -fieldset, -figcaption, -figure, -font, -footer, -form, -h1, -h2, -h3, -h4, -h5, -h6, -header, -hgroup, -hr, -html, -i, -iframe, -img, -ins, -kbd, -label, -legend, -li, -mark, -menu, -meter, -nav, -object, -ol, -output, -p, -pre, -progress, -q, -rp, -rt, -ruby, -s, -samp, -section, -small, -span, -strike, -strong, -sub, -summary, -sup, -table, -tbody, -td, -tfoot, -th, -thead, -time, -tr, -tt, -u, -ul, -var, -video, -xmp { - border: 0; - margin: 0; - padding: 0; - font-size: 100%; - outline: none; -} - -h1,h2,h3,h4,h5,h6{ word-wrap: break-word; } - -article, -aside, -details, -figcaption, -figure, -footer, -header, -hgroup, -menu, -nav, -section { -/* - Override the default (display: inline) for - browsers that do not recognize HTML5 tags. - - IE8 (and lower) requires a shiv: - http://ejohn.org/blog/html5-shiv -*/ - display: block; -} - -b, -strong { -/* - Makes browsers agree. - IE + Opera = font-weight: bold. - Gecko + WebKit = font-weight: bolder. -*/ - font-weight: bold; -} - -img { - color: transparent; - font-size: 0; - vertical-align: middle; -/* - For IE. - http://css-tricks.com/ie-fix-bicubic-scaling-for-images -*/ - -ms-interpolation-mode: bicubic; -} - -li { -/* - For IE6 + IE7. -*/ - display: list-item; -} - -table { - border-collapse: collapse; - border-spacing: 0; -} - -th, -td, -caption { - font-weight: normal; - vertical-align: top; - text-align: left; -} - -svg { -/* - For IE9. -*/ - overflow: hidden; -} - -form{ - display: inline; -} -form.button_to > div {display: inline;} - -button::-moz-focus-inner, input[type="button"]::-moz-focus-inner, input[type="submit"]::-moz-focus-inner, input[type="reset"]::-moz-focus-inner { - padding: 0 !important; - border: 0 none !important; -} -button, input[type="button"], input[type="submit"], input[type="reset"] { - cursor: pointer; -} - -/* `Clear Floated Elements -----------------------------------------------------------------------------------------------------*/ - -/* http://sonspring.com/journal/clearing-floats */ - -.clear { - clear: both; - display: block; - overflow: hidden; - visibility: hidden; - width: 0; - height: 0; -} - -/* http://www.yuiblog.com/blog/2010/09/27/clearfix-reloaded-overflowhidden-demy... */ - -.clearfix:before, -.clearfix:after { - content: '\0020'; - display: block; - overflow: hidden; - visibility: hidden; - width: 0; - height: 0; -} - -.clearfix:after { - clear: both; -} - -/* - The following zoom: 1 rule is specifically for IE6 + IE7. - Move to separate stylesheet if invalid CSS is a problem. -*/ - -.clearfix { - zoom: 1; -} - /* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ -Page Layout -- v.0.0.2 [layout] (layout.scss) +Page Layout ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
$width: 960px; -$font-family-base: "Lucida Sans Unicode", "Lucida Grande", Verdana, Arial, Helvetica, sans-serif; -$font-family-em: "Lucida Sans", "Lucida Sans Unicode", "Lucida Grande", Verdana, Arial, Helvetica, sans-serif; -$font-family-primary: Helvetica, Arial, "Lucida Grande", sans-serif;
/* body */
@@ -275,11 +29,10 @@ body{
strong, em, b, i{ font-family: $font-family-em; }
-.align-center{text-align: center;} - /* Content */
div#content{ + @include clearfix; width: $width; margin: 0 auto; margin-bottom: 58px; @@ -299,518 +52,15 @@ div#content{ box-shadow: inset 0px .25em .25em #aaa, 0px .5em 2em #000 !important; }
-/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ -Page Layout -- v.0.0.2 [layout] (layout_ie.css) -~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ - - - -/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ -Application Button Set -- v.0.0.1 [button] (button.scss) -~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ - -/* ------------------------------------------ -CSS3 GITHUB BUTTONS (Nicolas Gallagher) -Licensed under Unlicense -http://github.com/necolas/css3-github-buttons ------------------------------------------- */ - - -/* ----------------------------------------------------------------- BUTTON */ - -.button { - position: relative; - overflow: visible; - @include display_inline_block; - padding: 0.5em 1em; - border: 1px solid #d4d4d4; - margin: 0; - text-decoration: none; - text-shadow: 1px 1px 0 #fff; - font:11px/normal sans-serif; - color: #333; - white-space: nowrap; - cursor: pointer; - outline: none; - background-color: #ececec; - background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#f4f4f4), to(#ececec)); - background-image: -moz-linear-gradient(#f4f4f4, #ececec); - background-image: -o-linear-gradient(#f4f4f4, #ececec); - background-image: linear-gradient(#f4f4f4, #ececec); - -webkit-background-clip: padding; - -moz-background-clip: padding; - -o-background-clip: padding-box; - /*background-clip: padding-box;*/ /* commented out due to Opera 11.10 bug */ - -webkit-border-radius: 0.2em; - -moz-border-radius: 0.2em; - border-radius: 0.2em; -} - -.button:hover, -.button:focus, -.button:active, -.button.active { - border-color: #3072b3; - border-bottom-color: #2a65a0; - text-decoration: none; - text-shadow: -1px -1px 0 rgba(0,0,0,0.3); - color: #fff; - background-color: #3C8DDE; - background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#599bdc), to(#3072b3)); - background-image: -moz-linear-gradient(#599bdc, #3072b3); - background-image: -o-linear-gradient(#599bdc, #3072b3); - background-image: linear-gradient(#599bdc, #3072b3); -} - -.button:active, -.button.active { - border-color: #2a65a0; - border-bottom-color: #3884CF; - background-color: #3072b3; - background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#3072b3), to(#599bdc)); - background-image: -moz-linear-gradient(#3072b3, #599bdc); - background-image: -o-linear-gradient(#3072b3, #599bdc); - background-image: linear-gradient(#3072b3, #599bdc); -} - -/* overrides extra padding on button elements in Firefox */ -.button::-moz-focus-inner { - padding: 0; - border: 0; -} -.button.disabled, .button[disabled] { - cursor: default; - background: transparent; - opacity: 0.6; - /* @include no-box-shadow; */ - &:hover { - background: transparent; - text-decoration: none; - color: inherit; - text-shadow: inherit; - } -} - -/* ------------------------------------------------------------------ Icons */ - -.button.icon:before { - content: ""; - position: relative; - top: 1px; - float:left; - width: 12px; - height: 12px; - margin: 0 0.75em 0 -0.25em; - background: url(../../images/button-icons.png) 0 99px no-repeat; -} - -.button.arrowup.icon:before { background-position: 0 0; } -.button.arrowup.icon:hover:before, -.button.arrowup.icon:focus:before, -.button.arrowup.icon:active:before { background-position: -12px 0; } - -.button.arrowdown.icon:before { background-position: 0 -12px; } -.button.arrowdown.icon:hover:before, -.button.arrowdown.icon:focus:before, -.button.arrowdown.icon:active:before { background-position: -12px -12px; } - -.button.arrowleft.icon:before { background-position: 0 -24px; } -.button.arrowleft.icon:hover:before, -.button.arrowleft.icon:focus:before, -.button.arrowleft.icon:active:before { background-position: -12px -24px; } - -.button.arrowright.icon:before { float:right; margin: 0 -0.25em 0 0.5em; background-position: 0 -36px; } -.button.arrowright.icon:hover:before, -.button.arrowright.icon:focus:before, -.button.arrowright.icon:active:before { background-position: -12px -36px; } - -.button.approve.icon:before { background-position: 0 -48px; } -.button.approve.icon:hover:before, -.button.approve.icon:focus:before, -.button.approve.icon:active:before { background-position: -12px -48px; } - -.button.add.icon:before { background-position: 0 -288px; } -.button.add.icon:hover:before, -.button.add.icon:focus:before, -.button.add.icon:active:before { background-position: -12px -288px; } - -.button.remove.icon:before { background-position: 0 -60px; } -.button.remove.icon:hover:before, -.button.remove.icon:focus:before, -.button.remove.icon:active:before { background-position: -12px -60px; } - -.button.log.icon:before { background-position: 0 -72px; } -.button.log.icon:hover:before, -.button.log.icon:focus:before, -.button.log.icon:active:before { background-position: -12px -72px; } - -.button.calendar.icon:before { background-position: 0 -84px; } -.button.calendar.icon:hover:before, -.button.calendar.icon:focus:before, -.button.calendar.icon:active:before { background-position: -12px -84px; } - -.button.chat.icon:before { background-position: 0 -96px; } -.button.chat.icon:hover:before, -.button.chat.icon:focus:before, -.button.chat.icon:active:before { background-position: -12px -96px; } - -.button.clock.icon:before { background-position: 0 -108px; } -.button.clock.icon:hover:before, -.button.clock.icon:focus:before, -.button.clock.icon:active:before { background-position: -12px -108px; } - -.button.settings.icon:before { background-position: 0 -120px; } -.button.settings.icon:hover:before, -.button.settings.icon:focus:before, -.button.settings.icon:active:before { background-position: -12px -120px; } - -.button.comment.icon:before { background-position: 0 -132px; } -.button.comment.icon:hover:before, -.button.comment.icon:focus:before, -.button.comment.icon:active:before { background-position: -12px -132px; } - -.button.fork.icon:before { background-position: 0 -144px; } -.button.fork.icon:hover:before, -.button.fork.icon:focus:before, -.button.fork.icon:active:before { background-position: -12px -144px; } - -.button.like.icon:before { background-position: 0 -156px; } -.button.like.icon:hover:before, -.button.like.icon:focus:before, -.button.like.icon:active:before { background-position: -12px -156px; } - -.button.favorite.icon:before { background-position: 0 -348px; } -.button.favorite.icon:hover:before, -.button.favorite.icon:focus:before, -.button.favorite.icon:active:before { background-position: -12px -348px; } - -.button.home.icon:before { background-position: 0 -168px; } -.button.home.icon:hover:before, -.button.home.icon:focus:before, -.button.home.icon:active:before { background-position: -12px -168px; } - -.button.key.icon:before { background-position: 0 -180px; } -.button.key.icon:hover:before, -.button.key.icon:focus:before, -.button.key.icon:active:before { background-position: -12px -180px; } - -.button.lock.icon:before { background-position: 0 -192px; } -.button.lock.icon:hover:before, -.button.lock.icon:focus:before, -.button.lock.icon:active:before { background-position: -12px -192px; } - -.button.unlock.icon:before { background-position: 0 -204px; } -.button.unlock.icon:hover:before, -.button.unlock.icon:focus:before, -.button.unlock.icon:active:before { background-position: -12px -204px; } - -.button.loop.icon:before { background-position: 0 -216px; } -.button.loop.icon:hover:before, -.button.loop.icon:focus:before, -.button.loop.icon:active:before { background-position: -12px -216px; } - -.button.search.icon:before { background-position: 0 -228px; } -.button.search.icon:hover:before, -.button.search.icon:focus:before, -.button.search.icon:active:before { background-position: -12px -228px; } - -.button.mail.icon:before { background-position: 0 -240px; } -.button.mail.icon:hover:before, -.button.mail.icon:focus:before, -.button.mail.icon:active:before { background-position: -12px -240px; } - -.button.move.icon:before { background-position: 0 -252px; } -.button.move.icon:hover:before, -.button.move.icon:focus:before, -.button.move.icon:active:before { background-position: -12px -252px; } - -.button.edit.icon:before { background-position: 0 -264px; } -.button.edit.icon:hover:before, -.button.edit.icon:focus:before, -.button.edit.icon:active:before { background-position: -12px -264px; } - -.button.pin.icon:before { background-position: 0 -276px; } -.button.pin.icon:hover:before, -.button.pin.icon:focus:before, -.button.pin.icon:active:before { background-position: -12px -276px; } - -.button.reload.icon:before { background-position: 0 -300px; } -.button.reload.icon:hover:before, -.button.reload.icon:focus:before, -.button.reload.icon:active:before { background-position: -12px -300px; } - -.button.rss.icon:before { background-position: 0 -312px; } -.button.rss.icon:hover:before, -.button.rss.icon:focus:before, -.button.rss.icon:active:before { background-position: -12px -312px; } - -.button.tag.icon:before { background-position: 0 -324px; } -.button.tag.icon:hover:before, -.button.tag.icon:focus:before, -.button.tag.icon:active:before { background-position: -12px -324px; } - -.button.trash.icon:before { background-position: 0 -336px; } -.button.trash.icon:hover:before, -.button.trash.icon:focus:before, -.button.trash.icon:active:before { background-position: -12px -336px; } - -.button.user.icon:before { background-position: 0 -360px; } -.button.user.icon:hover:before, -.button.user.icon:focus:before, -.button.user.icon:active:before { background-position: -12px -360px; } - - -/* ------------------------------------------------------ BUTTON EXTENSIONS */ - -/* ---------------------------------------------------------------- Primary */ - -.button.primary { - font-weight: bold; -} - -/* ----------------------------------------------------------------- Danger */ - -.button.danger { - color: #900; -} - -.button.danger:hover, -.button.danger:focus, -.button.danger:active { - border-color: #b53f3a; - border-bottom-color: #a0302a; - color: #fff; - background-color: #dc5f59; - background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#dc5f59), to(#b33630)); - background-image: -moz-linear-gradient(#dc5f59, #b33630); - background-image: -o-linear-gradient(#dc5f59, #b33630); - background-image: linear-gradient(#dc5f59, #b33630); -} - -.button.danger:active, -.button.danger.active { - border-color: #a0302a; - border-bottom-color: #bf4843; - background-color: #b33630; - background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#b33630), to(#dc5f59)); - background-image: -moz-linear-gradient(#b33630, #dc5f59); - background-image: -o-linear-gradient(#b33630, #dc5f59); - background-image: linear-gradient(#b33630, #dc5f59); -} - -/* ------------------------------------------------------------------- Pill */ - -.button.pill { - -webkit-border-radius: 50em; - -moz-border-radius: 50em; - border-radius: 50em; -} - -/* ---------------------------------------------------------------- Disable */ - -.button.disable { - opacity: 0.5; -} - -/* -------------------------------------------------------------------- Big */ - -.button.big { - font-size: 14px; -} - -.button.big.icon:before { top: 0; } - - -/* ---------------------------------------------------------- BUTTON GROUPS */ - -/* --------------------------------------------------------------- Standard */ - -.button-group { - @include display_inline_block; - list-style: none; - padding: 0; - margin: 0; -} - -.button + .button, -.button + .button-group, -.button-group + .button, -.return_to + .button-group, -.button-group + .button-group { - margin-left: 15px; -} - -.button-group li { - float: left; - padding: 0; - margin: 0; -} - -.button-group .button { - float: left; - margin-left: -1px; -} - -.button-group > .button:not(:first-child):not(:last-child), -.button-group li:not(:first-child):not(:last-child) .button { - -webkit-border-radius: 0; - -moz-border-radius: 0; - border-radius: 0; -} - -.button-group > .button:first-child, -.button-group li:first-child .button { - margin-left: 0; - -webkit-border-top-right-radius: 0; - -webkit-border-bottom-right-radius: 0; - -moz-border-radius-topright: 0; - -moz-border-radius-bottomright: 0; - border-top-right-radius: 0; - border-bottom-right-radius: 0; -} - -.button-group > .button:last-child, -.button-group li:last-child > .button { - -webkit-border-top-left-radius: 0; - -webkit-border-bottom-left-radius: 0; - -moz-border-radius-topleft: 0; - -moz-border-radius-bottomleft: 0; - border-top-left-radius: 0; - border-bottom-left-radius: 0; -} - -/* ------------------------------------------------------------------ Minor */ - -.button-group.minor-group .button { - border: 1px solid #d4d4d4; - text-shadow: none; - background-image: none; - background-color: #fff; -} - -.button-group.minor-group .button:hover, -.button-group.minor-group .button:focus, -.button-group.minor-group .button:active { - background-color: #599bdc; -} - -.button-group.minor-group .button:active, -.button-group.minor-group .button.active { - background-color: #3072b3; -} - -.button-group.minor-group .button.icon:before { - opacity: 0.8; -} - -/* ------------------------------------------------------- BUTTON CONTAINER */ -/* For mixing buttons and button groups, e.g., in a navigation bar */ - -.button-container .button, -.button-container .button-group { - vertical-align: top; -} -/* --------------------------------------------------------- CUSTOM BUTTONS */ - -span.view-toggle{ - @include display_inline_block; -} - -a.view-toggle{ - background: url('../../images/button-viewtoggle.png') no-repeat top left; - display: block; - float:left; - width: 38px; - height: 27px; -} - -a.view-toggle span{ - position: absolute; - top: -999em; -} - -a.view-toggle.pretty{ - &:active{ - background-position: -75px 0px; - } -} - -a.view-toggle.filter{ - width: 36px; - background-position: -39px 0px; - &:active{ - background-position: -114px 0px; - } -} - -a.view-toggle.pretty.active{ - background-position: -75px 0px; -} - -a.view-toggle.filter.active{ - background-position: -114px 0px; -} - -a.add-group-button{ - background: transparent url('../../images/button-add-user-group.png') no-repeat top left; - display: block; - width: 50px; - height: 25px; -} -a.add-user-button{ - background: transparent url('../../images/button-add-user-group.png') no-repeat bottom left; - display: block; - width: 50px; - height: 25px; -}
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ Application Input Controls -- v.0.0.1 [input] (input.scss) ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
-/* Query Inputs */ - -div.query-input{ - @include display_inline_block; - background-image: -moz-linear-gradient(top, rgba(209,209,209,1), rgba(230,230,230, 0)); - background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(209,209,209,1)), to(rgba(230,230,230, 0))); - -webkit-border-radius: 16px; -moz-border-radius: 16px; border-radius: 16px; - padding: 3px; -} - -div.query-input input[type="text"]{ - display: inline; - -webkit-border-radius: 16px; -moz-border-radius: 16px; border-radius: 16px; - border: 1px solid #ccc; - height: 23px; - width: 180px; - outline: none; - padding: 0px 26px 0px 10px; - margin:0px; - font-size: 12px; -} - -div.query-input input[type="submit"]{ - display:inline; - background: transparent url('../../images/button-search.png') no-repeat left center; - color: transparent; - border: 0px; - width: 25px; height: 25px; - margin-left: -25px; - outline: none; - cursor: pointer; - &:hover{ background: transparent url('../../images/button-search-over.png') no-repeat left center; } - &:active{ background: transparent url('../../images/button-search-down.png') no-repeat left center; } -} - /* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ Textual Labels -- v.0.0.1 [label] (label.scss) ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
-$font-family-base: "Lucida Sans Unicode", "Lucida Grande", Verdana, Arial, Helvetica, sans-serif; -$font-family-em: "Lucida Sans", "Lucida Sans Unicode", "Lucida Grande", Verdana, Arial, Helvetica, sans-serif; -$font-family-primary: "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; - .label{ font-family: $font-family-base; font-size: 12px; @@ -839,11 +89,10 @@ $font-family-primary: "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-
.label.badge{ @include display_inline_block; - vertical-align: baseline; -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px; background-color: #efefef; border: 1px solid transparent; - padding: 1px 4px 0px 4px; + padding: 0px 4px 0px 4px; min-width: 10px; font-size: 10px; color: #000; @@ -995,8 +244,6 @@ nav#administer_nav { Page Header -- v.0.0.1 [header] (header.scss) ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
-$font-family-primary: "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; - div#content .page-header{
display: block; @@ -1017,7 +264,7 @@ div#content .page-header{ border-radius: 0em;
h1{ - font-family: overpass; + font-family: $font-family-primary; font-size: 25px; line-height: 38px; font-weight: normal; @@ -1085,34 +332,21 @@ div#content .page-header{ background: transparent url('../../images/header_icon_settings.png') no-repeat 8px center; }
- #obj_actions{ + .obj_actions{ + & > *{ vertical-align: middle; } float: right; margin: 13px 7px 12px 24px; }
- div.return_to{ - @include display_inline_block; - padding: 0.5em 0em; - - a{ - background: #cccccc; - color: black; - text-decoration: none; - font-weight: bold; - padding: 3px 6px; - -webkit-border-radius: 12px; -moz-border-radius: 12px; border-radius: 12px; - border: none; - } - } - ul#provider_select{ @include display_inline_block; + vertical-align: middle; list-style-type: none; position: relative; & > li{ - padding: 0px 15px 15px 0px; + padding: 7px 15px 7px 0px; margin: 0px 15px 0px 10px; - background: transparent url('../../images/admin_header_provider_select.png') right 1px no-repeat; + background: transparent url('../../images/admin_header_provider_select.png') right center no-repeat; & > a{ color: black; text-decoration: none; @@ -1157,10 +391,10 @@ div#content .page-header{
input[type="submit"].provider_toggle{ @include display_inline_block; + vertical-align: middle; border: none; width: 45px; height: 21px; - margin-top: -4px;
&.on{ background: transparent url('../../images/provider_on_off.png') left center; @@ -1210,7 +444,6 @@ nav#nav_history{ Statistics Scoreboard -- v.0.0.1 [scoreboard] (scoreboard.scss) ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
-$font-family-primary: "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; $dd_padding: 10px; $dd_icon_padding_right: 4px;
@@ -1334,10 +567,6 @@ $dd_icon_padding_right: 4px; Content Section Container -- v.0.0.1 [section] (section.scss) ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
-$font-family-base: "Lucida Sans Unicode", "Lucida Grande", Verdana, Arial, Helvetica, sans-serif; -$font-family-em: "Lucida Sans", "Lucida Sans Unicode", "Lucida Grande", Verdana, Arial, Helvetica, sans-serif; -$font-family-primary: Helvetica, Arial, "Lucida Grande", sans-serif; - section.content-section{ padding: 4px 15px 15px 15px; border-bottom: 1px solid #C4C4C4; @@ -1361,8 +590,9 @@ section.content-section{ font-size: 21px; font-weight: 200; @include display_inline_block; + vertical-align: middle; + padding: 2px 40px 2px 0px; margin-bottom: 4px; - padding: 2px 40px 0px 0px;
&.activity{ background: transparent url('../../images/admin_h2_icons.png') right 0px no-repeat; } &.roles{ background: transparent url('../../images/admin_h2_icons.png') right -29px no-repeat; } @@ -1387,11 +617,9 @@ section.content-section{ }
.section-controls{ - position: absolute; - right: 0px; - bottom: 4px; + float: right; @include display_inline_block; - font-size: 11px; + & > * { vertical-align: middle; }
a.collapse{ text-decoration: none; @@ -1402,6 +630,7 @@ section.content-section{
/* nav */ nav.faceted{ + @include clearfix; border-bottom: 1px solid #ccc; ul{ list-style: none; font-family: $font-family-primary; } li{ @@ -1412,7 +641,8 @@ section.content-section{ @include display_inline_block; font-family: overpass; font-size: 1.3em; - padding-bottom: 6px; + line-height: 1.5em; + padding: 3px 0px; text-decoration: none; color: #aaa; } @@ -1425,6 +655,11 @@ section.content-section{ } }
+ div.loading_tabs{ + height: 60px; + background: transparent url("../../images/loading.gif") no-repeat center center; + } + /* Content */
.content{ @@ -1457,6 +692,7 @@ section.content-section{ }
header.page-header + section.content-section{margin-top: 26px;} +nav#administer_nav + section.content-section{margin-top: 26px;} #scoreboard + section.content-section{ margin-top: 26px; }
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ @@ -1507,6 +743,7 @@ div#user_card{ }
div.user-card-content{ + @include clearfix; padding: 15px 15px 15px 60px; background: #efefef; -webkit-border-radius: 0px 0px 7px 7px; -moz-border-radius: 0px 0px 7px 7px; border-radius: 0px 0px 7px 7px; @@ -1523,10 +760,6 @@ div#user_card{ margin-top: 10px; } } - - #obj_actions{ - float: right; - } } }
@@ -1554,10 +787,6 @@ dl.user_stats{ Alert Components -- v.0.0.1 [alert] (alert.scss) ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
-$font-family-base: "Lucida Sans Unicode", "Lucida Grande", Verdana, Arial, Helvetica, sans-serif; -$font-family-em: "Lucida Sans", "Lucida Sans Unicode", "Lucida Grande", Verdana, Arial, Helvetica, sans-serif; -$font-family-primary: Helvetica, Arial, "Lucida Grande", sans-serif; - .content.closed{ border-bottom: 1px solid #efefef; } @@ -1635,7 +864,6 @@ dl.alerts{ Pool Components -- v.0.0.1 [pool] (pool.scss) ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
-$font-family-primary: Helvetica, Arial, "Lucida Grande", sans-serif; $dd_padding: 10px; $dd_icon_padding_right: 4px; $bar_height: 37px; @@ -1874,16 +1102,10 @@ header + div.pool.overview{ Deployment Components -- v.0.0.1 [deployment] (deployment.scss) ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
-$font-family-base: "Lucida Sans Unicode", "Lucida Grande", Verdana, Arial, Helvetica, sans-serif; -$font-family-em: "Lucida Sans", "Lucida Sans Unicode", "Lucida Grande", Verdana, Arial, Helvetica, sans-serif; -$font-family-primary: Helvetica, Arial, "Lucida Grande", sans-serif; - /************************************************************************** */ /********************************************* Large Deployable Card Arrays */ /****************************************************************************/
-/* todo: move this elsewhere */ - $deployment-large-height: 154px; $deployment-large-width: 166px; $deployment-large-padding: 8px; @@ -2017,9 +1239,6 @@ ul.deployment-array.large + ul.deployment-array.large{ margin-top: 10px; }
- - - /************************************************************************** */ /********************************************* Small Deployable Card Arrays */ /************************************************************************** */ @@ -2237,47 +1456,6 @@ ul.instances-array{ /********************************************* Deployable Detail page */ /************************************************************************** */
-#launch_deployment_button{ - @include display_inline_block; - margin: -7px 0px 0px 10px; - padding: 13px 12px 9px 46px; - font-weight: bold; - font-size: 14px; - color: white; - text-decoration: none; - border: 1px solid #669933; - -webkit-border-radius: 0.2em; -moz-border-radius: 0.2em; border-radius: 0.2em; - - background: #5AB45C url(../../images/deployment_large_icon_provider_white.png) no-repeat 12px center; /* Old browsers */ - background: url(../../images/deployment_large_icon_provider_white.png) 12px center no-repeat, -moz-linear-gradient(top, #ace3ac 0%, #5ab45c 100%); /* FF3.6+ */ - background: url(../../images/deployment_large_icon_provider_white.png) 12px center no-repeat, -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ace3ac), color-stop(100%,#5ab45c)); /* Chrome,Safari4+ */ - background: url(../../images/deployment_large_icon_provider_white.png) 12px center no-repeat, -webkit-linear-gradient(top, #ace3ac 0%,#5ab45c 100%); /* Chrome10+,Safari5.1+ */ - background: url(../../images/deployment_large_icon_provider_white.png) 12px center no-repeat, -o-linear-gradient(top, #ace3ac 0%,#5ab45c 100%); /* Opera 11.10+ */ - background: url(../../images/deployment_large_icon_provider_white.png) 12px center no-repeat, -ms-linear-gradient(top, #ace3ac 0%,#5ab45c 100%); /* IE10+ */ - background: url(../../images/deployment_large_icon_provider_white.png) 12px center no-repeat, linear-gradient(top, #ace3ac 0%,#5ab45c 100%); /* W3C */ - filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ace3ac', endColorstr='#5ab45c',GradientType=0 ); /* IE6-9 */ - &:active{ - background: #458944; /* Old browsers */ - background: url(../../images/deployment_large_icon_provider_white.png) 12px center no-repeat, -moz-linear-gradient(top, #9ecc9b 0%, #458944 100%); /* FF3.6+ */ - background: url(../../images/deployment_large_icon_provider_white.png) 12px center no-repeat, -webkit-gradient(linear, left top, left bottom, color-stop(0%,#9ecc9b), color-stop(100%,#458944)); /* Chrome,Safari4+ */ - background: url(../../images/deployment_large_icon_provider_white.png) 12px center no-repeat, -webkit-linear-gradient(top, #9ecc9b 0%, #458944 100%); /* Chrome10+,Safari5.1+ */ - background: url(../../images/deployment_large_icon_provider_white.png) 12px center no-repeat, -o-linear-gradient(top, #9ecc9b 0%, #458944 100%); /* Opera 11.10+ */ - background: url(../../images/deployment_large_icon_provider_white.png) 12px center no-repeat, -ms-linear-gradient(top, #9ecc9b 0%, #458944 100%); /* IE10+ */ - background: url(../../images/deployment_large_icon_provider_white.png) 12px center no-repeat, linear-gradient(top, #9ecc9b 0%, #458944 100%); /* W3C */ - filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9ecc9b', endColorstr='#458944',GradientType=0 ); /* IE6-9 */ - -webkit-box-shadow: inset 1px 1px 2px 0px #333; -moz-box-shadow: inset 1px 1px 2px 0px #333; box-shadow: inset 1px 1px 2px 0px #333; - } - &[type=submit][disabled=disabled], - &[disabled=disabled], - &.disabled{ - cursor: default; - zoom: 1; - filter: alpha(opacity=50); - -moz-opacity:0.5; - opacity: 0.5; - } -} - table.light_table{ margin: 10px; td,th{ padding: 5px 10px; vertical-align: middle;} @@ -2458,6 +1636,7 @@ div.build_status{ text-decoration: none; } div.catalog_with_checkbox{ + @include clearfix; padding: 7px 10px; input[type="checkbox"]{margin: 0px; padding: 0px; float: right;} } @@ -2489,14 +1668,6 @@ div.build_status{ margin-left: 2px; }
-#obj_actions .catalog_link { - border-color: white; - - &:hover { - border-color: #999; - } -} - ul.catalog_pretty { border: 1px solid #ccc; -webkit-border-radius: 7px 7px 7px 7px; -moz-border-radius: 7px 7px 7px 7px; border-radius: 7px 7px 7px 7px; @@ -2623,8 +1794,6 @@ ul.image_builds{ 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 4px 10px; $td_padding: 5px 10px 3px 10px; @@ -2640,27 +1809,11 @@ $cell_header_text_color: #666666;
$cell_anchor_text_color: #3286B8;
-/* 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); -} - /* Filterable Form */ form.filterable-data{
- ul.obj_actions{ - padding: 6px 0px 6px 0px; - - list-style: none; - li{ @include display_inline_block; } - li + li{ padding-left: 6px; } - } - div.controls{ + @include clearfix; display: block; font-family: $font-family-primary; font-size: 12px; @@ -2992,10 +2145,14 @@ table.pool_families{ Form Components -- v.0.0.1 [form] (form.scss) ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
-$font-family-base: "Lucida Sans Unicode", "Lucida Grande", Verdana, Arial, Helvetica, sans-serif; -$label-font: "Lucida Sans", "Lucida Sans Unicode", "Lucida Grande", Verdana, Arial, Helvetica, sans-serif; -$font-family-primary: Helvetica, Arial, "Lucida Grande", sans-serif; +/* Global form settings + ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ +fieldset{ + margin-top: 20px; +}
+/* Generic form + ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ form.generic{
div.field{ @@ -3016,20 +2173,20 @@ form.generic{ margin-top: 10px; }
- fieldset{ - margin-top: 20px; - } - fieldset legend{ font-family: $font-family-primary; font-size: 16px; font-weight: light; }
+ fieldset.options{ + & > *{ vertical-align: middle; } + } + label{ display: block; padding-bottom: 2px; - font-family: $label-font; + font-family: $font-family-em; font-size: 12px; text-shadow: 0px 1px 0px #ffffff; font-weight: normal; diff --git a/src/app/stylesheets/login.scss b/src/app/stylesheets/login.scss index b50d2fd..da4fc4b 100644 --- a/src/app/stylesheets/login.scss +++ b/src/app/stylesheets/login.scss @@ -1,3 +1,5 @@ +@import "reset"; + $font-family-base: "Lucida Sans Unicode", "Lucida Grande", Verdana, Arial, Helvetica, sans-serif; $font-family-em: "Lucida Sans", "Lucida Sans Unicode", "Lucida Grande", Verdana, Arial, Helvetica, sans-serif; $font-family-primary: Helvetica, Arial, "Lucida Grande", sans-serif; diff --git a/src/app/views/catalogs/_section_header.html.haml b/src/app/views/catalogs/_section_header.html.haml index 0789f03..1460606 100644 --- a/src/app/views/catalogs/_section_header.html.haml +++ b/src/app/views/catalogs/_section_header.html.haml @@ -1,4 +1,4 @@ %header.page-header - #obj_actions.button-group + .obj_actions = link_to t('catalogs.new_catalog'), new_catalog_url, :class => 'button primary', :id => 'new_catalog_button' %h1.no-icon=t('catalogs.catalogs') diff --git a/src/app/views/catalogs/edit.html.haml b/src/app/views/catalogs/edit.html.haml index 0188837..a490f70 100644 --- a/src/app/views/catalogs/edit.html.haml +++ b/src/app/views/catalogs/edit.html.haml @@ -1,6 +1,6 @@ = render :partial => 'layouts/admin_nav' %header.page-header - #obj_actions.button-container + .obj_actions = link_to t('catalogs.new_catalog'), new_catalog_url, :class => 'button primary', :id => 'new_catalog_button' %h1.no-icon= @catalog.name
diff --git a/src/app/views/catalogs/new.html.haml b/src/app/views/catalogs/new.html.haml index 22b716f..b6417ac 100644 --- a/src/app/views/catalogs/new.html.haml +++ b/src/app/views/catalogs/new.html.haml @@ -1,7 +1,7 @@ = render :partial => 'layouts/admin_nav'
%header.page-header - #obj_actions + .obj_actions .return_to = t'return_to' = link_to t("catalogs.catalogs"), catalogs_path diff --git a/src/app/views/catalogs/show.html.haml b/src/app/views/catalogs/show.html.haml index d373b0f..b0d37e6 100644 --- a/src/app/views/catalogs/show.html.haml +++ b/src/app/views/catalogs/show.html.haml @@ -1,6 +1,6 @@ = render :partial => 'layouts/admin_nav' %header.page-header - #obj_actions.button-container + .obj_actions - if check_privilege(Privilege::CREATE, Catalog) = link_to t('catalogs.new_catalog'), new_catalog_url, :class => 'button primary', :id => 'new_catalog_button' .button-group diff --git a/src/app/views/deployables/_new_from_image.html.haml b/src/app/views/deployables/_new_from_image.html.haml index 9291f1e..beb4d42 100644 --- a/src/app/views/deployables/_new_from_image.html.haml +++ b/src/app/views/deployables/_new_from_image.html.haml @@ -35,7 +35,6 @@ .catalog_with_checkbox = check_box_tag 'catalog_id[]', catalog.id, @selected_catalogs.any?{|c| c.id == catalog.id} = catalog.name - .clear
%fieldset.options.align-center = link_to t('deployables.form.cancel'), catalogs_path, :class => 'button danger' diff --git a/src/app/views/deployables/_section_header.html.haml b/src/app/views/deployables/_section_header.html.haml index 861a12d..35cc064 100644 --- a/src/app/views/deployables/_section_header.html.haml +++ b/src/app/views/deployables/_section_header.html.haml @@ -1,5 +1,5 @@ %header.page-header - #obj_actions.button-group + .obj_actions - if check_privilege(Privilege::CREATE, Deployable) = link_to "#{t'catalog_entries.new_catalog_entry'}", new_polymorphic_path([@catalog, Deployable]), :class => 'button primary', :id => 'new_catalog_entry_button' %h1.catalog_entries=t'catalog_entries.index.catalog_entries' diff --git a/src/app/views/deployables/show.html.haml b/src/app/views/deployables/show.html.haml index b8666e6..7ddb800 100644 --- a/src/app/views/deployables/show.html.haml +++ b/src/app/views/deployables/show.html.haml @@ -1,11 +1,11 @@ = render :partial => 'layouts/admin_nav' %header.page-header - #obj_actions.button-container + .obj_actions .button-group - if check_privilege(Privilege::MODIFY, @deployable) - = button_to t('.delete'), polymorphic_path([@catalog, @deployable]), :method => 'delete', :confirm => "#{t'catalog_entries.show.confirm_delete'}", :class => 'button danger', :id => 'delete' = link_to t('.edit'), edit_polymorphic_path([@catalog, @deployable]), :class => 'button', :id => 'edit_button' = link_to t('.edit_xml'), edit_polymorphic_path([@catalog, @deployable], :edit_xml => true), :class => 'button', :id => 'edit_xml_button' + = button_to t('.delete'), polymorphic_path([@catalog, @deployable]), :method => 'delete', :confirm => "#{t'catalog_entries.show.confirm_delete'}", :class => 'button danger', :id => 'delete'
- launch_deployment_button_path = launch_time_params_deployments_path(:deployable_id => @deployable.id, :deployment => { :name => @deployable.name, :pool_id => @catalog.pool }) - if @catalog.present? && @deployable_errors.empty? && @pushed_count > 0 @@ -87,13 +87,13 @@
%section.content-section %header - %h2.catalogs= t('.catalogs') .section-controls = form_for(:catalog_entry, :url => catalog_entries_path) do |f| = f.label :catalog_id, t('.choose_catalog') = f.select :catalog_id, options_for_select(@catalogs_options.map {|c| [c.name, c.id]}) = f.hidden_field(:deployable_id, :value => @deployable.id) = f.submit t('.add_catalog'), :id => :add_catalog, :class => 'button pill', :disabled => @catalogs_options.empty? + %h2.catalogs= t('.catalogs') .content .centered %table.light_table diff --git a/src/app/views/deployments/_alerts_show.html.haml b/src/app/views/deployments/_alerts_show.html.haml index f850c6c..e208287 100644 --- a/src/app/views/deployments/_alerts_show.html.haml +++ b/src/app/views/deployments/_alerts_show.html.haml @@ -1,10 +1,11 @@ - if @failed_instances.count > 0 %section.content-section.alerts.collapse_entity %header - %h2=t 'alerts_label' - %span.label.badge.alert.count= @failed_instances.count .section-controls = link_to t("providers.edit.toggle_alerts"), "#", :class => 'collapse alerts' unless @statistics[:instances_failed].blank? + %h2.alerts + =t 'alerts_label' + %span.label.badge.alert.count= @failed_instances.count .content.collapsible %dl.alerts %ul diff --git a/src/app/views/deployments/_header_show.html.haml b/src/app/views/deployments/_header_show.html.haml index eb4ff67..46dc99f 100644 --- a/src/app/views/deployments/_header_show.html.haml +++ b/src/app/views/deployments/_header_show.html.haml @@ -1,6 +1,5 @@ %header.page-header - #obj_actions.button-container - .button-group - - if check_privilege(Privilege::MODIFY, @deployment) - = button_to t('delete'), deployment_path(@deployment), :method => :delete, :confirm => t("deployments.confirm_delete"), :class => "button danger", :id => 'delete' + .obj_actions + - if check_privilege(Privilege::MODIFY, @deployment) + = button_to t('delete'), deployment_path(@deployment), :method => :delete, :confirm => t("deployments.confirm_delete"), :class => "button danger", :id => 'delete' %h1.deployments= @title diff --git a/src/app/views/deployments/_launch_new.html.haml b/src/app/views/deployments/_launch_new.html.haml index bac7945..6cfce80 100644 --- a/src/app/views/deployments/_launch_new.html.haml +++ b/src/app/views/deployments/_launch_new.html.haml @@ -1,7 +1,7 @@ = if request.xhr? = render :partial => '/layouts/new_notification' %header.page-header - #obj_actions.button-container + .obj_actions = link_to t('cancel'), pool_path(@pool), :class => 'button danger', :id => 'cancel_deployment_button' %h1.deployments = @title diff --git a/src/app/views/deployments/launch_from_catalog.html.haml b/src/app/views/deployments/launch_from_catalog.html.haml index f38a600..cc2cf12 100644 --- a/src/app/views/deployments/launch_from_catalog.html.haml +++ b/src/app/views/deployments/launch_from_catalog.html.haml @@ -1,6 +1,6 @@ = render :partial => 'layouts/nav_history' %header.page-header - #obj_actions.button-container + .obj_actions = link_to t('edit'), edit_catalog_path(@catalog), :class => 'button', :id => 'edit_button' %h1.pools= @catalog.name
diff --git a/src/app/views/deployments/show.html.haml b/src/app/views/deployments/show.html.haml index cbd0983..6006a55 100644 --- a/src/app/views/deployments/show.html.haml +++ b/src/app/views/deployments/show.html.haml @@ -4,6 +4,8 @@ = render :partial => 'alerts_show' %section.content-section %header#tab-container-1 + .section-controls + = pretty_filter_toggle(deployment_path(@deployment, :view => 'pretty', :page => params[:page]), deployment_path(@deployment, :view => 'filter', :page => params[:page])) %nav.faceted %ul#tab-container-1-nav - @tabs.each do |tab| @@ -13,10 +15,5 @@ = tab[:name] -if tab[:count] %span.label.badge.count.dark=tab[:count] - .section-controls - #obj_actions.button-container - .button-group - = pretty_filter_toggle(deployment_path(@deployment, :view => 'pretty', :page => params[:page]), - deployment_path(@deployment, :view => 'filter', :page => params[:page])) .content.collapsible.toggle-view.deployments#tab = render :partial => @view diff --git a/src/app/views/hardware_profiles/_form.html.haml b/src/app/views/hardware_profiles/_form.html.haml index 5b130b5..972cb69 100644 --- a/src/app/views/hardware_profiles/_form.html.haml +++ b/src/app/views/hardware_profiles/_form.html.haml @@ -1,23 +1,26 @@ - if @hardware_profile.errors.any? = render 'layouts/error_messages', :object => @hardware_profile -= hwp_form.label :name -= hwp_form.text_field :name -%table - %thead - %tr - - @header.each do |header| - %th - = header[:name] - - [:memory, :cpu, :storage, :architecture].each do |type| - = hwp_form.fields_for type do |hwpp_form| +%fieldset + = hwp_form.label :name, :class => 'em' + = hwp_form.text_field :name, :class => 'em' +%fieldset + %table + %thead %tr - %td= hwpp_form.text_field(:name, :readonly => "readonly") - %td= hwpp_form.text_field(:unit, :size => 5, :readonly => "readonly") - %td - -if type == :architecture - = hwpp_form.select("value", ["i386", "x86_64"], {}) - -else - = hwpp_form.text_field(:value) + - @header.each do |header| + %th + = header[:name] + - [:memory, :cpu, :storage, :architecture].each do |type| + = hwp_form.fields_for type do |hwpp_form| + %tr + %td= hwpp_form.text_field(:name, :readonly => "readonly") + %td= hwpp_form.text_field(:unit, :size => 5, :readonly => "readonly") + %td + -if type == :architecture + = hwpp_form.select("value", ["i386", "x86_64"], {}) + -else + = hwpp_form.text_field(:value)
-= hwp_form.submit t('hardware_profiles.form.check_matches'), :class => 'danger button', :id => 'check_matches' -= hwp_form.submit t('save'), :class => 'submit button', :id => 'save_button' +%fieldset.options + = hwp_form.submit t('hardware_profiles.form.check_matches'), :class => 'danger button', :id => 'check_matches' + = hwp_form.submit t('save'), :class => 'submit button', :id => 'save_button' diff --git a/src/app/views/hardware_profiles/_section_header.html.haml b/src/app/views/hardware_profiles/_section_header.html.haml index 2ef093f..e5f40b5 100644 --- a/src/app/views/hardware_profiles/_section_header.html.haml +++ b/src/app/views/hardware_profiles/_section_header.html.haml @@ -1,4 +1,4 @@ %header.page-header - #obj_actions.button-group + .obj_actions = link_to t('hardware_profiles.list.new_hardware'), new_hardware_profile_url, :class => 'button primary', :id => 'new_hardware_profile_button' %h1.hardware_profiles=t'hardware_profiles.hardware_profiles' diff --git a/src/app/views/hardware_profiles/edit.html.haml b/src/app/views/hardware_profiles/edit.html.haml index 66219ad..306654f 100644 --- a/src/app/views/hardware_profiles/edit.html.haml +++ b/src/app/views/hardware_profiles/edit.html.haml @@ -1,18 +1,17 @@ = render :partial => 'layouts/admin_nav'
%header.page-header - #obj_actions.button-container + .obj_actions = link_to t('hardware_profiles.list.new_hardware'), hardware_profile_url, :class => 'button primary', :id => 'new_user_button' - %div.button-group - = link_to t('hardware_profiles.edit.cancel_editing'), hardware_profile_path(@hardware_profile), :class => 'button pill danger', :id => 'new_user_button' + = link_to t('hardware_profiles.edit.cancel_editing'), hardware_profile_path(@hardware_profile), :class => 'button pill danger', :id => 'new_user_button' %h1.hardware_profiles= @title
-%section.content-section.hardware_profile +%section.content-section %header %h2=t('hardware_profiles.edit.edit_hwp')
.content - = form_for @hardware_profile, :url => hardware_profile_path(@hardware_profile), :html => { :multipart => true } do |hwp_form| + = form_for @hardware_profile, :url => hardware_profile_path(@hardware_profile), :html => { :multipart => true, :class => 'generic' } do |hwp_form| = render :partial => "form", :locals => { :hwp_form => hwp_form }
= render :partial => 'matching_provider_hardware_profiles' if params[:commit] == 'Check Matches' diff --git a/src/app/views/hardware_profiles/new.html.haml b/src/app/views/hardware_profiles/new.html.haml index bedcda7..90d40f5 100644 --- a/src/app/views/hardware_profiles/new.html.haml +++ b/src/app/views/hardware_profiles/new.html.haml @@ -1,7 +1,7 @@ = render :partial => 'layouts/admin_nav'
%header.page-header - #obj_actions + .obj_actions .return_to = t'return_to' = link_to t('hardware_profiles.hardware_profiles'), hardware_profiles_path diff --git a/src/app/views/hardware_profiles/show.html.haml b/src/app/views/hardware_profiles/show.html.haml index d89fe39..b2bbb83 100644 --- a/src/app/views/hardware_profiles/show.html.haml +++ b/src/app/views/hardware_profiles/show.html.haml @@ -1,6 +1,6 @@ = render :partial => 'layouts/admin_nav' %header.page-header - #obj_actions.button-container + .obj_actions - if check_privilege(Privilege::CREATE, HardwareProfile) = link_to t('hardware_profiles.list.new_hardware'), new_hardware_profile_url, :class => 'button primary', :id => 'new_role_button' .button-group diff --git a/src/app/views/images/edit_xml.html.haml b/src/app/views/images/edit_xml.html.haml index 4af44ec..a2b7ac7 100644 --- a/src/app/views/images/edit_xml.html.haml +++ b/src/app/views/images/edit_xml.html.haml @@ -1,6 +1,6 @@ = render :partial => 'layouts/admin_nav' %header.page-header - #obj_actions.button-container + .obj_actions .return_to = t :return_to = link_to t('images.environment', :environment => @environment.name), pool_family_path(@environment) diff --git a/src/app/views/images/import.html.haml b/src/app/views/images/import.html.haml index 9fdb103..ec5b3ac 100644 --- a/src/app/views/images/import.html.haml +++ b/src/app/views/images/import.html.haml @@ -1,6 +1,6 @@ = render :partial => 'layouts/admin_nav' %header.page-header - #obj_actions.button-container + .obj_actions.button-container .return_to = t :return_to = link_to t('images.environment', :environment => @environment.name), pool_family_path(@environment) diff --git a/src/app/views/images/new.html.haml b/src/app/views/images/new.html.haml index 59761e5..daf34bf 100644 --- a/src/app/views/images/new.html.haml +++ b/src/app/views/images/new.html.haml @@ -1,6 +1,6 @@ = render :partial => 'layouts/admin_nav' %header.page-header - #obj_actions.button-container + .obj_actions .return_to = t(:return_to) = link_to t('images.environment', :environment => @environment.name), pool_family_path(@environment) @@ -18,7 +18,6 @@ %a{ :href => '#image-file-form', :class => 'active'}= t('.upload') %li %a{ :href => '#image-url-form'}= t('.from_url') - .clear
%section#image-file-form = form_tag(edit_xml_images_path, { :multipart => true, :class => 'generic horizontal' }) do diff --git a/src/app/views/images/overview.html.haml b/src/app/views/images/overview.html.haml index 0e0f70c..4d606b9 100644 --- a/src/app/views/images/overview.html.haml +++ b/src/app/views/images/overview.html.haml @@ -1,6 +1,6 @@ = render :partial => 'layouts/admin_nav' %header.page-header - #obj_actions.button-container + .obj_actions .return_to = t :return_to = link_to t('images.environment', :environment => @environment.name), pool_family_path(@environment) diff --git a/src/app/views/images/show.html.haml b/src/app/views/images/show.html.haml index 4ef868d..57385e4 100644 --- a/src/app/views/images/show.html.haml +++ b/src/app/views/images/show.html.haml @@ -1,6 +1,6 @@ = render :partial => 'layouts/admin_nav' %header.page-header - #obj_actions.button-container.images + .obj_actions .return_to =t'return_to' = link_to t('images.index.images'), images_path @@ -24,17 +24,16 @@
%section.content-section %header - %h2= t('.provider_images') .section-controls - if @builds.any? - = t'.view_build' + %span= t'.view_build' - if user_can_build = form_tag image_path(@image.id), :method => :get do = select_tag :build, options_for_build_select(@builds, @build, @latest_build) = submit_tag t('.select_build'), :id => 'select_build_button' - if user_can_build - if @image.imported? - = t('.can_not_build_imported_image') + %span= t('.can_not_build_imported_image') -else - if @builds.any? - build_text = '.rebuild' @@ -46,13 +45,14 @@ #push-all-btn - if @build && @build.id == @latest_build && @target_image_exists = button_to t('.push_all'), push_all_image_path(@image.id, :build_id => @build.id), :class => 'button pill' + %h2= t('.provider_images')
.content - if @account_groups_listing.present? %ul.image_builds - @account_groups_listing.each do |driver, group| - timg = @target_images_by_target[driver] - %li + %li.clearfix %dl %dt .build-actions @@ -120,7 +120,6 @@ = button_to "", image_provider_image_path(@image.id, pimg.id), :method => :delete, :class => 'delete_image' - else - .clear - else .centered.align-center %strong= t("images.flash.error.no_provider_accounts") diff --git a/src/app/views/layouts/_admin_content_tabs.html.haml b/src/app/views/layouts/_admin_content_tabs.html.haml index 6f55e04..5e89f29 100644 --- a/src/app/views/layouts/_admin_content_tabs.html.haml +++ b/src/app/views/layouts/_admin_content_tabs.html.haml @@ -8,6 +8,5 @@ = tab[:name] -if tab[:count] %span.label.badge.count.dark=tab[:count] - .clear .content#tab = render :partial => 'list' diff --git a/src/app/views/layouts/_admin_users_tabs.html.haml b/src/app/views/layouts/_admin_users_tabs.html.haml index 6f55e04..5e89f29 100644 --- a/src/app/views/layouts/_admin_users_tabs.html.haml +++ b/src/app/views/layouts/_admin_users_tabs.html.haml @@ -8,6 +8,5 @@ = tab[:name] -if tab[:count] %span.label.badge.count.dark=tab[:count] - .clear .content#tab = render :partial => 'list' diff --git a/src/app/views/layouts/_filter_table.html.haml b/src/app/views/layouts/_filter_table.html.haml index 7fbaf75..83ef88b 100644 --- a/src/app/views/layouts/_filter_table.html.haml +++ b/src/app/views/layouts/_filter_table.html.haml @@ -8,7 +8,6 @@ - if content_for? form_header %ul.actions = yield form_header - .clear
%table.flat.checkbox_table{ 'data-none_selected' => t("default_none_selected_message"), 'data-confirm' => t("default_confirm_message") } %thead @@ -24,7 +23,7 @@ = rows.collect {|row| capture_haml(row, &block)}.to_s.html_safe
- if content_for? form_footer - %ul.obj_actions + %fieldset.options = yield form_footer
- if rows.is_a?(WillPaginate::Collection) diff --git a/src/app/views/layouts/_pretty_filter_toggle.html.haml b/src/app/views/layouts/_pretty_filter_toggle.html.haml index 3ccb45b..73a2719 100644 --- a/src/app/views/layouts/_pretty_filter_toggle.html.haml +++ b/src/app/views/layouts/_pretty_filter_toggle.html.haml @@ -1,5 +1,3 @@ %span.view-toggle - %a.view-toggle.pretty#pretty_view{:href => pretty_link, :class => (filter_view? ? '' : 'active')} - %span Graphic View - %a.view-toggle.filter#filter_view{:href => filter_link, :class => (filter_view? ? 'active' : '')} - %span Filter View + %a.view-toggle.pretty#pretty_view{:href => pretty_link, :class => (filter_view? ? '' : 'active'), :title => "Pretty view"} + %a.view-toggle.filter#filter_view{:href => filter_link, :class => (filter_view? ? 'active' : ''), :title => "Filter view"} diff --git a/src/app/views/layouts/_tabpanel.html.haml b/src/app/views/layouts/_tabpanel.html.haml index 657c5bc..b603893 100644 --- a/src/app/views/layouts/_tabpanel.html.haml +++ b/src/app/views/layouts/_tabpanel.html.haml @@ -1,17 +1,16 @@ -%section.content-section - %header#tab-container-1 - %nav.faceted - %ul#tab-container-1-nav - - @tabs.each do |tab| - %li - %a{ :href => url_for(:details_tab => tab[:id], :view => "filter", :only_tab => true), - :id => "details_#{tab[:id]}", :class => "#{'active' if @details_tab[:id] == tab[:id]}", - 'data-pretty_view_toggle' => tab[:pretty_view_toggle] } - = tab[:name] - .section-controls - -#%a.collapse{'href'=>'#'} Collapse - .content.collapsible#tab - = render :partial => @details_tab[:view] +%header#tab-container-1 + .section-controls + -#%a.collapse{'href'=>'#'} Collapse + %nav.faceted + %ul#tab-container-1-nav + - @tabs.each do |tab| + %li + %a{ :href => url_for(:details_tab => tab[:id], :view => "filter", :only_tab => true), + :id => "details_#{tab[:id]}", :class => "#{'active' if @details_tab[:id] == tab[:id]}", + 'data-pretty_view_toggle' => tab[:pretty_view_toggle] } + = tab[:name] +.content.collapsible#tab + = render :partial => @details_tab[:view]
:javascript $(document).ready(function() { diff --git a/src/app/views/layouts/application.html.haml b/src/app/views/layouts/application.html.haml index 93d3198..5450a6a 100644 --- a/src/app/views/layouts/application.html.haml +++ b/src/app/views/layouts/application.html.haml @@ -6,12 +6,8 @@ = t("layout.appname") = "| #{@title}" unless @title.blank? %link{:rel => 'shortcut icon', :href => '/favicon.ico'} - = stylesheet_link_tag '/stylesheets/reset.css' - = stylesheet_link_tag '/stylesheets/960.css' - = stylesheet_link_tag '/stylesheets/buttons.css' = stylesheet_link_tag '/stylesheets/compiled/layout.css' = stylesheet_link_tag 'jquery.ui-1.8.1/jquery-ui-1.8.1.custom.css' - = stylesheet_link_tag '/stylesheets/compiled/header.css' /[if lt IE 9] = javascript_include_tag 'http://html5shiv.googlecode.com/svn/trunk/html5.js' /[if lt IE 8] @@ -60,7 +56,6 @@ #content = render :partial => '/layouts/new_notification' if flash.present? or content_for?(:error_messages) = yield - .clear %footer.standard .container %span.copyright!= t('layout.copyright') diff --git a/src/app/views/permissions/_form.html.haml b/src/app/views/permissions/_form.html.haml index 187cdfa..7b401aa 100644 --- a/src/app/views/permissions/_form.html.haml +++ b/src/app/views/permissions/_form.html.haml @@ -2,8 +2,8 @@ = hidden_field_tag :permission_object_type, @permission_object.class.name = hidden_field_tag :permission_object_id, @permission_object.id = hidden_field_tag :path_prefix, @path_prefix - %li= restful_submit_tag t('permissions.form.grant_access'), "create", permissions_path, 'POST', :id => 'save_button', :class => 'button' - %li= link_to t('cancel'), @return_path, :class => 'button danger' + = link_to t('cancel'), @return_path, :class => 'button danger' + = restful_submit_tag t('permissions.form.grant_access'), "create", permissions_path, 'POST', :id => 'save_button', :class => 'button' = filter_table(@header, @users) do |user| %tr{:class => cycle('nostripe','stripe')} %td diff --git a/src/app/views/permissions/_new.html.haml b/src/app/views/permissions/_new.html.haml index e508363..0547e1e 100644 --- a/src/app/views/permissions/_new.html.haml +++ b/src/app/views/permissions/_new.html.haml @@ -1,5 +1,5 @@ %header.page-header - #obj_actions.button-group + .obj_actions .return_to = t'return_to' = link_to @return_text, @return_path, :id => 'new_pool_button' diff --git a/src/app/views/pool_families/_list.html.haml b/src/app/views/pool_families/_list.html.haml index 55006a1..cb590f3 100644 --- a/src/app/views/pool_families/_list.html.haml +++ b/src/app/views/pool_families/_list.html.haml @@ -1,9 +1,8 @@ %header - %h2.pools= @title .section-controls - #obj_actions - - if check_privilege(Privilege::CREATE, PoolFamily) - = link_to t("pool_families.index.new_pool_family"), new_pool_family_path, :class => 'button pill', :id => 'new_pool_family_button' + - if check_privilege(Privilege::CREATE, PoolFamily) + = link_to t("pool_families.index.new_pool_family"), new_pool_family_path, :class => 'button pill', :id => 'new_pool_family_button' + %h2.pools= @title
.content - @pool_families.each do |pool_family| @@ -15,11 +14,10 @@ %h2 = link_to pool_family.name, pool_family .section-controls - #obj_actions - = link_to t("pools.new_pool"), new_pool_path(:pool_family_id => pool_family.id), :class => 'pool_family_button' - - if pool_family.pools.any? - = link_to t("images.import.import_image"), new_image_path(:environment => pool_family.id, :tab => 'import'), :class => 'new_image_button' - = link_to t("images.new.new_image"), new_image_path( :environment => pool_family.id), :class => 'new_image_button' + = link_to t("pools.new_pool"), new_pool_path(:pool_family_id => pool_family.id), :class => 'pool_family_button' + - if pool_family.pools.any? + = link_to t("images.import.import_image"), new_image_path(:environment => pool_family.id, :tab => 'import'), :class => 'new_image_button' + = link_to t("images.new.new_image"), new_image_path( :environment => pool_family.id), :class => 'new_image_button' - unless pool_family.pools.blank? %tr %th= t("pool_families.index.pool_name") diff --git a/src/app/views/pool_families/_section_header.html.haml b/src/app/views/pool_families/_section_header.html.haml index eab1a6c..a36c83e 100644 --- a/src/app/views/pool_families/_section_header.html.haml +++ b/src/app/views/pool_families/_section_header.html.haml @@ -1,4 +1,4 @@ %header.page-header - #obj_actions.button-group + .obj_actions = link_to 'New Pool Family', new_pool_family_url, :class => 'button primary', :id => 'new_pool_family_button' %h1.pool_families Pool Families diff --git a/src/app/views/pool_families/add_provider_accounts.html.haml b/src/app/views/pool_families/add_provider_accounts.html.haml index 2ca766e..95e5174 100644 --- a/src/app/views/pool_families/add_provider_accounts.html.haml +++ b/src/app/views/pool_families/add_provider_accounts.html.haml @@ -1,15 +1,14 @@ = render :partial => 'layouts/admin_nav' %header.page-header - #obj_actions.button-container + .obj_actions .return_to = t'return_to' = link_to @pool_family.name, pool_family_path(@pool_family, :details_tab => 'provider_accounts'), :id => 'new_pool_button' %h1.pool_families= @pool_family.name
%section.content-section.pool_families - %h3= t("pool_families.choose_provider_accounts") - %header#tab-container-1 - %h2.settings= #t("settings.settings") - %nav.faceted - .content#tab + %header + .align-center + %strong= t("pool_families.choose_provider_accounts") + .content = render :partial => 'add_provider_accounts_form' diff --git a/src/app/views/pool_families/edit.html.haml b/src/app/views/pool_families/edit.html.haml index e69cda6..244660a 100644 --- a/src/app/views/pool_families/edit.html.haml +++ b/src/app/views/pool_families/edit.html.haml @@ -1,7 +1,7 @@ = render :partial => 'layouts/admin_nav'
%header.page-header - #obj_actions + .obj_actions .return_to = t("return_to") = link_to t("pool_families.new.environments"), pool_families_path diff --git a/src/app/views/pool_families/new.html.haml b/src/app/views/pool_families/new.html.haml index 9cf6bbf..8a219d1 100644 --- a/src/app/views/pool_families/new.html.haml +++ b/src/app/views/pool_families/new.html.haml @@ -1,6 +1,6 @@ = render :partial => 'layouts/admin_nav' %header.page-header - #obj_actions + .obj_actions .return_to = t("return_to") = link_to t("pool_families.new.environments"), pool_families_path diff --git a/src/app/views/pool_families/show.html.haml b/src/app/views/pool_families/show.html.haml index 03318a5..a95af93 100644 --- a/src/app/views/pool_families/show.html.haml +++ b/src/app/views/pool_families/show.html.haml @@ -1,6 +1,6 @@ = render :partial => 'layouts/admin_nav' %header.page-header - #obj_actions.button-container + .obj_actions .button-group = link_to t('edit'), edit_pool_family_path(@pool_family), :class => 'button pill' = button_to t('delete'), pool_family_path(@pool_family), :method => :delete, :confirm => t("pool_families.confirm_delete"), :class => "button pill danger", :id => 'delete_pool_family_button' @@ -17,6 +17,5 @@ = tab[:name] -if tab[:count] %span.label.badge.count.dark=tab[:count] - .clear .content#tab = render :partial => @view diff --git a/src/app/views/pools/_alerts_index.html.haml b/src/app/views/pools/_alerts_index.html.haml index 2831e81..29cbbd9 100644 --- a/src/app/views/pools/_alerts_index.html.haml +++ b/src/app/views/pools/_alerts_index.html.haml @@ -1,10 +1,11 @@ - if @statistics[:instances_failed_count] > 0 %section.content-section.alerts.collapse_entity %header - %h2=t "alerts_label" - %span.label.badge.alert.count= @statistics[:instances_failed_count] .section-controls = link_to t("providers.edit.toggle_alerts"), "#", :class => 'collapse alerts' unless @statistics[:instances_failed].blank? + %h2.alerts + =t "alerts_label" + %span.label.badge.alert.count= @statistics[:instances_failed_count] .content.collapsible %dl.alerts %ul diff --git a/src/app/views/pools/_alerts_show.html.haml b/src/app/views/pools/_alerts_show.html.haml index 1f9865e..4807e8f 100644 --- a/src/app/views/pools/_alerts_show.html.haml +++ b/src/app/views/pools/_alerts_show.html.haml @@ -1,10 +1,11 @@ - if @statistics[:instances_failed_visible_count] > 0 %section.content-section.alerts.collapse_entity %header - %h2=t 'alerts_label' - %span.label.badge.alert.count= @statistics[:instances_failed_visible_count] .section-controls = link_to t("providers.edit.toggle_alerts"), "#", :class => 'collapse alerts' unless @statistics[:instances_failed].blank? + %h2.alerts + =t 'alerts_label' + %span.label.badge.alert.count= @statistics[:instances_failed_visible_count] .content.collapsible %dl.alerts %ul diff --git a/src/app/views/pools/_edit.html.haml b/src/app/views/pools/_edit.html.haml index 8849e42..17b33fe 100644 --- a/src/app/views/pools/_edit.html.haml +++ b/src/app/views/pools/_edit.html.haml @@ -1,5 +1,5 @@ %header.page-header - #obj_actions.button-container + .obj_actions - if check_privilege(Privilege::CREATE, Pool) = link_to t('pools.new_pool'), new_pool_url, :class => 'button primary', :id => 'new_pool_button' %h1.pools= @pool.name @@ -9,4 +9,4 @@ %h2= @title
.content - = render :partial => 'form' + = render :partial => 'form' \ No newline at end of file diff --git a/src/app/views/pools/_form.html.haml b/src/app/views/pools/_form.html.haml index b93298b..94fa0cd 100644 --- a/src/app/views/pools/_form.html.haml +++ b/src/app/views/pools/_form.html.haml @@ -11,7 +11,7 @@ - if @pool_families = form.collection_select :pool_family_id, @pool_families, :id, :name - else - = form.label :pool_family_id, @pool.pool_family.name + %span.text_instead_input= @pool.pool_family.name = hidden_field_tag 'pool[pool_family_id]', @pool.pool_family_id .field = label_tag :quota, t('quota') diff --git a/src/app/views/pools/_header_index.html.haml b/src/app/views/pools/_header_index.html.haml index 702562a..5735208 100644 --- a/src/app/views/pools/_header_index.html.haml +++ b/src/app/views/pools/_header_index.html.haml @@ -1,5 +1,5 @@ %header.page-header - #obj_actions.button-container + .obj_actions .button-group = pretty_filter_toggle(pools_path(:view => 'pretty', :page => params[:page]), pools_path(:view => 'filter', :page => params[:page])) .button-group @@ -7,4 +7,4 @@ = link_to t('pools.new_pool'), new_pool_path, { :class => 'button primary', :id => 'new_pool_button' } %h1.section-index= t 'pools.index.overview'
-= render :partial => 'scoreboard_index' += render :partial => 'scoreboard_index' \ No newline at end of file diff --git a/src/app/views/pools/_header_show.html.haml b/src/app/views/pools/_header_show.html.haml index b20fc18..cd0d54a 100644 --- a/src/app/views/pools/_header_show.html.haml +++ b/src/app/views/pools/_header_show.html.haml @@ -1,11 +1,11 @@ %header.page-header - #obj_actions.button-container + .obj_actions - if check_privilege(Privilege::CREATE, Deployment, @pool) = link_to t('deployments.new_deployment'), launch_new_deployments_path(:pool_id => @pool.id), :class => 'button primary', :id => 'new_deployment_button' %div.catalog_link = render :partial => 'layouts/catalog_dropdown', :locals => {:catalogs => @pool.catalogs} .button-group - if check_privilege(Privilege::MODIFY, @pool) - = link_to t('edit'), edit_pool_path(@pool), :class => 'button', :id => 'edit_pool_button' - = button_to t('delete'), pool_path(@pool), :method => :delete, :confirm => t('pools.index.confirm_delete'), :class => "button danger", :id => 'delete_pool_button' + = link_to t('edit'), edit_pool_path(@pool), :class => 'button pill', :id => 'edit_pool_button' + = button_to t('delete'), pool_path(@pool), :method => :delete, :confirm => t('pools.index.confirm_delete'), :class => "button pill danger", :id => 'delete_pool_button' %h1.pools= @title diff --git a/src/app/views/pools/show.html.haml b/src/app/views/pools/show.html.haml index b593c7d..882089b 100644 --- a/src/app/views/pools/show.html.haml +++ b/src/app/views/pools/show.html.haml @@ -5,6 +5,8 @@
%section.content-section %header#tab-container-1 + .section-controls + = pretty_filter_toggle(pool_path(@pool, :view => 'pretty', :details_tab => @details_tab[:id], :page => params[:page]), pool_path(@pool, :view => 'filter', :details_tab => @details_tab[:id], :page => params[:page])) %nav.faceted %ul#tab-container-1-nav - @tabs.each do |tab| @@ -13,10 +15,5 @@ = tab[:name] -if tab[:count] %span.label.badge.count.dark=tab[:count] - .section-controls - #obj_actions.button-container - .button-group - = pretty_filter_toggle(pool_path(@pool, :view => 'pretty', :details_tab => @details_tab[:id], :page => params[:page]), - pool_path(@pool, :view => 'filter', :details_tab => @details_tab[:id], :page => params[:page])) .content.collapsible.toggle-view.pools#tab = render :partial => @view diff --git a/src/app/views/provider_accounts/_section_header.html.haml b/src/app/views/provider_accounts/_section_header.html.haml index 1fe8cad..ca4d25d 100644 --- a/src/app/views/provider_accounts/_section_header.html.haml +++ b/src/app/views/provider_accounts/_section_header.html.haml @@ -1,4 +1,4 @@ %header.page-header - #obj_actions.button-group + .obj_actions = link_to t('provider_accounts.new.new_provider_account'), new_provider_account_url, :class => 'button primary', :id => 'new_provider_account_button' %h1.provider_accounts= t'provider_accounts.index.provider_accounts' diff --git a/src/app/views/provider_accounts/edit.html.haml b/src/app/views/provider_accounts/edit.html.haml index b3b0849..f2ce8a2 100644 --- a/src/app/views/provider_accounts/edit.html.haml +++ b/src/app/views/provider_accounts/edit.html.haml @@ -1,6 +1,6 @@ = render :partial => 'layouts/admin_nav' %header.page-header - #obj_actions + .obj_actions .return_to =t'return_to' = link_to t('provider_accounts.new.cloud_providers'), edit_provider_path(@provider, :details_tab => 'accounts') diff --git a/src/app/views/provider_accounts/new.html.haml b/src/app/views/provider_accounts/new.html.haml index b7c05be..b350d52 100644 --- a/src/app/views/provider_accounts/new.html.haml +++ b/src/app/views/provider_accounts/new.html.haml @@ -1,6 +1,6 @@ = render :partial => 'layouts/admin_nav' %header.page-header - #obj_actions + .obj_actions .return_to = t'return_to' = link_to t('provider_accounts.new.cloud_providers'), edit_provider_path(@provider, :details_tab => 'accounts') diff --git a/src/app/views/provider_accounts/show.html.haml b/src/app/views/provider_accounts/show.html.haml index 72b753b..a46ec37 100644 --- a/src/app/views/provider_accounts/show.html.haml +++ b/src/app/views/provider_accounts/show.html.haml @@ -1,6 +1,6 @@ = render :partial => 'layouts/admin_nav' %header.page-header - #obj_actions + .obj_actions .return_to =t'return_to' = link_to t('provider_accounts.new.cloud_providers'), edit_provider_path(@provider, :details_tab => 'accounts') diff --git a/src/app/views/provider_realms/_section_header.html.haml b/src/app/views/provider_realms/_section_header.html.haml index 8aea23e..c4b6121 100644 --- a/src/app/views/provider_realms/_section_header.html.haml +++ b/src/app/views/provider_realms/_section_header.html.haml @@ -1,4 +1,4 @@ %header.page-header - #obj_actions.button-group + .obj_actions = link_to t('realms.new_realm'), new_realm_url, :class => 'button primary', :id => 'new_realm_button' %h1.realms Realms diff --git a/src/app/views/provider_realms/show.html.haml b/src/app/views/provider_realms/show.html.haml index a6fa471..d9c414b 100644 --- a/src/app/views/provider_realms/show.html.haml +++ b/src/app/views/provider_realms/show.html.haml @@ -1,6 +1,6 @@ = render :partial => 'layouts/admin_nav' %header.page-header - #obj_actions.button_container + .obj_actions .return_to = t('return_to') = link_to t('provider_realms.provider_realms'), edit_provider_path(@realm.provider, :details_tab => 'realms', :only_tab => true), :id => 'back_to_provider_realms_button' diff --git a/src/app/views/providers/_section_header.html.haml b/src/app/views/providers/_section_header.html.haml index 039e3cf..c7d6ce9 100644 --- a/src/app/views/providers/_section_header.html.haml +++ b/src/app/views/providers/_section_header.html.haml @@ -1,5 +1,5 @@ %header.page-header - #obj_actions + .obj_actions %span.label.light= t("providers.choose_a_provider") %ul#provider_select %li diff --git a/src/app/views/providers/edit.html.haml b/src/app/views/providers/edit.html.haml index 241ef55..90277c2 100644 --- a/src/app/views/providers/edit.html.haml +++ b/src/app/views/providers/edit.html.haml @@ -11,14 +11,14 @@ = t("providers.edit.enable_configure_providers") = image_tag "provider_enable_hint.png"
-%section.content-section.alerts.collapse_entity - %header - %h2.alerts - = t("alerts_label") - %span.label.badge.count.alert= @alerts.count - .section-controls - = link_to t("providers.edit.toggle_alerts"), "#", :class => 'collapse alerts' unless @alerts.blank? - - unless @alerts.blank? +- unless @alerts.blank? + %section.content-section.alerts.collapse_entity + %header + .section-controls + = link_to t("providers.edit.toggle_alerts"), "#", :class => 'collapse alerts' unless @alerts.blank? + %h2.alerts + = t("alerts_label") + %span.label.badge.count.alert= @alerts.count .content.collapsible %dl.alerts %ul diff --git a/src/app/views/providers/new.html.haml b/src/app/views/providers/new.html.haml index e98e58e..bcac552 100644 --- a/src/app/views/providers/new.html.haml +++ b/src/app/views/providers/new.html.haml @@ -1,6 +1,6 @@ = render :partial => 'layouts/admin_nav' %header.page-header - #obj_actions + .obj_actions %span.label.light Choose a provider: %ul#provider_select %li diff --git a/src/app/views/realms/_section_header.html.haml b/src/app/views/realms/_section_header.html.haml index 8aea23e..c4b6121 100644 --- a/src/app/views/realms/_section_header.html.haml +++ b/src/app/views/realms/_section_header.html.haml @@ -1,4 +1,4 @@ %header.page-header - #obj_actions.button-group + .obj_actions = link_to t('realms.new_realm'), new_realm_url, :class => 'button primary', :id => 'new_realm_button' %h1.realms Realms diff --git a/src/app/views/realms/edit.html.haml b/src/app/views/realms/edit.html.haml index b051543..d1564a3 100644 --- a/src/app/views/realms/edit.html.haml +++ b/src/app/views/realms/edit.html.haml @@ -1,10 +1,9 @@ = render :partial => 'layouts/admin_nav'
%header.page-header - #obj_actions.button-container + .obj_actions = link_to t('realms.new_realm'), new_realm_url, :class => 'button primary', :id => 'new_user_button' - %div.button-group - = link_to t('realms.edit.cancel_editing'), realm_path(@realm), :class => 'button pill danger', :id => 'new_user_button' + = link_to t('realms.edit.cancel_editing'), realm_path(@realm), :class => 'button pill danger', :id => 'new_user_button' %h1.realms= @title
%section.content-section.realm diff --git a/src/app/views/realms/new.html.haml b/src/app/views/realms/new.html.haml index 990b07c..539d7c3 100644 --- a/src/app/views/realms/new.html.haml +++ b/src/app/views/realms/new.html.haml @@ -1,6 +1,6 @@ = render :partial => 'layouts/admin_nav' %header.page-header - #obj_actions + .obj_actions .return_to =t'return_to' = link_to t('realms.realms'), realms_path diff --git a/src/app/views/realms/show.html.haml b/src/app/views/realms/show.html.haml index b0f8b44..5823a0b 100644 --- a/src/app/views/realms/show.html.haml +++ b/src/app/views/realms/show.html.haml @@ -1,6 +1,6 @@ = render :partial => 'layouts/admin_nav' %header.page-header - #obj_actions.button-container + .obj_actions .return_to =t'return_to' = link_to t('realms.realms'), realms_path diff --git a/src/app/views/roles/_form.html.haml b/src/app/views/roles/_form.html.haml index ff8475f..8edae18 100644 --- a/src/app/views/roles/_form.html.haml +++ b/src/app/views/roles/_form.html.haml @@ -1,8 +1,10 @@ - if @role.errors.any? = render 'layouts/error_messages', :object => @role %fieldset - = form.label :name - = form.text_field :name, :class => "em long" + .field + = form.label :name, :class => 'em' + .input + = form.text_field :name, :class => "em long" %fieldset.options - = form.submit t('save'), :class => "submit button" - = link_to t(:cancel), roles_path, :class => 'button button' + = form.submit t('save'), :class => "button" + = link_to t(:cancel), roles_path, :class => 'button danger' diff --git a/src/app/views/roles/_section_header.html.haml b/src/app/views/roles/_section_header.html.haml index c1b2ae5..9cbfe88 100644 --- a/src/app/views/roles/_section_header.html.haml +++ b/src/app/views/roles/_section_header.html.haml @@ -1,4 +1,4 @@ %header.page-header - #obj_actions.button-group + .obj_actions = link_to t('roles.new_role'), new_role_url, :class => 'button primary', :id => 'new_role_button' %h1.no-icon Roles diff --git a/src/app/views/roles/edit.html.haml b/src/app/views/roles/edit.html.haml index d3c175d..04cff39 100644 --- a/src/app/views/roles/edit.html.haml +++ b/src/app/views/roles/edit.html.haml @@ -1,20 +1,16 @@ = render :partial => 'layouts/admin_nav' %header.page-header - #obj_actions.button-container + .obj_actions = link_to t('roles.new_role'), new_role_url, :class => 'button primary', :id => 'new_role_button' - %div.button-group - = link_to t('roles.edit.cancel_editing'), role_path(@role), :class => 'button pill danger', :id => 'new_role_button' + = link_to t('roles.edit.cancel_editing'), role_path(@role), :class => 'button pill danger', :id => 'new_role_button' %h1.no-icon= @role.name.titlecase
%section.content-section.role %header - %h2=t'roles.edit.properties' - - .content - if check_privilege(Privilege::MODIFY, Role) %h2=t('roles.edit.editing_role') + "#{@role.name}" - else %h2=t('roles.edit.editing_role') - + .content = form_for @role, :url => role_path(@role), :html => { :method => :put, :class => 'generic horizontal' } do |f| = render :partial => "form", :locals => { :form => f } diff --git a/src/app/views/roles/show.html.haml b/src/app/views/roles/show.html.haml index 98b61b5..a58c4b1 100644 --- a/src/app/views/roles/show.html.haml +++ b/src/app/views/roles/show.html.haml @@ -1,6 +1,6 @@ = render :partial => 'layouts/admin_nav' %header.page-header - #obj_actions.button-container + .obj_actions = link_to t('roles.new_role'), new_role_url, :class => 'button primary', :id => 'new_role_button' .button-group = link_to t('edit'), edit_role_path(@role), :class => 'button pill' diff --git a/src/app/views/settings/index.html.haml b/src/app/views/settings/index.html.haml index 2e7761f..d0484ca 100644 --- a/src/app/views/settings/index.html.haml +++ b/src/app/views/settings/index.html.haml @@ -2,14 +2,10 @@ = render :partial => 'section_header'
%section.content-section.settings + %header + %h2= t('.permissions') .content - %ul.tiles{:class => 'container_16'} - - if check_privilege(Privilege::MODIFY) - %li#permissions.grid_8 - = image_tag "blnk.png", :class => "icon", :alt => "" - %h2 - = t('.permissions') - %p - = t('.permissions_desc') - = link_to t(:continue), self_service_settings_path, :class => 'button' - .clear + - if check_privilege(Privilege::MODIFY) + %p + = t('.permissions_desc') + = link_to t(:continue), self_service_settings_path, :class => 'button pill' diff --git a/src/app/views/settings/self_service.html.haml b/src/app/views/settings/self_service.html.haml index c623896..7194c58 100644 --- a/src/app/views/settings/self_service.html.haml +++ b/src/app/views/settings/self_service.html.haml @@ -1,6 +1,6 @@ = render :partial => 'layouts/admin_nav' %header.page-header - #obj_actions.button-group + .obj_actions .return_to = t 'return_to' = link_to "Settings", settings_path @@ -20,6 +20,6 @@ %label= t('.instances_quota') = text_field :self_service_default_quota, :maximum_running_instances, :class => 'grid_5' %fieldset.options - #obj_actions.button-group + .obj_actions.button-group = link_to t('reset'), self_service_settings_path, :class => 'button pill' = submit_tag t(:save), :class => "button pill" diff --git a/src/app/views/users/_list.html.haml b/src/app/views/users/_list.html.haml index 5978181..6d6cc51 100644 --- a/src/app/views/users/_list.html.haml +++ b/src/app/views/users/_list.html.haml @@ -1,11 +1,9 @@ %header %h2#users.users= @title - .section-controls - #obj_actions - = link_to "", new_user_path, :class => 'add-user-button', :id => 'add_user_button'
- content_for :form_header do %li= restful_submit_tag "#{t'users.list.delete_selected'}", "destroy", multi_destroy_users_path, 'DELETE', :id => 'delete_button', :class => 'button danger' + %li= link_to t("users.list.add_user"), new_user_path, :class => 'button', :id => 'add_user_button'
- content_for :filter_controls do %li diff --git a/src/app/views/users/_section_header.html.haml b/src/app/views/users/_section_header.html.haml index 73a64a1..c798674 100644 --- a/src/app/views/users/_section_header.html.haml +++ b/src/app/views/users/_section_header.html.haml @@ -1,5 +1,5 @@ %header.page-header - #obj_actions + .obj_actions .return_to =t'users.quick_jump' = link_to 'Groups', "#groups" diff --git a/src/app/views/users/edit.html.haml b/src/app/views/users/edit.html.haml index 619bf93..f19fb48 100644 --- a/src/app/views/users/edit.html.haml +++ b/src/app/views/users/edit.html.haml @@ -1,6 +1,6 @@ = render :partial => 'layouts/admin_nav' %header.page-header - #obj_actions + .obj_actions .return_to =t'users.return_to' = link_to "#{t'users.users'}", users_path diff --git a/src/app/views/users/new.html.haml b/src/app/views/users/new.html.haml index f6e1ce7..b1b4b5f 100644 --- a/src/app/views/users/new.html.haml +++ b/src/app/views/users/new.html.haml @@ -1,6 +1,6 @@ = render :partial => 'layouts/admin_nav' %header.page-header - #obj_actions + .obj_actions .return_to =t'return_to' = link_to "#{t'users.users'}", users_path diff --git a/src/app/views/users/show.html.haml b/src/app/views/users/show.html.haml index 16a7118..aa9ca5b 100644 --- a/src/app/views/users/show.html.haml +++ b/src/app/views/users/show.html.haml @@ -1,7 +1,7 @@ = render :partial => 'layouts/admin_nav' %header.page-header - if check_privilege(Privilege::VIEW, User) - #obj_actions + .obj_actions .return_to =t'return_to' = link_to t('users.users'), users_path @@ -17,11 +17,10 @@ %dd= @user.email %dt=t'users.show.username' %dd= @user.login - #obj_actions.button-group + .button-group = link_to "#{t('users.show.edit')}", edit_user_path(@user), :class => 'button' - unless @user.id == current_user.id = button_to "#{t('users.show.delete')}", user_path(@user), :method => :delete, :confirm => t('users.confirm_delete'), :class => "button danger" - .clear %dl.user_stats %ul %div @@ -44,7 +43,6 @@ %li %dt=t'users.show.last_login_ip' %dd= @user.last_login_ip - .clear
/%section.content-section.user / %header diff --git a/src/config/locales/en.yml b/src/config/locales/en.yml index f6d3623..6bee3f4 100644 --- a/src/config/locales/en.yml +++ b/src/config/locales/en.yml @@ -45,6 +45,7 @@ en: neccessary_information: "Enter necessary information about your new user and click 'Save User' when you are finished." list: delete_selected: Delete Selected + add_user: Add User unlimited: Unlimited edit: edit_user: Edit User diff --git a/src/features/step_definitions/hardware_profile_steps.rb b/src/features/step_definitions/hardware_profile_steps.rb index be3c4a8..b2c3f35 100644 --- a/src/features/step_definitions/hardware_profile_steps.rb +++ b/src/features/step_definitions/hardware_profile_steps.rb @@ -89,7 +89,7 @@ Then /^I should not see the edit button$/ do end
Then /^I should not see the delete button$/ do - within('#obj_actions') do + within('.obj_actions') do page.should have_no_selector('input[value=delete]') end end diff --git a/src/public/javascripts/application.js b/src/public/javascripts/application.js index f4054fb..52bb712 100644 --- a/src/public/javascripts/application.js +++ b/src/public/javascripts/application.js @@ -20,7 +20,7 @@ $.extend(Conductor, {
e.preventDefault(); var url = $(this).attr('href'); - $('#tab').html('<span class="loading_tabs"></span>'); + $('#tab').html('<div class="loading_tabs"></div>'); $.get(url, function(data) { $('#tab').html(data).show(); }) @@ -85,7 +85,7 @@ $.extend(Conductor, { bind_pretty_toggle: function() { Conductor.nicelyHookAjaxClick($("#pretty_view"), function() { var link_element = this; - $('#content .toggle-view').html('<span class="loading_tabs"></span>'); + $('#content .toggle-view').html('<div class="loading_tabs"></div>'); $.get($(this).attr("href"), $(this).serialize(), function(result) { $('#content .toggle-view').html(result); $(link_element).addClass('active'); @@ -94,7 +94,7 @@ $.extend(Conductor, { }); Conductor.nicelyHookAjaxClick($("#filter_view"), function() { var link_element = this; - $('#content .toggle-view').html('<span class="loading_tabs"></span>'); + $('#content .toggle-view').html('<div class="loading_tabs"></div>'); $.get($(this).attr("href"), $(this).serialize(), function(result) { $('#content .toggle-view').html(result); $('#details-selected').hide(); diff --git a/src/public/stylesheets/960.css b/src/public/stylesheets/960.css deleted file mode 100644 index 1272675..0000000 --- a/src/public/stylesheets/960.css +++ /dev/null @@ -1,440 +0,0 @@ -/* - 960 Grid System ~ Core CSS. - Learn more ~ http://960.gs/ - - Licensed under GPL and MIT. -*/ - -/* - Forces backgrounds to span full width, - even if there is horizontal scrolling. - Increase this if your layout is wider. - - Note: IE6 works fine without this fix. -*/ - -body { - min-width: 960px; -} - -/* Containers -----------------------------------------------------------------------------------------------------*/ -.container_16 { - margin-left: auto; - margin-right: auto; - width: 960px; -} - -/* Grid >> Global -----------------------------------------------------------------------------------------------------*/ - -.grid_1, -.grid_2, -.grid_3, -.grid_4, -.grid_5, -.grid_6, -.grid_7, -.grid_8, -.grid_9, -.grid_10, -.grid_11, -.grid_12, -.grid_13, -.grid_14, -.grid_15, -.grid_16 { - display: inline; - float: left; - position: relative; - margin-left: 10px; - margin-right: 10px; -} - -.push_1, .pull_1, -.push_2, .pull_2, -.push_3, .pull_3, -.push_4, .pull_4, -.push_5, .pull_5, -.push_6, .pull_6, -.push_7, .pull_7, -.push_8, .pull_8, -.push_9, .pull_9, -.push_10, .pull_10, -.push_11, .pull_11, -.push_12, .pull_12, -.push_13, .pull_13, -.push_14, .pull_14, -.push_15, .pull_15, -.push_16, .pull_16 { - position: relative; -} - -/* Grid >> Children (Alpha ~ First, Omega ~ Last) -----------------------------------------------------------------------------------------------------*/ - -.alpha { - margin-left: 0; -} - -.omega { - margin-right: 0; -} - -/* Grid >> 16 Columns -----------------------------------------------------------------------------------------------------*/ - -.container_16 .grid_1 { - width: 40px; -} - -.container_16 .grid_2 { - width: 100px; -} - -.container_16 .grid_3 { - width: 160px; -} - -.container_16 .grid_4 { - width: 220px; -} - -.container_16 .grid_5 { - width: 280px; -} - -.container_16 .grid_6 { - width: 340px; -} - -.container_16 .grid_7 { - width: 400px; -} - -.container_16 .grid_8 { - width: 460px; -} - -.container_16 .grid_9 { - width: 520px; -} - -.container_16 .grid_10 { - width: 580px; -} - -.container_16 .grid_11 { - width: 640px; -} - -.container_16 .grid_12 { - width: 700px; -} - -.container_16 .grid_13 { - width: 760px; -} - -.container_16 .grid_14 { - width: 820px; -} - -.container_16 .grid_15 { - width: 880px; -} - -.container_16 .grid_16 { - width: 940px; -} - -/* Prefix Extra Space >> 16 Columns -----------------------------------------------------------------------------------------------------*/ - -.container_16 .prefix_1 { - padding-left: 60px; -} - -.container_16 .prefix_2 { - padding-left: 120px; -} - -.container_16 .prefix_3 { - padding-left: 180px; -} - -.container_16 .prefix_4 { - padding-left: 240px; -} - -.container_16 .prefix_5 { - padding-left: 300px; -} - -.container_16 .prefix_6 { - padding-left: 360px; -} - -.container_16 .prefix_7 { - padding-left: 420px; -} - -.container_16 .prefix_8 { - padding-left: 480px; -} - -.container_16 .prefix_9 { - padding-left: 540px; -} - -.container_16 .prefix_10 { - padding-left: 600px; -} - -.container_16 .prefix_11 { - padding-left: 660px; -} - -.container_16 .prefix_12 { - padding-left: 720px; -} - -.container_16 .prefix_13 { - padding-left: 780px; -} - -.container_16 .prefix_14 { - padding-left: 840px; -} - -.container_16 .prefix_15 { - padding-left: 900px; -} - -/* Suffix Extra Space >> 16 Columns -----------------------------------------------------------------------------------------------------*/ - -.container_16 .suffix_1 { - padding-right: 60px; -} - -.container_16 .suffix_2 { - padding-right: 120px; -} - -.container_16 .suffix_3 { - padding-right: 180px; -} - -.container_16 .suffix_4 { - padding-right: 240px; -} - -.container_16 .suffix_5 { - padding-right: 300px; -} - -.container_16 .suffix_6 { - padding-right: 360px; -} - -.container_16 .suffix_7 { - padding-right: 420px; -} - -.container_16 .suffix_8 { - padding-right: 480px; -} - -.container_16 .suffix_9 { - padding-right: 540px; -} - -.container_16 .suffix_10 { - padding-right: 600px; -} - -.container_16 .suffix_11 { - padding-right: 660px; -} - -.container_16 .suffix_12 { - padding-right: 720px; -} - -.container_16 .suffix_13 { - padding-right: 780px; -} - -.container_16 .suffix_14 { - padding-right: 840px; -} - -.container_16 .suffix_15 { - padding-right: 900px; -} - -/* Push Space >> 16 Columns -----------------------------------------------------------------------------------------------------*/ - -.container_16 .push_1 { - left: 60px; -} - -.container_16 .push_2 { - left: 120px; -} - -.container_16 .push_3 { - left: 180px; -} - -.container_16 .push_4 { - left: 240px; -} - -.container_16 .push_5 { - left: 300px; -} - -.container_16 .push_6 { - left: 360px; -} - -.container_16 .push_7 { - left: 420px; -} - -.container_16 .push_8 { - left: 480px; -} - -.container_16 .push_9 { - left: 540px; -} - -.container_16 .push_10 { - left: 600px; -} - -.container_16 .push_11 { - left: 660px; -} - -.container_16 .push_12 { - left: 720px; -} - -.container_16 .push_13 { - left: 780px; -} - -.container_16 .push_14 { - left: 840px; -} - -.container_16 .push_15 { - left: 900px; -} - -/* Pull Space >> 16 Columns -----------------------------------------------------------------------------------------------------*/ - -.container_16 .pull_1 { - left: -60px; -} - -.container_16 .pull_2 { - left: -120px; -} - -.container_16 .pull_3 { - left: -180px; -} - -.container_16 .pull_4 { - left: -240px; -} - -.container_16 .pull_5 { - left: -300px; -} - -.container_16 .pull_6 { - left: -360px; -} - -.container_16 .pull_7 { - left: -420px; -} - -.container_16 .pull_8 { - left: -480px; -} - -.container_16 .pull_9 { - left: -540px; -} - -.container_16 .pull_10 { - left: -600px; -} - -.container_16 .pull_11 { - left: -660px; -} - -.container_16 .pull_12 { - left: -720px; -} - -.container_16 .pull_13 { - left: -780px; -} - -.container_16 .pull_14 { - left: -840px; -} - -.container_16 .pull_15 { - left: -900px; -} - -/* `Clear Floated Elements -----------------------------------------------------------------------------------------------------*/ - -/* http://sonspring.com/journal/clearing-floats */ - -.clear { - clear: both; - display: block; - overflow: hidden; - visibility: hidden; - width: 0; - height: 0; -} - -/* http://www.yuiblog.com/blog/2010/09/27/clearfix-reloaded-overflowhidden-demy... */ - -.clearfix:before, -.clearfix:after { - content: '\0020'; - display: block; - overflow: hidden; - visibility: hidden; - width: 0; - height: 0; -} - -.clearfix:after { - clear: both; -} - -/* - The following zoom: 1 rule is specifically for IE6 + IE7. - Move to separate stylesheet if invalid CSS is a problem. -*/ - -.clearfix { - zoom: 1; -} \ No newline at end of file diff --git a/src/public/stylesheets/buttons.css b/src/public/stylesheets/buttons.css deleted file mode 100644 index 10876b1..0000000 --- a/src/public/stylesheets/buttons.css +++ /dev/null @@ -1,394 +0,0 @@ -/* ------------------------------------------ -CSS3 GITHUB BUTTONS (Nicolas Gallagher) -Licensed under Unlicense -http://github.com/necolas/css3-github-buttons ------------------------------------------- */ - - -/* ------------------------------------------------------------------------------------------------------------- BUTTON */ - -.button { - position: relative; - overflow: visible; - display: inline-block; - padding: 0.5em 1em; - border: 1px solid #d4d4d4; - margin: 0; - text-decoration: none; - text-shadow: 1px 1px 0 #fff; - font:11px/normal sans-serif; - color: #333; - white-space: nowrap; - cursor: pointer; - outline: none; - background-color: #ececec; - background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#f4f4f4), to(#ececec)); - background-image: -moz-linear-gradient(#f4f4f4, #ececec); - background-image: -o-linear-gradient(#f4f4f4, #ececec); - background-image: linear-gradient(#f4f4f4, #ececec); - -webkit-background-clip: padding; - -moz-background-clip: padding; - -o-background-clip: padding-box; - /*background-clip: padding-box;*/ /* commented out due to Opera 11.10 bug */ - -webkit-border-radius: 0.2em; - -moz-border-radius: 0.2em; - border-radius: 0.2em; - /* IE hacks */ - zoom: 1; - *display: inline; -} - -.button:hover, -.button:focus, -.button:active, -.button.active { - border-color: #3072b3; - border-bottom-color: #2a65a0; - text-decoration: none; - text-shadow: -1px -1px 0 rgba(0,0,0,0.3); - color: #fff; - background-color: #3C8DDE; - background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#599bdc), to(#3072b3)); - background-image: -moz-linear-gradient(#599bdc, #3072b3); - background-image: -o-linear-gradient(#599bdc, #3072b3); - background-image: linear-gradient(#599bdc, #3072b3); -} - -.button:active, -.button.active { - border-color: #2a65a0; - border-bottom-color: #3884CF; - background-color: #3072b3; - background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#3072b3), to(#599bdc)); - background-image: -moz-linear-gradient(#3072b3, #599bdc); - background-image: -o-linear-gradient(#3072b3, #599bdc); - background-image: linear-gradient(#3072b3, #599bdc); -} - -/* overrides extra padding on button elements in Firefox */ -.button::-moz-focus-inner { - padding: 0; - border: 0; -} - -/* ............................................................................................................. Icons */ - -.button.icon:before { - content: ""; - position: relative; - top: 1px; - float:left; - width: 12px; - height: 12px; - margin: 0 0.75em 0 -0.25em; - background: url(images/button-icons.png) 0 99px no-repeat; -} - -.button.arrowup.icon:before { background-position: 0 0; } -.button.arrowup.icon:hover:before, -.button.arrowup.icon:focus:before, -.button.arrowup.icon:active:before { background-position: -12px 0; } - -.button.arrowdown.icon:before { background-position: 0 -12px; } -.button.arrowdown.icon:hover:before, -.button.arrowdown.icon:focus:before, -.button.arrowdown.icon:active:before { background-position: -12px -12px; } - -.button.arrowleft.icon:before { background-position: 0 -24px; } -.button.arrowleft.icon:hover:before, -.button.arrowleft.icon:focus:before, -.button.arrowleft.icon:active:before { background-position: -12px -24px; } - -.button.arrowright.icon:before { float:right; margin: 0 -0.25em 0 0.5em; background-position: 0 -36px; } -.button.arrowright.icon:hover:before, -.button.arrowright.icon:focus:before, -.button.arrowright.icon:active:before { background-position: -12px -36px; } - -.button.approve.icon:before { background-position: 0 -48px; } -.button.approve.icon:hover:before, -.button.approve.icon:focus:before, -.button.approve.icon:active:before { background-position: -12px -48px; } - -.button.add.icon:before { background-position: 0 -288px; } -.button.add.icon:hover:before, -.button.add.icon:focus:before, -.button.add.icon:active:before { background-position: -12px -288px; } - -.button.remove.icon:before { background-position: 0 -60px; } -.button.remove.icon:hover:before, -.button.remove.icon:focus:before, -.button.remove.icon:active:before { background-position: -12px -60px; } - -.button.log.icon:before { background-position: 0 -72px; } -.button.log.icon:hover:before, -.button.log.icon:focus:before, -.button.log.icon:active:before { background-position: -12px -72px; } - -.button.calendar.icon:before { background-position: 0 -84px; } -.button.calendar.icon:hover:before, -.button.calendar.icon:focus:before, -.button.calendar.icon:active:before { background-position: -12px -84px; } - -.button.chat.icon:before { background-position: 0 -96px; } -.button.chat.icon:hover:before, -.button.chat.icon:focus:before, -.button.chat.icon:active:before { background-position: -12px -96px; } - -.button.clock.icon:before { background-position: 0 -108px; } -.button.clock.icon:hover:before, -.button.clock.icon:focus:before, -.button.clock.icon:active:before { background-position: -12px -108px; } - -.button.settings.icon:before { background-position: 0 -120px; } -.button.settings.icon:hover:before, -.button.settings.icon:focus:before, -.button.settings.icon:active:before { background-position: -12px -120px; } - -.button.comment.icon:before { background-position: 0 -132px; } -.button.comment.icon:hover:before, -.button.comment.icon:focus:before, -.button.comment.icon:active:before { background-position: -12px -132px; } - -.button.fork.icon:before { background-position: 0 -144px; } -.button.fork.icon:hover:before, -.button.fork.icon:focus:before, -.button.fork.icon:active:before { background-position: -12px -144px; } - -.button.like.icon:before { background-position: 0 -156px; } -.button.like.icon:hover:before, -.button.like.icon:focus:before, -.button.like.icon:active:before { background-position: -12px -156px; } - -.button.favorite.icon:before { background-position: 0 -348px; } -.button.favorite.icon:hover:before, -.button.favorite.icon:focus:before, -.button.favorite.icon:active:before { background-position: -12px -348px; } - -.button.home.icon:before { background-position: 0 -168px; } -.button.home.icon:hover:before, -.button.home.icon:focus:before, -.button.home.icon:active:before { background-position: -12px -168px; } - -.button.key.icon:before { background-position: 0 -180px; } -.button.key.icon:hover:before, -.button.key.icon:focus:before, -.button.key.icon:active:before { background-position: -12px -180px; } - -.button.lock.icon:before { background-position: 0 -192px; } -.button.lock.icon:hover:before, -.button.lock.icon:focus:before, -.button.lock.icon:active:before { background-position: -12px -192px; } - -.button.unlock.icon:before { background-position: 0 -204px; } -.button.unlock.icon:hover:before, -.button.unlock.icon:focus:before, -.button.unlock.icon:active:before { background-position: -12px -204px; } - -.button.loop.icon:before { background-position: 0 -216px; } -.button.loop.icon:hover:before, -.button.loop.icon:focus:before, -.button.loop.icon:active:before { background-position: -12px -216px; } - -.button.search.icon:before { background-position: 0 -228px; } -.button.search.icon:hover:before, -.button.search.icon:focus:before, -.button.search.icon:active:before { background-position: -12px -228px; } - -.button.mail.icon:before { background-position: 0 -240px; } -.button.mail.icon:hover:before, -.button.mail.icon:focus:before, -.button.mail.icon:active:before { background-position: -12px -240px; } - -.button.move.icon:before { background-position: 0 -252px; } -.button.move.icon:hover:before, -.button.move.icon:focus:before, -.button.move.icon:active:before { background-position: -12px -252px; } - -.button.edit.icon:before { background-position: 0 -264px; } -.button.edit.icon:hover:before, -.button.edit.icon:focus:before, -.button.edit.icon:active:before { background-position: -12px -264px; } - -.button.pin.icon:before { background-position: 0 -276px; } -.button.pin.icon:hover:before, -.button.pin.icon:focus:before, -.button.pin.icon:active:before { background-position: -12px -276px; } - -.button.reload.icon:before { background-position: 0 -300px; } -.button.reload.icon:hover:before, -.button.reload.icon:focus:before, -.button.reload.icon:active:before { background-position: -12px -300px; } - -.button.rss.icon:before { background-position: 0 -312px; } -.button.rss.icon:hover:before, -.button.rss.icon:focus:before, -.button.rss.icon:active:before { background-position: -12px -312px; } - -.button.tag.icon:before { background-position: 0 -324px; } -.button.tag.icon:hover:before, -.button.tag.icon:focus:before, -.button.tag.icon:active:before { background-position: -12px -324px; } - -.button.trash.icon:before { background-position: 0 -336px; } -.button.trash.icon:hover:before, -.button.trash.icon:focus:before, -.button.trash.icon:active:before { background-position: -12px -336px; } - -.button.user.icon:before { background-position: 0 -360px; } -.button.user.icon:hover:before, -.button.user.icon:focus:before, -.button.user.icon:active:before { background-position: -12px -360px; } - - -/* ------------------------------------------------------------------------------------------------------------- BUTTON EXTENSIONS */ - -/* ............................................................................................................. Primary */ - -.button.primary { - font-weight: bold; -} - -/* ............................................................................................................. Danger */ - -.button.danger { - color: #900; -} - -.button.danger:hover, -.button.danger:focus, -.button.danger:active { - border-color: #b53f3a; - border-bottom-color: #a0302a; - color: #fff; - background-color: #dc5f59; - background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#dc5f59), to(#b33630)); - background-image: -moz-linear-gradient(#dc5f59, #b33630); - background-image: -o-linear-gradient(#dc5f59, #b33630); - background-image: linear-gradient(#dc5f59, #b33630); -} - -.button.danger:active, -.button.danger.active { - border-color: #a0302a; - border-bottom-color: #bf4843; - background-color: #b33630; - background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#b33630), to(#dc5f59)); - background-image: -moz-linear-gradient(#b33630, #dc5f59); - background-image: -o-linear-gradient(#b33630, #dc5f59); - background-image: linear-gradient(#b33630, #dc5f59); -} - -/* ............................................................................................................. Pill */ - -.button.pill { - -webkit-border-radius: 50em; - -moz-border-radius: 50em; - border-radius: 50em; -} - -/* ............................................................................................................. Disable */ - -.button.disable { - opacity: 0.5; -} - -/* ............................................................................................................. Big */ - -.button.big { - font-size: 14px; -} - -.button.big.icon:before { top: 0; } - - -/* ------------------------------------------------------------------------------------------------------------- BUTTON GROUPS */ - -/* ............................................................................................................. Standard */ - -.button-group { - display: inline-block; - list-style: none; - padding: 0; - margin: 0; - /* IE hacks */ - zoom: 1; - *display: inline; -} - -.button + .button, -.button + .button-group, -.button-group + .button, -.button-group + .button-group { - margin-left: 15px; -} - -.button-group li { - float: left; - padding: 0; - margin: 0; -} - -.button-group .button { - float: left; - margin-left: -1px; -} - -.button-group > .button:not(:first-child):not(:last-child), -.button-group li:not(:first-child):not(:last-child) .button { - -webkit-border-radius: 0; - -moz-border-radius: 0; - border-radius: 0; -} - -.button-group > .button:first-child, -.button-group li:first-child .button { - margin-left: 0; - -webkit-border-top-right-radius: 0; - -webkit-border-bottom-right-radius: 0; - -moz-border-radius-topright: 0; - -moz-border-radius-bottomright: 0; - border-top-right-radius: 0; - border-bottom-right-radius: 0; -} - -.button-group > .button:last-child, -.button-group li:last-child > .button { - -webkit-border-top-left-radius: 0; - -webkit-border-bottom-left-radius: 0; - -moz-border-radius-topleft: 0; - -moz-border-radius-bottomleft: 0; - border-top-left-radius: 0; - border-bottom-left-radius: 0; -} - -/* ............................................................................................................. Minor */ - -.button-group.minor-group .button { - border: 1px solid #d4d4d4; - text-shadow: none; - background-image: none; - background-color: #fff; -} - -.button-group.minor-group .button:hover, -.button-group.minor-group .button:focus, -.button-group.minor-group .button:active { - background-color: #599bdc; -} - -.button-group.minor-group .button:active, -.button-group.minor-group .button.active { - background-color: #3072b3; -} - -.button-group.minor-group .button.icon:before { - opacity: 0.8; -} - -/* ------------------------------------------------------------------------------------------------------------- BUTTON CONTAINER */ -/* For mixing buttons and button groups, e.g., in a navigation bar */ - -.button-container .button, -.button-container .button-group { - vertical-align: top; -} diff --git a/src/public/stylesheets/facebox.css b/src/public/stylesheets/facebox.css deleted file mode 100644 index 1825bea..0000000 --- a/src/public/stylesheets/facebox.css +++ /dev/null @@ -1,101 +0,0 @@ -#facebox .b { - background:url(../images/b.png); -} - -#facebox .tl { - background:url(../images/tl.png); -} - -#facebox .tr { - background:url(../images/tr.png); -} - -#facebox .bl { - background:url(../images/bl.png); -} - -#facebox .br { - background:url(../images/br.png); -} - -#facebox { - position: absolute; - top: 0; - left: 0; - z-index: 100; - text-align: left; -} - -#facebox .popup { - position: relative; -} - -#facebox table { - border-collapse: collapse; -} - -#facebox td { - border-bottom: 0; - padding: 0; -} - -#facebox .body { - background: #fff; - width: 370px; -} - -#facebox .loading { - text-align: center; -} - -#facebox .image { - text-align: center; -} - -#facebox img { - border: 0; - margin: 0; -} - -#facebox .footer { - padding-top: 0px; - margin-top: 0px; - text-align: right; - display:none; -} - -#facebox .tl, #facebox .tr, #facebox .bl, #facebox .br { - height: 10px; - width: 10px; - overflow: auto; - padding: 0; -} - -#facebox_overlay { - position: fixed; - top: 0px; - left: 0px; - height:100%; - width:100%; -} - -.facebox_hide { - z-index:-100; -} - -.facebox_overlayBG { - background-color: #000; - z-index: 99; -} - -* html #facebox_overlay { /* ie6 hack */ - position: absolute; - height: expression(document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight : document.body.offsetHeight + 'px'); -} - - -.facebox_timfooter { - background: url(../images/fb_footer.jpg) repeat-x; - height: 37px; - padding: 9px 9px 0 9px; -} diff --git a/src/public/stylesheets/layout.css b/src/public/stylesheets/layout.css deleted file mode 100644 index c530bc6..0000000 --- a/src/public/stylesheets/layout.css +++ /dev/null @@ -1,270 +0,0 @@ -/* body */ -/* line 9, ../../app/stylesheets/layout.scss */ -html, body { - height: 100%; -} - -/* line 11, ../../app/stylesheets/layout.scss */ -body { - background: url("../images/body-bg.png"); - font-family: "Lucida Sans Unicode", "Lucida Grande", Verdana, Arial, Helvetica, sans-serif; - font-size: 0.750em; - /* 12px base */ - color: #333; -} - -/* line 18, ../../app/stylesheets/layout.scss */ -strong, em, b, i { - font-family: "Lucida Sans", "Lucida Sans Unicode", "Lucida Grande", Verdana, Arial, Helvetica, sans-serif; -} - -/* line 20, ../../app/stylesheets/layout.scss */ -#primary-container { - position: relative; - min-height: 100%; - margin-bottom: -60px; -} - -/* typography */ -/* line 28, ../../app/stylesheets/layout.scss */ -.label { - font-family: "Lucida Sans Unicode", "Lucida Grande", Verdana, Arial, Helvetica, sans-serif; -} - -/* line 32, ../../app/stylesheets/layout.scss */ -.label.strong { - font-weight: bold; - color: #333; -} - -/* line 37, ../../app/stylesheets/layout.scss */ -.label.small-caps { - text-transform: uppercase; - font-size: 0.917em; -} - -/* Query Inputs */ -/* line 44, ../../app/stylesheets/layout.scss */ -div.query-input { - display: inline-block; - background-image: -moz-linear-gradient(top, #d1d1d1, rgba(230, 230, 230, 0)); - background-image: -webkit-gradient(linear, left top, left bottom, from(#d1d1d1), to(rgba(230, 230, 230, 0))); - -webkit-border-radius: 16px; - -moz-border-radius: 16px; - border-radius: 16px; - padding: 3px; -} - -/* line 52, ../../app/stylesheets/layout.scss */ -div.query-input input[type="text"] { - display: inline; - -webkit-border-radius: 16px; - -moz-border-radius: 16px; - border-radius: 16px; - border: 1px solid #ccc; - height: 23px; - width: 180px; - outline: none; - padding: 0px 26px 0px 10px; - margin: 0px; - font-size: 12px; -} - -/* line 64, ../../app/stylesheets/layout.scss */ -div.query-input input[type="submit"] { - display: inline; - background: transparent url("../images/button-search.png") no-repeat left center; - color: transparent; - border: 0px; - width: 25px; - height: 25px; - margin-left: -25px; - outline: none; - cursor: pointer; -} -/* line 73, ../../app/stylesheets/layout.scss */ -div.query-input input[type="submit"]:hover { - background: transparent url("../images/button-search-over.png") no-repeat left center; -} -/* line 74, ../../app/stylesheets/layout.scss */ -div.query-input input[type="submit"]:active { - background: transparent url("../images/button-search-down.png") no-repeat left center; -} - -/* Content */ -/* line 79, ../../app/stylesheets/layout.scss */ -header#masthead { - height: 49px; - background-color: #E7E7E7; - background: url("../images/masthead-bg.png") repeat-x; - position: relative; - margin-bottom: 22px; -} -/* line 86, ../../app/stylesheets/layout.scss */ -header#masthead img#logo { - position: absolute; - top: 8px; -} -/* line 91, ../../app/stylesheets/layout.scss */ -header#masthead div.container { - margin: 0 auto; - width: 960px; - overflow: hidden; - position: relative; -} -/* line 98, ../../app/stylesheets/layout.scss */ -header#masthead a.user-dropdown { - border: 1px solid #ccc; - background: url("../images/button-userdrop.png") no-repeat center center; - background: url("../images/button-userdrop.png") no-repeat center center, -moz-linear-gradient(top, rgba(239, 239, 239, 0), rgba(204, 204, 204, 0)); - background: url("../images/button-userdrop.png") no-repeat center center, -webkit-gradient(linear, left top, left bottom, color-stop(0, #efefef), color-stop(1, #cccccc)); - width: 46px; - margin-left: 4px; - padding: 5px 2px 5px 2px; - color: transparent; - font-size: 12px; - /* match the font-size of the query box, for proper valign */ -} -/* line 109, ../../app/stylesheets/layout.scss */ -header#masthead a.user-dropdown:active { - background: url("../images/button-userdrop.png") no-repeat center center; - background: url("../images/button-userdrop.png") no-repeat center center, -moz-linear-gradient(top, rgba(232, 232, 232, 0), rgba(210, 210, 210, 0)); - background: url("../images/button-userdrop.png") no-repeat center center, -webkit-gradient(linear, left top, left bottom, color-stop(0, #e8e8e8), color-stop(1, #d2d2d2)); -} -/* line 117, ../../app/stylesheets/layout.scss */ -header#masthead nav#system { - float: right; - margin-top: 6px; -} -/* line 120, ../../app/stylesheets/layout.scss */ -header#masthead nav#system ul { - list-style: none; -} -/* line 122, ../../app/stylesheets/layout.scss */ -header#masthead nav#system ul li { - display: inline; -} -/* line 123, ../../app/stylesheets/layout.scss */ -header#masthead nav#system ul li + li { - margin-left: 10px; -} -/* line 124, ../../app/stylesheets/layout.scss */ -header#masthead nav#system ul li.separator { - background: url("../images/masthead-nav-separator.gif") no-repeat left top; - padding: 8px 1px 8px 1px; -} - -/* Primary Nav */ -/* line 136, ../../app/stylesheets/layout.scss */ -nav#primary ul.container { - width: 950px; - margin: 0 auto; - list-style: none; - padding-left: 24px; - height: 34px; -} -/* line 142, ../../app/stylesheets/layout.scss */ -nav#primary ul.container li { - float: left; - position: relative; - display: inline-block; - background: url("../images/tab-inactive-right.png") no-repeat right top; - height: 34px; - margin-right: 6px; - z-index: 1; -} -/* line 150, ../../app/stylesheets/layout.scss */ -nav#primary ul.container li a { - display: block; - background: url("../images/tab-inactive-left.png") no-repeat left top; - padding: 10px 16px 14px 16px; - margin-left: -11px; - font-family: "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; - font-size: 12px; - letter-spacing: 1px; - font-weight: normal; - text-transform: uppercase; - text-decoration: none; - font-weight: bold; - color: #fff; -} -/* line 165, ../../app/stylesheets/layout.scss */ -nav#primary ul.container li.active { - margin-top: -5px; - background: url("../images/tab-active-right.png") no-repeat right top; - z-index: 1000; - height: 43px; -} -/* line 170, ../../app/stylesheets/layout.scss */ -nav#primary ul.container li.active a { - background: url("../images/tab-active-left.png") no-repeat left top; - padding: 12px 20px 12px 20px; - font-size: 16px; - color: #666; -} -/* line 177, ../../app/stylesheets/layout.scss */ -nav#primary ul.container li + li { - margin-right: 6px; -} - -/* Content */ -/* line 187, ../../app/stylesheets/layout.scss */ -div#content { - width: 946px; - margin: 0 auto; - margin-bottom: 98px; - height: 200px; - -webkit-border-radius: 7px; - -moz-border-radius: 7px; - border-radius: 7px; - background-color: #FAFAFA; - padding: 7px; - box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.5); - -moz-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.5); - -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.5); - border: 1px solid #999; -} -/* line 200, ../../app/stylesheets/layout.scss */ -div#content div.header { - background-color: #ccc; - height: 60px; -} - -/* Footer */ -/* line 209, ../../app/stylesheets/layout.scss */ -footer.standard { - background: rgba(0, 0, 0, 0.12); - position: relative; - height: 40px; - width: 100%; - clear: both; -} -/* line 217, ../../app/stylesheets/layout.scss */ -footer.standard div.container { - margin: 0 auto; - width: 946px; - background: rgba(0, 0, 0, 0.12); - height: 36px; - position: relative; - padding: 26px 8px 0px 8px; - top: -20px; -} -/* line 227, ../../app/stylesheets/layout.scss */ -footer.standard img.logo { - float: right; -} -/* line 231, ../../app/stylesheets/layout.scss */ -footer.standard span.copyright { - font-size: 10px; - display: inline-block; - color: #666; -} -/* line 237, ../../app/stylesheets/layout.scss */ -footer.standard nav.footer { - display: inline-block; -} -/* line 239, ../../app/stylesheets/layout.scss */ -footer.standard nav.footer a { - color: #fff; - padding-right: 6px; -} diff --git a/src/public/stylesheets/layout_ie7.css b/src/public/stylesheets/layout_ie7.css index b8290e1..db85095 100644 --- a/src/public/stylesheets/layout_ie7.css +++ b/src/public/stylesheets/layout_ie7.css @@ -3,7 +3,7 @@ dl.alerts li.alert{ margin-bottom: 5px; } dl.alerts li.alert dt, dl.alerts li.alert dd{ display: inline; }
/* add proper spacing to the catalog dropdown button on pools#show */ -#obj_actions .catalog_link { +.obj_actions .catalog_link { margin-right: 5px; }
diff --git a/src/public/stylesheets/reset.css b/src/public/stylesheets/reset.css deleted file mode 100644 index 885707c..0000000 --- a/src/public/stylesheets/reset.css +++ /dev/null @@ -1,171 +0,0 @@ -/* `XHTML, HTML4, HTML5 Reset -----------------------------------------------------------------------------------------------------*/ - -a, -abbr, -acronym, -address, -applet, -article, -aside, -audio, -b, -big, -blockquote, -body, -canvas, -caption, -center, -cite, -code, -dd, -del, -details, -dfn, -dialog, -div, -dl, -dt, -em, -embed, -fieldset, -figcaption, -figure, -font, -footer, -form, -h1, -h2, -h3, -h4, -h5, -h6, -header, -hgroup, -hr, -html, -i, -iframe, -img, -ins, -kbd, -label, -legend, -li, -mark, -menu, -meter, -nav, -object, -ol, -output, -p, -pre, -progress, -q, -rp, -rt, -ruby, -s, -samp, -section, -small, -span, -strike, -strong, -sub, -summary, -sup, -table, -tbody, -td, -tfoot, -th, -thead, -time, -tr, -tt, -u, -ul, -var, -video, -xmp { - border: 0; - margin: 0; - padding: 0; - font-size: 100%; -} - -html, -body { - height: 100%; -} - -article, -aside, -details, -figcaption, -figure, -footer, -header, -hgroup, -menu, -nav, -section { -/* - Override the default (display: inline) for - browsers that do not recognize HTML5 tags. - - IE8 (and lower) requires a shiv: - http://ejohn.org/blog/html5-shiv -*/ - display: block; -} - -b, -strong { -/* - Makes browsers agree. - IE + Opera = font-weight: bold. - Gecko + WebKit = font-weight: bolder. -*/ - font-weight: bold; -} - -img { - color: transparent; - font-size: 0; - vertical-align: middle; -/* - For IE. - http://css-tricks.com/ie-fix-bicubic-scaling-for-images -*/ - -ms-interpolation-mode: bicubic; -} - -li { -/* - For IE6 + IE7. -*/ - display: list-item; -} - -table { - border-collapse: collapse; - border-spacing: 0; -} - -th, -td, -caption { - font-weight: normal; - vertical-align: top; - text-align: left; -} - -svg { -/* - For IE9. -*/ - overflow: hidden; -} \ No newline at end of file
Sorry, please ignore. Will resend...
On 04/26/2012 04:31 PM, jtomasek@redhat.com wrote:
From: Jiri Tomasekjtomasek@redhat.com
unified clearfixes, loading tabs
removed all font family variables, moved them to fonts css
added separate buttons css
fixed buttons alignment, obj_actions as class
aligned provider_dropdown properly
badges
content-sections fixup
src/app/stylesheets/_buttons.scss | 345 +++++++ src/app/stylesheets/_custom.scss | 187 ++++ src/app/stylesheets/_fonts.scss | 18 + src/app/stylesheets/_header.scss | 445 ++++++++++ src/app/stylesheets/_helpers.scss | 7 + src/app/stylesheets/_mixins.scss | 30 + src/app/stylesheets/_reset.scss | 186 ++++ src/app/stylesheets/custom.scss | 199 ----- src/app/stylesheets/header.scss | 463 ---------- src/app/stylesheets/layout.scss | 937 +------------------- src/app/stylesheets/login.scss | 2 + src/app/views/catalogs/_section_header.html.haml | 2 +- src/app/views/catalogs/edit.html.haml | 2 +- src/app/views/catalogs/new.html.haml | 2 +- src/app/views/catalogs/show.html.haml | 2 +- .../views/deployables/_new_from_image.html.haml | 1 - .../views/deployables/_section_header.html.haml | 2 +- src/app/views/deployables/show.html.haml | 6 +- src/app/views/deployments/_alerts_show.html.haml | 5 +- src/app/views/deployments/_header_show.html.haml | 7 +- src/app/views/deployments/_launch_new.html.haml | 2 +- .../deployments/launch_from_catalog.html.haml | 2 +- src/app/views/deployments/show.html.haml | 7 +- src/app/views/hardware_profiles/_form.html.haml | 41 +- .../hardware_profiles/_section_header.html.haml | 2 +- src/app/views/hardware_profiles/edit.html.haml | 9 +- src/app/views/hardware_profiles/new.html.haml | 2 +- src/app/views/hardware_profiles/show.html.haml | 2 +- src/app/views/images/edit_xml.html.haml | 2 +- src/app/views/images/import.html.haml | 2 +- src/app/views/images/new.html.haml | 3 +- src/app/views/images/overview.html.haml | 2 +- src/app/views/images/show.html.haml | 11 +- .../views/layouts/_admin_content_tabs.html.haml | 1 - src/app/views/layouts/_admin_users_tabs.html.haml | 1 - src/app/views/layouts/_filter_table.html.haml | 3 +- .../views/layouts/_pretty_filter_toggle.html.haml | 6 +- src/app/views/layouts/_tabpanel.html.haml | 27 +- src/app/views/layouts/application.html.haml | 5 - src/app/views/permissions/_form.html.haml | 4 +- src/app/views/permissions/_new.html.haml | 2 +- src/app/views/pool_families/_list.html.haml | 16 +- .../views/pool_families/_section_header.html.haml | 2 +- .../pool_families/add_provider_accounts.html.haml | 11 +- src/app/views/pool_families/edit.html.haml | 2 +- src/app/views/pool_families/new.html.haml | 2 +- src/app/views/pool_families/show.html.haml | 3 +- src/app/views/pools/_alerts_index.html.haml | 5 +- src/app/views/pools/_alerts_show.html.haml | 5 +- src/app/views/pools/_edit.html.haml | 4 +- src/app/views/pools/_form.html.haml | 2 +- src/app/views/pools/_header_index.html.haml | 4 +- src/app/views/pools/_header_show.html.haml | 6 +- src/app/views/pools/show.html.haml | 7 +- .../provider_accounts/_section_header.html.haml | 2 +- src/app/views/provider_accounts/edit.html.haml | 2 +- src/app/views/provider_accounts/new.html.haml | 2 +- src/app/views/provider_accounts/show.html.haml | 2 +- .../provider_realms/_section_header.html.haml | 2 +- src/app/views/provider_realms/show.html.haml | 2 +- src/app/views/providers/_section_header.html.haml | 2 +- src/app/views/providers/edit.html.haml | 16 +- src/app/views/providers/new.html.haml | 2 +- src/app/views/realms/_section_header.html.haml | 2 +- src/app/views/realms/edit.html.haml | 5 +- src/app/views/realms/new.html.haml | 2 +- src/app/views/realms/show.html.haml | 2 +- src/app/views/roles/_form.html.haml | 10 +- src/app/views/roles/_section_header.html.haml | 2 +- src/app/views/roles/edit.html.haml | 10 +- src/app/views/roles/show.html.haml | 2 +- src/app/views/settings/index.html.haml | 16 +- src/app/views/settings/self_service.html.haml | 4 +- src/app/views/users/_list.html.haml | 4 +- src/app/views/users/_section_header.html.haml | 2 +- src/app/views/users/edit.html.haml | 2 +- src/app/views/users/new.html.haml | 2 +- src/app/views/users/show.html.haml | 6 +- src/config/locales/en.yml | 1 + .../step_definitions/hardware_profile_steps.rb | 2 +- src/public/javascripts/application.js | 6 +- src/public/stylesheets/960.css | 440 --------- src/public/stylesheets/buttons.css | 394 -------- src/public/stylesheets/facebox.css | 101 --- src/public/stylesheets/layout.css | 270 ------ src/public/stylesheets/layout_ie7.css | 2 +- src/public/stylesheets/reset.css | 171 ---- 87 files changed, 1426 insertions(+), 3117 deletions(-) create mode 100644 src/app/stylesheets/_buttons.scss create mode 100644 src/app/stylesheets/_custom.scss create mode 100644 src/app/stylesheets/_fonts.scss create mode 100644 src/app/stylesheets/_header.scss create mode 100644 src/app/stylesheets/_helpers.scss create mode 100644 src/app/stylesheets/_mixins.scss create mode 100644 src/app/stylesheets/_reset.scss delete mode 100644 src/app/stylesheets/custom.scss delete mode 100644 src/app/stylesheets/header.scss delete mode 100644 src/public/stylesheets/960.css delete mode 100644 src/public/stylesheets/buttons.css delete mode 100644 src/public/stylesheets/facebox.css delete mode 100644 src/public/stylesheets/layout.css delete mode 100644 src/public/stylesheets/reset.css
diff --git a/src/app/stylesheets/_buttons.scss b/src/app/stylesheets/_buttons.scss new file mode 100644 index 0000000..3f6703b --- /dev/null +++ b/src/app/stylesheets/_buttons.scss @@ -0,0 +1,345 @@ +/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ +Application Button Set +~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
+/* ------------------------------------------
- CSS3 GITHUB BUTTONS (Nicolas Gallagher)
- Licensed under Unlicense
- --------------------------------------- */
+/* =============================================================================
- Base Button
- ========================================================================== */
+.button {
- position: relative;
- overflow: visible;
- display: inline-block;
- padding: 0.5em 1em;
- border: 1px solid #d4d4d4;
- margin: 0;
- text-decoration: none;
- text-align: center;
- text-shadow: 1px 1px 0 #fff;
- font:11px/normal sans-serif;
- color: #333;
- white-space: nowrap;
- cursor: pointer;
- outline: none;
- background-color: #ececec;
- background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#f4f4f4), to(#ececec));
- background-image: -moz-linear-gradient(#f4f4f4, #ececec);
- background-image: -ms-linear-gradient(#f4f4f4, #ececec);
- background-image: -o-linear-gradient(#f4f4f4, #ececec);
- background-image: linear-gradient(#f4f4f4, #ececec);
- -moz-background-clip: padding; /* for Firefox 3.6 */
- background-clip: padding-box;
- border-radius: 0.2em;
- /* IE hacks */
- zoom: 1;
- *display: inline;
+}
+.button:hover, +.button:focus, +.button:active, +.button.active {
- border-color: #3072b3;
- border-bottom-color: #2a65a0;
- text-decoration: none;
- text-shadow: -1px -1px 0 rgba(0,0,0,0.3);
- color: #fff;
- background-color: #3c8dde;
- background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#599bdc), to(#3072b3));
- background-image: -moz-linear-gradient(#599bdc, #3072b3);
- background-image: -o-linear-gradient(#599bdc, #3072b3);
- background-image: linear-gradient(#599bdc, #3072b3);
+}
+.button:active, +.button.active {
- border-color: #2a65a0;
- border-bottom-color: #3884cd;
- background-color: #3072b3;
- background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#3072b3), to(#599bdc));
- background-image: -moz-linear-gradient(#3072b3, #599bdc);
- background-image: -ms-linear-gradient(#3072b3, #599bdc);
- background-image: -o-linear-gradient(#3072b3, #599bdc);
- background-image: linear-gradient(#3072b3, #599bdc);
+}
+/* overrides extra padding on button elements in Firefox */ +.button::-moz-focus-inner {
- padding: 0;
- border: 0;
+}
+/* =============================================================================
- Button extensions
- ========================================================================== */
+/* Primary button
- ========================================================================== */
+.button.primary {
- font-weight: bold;
+}
+/* Danger button
- ========================================================================== */
+.button.danger {
- color: #900;
+}
+.button.danger:hover, +.button.danger:focus, +.button.danger:active {
- border-color: #b53f3a;
- border-bottom-color: #a0302a;
- color: #fff;
- background-color: #dc5f59;
- background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#dc5f59), to(#b33630));
- background-image: -moz-linear-gradient(#dc5f59, #b33630);
- background-image: -ms-linear-gradient(#dc5f59, #b33630);
- background-image: -o-linear-gradient(#dc5f59, #b33630);
- background-image: linear-gradient(#dc5f59, #b33630);
+}
+.button.danger:active, +.button.danger.active {
- border-color: #a0302a;
- border-bottom-color: #bf4843;
- background-color: #b33630;
- background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#b33630), to(#dc5f59));
- background-image: -moz-linear-gradient(#b33630, #dc5f59);
- background-image: -ms-linear-gradient(#b33630, #dc5f59);
- background-image: -o-linear-gradient(#b33630, #dc5f59);
- background-image: linear-gradient(#b33630, #dc5f59);
+}
+/* Pill button
- ========================================================================== */
+.button.pill {
- border-radius: 50em;
+}
+/* Disabled button
- ========================================================================== */
+.button.disable {
- opacity: 0.5;
+}
+/* Big button
- ========================================================================== */
+.button.big {
- font-size: 14px;
+}
+.button.big.icon:before {
- top: 0;
+}
+/* =============================================================================
- Button groups
- ========================================================================== */
+/* Standard group
- ========================================================================== */
+.button-group {
- display: inline-block;
- list-style: none;
- padding: 0;
- margin: 0;
- /* IE hacks */
- zoom: 1;
- *display: inline;
+}
+.button + .button, +.button + .button-group, +.button-group + .button, +.button-group + .button-group {
- margin-left: 15px;
+}
+.button-group li {
- float: left;
- padding: 0;
- margin: 0;
+}
+.button-group .button {
- float: left;
- margin-left: -1px;
+}
+.button-group> .button:not(:first-child):not(:last-child), +.button-group li:not(:first-child):not(:last-child) .button {
- border-radius: 0;
+}
+.button-group> .button:first-child, +.button-group li:first-child .button {
- margin-left: 0;
- border-top-right-radius: 0;
- border-bottom-right-radius: 0;
+}
+.button-group> .button:last-child, +.button-group li:last-child> .button {
- border-top-left-radius: 0;
- border-bottom-left-radius: 0;
+}
+/* Minor group
- ========================================================================== */
+.button-group.minor-group .button {
- border: 1px solid #d4d4d4;
- text-shadow: none;
- background-image: none;
- background-color: #fff;
+}
+.button-group.minor-group .button:hover, +.button-group.minor-group .button:focus {
- background-color: #599bdc;
+}
+.button-group.minor-group .button:active, +.button-group.minor-group .button.active {
- background-color: #3072b3;
+}
+.button-group.minor-group .button.icon:before {
- opacity: 0.8;
+}
+/* =============================================================================
- Button container (mixing buttons and groups, e.g., nav bar)
- ========================================================================== */
+.button-container .button, +.button-container .button-group {
- vertical-align: top;
+}
+/* =============================================================================
- Conductor customizations
- ========================================================================== */
+/* Button_to helper in button-group fix
- ========================================================================== */
+.button-group .button_to:not(:only-child) div .button.pill{
- -webkit-border-radius: 0em 50em;
- -moz-border-radius: 0em 50em 50em 0em;
- border-radius: 0em 50em 50em 0em;
+}
+/* Launch deployment button
- ========================================================================== */
+#launch_deployment_button{
- @include display_inline_block;
- vertical-align: middle;
- margin: 0px 0px 0px 10px;
- padding: 13px 12px 9px 46px;
- font-weight: bold;
- font-size: 14px;
- color: white;
- text-decoration: none;
- border: 1px solid #669933;
- -webkit-border-radius: 0.2em; -moz-border-radius: 0.2em; border-radius: 0.2em;
- background: #5AB45C url(../../images/deployment_large_icon_provider_white.png) no-repeat 12px center; /* Old browsers */
- background: url(../../images/deployment_large_icon_provider_white.png) 12px center no-repeat, -moz-linear-gradient(top, #ace3ac 0%, #5ab45c 100%); /* FF3.6+ */
- background: url(../../images/deployment_large_icon_provider_white.png) 12px center no-repeat, -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ace3ac), color-stop(100%,#5ab45c)); /* Chrome,Safari4+ */
- background: url(../../images/deployment_large_icon_provider_white.png) 12px center no-repeat, -webkit-linear-gradient(top, #ace3ac 0%,#5ab45c 100%); /* Chrome10+,Safari5.1+ */
- background: url(../../images/deployment_large_icon_provider_white.png) 12px center no-repeat, -o-linear-gradient(top, #ace3ac 0%,#5ab45c 100%); /* Opera 11.10+ */
- background: url(../../images/deployment_large_icon_provider_white.png) 12px center no-repeat, -ms-linear-gradient(top, #ace3ac 0%,#5ab45c 100%); /* IE10+ */
- background: url(../../images/deployment_large_icon_provider_white.png) 12px center no-repeat, linear-gradient(top, #ace3ac 0%,#5ab45c 100%); /* W3C */
- filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ace3ac', endColorstr='#5ab45c',GradientType=0 ); /* IE6-9 */
+&:active{
- background: #458944; /* Old browsers */
- background: url(../../images/deployment_large_icon_provider_white.png) 12px center no-repeat, -moz-linear-gradient(top, #9ecc9b 0%, #458944 100%); /* FF3.6+ */
- background: url(../../images/deployment_large_icon_provider_white.png) 12px center no-repeat, -webkit-gradient(linear, left top, left bottom, color-stop(0%,#9ecc9b), color-stop(100%,#458944)); /* Chrome,Safari4+ */
- background: url(../../images/deployment_large_icon_provider_white.png) 12px center no-repeat, -webkit-linear-gradient(top, #9ecc9b 0%, #458944 100%); /* Chrome10+,Safari5.1+ */
- background: url(../../images/deployment_large_icon_provider_white.png) 12px center no-repeat, -o-linear-gradient(top, #9ecc9b 0%, #458944 100%); /* Opera 11.10+ */
- background: url(../../images/deployment_large_icon_provider_white.png) 12px center no-repeat, -ms-linear-gradient(top, #9ecc9b 0%, #458944 100%); /* IE10+ */
- background: url(../../images/deployment_large_icon_provider_white.png) 12px center no-repeat, linear-gradient(top, #9ecc9b 0%, #458944 100%); /* W3C */
- filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9ecc9b', endColorstr='#458944',GradientType=0 ); /* IE6-9 */
- -webkit-box-shadow: inset 1px 1px 2px 0px #333; -moz-box-shadow: inset 1px 1px 2px 0px #333; box-shadow: inset 1px 1px 2px 0px #333;
- }
+&[type=submit][disabled=disabled], +&[disabled=disabled], +&.disabled{
- cursor: default;
- zoom: 1;
- filter: alpha(opacity=50);
- -moz-opacity:0.5;
- opacity: 0.5;
- }
+}
+/* Pretty/Filter view toggle
- ========================================================================== */
+span.view-toggle{
- @include display_inline_block;
+}
+a.view-toggle{
- background: url('../../images/button-viewtoggle.png') no-repeat top left;
- display: block;
- float:left;
- width: 38px;
- height: 27px;
+}
+a.view-toggle.pretty{ +&:active{
- background-position: -75px 0px;
- }
+}
+a.view-toggle.filter{
- width: 36px;
- background-position: -39px 0px;
+&:active{
- background-position: -114px 0px;
- }
+}
+a.view-toggle.pretty.active{
- background-position: -75px 0px;
+}
+a.view-toggle.filter.active{
- background-position: -114px 0px;
+}
+/* Return to div
- ========================================================================== */
+div.return_to{
- @include display_inline_block;
- a{
- background: #cccccc;
- color: black;
- text-decoration: none;
- font-weight: bold;
- padding: 3px 6px;
- -webkit-border-radius: 12px; -moz-border-radius: 12px; border-radius: 12px;
- border: none;
- }
+}
+.return_to + .button-group, +.return_to + .button{
- margin-left: 15px;
+} diff --git a/src/app/stylesheets/_custom.scss b/src/app/stylesheets/_custom.scss new file mode 100644 index 0000000..ec407bc --- /dev/null +++ b/src/app/stylesheets/_custom.scss @@ -0,0 +1,187 @@ +.pool_details {
- color: #333;
- text-decoration: none;
+}
+/*launch time params*/ +.hidden {
- display: none;
+}
+table.light_table tbody {
- tr.collapsed {
- display: none;
- }
- ul li {
- list-style-type: none;
- }
+}
+.launch-time-params h2 {
- font-size: 16px;
- font-weight: normal;
- text-align: center;
+}
+$services_width: 250px; +$services_border: 1px solid #b0b0b0; +$services_background: #efefef;
+form.generic section.services {
- position: relative;
- border: $services_border;
- margin: 1em;
- padding: 0 0 1em;
- -webkit-border-radius: 1em;
- -moz-border-radius: 1em;
- border-radius: 1em;
- min-height: 300px;
- background: $services_background;
- overflow: hidden;
- .labels {
- margin-top: 64px;
- width: 250px;
- float: left;
- h4.service {
font-size: 14px;
font-weight: normal;
position: relative;
z-index: 1;
$left_padding: 26px;
padding: 0.5em 0 0.5em $left_padding;
width: $services_width - $left_padding + 1px;
border-bottom: 1px solid transparent;
+&:hover {
background: darken($services_background, 20%);
cursor: pointer;
}
+&.selected {
background: $services_background;
border-bottom: $services_border;
cursor: default;
}
+&.filled-out {
background-image: url('../../images/filled_out_params_indicator.png');
background-repeat: no-repeat;
background-position: 8px center;
}
- }
- }
- .params-container {
- margin-left: 250px;
- .parameters {
display: none;
top: 88px;
left: $services_width;
padding: 1em;
- }
- }
- #service-headers {
- position: absolute;
- z-index: 0;
- background: transparent url('../../images/services_bg.png') repeat top center;
- top: 0;
- left: 0;
- height: 100%;
- border-right: $services_border;
- width: $services_width;
- $left-corners: 1em 0 0 1em;
- -webkit-border-radius: $left-corners;
- -moz-border-radius: $left-corners;
- border-radius: $left-corners;
- }
- header {
- background-image: none;
- background: #dddddd;
- margin-left: $services_width;
- padding: 1em;
- height: 40px;
- $topright-corner: 0 1em 0 0;
- -webkit-border-radius: $topright-corner;
- -moz-border-radius: $topright-corner;
- border-radius: $topright-corner;
- h3 {
font-size: 22px;
font-weight: normal;
- }
- }
- label {
- display: block;
- float: left;
- min-width: 120px;
- text-align: right;
- padding: 6px 7px 5px 0px;
- font-size: 14px;
- text-shadow: 0px 1px 0px #ffffff;
- font-weight: normal;
- }
+}
+.catalog_deployments_and_images{
- color: #606060;
- position: relative;
- h1{
- font-size: 16px;
- }
- h2{
- font-size: 12px;
- padding-left: 10px;
- padding-top: 10px;
- }
- h3{
- font-size: 12px;
- padding-left: 10px;
- }
- ul li{
- padding-left: 10px;
- padding-top:5px;
- list-style-type: none;
- }
+}
+#no-catalog-entry {
- margin-bottom: 30px;
+}
+.instance_details, .confirm_instances_termination {
- h3{
- font-size: 22px;
- font-weight: normal;
- margin-bottom: 10px;
- }
- ul li {
- list-style-type: none;
- margin: 10px 15px;
- font-weight: bold;
- span {
font-weight: normal;
- }
- }
- ol{
- margin: 15px;
- li {
margin:10px 15px;
- }
- }
+}
+.pagination{
- margin-top: 10px;
- text-align: center;
+} diff --git a/src/app/stylesheets/_fonts.scss b/src/app/stylesheets/_fonts.scss new file mode 100644 index 0000000..e20293f --- /dev/null +++ b/src/app/stylesheets/_fonts.scss @@ -0,0 +1,18 @@ +@font-face {
- font-family: 'Overpass';
- src: url("../../fonts/overpass_regular-web.eot");
- src: local("Overpass"), url("../../fonts/overpass_regular-web.eot?#iefix") format("eot"), url("../../fonts/overpass_regular-web.woff") format("woff"), url("../../fonts/overpass_regular-web.ttf") format("truetype"), url("../../fonts/overpass_regular-web.svg#webfontLTZe4IYH") format("svg");
- font-weight: normal;
- font-style: normal; }
+@font-face {
- font-family: 'Overpass';
- src: url("../../fonts/overpass_bold-web.eot");
- src: local("Overpass Bold"), local("Overpass-Bold"), url("../../fonts/overpass_bold-web.eot?#iefix") format("eot"), url("../../fonts/overpass_bold-web.woff") format("woff"), url("../../fonts/overpass_bold-web.ttf") format("truetype"), url("../../fonts/overpass_bold-web.svg#webfontzAU82Ltw") format("svg");
- font-weight: bold;
- font-style: normal; }
+$font-family-base: "Lucida Sans Unicode", "Lucida Grande", Verdana, Arial, Helvetica, sans-serif; +$font-family-em: "Lucida Sans", "Lucida Sans Unicode", "Lucida Grande", Verdana, Arial, Helvetica, sans-serif; +$font-family-primary: "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; diff --git a/src/app/stylesheets/_header.scss b/src/app/stylesheets/_header.scss new file mode 100644 index 0000000..0e4c1f1 --- /dev/null +++ b/src/app/stylesheets/_header.scss @@ -0,0 +1,445 @@ +/* Adapted normalization */
+.hidden {
- display: none; }
+.shell-design {
- section {
- display: none;
+&.active {
display: block; } }
- article, aside, details, figcaption, figure, footer, header, hgroup, nav, section {
- display: block; }
- a {
- color: #36c;
+&:visited {
color: #36c; }
+&:hover {
color: #000; }
+&:focus {
outline: none;
box-shadow: 0 0 3px 3px #fa0; }
+&:hover,&:active {
outline: none; } }
- b, strong {
- font-weight: bold; }
- img {
- border: 0;
- -ms-interpolation-mode: bicubic;
- vertical-align: middle; }
- svg:not(:root) {
- overflow: hidden; } }
+/* Some header-specific styling */
+header.shell-design {
- height: 5.5em;
- background-color: #1a1f22;
- position: relative;
- color: #fff;
- border-bottom: .4em solid #060807;
- border-top: .4em solid #060807;
- box-shadow: inset 0em -0.1em #181c1e, inset 0px -2em 5em #101214;
- h1 {
- font-size: 1em;
- text-transform: uppercase;
- position: absolute;
- top: .9em;
- left: 0;
- line-height: 1.5em;
- text-indent: 2em;
- color: #fff;
- em {
border-left: .1em solid #fff;
padding-left: .25em;
margin-left: .25em;
font-style: normal; } }
+> article {
- margin: 0 auto;
- max-width: 80em;
- line-height: 2em;
- position: relative;
- padding: 0em;
- padding-left: 20em; } }
+/* Navigation */
+nav#appnav {
- display: table;
- font-weight: normal;
- border: .2em solid #181c1e;
- border-bottom: none transparent 0px;
- margin-top: 2.25em;
- border-radius: .25em .25em 0em 0em;
- white-space: nowrap;
+> ul { +> li { +> ul> li a {
color: #777; }
display: block;
vertical-align: top;
float: left;
a {
display: block;
width: 100%;
text-decoration: none;
clear: both;
padding: 0em;
text-indent: 1.5em;
text-transform: capitalize;
position: relative;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
+&.selected{ background-color: #444; }
}
+> a {
color: #bbb;
padding: .75em 1em;
text-align: center;
text-indent: 0em;
border-style: none solid;
border-width: 0px .1em;
border-color: transparent #181c1e;
background-color: #1f2123;
box-shadow: inset 0px -3.5em 2em -2em #15191b;
+&:active {
color: #fff;
background-color: #4a4e50; }
+&:hover {
/*box-shadow*/
-webkit-box-shadow: 0em 0em 1em rgba(0, 0, 0, 0.32);
-moz-box-shadow: 0em 0em 1em rgba(0, 0, 0, 0.32);
box-shadow: 0em 0em 1em rgba(0, 0, 0, 0.32);
cursor: pointer; }
+&:focus,&:active {
box-shadow: inset 0px -4em 3em -2em rgba(0, 0, 0, 0.4); } }
position: relative;
+&:hover { +> a {
box-shadow: inset 0px -4em 3em -2em rgba(0, 0, 0, 0.4); }
li:hover> a,> a {
background-color: #4a4e50;
color: #fff; } }
a {
+&:hover,&:focus {
background-color: #4a4e50;
color: #fff; } }
+&:first-child> a {
/*border-radius*/
-webkit-border-radius: .225em 0em 0em 0em;
-moz-border-radius: .225em 0em 0em 0em;
border-radius: .225em 0em 0em 0em;
border-left: 0px transparent none; }
+&:last-child> a {
/*border-radius*/
-webkit-border-radius: 0em .225em 0em 0em;
-moz-border-radius: 0em .225em 0em 0em;
border-radius: 0em .225em 0em 0em;
border-right: 0px transparent none; }
+> ul> li:last-child> a {
/*border-radius*/
-webkit-border-radius: 0em 0em .25em .25em;
-moz-border-radius: 0em 0em .25em .25em;
border-radius: 0em 0em .25em .25em; } }
- display: table-row; }
- ul a:after {
- z-index: 3;
- content: "";
- width: 100%;
- height: 50%;
- top: 0;
- left: 0;
- right: 0;
- display: block;
- position: absolute; }
+> ul> li {
- a:focus ~ ul,&:hover ul {
background-color: white;
/*box-shadow*/
-webkit-box-shadow: 0em 0.025em 0.5em rgba(0, 0, 0, 0.5);
-moz-box-shadow: 0em 0.025em 0.51em rgba(0, 0, 0, 0.5);
box-shadow: 0em 0.025em 0.51em rgba(0, 0, 0, 0.5);
/*border-radius*/
-webkit-border-radius: 0em 0em .25em .25em;
-moz-border-radius: 0em 0em .25em .25em;
border-radius: 0em 0em .25em .25em;
display: block;
width: 100%;
top: 0em;
left: 0; } } }
+/* I'm doubtful that this actually matches anythign */
+.no-boxshadow header nav#appnav> ul> li:hover ul {
- border: 1px solid #ccc;
- margin: -0.1px; }
+header.shell-design {
- nav#appnav> ul> li {
+&:hover> ul {
z-index: 9999 !important;
/*painfully silly hack*/
margin-top: -0.25em;
padding-top: 0em !important;
- }
+> ul> li:hover {
position: relative; }
+&:hover> ul> li> ul {
position: absolute;
box-shadow: none;
background-color: transparent;
top: 0em;
left: 100%;
padding-top: 0em;
+> li {
display: none; } }
- a:focus ~ ul,&:hover> ul {
z-index: 1;
padding-top: 1em;
display: block;
position: absolute;
top: 3.5em;
opacity: 1; }
- a:focus ~ li ul li,&:hover> ul> li:hover> ul> li {
display: block; }
- a:focus ~ li ul,&:hover> ul> li:hover ul {
/*box-shadow*/
-webkit-box-shadow: 0.025em 0.025em 0.51em rgba(0, 0, 0, 0.5);
-moz-box-shadow: 0.025em 0.025em 0.51em rgba(0, 0, 0, 0.5);
box-shadow: 0.025em 0.025em 0.51em rgba(0, 0, 0, 0.5);
/*border-radius*/
-webkit-border-radius: 0em .25em .25em 0em;
-moz-border-radius: 0em .25em .25em 0em;
border-radius: 0em .25em .25em 0em;
background-color: white;
z-index: 1;
opacity: 1; }
+> {
ul {
+> li { +> ul li { +&:first-child a {
/*border-radius*/
-webkit-border-radius: .0em .25em 0em 0em;
-moz-border-radius: .0em .25em 0em 0em;
border-radius: .0em .25em 0em 0em; }
+&:last-child a {
/*border-radius*/
-webkit-border-radius: 0em 0em .25em .0em;
-moz-border-radius: 0em 0em .25em .0em;
border-radius: 0em 0em .25em .0em; }
+&:first-child:hover a:after {
z-index: 9;
display: block;
position: absolute;
top: .5em;
left: 0em;
content: "";
height: 0;
width: 0;
border-width: .5em 0em .5em .5em;
border-style: solid none solid solid;
border-color: transparent transparent transparent #fff; } }
ul {
+&:before {
z-index: 2;
display: block;
position: absolute;
top: 0em;
left: -0.14em;
content: "";
height: 0;
width: 0;
border-width: 1em 0em 1em 1em;
border-style: solid none solid solid;
border-color: transparent transparent transparent transparent; }
+&:after {
z-index: 1;
display: block;
position: absolute;
top: .5em;
left: -1em;
content: "";
height: 0;
width: 0;
opacity: 1;
z-index: 2;
border-width: .5em 0em .5em .5em;
border-style: solid none solid solid;
border-color: transparent transparent transparent #ccc; } }
a:hover ~ ul:before,&:hover ul:before {
top: 0em;
border: solid 1em #4a4e50;
left: -1.98em; }
a:hover ~ ul:after,&:hover ul:after {
top: 0em;
border-color: transparent transparent transparent #4a4e50;
left: 0em;
content: "";
height: 0;
width: 0;
border-width: 1em 0em 1em 1em;
border-style: solid none solid solid; } }
position: absolute;
left: 0;
display: none;
line-height: 2em !important;
min-width: 16em;
max-width: 22em; }
a.active {
position: relative;
+&:after {
z-index: 9;
position: absolute;
top: 3.1em;
left: 50%;
margin-left: -0.55em;
display: block;
content: "";
width: 0;
height: 0;
border-width: 0em .55em .55em .55em;
border-style: none solid solid solid;
border-color: transparent transparent #fff transparent; } } }
- position: relative; }
+&.shell-design> article section:last-child {
- text-align: right;
- position: absolute;
- top: -1.75em;
- right: 0em;
- margin: 0 auto;
- display: block;
- a {
border: 0.1em solid rgba(255, 255, 255, 0.12);
color: #ccc !important;
border-radius: 0em 0em .5em .5em;
color: #fff;
text-decoration: none;
background-color: #181c1e;
box-shadow: inset 0px 1.5em 1em -1em rgba(222, 222, 255, 0.1);
display: inline-block;
padding: .1em 1em;
position: relative;
margin: 1.25em .1em;
+&:last-child {
padding-right: 2em;
+&:after {
content: "";
display: block;
height: 0px;
width: 0px;
position: absolute;
top: .75em;
right: .5em;
border-style: solid solid none solid;
border-width: .5em .5em 0em .5em;
border-color: #666 transparent transparent; } }
+&:first-child {
padding-left: 3em;
+&:after {
/*content: "!";*/
color: #2e4e66;
text-align: center;
background-color: #ccc !important;
width: 1em;
height: 1em;
border-radius: 50%;
position: absolute;
top: .25em;
left: .5em;
line-height: 1em;
font-size: 1.5em;
display: block;
background-color: transparent;
z-index: 2; } } } } }
+/*
- header nav#appnav> ul> li> ul> li
+*/
+/* The below is good */
+/* Some new stuff */
+/* Is this legit? */
+.shell-design {
- {
- /*
this is life saving but locks us into> ie8 will consider this polyfil for lt-ie8
https://github.com/Schepp/box-sizing-polyfill
- */
- -moz-box-sizing: border-box !important;
- -webkit-box-sizing: border-box !important;
- box-sizing: border-box !important;
- background-repeat: no-repeat;
- vertical-align: middle;
- font-family: overpass; }
- a {
+&:hover,&:focus,&:active {
color: #fa0; }
+&:focus {
outline: none !important; }
+&:link {
color: #36c; } }
- article {
+&:before {
content: "";
display: table; }
+&:after {
content: "";
display: table;
clear: both; } } }
+/* Wait, do we actually want this? */
+/* User dropdown menu definition */
+section#usermenu {
- position: absolute;
- left: 80%;
- width: 20%;
- padding: 5px 2px 5px 2px;
- cursor: pointer;
- z-index: 9999;
+> a {
- width: 100%; }
+> ul {
- list-style-type: none;
- display: none;
- border: none;
- padding: 0em;
- margin: 0em;
- top: 4em;
- float: left;
- position: absolute;
- z-index: 9999;
- width: 100%;
+&:before {
display: none;
content: none; } }
+&:hover> ul {
- display: block;
- }
+> ul { +> li {
padding: 0em;
margin: 0em;
border-color: transparent !important;
background-image: none !important;
box-shadow: none !important; }
- li {
a {
margin: 0em;
padding: .5em 2em;
border-radius: 0;
border-color: transparent !important;
box-shadow: none !important;
+&:hover {
color: #FFF !important;
text-decoration: underline; } }
+&:last-child a {
border-radius: 0em 0em .51em .51em; }
a:after {
content: none; } } } }
diff --git a/src/app/stylesheets/_helpers.scss b/src/app/stylesheets/_helpers.scss new file mode 100644 index 0000000..46b1e97 --- /dev/null +++ b/src/app/stylesheets/_helpers.scss @@ -0,0 +1,7 @@ +/* ####################################################################################################### +HELPERS +####################################################################################################### */
+.clearfix { @include clearfix; }
+.align-center{ text-align: center; } diff --git a/src/app/stylesheets/_mixins.scss b/src/app/stylesheets/_mixins.scss new file mode 100644 index 0000000..011b2f3 --- /dev/null +++ b/src/app/stylesheets/_mixins.scss @@ -0,0 +1,30 @@ +/* ####################################################################################################### +MIXINS +####################################################################################################### */
+@mixin display_inline_block {
- display: -moz-inline-stack;
- display: inline-block;
- vertical-align: top;
- zoom: 1;
- *display: inline;
+}
+@mixin clearfix {
- *zoom: 1;
+&:before,&:after {
- display: table;
- content: "";
- }
+&:after {
- clear: both;
- }
+}
+@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);
+} diff --git a/src/app/stylesheets/_reset.scss b/src/app/stylesheets/_reset.scss new file mode 100644 index 0000000..4d2ce40 --- /dev/null +++ b/src/app/stylesheets/_reset.scss @@ -0,0 +1,186 @@ +/* ################################################################################################### +XHTML, HTML4, HTML5 Reset +################################################################################################### */
+a, +abbr, +acronym, +address, +applet, +article, +aside, +audio, +b, +big, +blockquote, +body, +canvas, +caption, +center, +cite, +code, +dd, +del, +details, +dfn, +dialog, +div, +dl, +dt, +em, +embed, +fieldset, +figcaption, +figure, +font, +footer, +form, +h1, +h2, +h3, +h4, +h5, +h6, +header, +hgroup, +hr, +html, +i, +iframe, +img, +ins, +kbd, +label, +legend, +li, +mark, +menu, +meter, +nav, +object, +ol, +output, +p, +pre, +progress, +q, +rp, +rt, +ruby, +s, +samp, +section, +small, +span, +strike, +strong, +sub, +summary, +sup, +table, +tbody, +td, +tfoot, +th, +thead, +time, +tr, +tt, +u, +ul, +var, +video, +xmp {
- border: 0;
- margin: 0;
- padding: 0;
- font-size: 100%;
- outline: none;
+}
+article, +aside, +details, +figcaption, +figure, +footer, +header, +hgroup, +menu, +nav, +section { +/*
- Override the default (display: inline) for
- browsers that do not recognize HTML5 tags.
- IE8 (and lower) requires a shiv:
- http://ejohn.org/blog/html5-shiv
+*/
- display: block;
+}
+b, +strong { +/*
- Makes browsers agree.
- IE + Opera = font-weight: bold.
- Gecko + WebKit = font-weight: bolder.
+*/
- font-weight: bold;
+}
+img {
- color: transparent;
- font-size: 0;
- vertical-align: middle;
+/*
+*/
- -ms-interpolation-mode: bicubic;
+}
+li { +/*
- For IE6 + IE7.
+*/
- display: list-item;
+}
+table {
- border-collapse: collapse;
- border-spacing: 0;
+}
+th, +td, +caption {
- font-weight: normal;
- vertical-align: top;
- text-align: left;
+}
+svg { +/*
- For IE9.
+*/
- overflow: hidden;
+}
+form{
- display: inline;
+}
+button::-moz-focus-inner, input[type="button"]::-moz-focus-inner, input[type="submit"]::-moz-focus-inner, input[type="reset"]::-moz-focus-inner {
- padding: 0 !important;
- border: 0 none !important;
+} +button, input[type="button"], input[type="submit"], input[type="reset"] {
- cursor: pointer;
+}
+// prevent image UUID's to overflow the layout +h1,h2,h3,h4,h5,h6{ word-wrap: break-word; }
+//rails creates div inside button_to form. Make it inline +form.button_to> div {display: inline;} diff --git a/src/app/stylesheets/custom.scss b/src/app/stylesheets/custom.scss deleted file mode 100644 index 93b85c0..0000000 --- a/src/app/stylesheets/custom.scss +++ /dev/null @@ -1,199 +0,0 @@ -/*fixes the button_to helper used in button-group problem*/ -.button-group .button_to:not(:only-child) div .button.pill{
- -webkit-border-radius: 0em 50em;
- -moz-border-radius: 0em 50em 50em 0em;
- border-radius: 0em 50em 50em 0em;
-}
-.pool_details {
- color: #333;
- text-decoration: none;
-}
-.loading_tabs {
- height: 30px;
- display:block;
- background: url(../../images/loading.gif) no-repeat center;
-}
-.hidden {
- display: none;
-}
-table.light_table tbody {
- tr.collapsed {
- display: none;
- }
- ul li {
- list-style-type: none;
- }
-}
-.launch-time-params h2 {
- font-size: 16px;
- font-weight: normal;
- text-align: center;
-}
-$services_width: 250px; -$services_border: 1px solid #b0b0b0; -$services_background: #efefef;
-form.generic section.services {
- position: relative;
- border: $services_border;
- margin: 1em;
- padding: 0 0 1em;
- -webkit-border-radius: 1em;
- -moz-border-radius: 1em;
- border-radius: 1em;
- min-height: 300px;
- background: $services_background;
- overflow: hidden;
- .labels {
- margin-top: 64px;
- width: 250px;
- float: left;
- h4.service {
font-size: 14px;
font-weight: normal;
position: relative;
z-index: 1;
$left_padding: 26px;
padding: 0.5em 0 0.5em $left_padding;
width: $services_width - $left_padding + 1px;
border-bottom: 1px solid transparent;
-&:hover {
background: darken($services_background, 20%);
cursor: pointer;
}
-&.selected {
background: $services_background;
border-bottom: $services_border;
cursor: default;
}
-&.filled-out {
background-image: url('../../images/filled_out_params_indicator.png');
background-repeat: no-repeat;
background-position: 8px center;
}
- }
- }
- .params-container {
- margin-left: 250px;
- .parameters {
display: none;
top: 88px;
left: $services_width;
padding: 1em;
- }
- }
- #service-headers {
- position: absolute;
- z-index: 0;
- background: transparent url('../../images/services_bg.png') repeat top center;
- top: 0;
- left: 0;
- height: 100%;
- border-right: $services_border;
- width: $services_width;
- $left-corners: 1em 0 0 1em;
- -webkit-border-radius: $left-corners;
- -moz-border-radius: $left-corners;
- border-radius: $left-corners;
- }
- header {
- background-image: none;
- background: #dddddd;
- margin-left: $services_width;
- padding: 1em;
- height: 40px;
- $topright-corner: 0 1em 0 0;
- -webkit-border-radius: $topright-corner;
- -moz-border-radius: $topright-corner;
- border-radius: $topright-corner;
- h3 {
font-size: 22px;
font-weight: normal;
- }
- }
- label {
- display: block;
- float: left;
- min-width: 120px;
- text-align: right;
- padding: 6px 7px 5px 0px;
- font-size: 14px;
- text-shadow: 0px 1px 0px #ffffff;
- font-weight: normal;
- }
-}
-.catalog_deployments_and_images{
- color: #606060;
- position: relative;
- h1{
- font-size: 16px;
- }
- h2{
- font-size: 12px;
- padding-left: 10px;
- padding-top: 10px;
- }
- h3{
- font-size: 12px;
- padding-left: 10px;
- }
- ul li{
- padding-left: 10px;
- padding-top:5px;
- list-style-type: none;
- }
-}
-#no-catalog-entry {
- margin-bottom: 30px;
-}
-.instance_details, .confirm_instances_termination {
- h3{
- font-size: 22px;
- font-weight: normal;
- margin-bottom: 10px;
- }
- ul li {
- list-style-type: none;
- margin: 10px 15px;
- font-weight: bold;
- span {
font-weight: normal;
- }
- }
- ol{
- margin: 15px;
- li {
margin:10px 15px;
- }
- }
-}
-.pagination{
- margin-top: 10px;
- text-align: center;
-} diff --git a/src/app/stylesheets/header.scss b/src/app/stylesheets/header.scss deleted file mode 100644 index dca6cc2..0000000 --- a/src/app/stylesheets/header.scss +++ /dev/null @@ -1,463 +0,0 @@ -/* @font-face setup */
-@font-face {
- font-family: 'Overpass';
- src: url("../../fonts/overpass_regular-web.eot");
- src: local("Overpass"), url("../../fonts/overpass_regular-web.eot?#iefix") format("eot"), url("../../fonts/overpass_regular-web.woff") format("woff"), url("../../fonts/overpass_regular-web.ttf") format("truetype"), url("../../fonts/overpass_regular-web.svg#webfontLTZe4IYH") format("svg");
- font-weight: normal;
- font-style: normal; }
-@font-face {
- font-family: 'Overpass';
- src: url("../../fonts/overpass_bold-web.eot");
- src: local("Overpass Bold"), local("Overpass-Bold"), url("../../fonts/overpass_bold-web.eot?#iefix") format("eot"), url("../../fonts/overpass_bold-web.woff") format("woff"), url("../../fonts/overpass_bold-web.ttf") format("truetype"), url("../../fonts/overpass_bold-web.svg#webfontzAU82Ltw") format("svg");
- font-weight: bold;
- font-style: normal; }
-/* Adapted normalization */
-.hidden {
- display: none; }
-.shell-design {
- section {
- display: none;
-&.active {
display: block; } }
- article, aside, details, figcaption, figure, footer, header, hgroup, nav, section {
- display: block; }
- a {
- color: #36c;
-&:visited {
color: #36c; }
-&:hover {
color: #000; }
-&:focus {
outline: none;
box-shadow: 0 0 3px 3px #fa0; }
-&:hover,&:active {
outline: none; } }
- b, strong {
- font-weight: bold; }
- img {
- border: 0;
- -ms-interpolation-mode: bicubic;
- vertical-align: middle; }
- svg:not(:root) {
- overflow: hidden; } }
-/* Some header-specific styling */
-header.shell-design {
- height: 5.5em;
- background-color: #1a1f22;
- position: relative;
- color: #fff;
- border-bottom: .4em solid #060807;
- border-top: .4em solid #060807;
- box-shadow: inset 0em -0.1em #181c1e, inset 0px -2em 5em #101214;
- h1 {
- font-size: 1em;
- text-transform: uppercase;
- position: absolute;
- top: .9em;
- left: 0;
- line-height: 1.5em;
- text-indent: 2em;
- color: #fff;
- em {
border-left: .1em solid #fff;
padding-left: .25em;
margin-left: .25em;
font-style: normal; } }
-> article {
- margin: 0 auto;
- max-width: 80em;
- line-height: 2em;
- position: relative;
- padding: 0em;
- padding-left: 20em; } }
-/* Navigation */
-nav#appnav {
- display: table;
- font-weight: normal;
- border: .2em solid #181c1e;
- border-bottom: none transparent 0px;
- margin-top: 2.25em;
- border-radius: .25em .25em 0em 0em;
- white-space: nowrap;
-> ul { -> li { -> ul> li a {
color: #777; }
display: block;
vertical-align: top;
float: left;
a {
display: block;
width: 100%;
text-decoration: none;
clear: both;
padding: 0em;
text-indent: 1.5em;
text-transform: capitalize;
position: relative;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
-&.selected{ background-color: #444; }
}
-> a {
color: #bbb;
padding: .75em 1em;
text-align: center;
text-indent: 0em;
border-style: none solid;
border-width: 0px .1em;
border-color: transparent #181c1e;
background-color: #1f2123;
box-shadow: inset 0px -3.5em 2em -2em #15191b;
-&:active {
color: #fff;
background-color: #4a4e50; }
-&:hover {
/*box-shadow*/
-webkit-box-shadow: 0em 0em 1em rgba(0, 0, 0, 0.32);
-moz-box-shadow: 0em 0em 1em rgba(0, 0, 0, 0.32);
box-shadow: 0em 0em 1em rgba(0, 0, 0, 0.32);
cursor: pointer; }
-&:focus,&:active {
box-shadow: inset 0px -4em 3em -2em rgba(0, 0, 0, 0.4); } }
position: relative;
-&:hover { -> a {
box-shadow: inset 0px -4em 3em -2em rgba(0, 0, 0, 0.4); }
li:hover> a,> a {
background-color: #4a4e50;
color: #fff; } }
a {
-&:hover,&:focus {
background-color: #4a4e50;
color: #fff; } }
-&:first-child> a {
/*border-radius*/
-webkit-border-radius: .225em 0em 0em 0em;
-moz-border-radius: .225em 0em 0em 0em;
border-radius: .225em 0em 0em 0em;
border-left: 0px transparent none; }
-&:last-child> a {
/*border-radius*/
-webkit-border-radius: 0em .225em 0em 0em;
-moz-border-radius: 0em .225em 0em 0em;
border-radius: 0em .225em 0em 0em;
border-right: 0px transparent none; }
-> ul> li:last-child> a {
/*border-radius*/
-webkit-border-radius: 0em 0em .25em .25em;
-moz-border-radius: 0em 0em .25em .25em;
border-radius: 0em 0em .25em .25em; } }
- display: table-row; }
- ul a:after {
- z-index: 3;
- content: "";
- width: 100%;
- height: 50%;
- top: 0;
- left: 0;
- right: 0;
- display: block;
- position: absolute; }
-> ul> li {
- a:focus ~ ul,&:hover ul {
background-color: white;
/*box-shadow*/
-webkit-box-shadow: 0em 0.025em 0.5em rgba(0, 0, 0, 0.5);
-moz-box-shadow: 0em 0.025em 0.51em rgba(0, 0, 0, 0.5);
box-shadow: 0em 0.025em 0.51em rgba(0, 0, 0, 0.5);
/*border-radius*/
-webkit-border-radius: 0em 0em .25em .25em;
-moz-border-radius: 0em 0em .25em .25em;
border-radius: 0em 0em .25em .25em;
display: block;
width: 100%;
top: 0em;
left: 0; } } }
-/* I'm doubtful that this actually matches anythign */
-.no-boxshadow header nav#appnav> ul> li:hover ul {
- border: 1px solid #ccc;
- margin: -0.1px; }
-header.shell-design {
- nav#appnav> ul> li {
-&:hover> ul {
z-index: 9999 !important;
/*painfully silly hack*/
margin-top: -0.25em;
padding-top: 0em !important;
- }
-> ul> li:hover {
position: relative; }
-&:hover> ul> li> ul {
position: absolute;
box-shadow: none;
background-color: transparent;
top: 0em;
left: 100%;
padding-top: 0em;
-> li {
display: none; } }
- a:focus ~ ul,&:hover> ul {
z-index: 1;
padding-top: 1em;
display: block;
position: absolute;
top: 3.5em;
opacity: 1; }
- a:focus ~ li ul li,&:hover> ul> li:hover> ul> li {
display: block; }
- a:focus ~ li ul,&:hover> ul> li:hover ul {
/*box-shadow*/
-webkit-box-shadow: 0.025em 0.025em 0.51em rgba(0, 0, 0, 0.5);
-moz-box-shadow: 0.025em 0.025em 0.51em rgba(0, 0, 0, 0.5);
box-shadow: 0.025em 0.025em 0.51em rgba(0, 0, 0, 0.5);
/*border-radius*/
-webkit-border-radius: 0em .25em .25em 0em;
-moz-border-radius: 0em .25em .25em 0em;
border-radius: 0em .25em .25em 0em;
background-color: white;
z-index: 1;
opacity: 1; }
-> {
ul {
-> li { -> ul li { -&:first-child a {
/*border-radius*/
-webkit-border-radius: .0em .25em 0em 0em;
-moz-border-radius: .0em .25em 0em 0em;
border-radius: .0em .25em 0em 0em; }
-&:last-child a {
/*border-radius*/
-webkit-border-radius: 0em 0em .25em .0em;
-moz-border-radius: 0em 0em .25em .0em;
border-radius: 0em 0em .25em .0em; }
-&:first-child:hover a:after {
z-index: 9;
display: block;
position: absolute;
top: .5em;
left: 0em;
content: "";
height: 0;
width: 0;
border-width: .5em 0em .5em .5em;
border-style: solid none solid solid;
border-color: transparent transparent transparent #fff; } }
ul {
-&:before {
z-index: 2;
display: block;
position: absolute;
top: 0em;
left: -0.14em;
content: "";
height: 0;
width: 0;
border-width: 1em 0em 1em 1em;
border-style: solid none solid solid;
border-color: transparent transparent transparent transparent; }
-&:after {
z-index: 1;
display: block;
position: absolute;
top: .5em;
left: -1em;
content: "";
height: 0;
width: 0;
opacity: 1;
z-index: 2;
border-width: .5em 0em .5em .5em;
border-style: solid none solid solid;
border-color: transparent transparent transparent #ccc; } }
a:hover ~ ul:before,&:hover ul:before {
top: 0em;
border: solid 1em #4a4e50;
left: -1.98em; }
a:hover ~ ul:after,&:hover ul:after {
top: 0em;
border-color: transparent transparent transparent #4a4e50;
left: 0em;
content: "";
height: 0;
width: 0;
border-width: 1em 0em 1em 1em;
border-style: solid none solid solid; } }
position: absolute;
left: 0;
display: none;
line-height: 2em !important;
min-width: 16em;
max-width: 22em; }
a.active {
position: relative;
-&:after {
z-index: 9;
position: absolute;
top: 3.1em;
left: 50%;
margin-left: -0.55em;
display: block;
content: "";
width: 0;
height: 0;
border-width: 0em .55em .55em .55em;
border-style: none solid solid solid;
border-color: transparent transparent #fff transparent; } } }
- position: relative; }
-&.shell-design> article section:last-child {
- text-align: right;
- position: absolute;
- top: -1.75em;
- right: 0em;
- margin: 0 auto;
- display: block;
- a {
border: 0.1em solid rgba(255, 255, 255, 0.12);
color: #ccc !important;
border-radius: 0em 0em .5em .5em;
color: #fff;
text-decoration: none;
background-color: #181c1e;
box-shadow: inset 0px 1.5em 1em -1em rgba(222, 222, 255, 0.1);
display: inline-block;
padding: .1em 1em;
position: relative;
margin: 1.25em .1em;
-&:last-child {
padding-right: 2em;
-&:after {
content: "";
display: block;
height: 0px;
width: 0px;
position: absolute;
top: .75em;
right: .5em;
border-style: solid solid none solid;
border-width: .5em .5em 0em .5em;
border-color: #666 transparent transparent; } }
-&:first-child {
padding-left: 3em;
-&:after {
/*content: "!";*/
color: #2e4e66;
text-align: center;
background-color: #ccc !important;
width: 1em;
height: 1em;
border-radius: 50%;
position: absolute;
top: .25em;
left: .5em;
line-height: 1em;
font-size: 1.5em;
display: block;
background-color: transparent;
z-index: 2; } } } } }
-/*
- header nav#appnav> ul> li> ul> li
-*/
-/* The below is good */
-/* Some new stuff */
-/* Is this legit? */
-.shell-design {
- {
- /*
this is life saving but locks us into> ie8 will consider this polyfil for lt-ie8
https://github.com/Schepp/box-sizing-polyfill
- */
- -moz-box-sizing: border-box !important;
- -webkit-box-sizing: border-box !important;
- box-sizing: border-box !important;
- background-repeat: no-repeat;
- vertical-align: middle;
- font-family: overpass; }
- a {
-&:hover,&:focus,&:active {
color: #fa0; }
-&:focus {
outline: none !important; }
-&:link {
color: #36c; } }
- article {
-&:before {
content: "";
display: table; }
-&:after {
content: "";
display: table;
clear: both; } } }
-/* Wait, do we actually want this? */
-/* User dropdown menu definition */
-section#usermenu {
- position: absolute;
- left: 80%;
- width: 20%;
- padding: 5px 2px 5px 2px;
- cursor: pointer;
- z-index: 9999;
-> a {
- width: 100%; }
-> ul {
- list-style-type: none;
- display: none;
- border: none;
- padding: 0em;
- margin: 0em;
- top: 4em;
- float: left;
- position: absolute;
- z-index: 9999;
- width: 100%;
-&:before {
display: none;
content: none; } }
-&:hover> ul {
- display: block;
- }
-> ul { -> li {
padding: 0em;
margin: 0em;
border-color: transparent !important;
background-image: none !important;
box-shadow: none !important; }
- li {
a {
margin: 0em;
padding: .5em 2em;
border-radius: 0;
border-color: transparent !important;
box-shadow: none !important;
-&:hover {
color: #FFF !important;
text-decoration: underline; } }
-&:last-child a {
border-radius: 0em 0em .51em .51em; }
a:after {
content: none; } } } }
diff --git a/src/app/stylesheets/layout.scss b/src/app/stylesheets/layout.scss index 430ee1b..f469b9b 100644 --- a/src/app/stylesheets/layout.scss +++ b/src/app/stylesheets/layout.scss @@ -1,266 +1,20 @@ +@import "reset"; +@import "mixins"; +@import "helpers"; +@import "fonts"; +@import "buttons"; +@import "header"; +@import "custom";
- /* ###########################################################################
-Generated SCSS for Aeolus UI [aeolus_ui] -Compiled on Wed Jul 13 12:26:53 -0700 2011 +SCSS for Aeolus UI ########################################################################### */
-/*VARIABLES AND MIXINS*/ -@mixin display_inline_block {
- display: -moz-inline-stack;
- display: inline-block;
- vertical-align: top;
- zoom: 1;
- *display: inline;
-}
-@mixin clearfix {
- *zoom: 1;
-&:before,&:after {
- display: table;
- content: "";
- }
-&:after {
- clear: both;
- }
-}
-.clearfix {
- @include clearfix;
-}
-/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ -Page Layout -- v.0.0.2 [layout] (reset.css) -~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
-/* `XHTML, HTML4, HTML5 Reset -----------------------------------------------------------------------------------------------------*/
-a, -abbr, -acronym, -address, -applet, -article, -aside, -audio, -b, -big, -blockquote, -body, -canvas, -caption, -center, -cite, -code, -dd, -del, -details, -dfn, -dialog, -div, -dl, -dt, -em, -embed, -fieldset, -figcaption, -figure, -font, -footer, -form, -h1, -h2, -h3, -h4, -h5, -h6, -header, -hgroup, -hr, -html, -i, -iframe, -img, -ins, -kbd, -label, -legend, -li, -mark, -menu, -meter, -nav, -object, -ol, -output, -p, -pre, -progress, -q, -rp, -rt, -ruby, -s, -samp, -section, -small, -span, -strike, -strong, -sub, -summary, -sup, -table, -tbody, -td, -tfoot, -th, -thead, -time, -tr, -tt, -u, -ul, -var, -video, -xmp {
- border: 0;
- margin: 0;
- padding: 0;
- font-size: 100%;
- outline: none;
-}
-h1,h2,h3,h4,h5,h6{ word-wrap: break-word; }
-article, -aside, -details, -figcaption, -figure, -footer, -header, -hgroup, -menu, -nav, -section { -/*
- Override the default (display: inline) for
- browsers that do not recognize HTML5 tags.
- IE8 (and lower) requires a shiv:
- http://ejohn.org/blog/html5-shiv
-*/
- display: block;
-}
-b, -strong { -/*
- Makes browsers agree.
- IE + Opera = font-weight: bold.
- Gecko + WebKit = font-weight: bolder.
-*/
- font-weight: bold;
-}
-img {
- color: transparent;
- font-size: 0;
- vertical-align: middle;
-/*
-*/
- -ms-interpolation-mode: bicubic;
-}
-li { -/*
- For IE6 + IE7.
-*/
- display: list-item;
-}
-table {
- border-collapse: collapse;
- border-spacing: 0;
-}
-th, -td, -caption {
- font-weight: normal;
- vertical-align: top;
- text-align: left;
-}
-svg { -/*
- For IE9.
-*/
- overflow: hidden;
-}
-form{
- display: inline;
-} -form.button_to> div {display: inline;}
-button::-moz-focus-inner, input[type="button"]::-moz-focus-inner, input[type="submit"]::-moz-focus-inner, input[type="reset"]::-moz-focus-inner {
- padding: 0 !important;
- border: 0 none !important;
-} -button, input[type="button"], input[type="submit"], input[type="reset"] {
- cursor: pointer;
-}
-/* `Clear Floated Elements -----------------------------------------------------------------------------------------------------*/
-/* http://sonspring.com/journal/clearing-floats */
-.clear {
- clear: both;
- display: block;
- overflow: hidden;
- visibility: hidden;
- width: 0;
- height: 0;
-}
-/* http://www.yuiblog.com/blog/2010/09/27/clearfix-reloaded-overflowhidden-demy... */
-.clearfix:before, -.clearfix:after {
- content: '\0020';
- display: block;
- overflow: hidden;
- visibility: hidden;
- width: 0;
- height: 0;
-}
-.clearfix:after {
- clear: both;
-}
-/*
- The following zoom: 1 rule is specifically for IE6 + IE7.
- Move to separate stylesheet if invalid CSS is a problem.
-*/
-.clearfix {
- zoom: 1;
-}
- /* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
-Page Layout -- v.0.0.2 [layout] (layout.scss) +Page Layout
$width: 960px; -$font-family-base: "Lucida Sans Unicode", "Lucida Grande", Verdana, Arial, Helvetica, sans-serif; -$font-family-em: "Lucida Sans", "Lucida Sans Unicode", "Lucida Grande", Verdana, Arial, Helvetica, sans-serif; -$font-family-primary: Helvetica, Arial, "Lucida Grande", sans-serif; /* body */ @@ -275,11 +29,10 @@ body{ strong, em, b, i{ font-family: $font-family-em; } -.align-center{text-align: center;} - /* Content */ div#content{ + @include clearfix; width: $width; margin: 0 auto; margin-bottom: 58px; @@ -299,518 +52,15 @@ div#content{ box-shadow: inset 0px .25em .25em #aaa, 0px .5em 2em #000 !important; } -/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ -Page Layout -- v.0.0.2 [layout] (layout_ie.css) -~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ - - - -/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ -Application Button Set -- v.0.0.1 [button] (button.scss) -~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ - -/* ------------------------------------------ -CSS3 GITHUB BUTTONS (Nicolas Gallagher) -Licensed under Unlicense -http://github.com/necolas/css3-github-buttons ------------------------------------------- */ - - -/* ----------------------------------------------------------------- BUTTON */ - -.button { - position: relative; - overflow: visible; - @include display_inline_block; - padding: 0.5em 1em; - border: 1px solid #d4d4d4; - margin: 0; - text-decoration: none; - text-shadow: 1px 1px 0 #fff; - font:11px/normal sans-serif; - color: #333; - white-space: nowrap; - cursor: pointer; - outline: none; - background-color: #ececec; - background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#f4f4f4), to(#ececec)); - background-image: -moz-linear-gradient(#f4f4f4, #ececec); - background-image: -o-linear-gradient(#f4f4f4, #ececec); - background-image: linear-gradient(#f4f4f4, #ececec); - -webkit-background-clip: padding; - -moz-background-clip: padding; - -o-background-clip: padding-box; - /*background-clip: padding-box;*/ /* commented out due to Opera 11.10 bug */ - -webkit-border-radius: 0.2em; - -moz-border-radius: 0.2em; - border-radius: 0.2em; -} - -.button:hover, -.button:focus, -.button:active, -.button.active { - border-color: #3072b3; - border-bottom-color: #2a65a0; - text-decoration: none; - text-shadow: -1px -1px 0 rgba(0,0,0,0.3); - color: #fff; - background-color: #3C8DDE; - background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#599bdc), to(#3072b3)); - background-image: -moz-linear-gradient(#599bdc, #3072b3); - background-image: -o-linear-gradient(#599bdc, #3072b3); - background-image: linear-gradient(#599bdc, #3072b3); -} - -.button:active, -.button.active { - border-color: #2a65a0; - border-bottom-color: #3884CF; - background-color: #3072b3; - background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#3072b3), to(#599bdc)); - background-image: -moz-linear-gradient(#3072b3, #599bdc); - background-image: -o-linear-gradient(#3072b3, #599bdc); - background-image: linear-gradient(#3072b3, #599bdc); -} - -/* overrides extra padding on button elements in Firefox */ -.button::-moz-focus-inner { - padding: 0; - border: 0; -} -.button.disabled, .button[disabled] { - cursor: default; - background: transparent; - opacity: 0.6; - /* @include no-box-shadow; */ -&:hover { - background: transparent; - text-decoration: none; - color: inherit; - text-shadow: inherit; - } -} - -/* ------------------------------------------------------------------ Icons */ - -.button.icon:before { - content: ""; - position: relative; - top: 1px; - float:left; - width: 12px; - height: 12px; - margin: 0 0.75em 0 -0.25em; - background: url(../../images/button-icons.png) 0 99px no-repeat; -} - -.button.arrowup.icon:before { background-position: 0 0; } -.button.arrowup.icon:hover:before, -.button.arrowup.icon:focus:before, -.button.arrowup.icon:active:before { background-position: -12px 0; } - -.button.arrowdown.icon:before { background-position: 0 -12px; } -.button.arrowdown.icon:hover:before, -.button.arrowdown.icon:focus:before, -.button.arrowdown.icon:active:before { background-position: -12px -12px; } - -.button.arrowleft.icon:before { background-position: 0 -24px; } -.button.arrowleft.icon:hover:before, -.button.arrowleft.icon:focus:before, -.button.arrowleft.icon:active:before { background-position: -12px -24px; } - -.button.arrowright.icon:before { float:right; margin: 0 -0.25em 0 0.5em; background-position: 0 -36px; } -.button.arrowright.icon:hover:before, -.button.arrowright.icon:focus:before, -.button.arrowright.icon:active:before { background-position: -12px -36px; } - -.button.approve.icon:before { background-position: 0 -48px; } -.button.approve.icon:hover:before, -.button.approve.icon:focus:before, -.button.approve.icon:active:before { background-position: -12px -48px; } - -.button.add.icon:before { background-position: 0 -288px; } -.button.add.icon:hover:before, -.button.add.icon:focus:before, -.button.add.icon:active:before { background-position: -12px -288px; } - -.button.remove.icon:before { background-position: 0 -60px; } -.button.remove.icon:hover:before, -.button.remove.icon:focus:before, -.button.remove.icon:active:before { background-position: -12px -60px; } - -.button.log.icon:before { background-position: 0 -72px; } -.button.log.icon:hover:before, -.button.log.icon:focus:before, -.button.log.icon:active:before { background-position: -12px -72px; } - -.button.calendar.icon:before { background-position: 0 -84px; } -.button.calendar.icon:hover:before, -.button.calendar.icon:focus:before, -.button.calendar.icon:active:before { background-position: -12px -84px; } - -.button.chat.icon:before { background-position: 0 -96px; } -.button.chat.icon:hover:before, -.button.chat.icon:focus:before, -.button.chat.icon:active:before { background-position: -12px -96px; } - -.button.clock.icon:before { background-position: 0 -108px; } -.button.clock.icon:hover:before, -.button.clock.icon:focus:before, -.button.clock.icon:active:before { background-position: -12px -108px; } - -.button.settings.icon:before { background-position: 0 -120px; } -.button.settings.icon:hover:before, -.button.settings.icon:focus:before, -.button.settings.icon:active:before { background-position: -12px -120px; } - -.button.comment.icon:before { background-position: 0 -132px; } -.button.comment.icon:hover:before, -.button.comment.icon:focus:before, -.button.comment.icon:active:before { background-position: -12px -132px; } - -.button.fork.icon:before { background-position: 0 -144px; } -.button.fork.icon:hover:before, -.button.fork.icon:focus:before, -.button.fork.icon:active:before { background-position: -12px -144px; } - -.button.like.icon:before { background-position: 0 -156px; } -.button.like.icon:hover:before, -.button.like.icon:focus:before, -.button.like.icon:active:before { background-position: -12px -156px; } - -.button.favorite.icon:before { background-position: 0 -348px; } -.button.favorite.icon:hover:before, -.button.favorite.icon:focus:before, -.button.favorite.icon:active:before { background-position: -12px -348px; } - -.button.home.icon:before { background-position: 0 -168px; } -.button.home.icon:hover:before, -.button.home.icon:focus:before, -.button.home.icon:active:before { background-position: -12px -168px; } - -.button.key.icon:before { background-position: 0 -180px; } -.button.key.icon:hover:before, -.button.key.icon:focus:before, -.button.key.icon:active:before { background-position: -12px -180px; } - -.button.lock.icon:before { background-position: 0 -192px; } -.button.lock.icon:hover:before, -.button.lock.icon:focus:before, -.button.lock.icon:active:before { background-position: -12px -192px; } - -.button.unlock.icon:before { background-position: 0 -204px; } -.button.unlock.icon:hover:before, -.button.unlock.icon:focus:before, -.button.unlock.icon:active:before { background-position: -12px -204px; } - -.button.loop.icon:before { background-position: 0 -216px; } -.button.loop.icon:hover:before, -.button.loop.icon:focus:before, -.button.loop.icon:active:before { background-position: -12px -216px; } - -.button.search.icon:before { background-position: 0 -228px; } -.button.search.icon:hover:before, -.button.search.icon:focus:before, -.button.search.icon:active:before { background-position: -12px -228px; } - -.button.mail.icon:before { background-position: 0 -240px; } -.button.mail.icon:hover:before, -.button.mail.icon:focus:before, -.button.mail.icon:active:before { background-position: -12px -240px; } - -.button.move.icon:before { background-position: 0 -252px; } -.button.move.icon:hover:before, -.button.move.icon:focus:before, -.button.move.icon:active:before { background-position: -12px -252px; } - -.button.edit.icon:before { background-position: 0 -264px; } -.button.edit.icon:hover:before, -.button.edit.icon:focus:before, -.button.edit.icon:active:before { background-position: -12px -264px; } - -.button.pin.icon:before { background-position: 0 -276px; } -.button.pin.icon:hover:before, -.button.pin.icon:focus:before, -.button.pin.icon:active:before { background-position: -12px -276px; } - -.button.reload.icon:before { background-position: 0 -300px; } -.button.reload.icon:hover:before, -.button.reload.icon:focus:before, -.button.reload.icon:active:before { background-position: -12px -300px; } - -.button.rss.icon:before { background-position: 0 -312px; } -.button.rss.icon:hover:before, -.button.rss.icon:focus:before, -.button.rss.icon:active:before { background-position: -12px -312px; } - -.button.tag.icon:before { background-position: 0 -324px; } -.button.tag.icon:hover:before, -.button.tag.icon:focus:before, -.button.tag.icon:active:before { background-position: -12px -324px; } - -.button.trash.icon:before { background-position: 0 -336px; } -.button.trash.icon:hover:before, -.button.trash.icon:focus:before, -.button.trash.icon:active:before { background-position: -12px -336px; } - -.button.user.icon:before { background-position: 0 -360px; } -.button.user.icon:hover:before, -.button.user.icon:focus:before, -.button.user.icon:active:before { background-position: -12px -360px; } - - -/* ------------------------------------------------------ BUTTON EXTENSIONS */ - -/* ---------------------------------------------------------------- Primary */ - -.button.primary { - font-weight: bold; -} - -/* ----------------------------------------------------------------- Danger */ - -.button.danger { - color: #900; -} - -.button.danger:hover, -.button.danger:focus, -.button.danger:active { - border-color: #b53f3a; - border-bottom-color: #a0302a; - color: #fff; - background-color: #dc5f59; - background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#dc5f59), to(#b33630)); - background-image: -moz-linear-gradient(#dc5f59, #b33630); - background-image: -o-linear-gradient(#dc5f59, #b33630); - background-image: linear-gradient(#dc5f59, #b33630); -} - -.button.danger:active, -.button.danger.active { - border-color: #a0302a; - border-bottom-color: #bf4843; - background-color: #b33630; - background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#b33630), to(#dc5f59)); - background-image: -moz-linear-gradient(#b33630, #dc5f59); - background-image: -o-linear-gradient(#b33630, #dc5f59); - background-image: linear-gradient(#b33630, #dc5f59); -} - -/* ------------------------------------------------------------------- Pill */ - -.button.pill { - -webkit-border-radius: 50em; - -moz-border-radius: 50em; - border-radius: 50em; -} - -/* ---------------------------------------------------------------- Disable */ - -.button.disable { - opacity: 0.5; -} - -/* -------------------------------------------------------------------- Big */ - -.button.big { - font-size: 14px; -} - -.button.big.icon:before { top: 0; } - - -/* ---------------------------------------------------------- BUTTON GROUPS */ - -/* --------------------------------------------------------------- Standard */ - -.button-group { - @include display_inline_block; - list-style: none; - padding: 0; - margin: 0; -} - -.button + .button, -.button + .button-group, -.button-group + .button, -.return_to + .button-group, -.button-group + .button-group { - margin-left: 15px; -} - -.button-group li { - float: left; - padding: 0; - margin: 0; -} - -.button-group .button { - float: left; - margin-left: -1px; -} - -.button-group> .button:not(:first-child):not(:last-child), -.button-group li:not(:first-child):not(:last-child) .button { - -webkit-border-radius: 0; - -moz-border-radius: 0; - border-radius: 0; -} - -.button-group> .button:first-child, -.button-group li:first-child .button { - margin-left: 0; - -webkit-border-top-right-radius: 0; - -webkit-border-bottom-right-radius: 0; - -moz-border-radius-topright: 0; - -moz-border-radius-bottomright: 0; - border-top-right-radius: 0; - border-bottom-right-radius: 0; -} - -.button-group> .button:last-child, -.button-group li:last-child> .button { - -webkit-border-top-left-radius: 0; - -webkit-border-bottom-left-radius: 0; - -moz-border-radius-topleft: 0; - -moz-border-radius-bottomleft: 0; - border-top-left-radius: 0; - border-bottom-left-radius: 0; -} - -/* ------------------------------------------------------------------ Minor */ - -.button-group.minor-group .button { - border: 1px solid #d4d4d4; - text-shadow: none; - background-image: none; - background-color: #fff; -} - -.button-group.minor-group .button:hover, -.button-group.minor-group .button:focus, -.button-group.minor-group .button:active { - background-color: #599bdc; -} - -.button-group.minor-group .button:active, -.button-group.minor-group .button.active { - background-color: #3072b3; -} - -.button-group.minor-group .button.icon:before { - opacity: 0.8; -} - -/* ------------------------------------------------------- BUTTON CONTAINER */ -/* For mixing buttons and button groups, e.g., in a navigation bar */ - -.button-container .button, -.button-container .button-group { - vertical-align: top; -} -/* --------------------------------------------------------- CUSTOM BUTTONS */ - -span.view-toggle{ - @include display_inline_block; -} - -a.view-toggle{ - background: url('../../images/button-viewtoggle.png') no-repeat top left; - display: block; - float:left; - width: 38px; - height: 27px; -} - -a.view-toggle span{ - position: absolute; - top: -999em; -} - -a.view-toggle.pretty{ -&:active{ - background-position: -75px 0px; - } -} - -a.view-toggle.filter{ - width: 36px; - background-position: -39px 0px; -&:active{ - background-position: -114px 0px; - } -} - -a.view-toggle.pretty.active{ - background-position: -75px 0px; -} - -a.view-toggle.filter.active{ - background-position: -114px 0px; -} - -a.add-group-button{ - background: transparent url('../../images/button-add-user-group.png') no-repeat top left; - display: block; - width: 50px; - height: 25px; -} -a.add-user-button{ - background: transparent url('../../images/button-add-user-group.png') no-repeat bottom left; - display: block; - width: 50px; - height: 25px; -} /* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ Application Input Controls -- v.0.0.1 [input] (input.scss) ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ -/* Query Inputs */ - -div.query-input{ - @include display_inline_block; - background-image: -moz-linear-gradient(top, rgba(209,209,209,1), rgba(230,230,230, 0)); - background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(209,209,209,1)), to(rgba(230,230,230, 0))); - -webkit-border-radius: 16px; -moz-border-radius: 16px; border-radius: 16px; - padding: 3px; -} - -div.query-input input[type="text"]{ - display: inline; - -webkit-border-radius: 16px; -moz-border-radius: 16px; border-radius: 16px; - border: 1px solid #ccc; - height: 23px; - width: 180px; - outline: none; - padding: 0px 26px 0px 10px; - margin:0px; - font-size: 12px; -} - -div.query-input input[type="submit"]{ - display:inline; - background: transparent url('../../images/button-search.png') no-repeat left center; - color: transparent; - border: 0px; - width: 25px; height: 25px; - margin-left: -25px; - outline: none; - cursor: pointer; -&:hover{ background: transparent url('../../images/button-search-over.png') no-repeat left center; } -&:active{ background: transparent url('../../images/button-search-down.png') no-repeat left center; } -} - /* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ Textual Labels -- v.0.0.1 [label] (label.scss) ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ -$font-family-base: "Lucida Sans Unicode", "Lucida Grande", Verdana, Arial, Helvetica, sans-serif; -$font-family-em: "Lucida Sans", "Lucida Sans Unicode", "Lucida Grande", Verdana, Arial, Helvetica, sans-serif; -$font-family-primary: "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; - .label{ font-family: $font-family-base; font-size: 12px; @@ -839,11 +89,10 @@ $font-family-primary: "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans- .label.badge{ @include display_inline_block; - vertical-align: baseline; -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px; background-color: #efefef; border: 1px solid transparent; - padding: 1px 4px 0px 4px; + padding: 0px 4px 0px 4px; min-width: 10px; font-size: 10px; color: #000; @@ -995,8 +244,6 @@ nav#administer_nav { Page Header -- v.0.0.1 [header] (header.scss) ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ -$font-family-primary: "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; - div#content .page-header{ display: block; @@ -1017,7 +264,7 @@ div#content .page-header{ border-radius: 0em; h1{ - font-family: overpass; + font-family: $font-family-primary; font-size: 25px; line-height: 38px; font-weight: normal; @@ -1085,34 +332,21 @@ div#content .page-header{ background: transparent url('../../images/header_icon_settings.png') no-repeat 8px center; } - #obj_actions{ + .obj_actions{ +& > *{ vertical-align: middle; } float: right; margin: 13px 7px 12px 24px; } - div.return_to{ - @include display_inline_block; - padding: 0.5em 0em; - - a{ - background: #cccccc; - color: black; - text-decoration: none; - font-weight: bold; - padding: 3px 6px; - -webkit-border-radius: 12px; -moz-border-radius: 12px; border-radius: 12px; - border: none; - } - } - ul#provider_select{ @include display_inline_block; + vertical-align: middle; list-style-type: none; position: relative; & > li{ - padding: 0px 15px 15px 0px; + padding: 7px 15px 7px 0px; margin: 0px 15px 0px 10px; - background: transparent url('../../images/admin_header_provider_select.png') right 1px no-repeat; + background: transparent url('../../images/admin_header_provider_select.png') right center no-repeat; & > a{ color: black; text-decoration: none; @@ -1157,10 +391,10 @@ div#content .page-header{ input[type="submit"].provider_toggle{ @include display_inline_block; + vertical-align: middle; border: none; width: 45px; height: 21px; - margin-top: -4px; &.on{ background: transparent url('../../images/provider_on_off.png') left center; @@ -1210,7 +444,6 @@ nav#nav_history{ Statistics Scoreboard -- v.0.0.1 [scoreboard] (scoreboard.scss) ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ -$font-family-primary: "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; $dd_padding: 10px; $dd_icon_padding_right: 4px; @@ -1334,10 +567,6 @@ $dd_icon_padding_right: 4px; Content Section Container -- v.0.0.1 [section] (section.scss) ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ -$font-family-base: "Lucida Sans Unicode", "Lucida Grande", Verdana, Arial, Helvetica, sans-serif; -$font-family-em: "Lucida Sans", "Lucida Sans Unicode", "Lucida Grande", Verdana, Arial, Helvetica, sans-serif; -$font-family-primary: Helvetica, Arial, "Lucida Grande", sans-serif; - section.content-section{ padding: 4px 15px 15px 15px; border-bottom: 1px solid #C4C4C4; @@ -1361,8 +590,9 @@ section.content-section{ font-size: 21px; font-weight: 200; @include display_inline_block; + vertical-align: middle; + padding: 2px 40px 2px 0px; margin-bottom: 4px; - padding: 2px 40px 0px 0px; &.activity{ background: transparent url('../../images/admin_h2_icons.png') right 0px no-repeat; } &.roles{ background: transparent url('../../images/admin_h2_icons.png') right -29px no-repeat; } @@ -1387,11 +617,9 @@ section.content-section{ } .section-controls{ - position: absolute; - right: 0px; - bottom: 4px; + float: right; @include display_inline_block; - font-size: 11px; +& > * { vertical-align: middle; } a.collapse{ text-decoration: none; @@ -1402,6 +630,7 @@ section.content-section{ /* nav */ nav.faceted{ + @include clearfix; border-bottom: 1px solid #ccc; ul{ list-style: none; font-family: $font-family-primary; } li{ @@ -1412,7 +641,8 @@ section.content-section{ @include display_inline_block; font-family: overpass; font-size: 1.3em; - padding-bottom: 6px; + line-height: 1.5em; + padding: 3px 0px; text-decoration: none; color: #aaa; } @@ -1425,6 +655,11 @@ section.content-section{ } } + div.loading_tabs{ + height: 60px; + background: transparent url("../../images/loading.gif") no-repeat center center; + } + /* Content */ .content{ @@ -1457,6 +692,7 @@ section.content-section{ } header.page-header + section.content-section{margin-top: 26px;} +nav#administer_nav + section.content-section{margin-top: 26px;} #scoreboard + section.content-section{ margin-top: 26px; } /* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ @@ -1507,6 +743,7 @@ div#user_card{ } div.user-card-content{ + @include clearfix; padding: 15px 15px 15px 60px; background: #efefef; -webkit-border-radius: 0px 0px 7px 7px; -moz-border-radius: 0px 0px 7px 7px; border-radius: 0px 0px 7px 7px; @@ -1523,10 +760,6 @@ div#user_card{ margin-top: 10px; } } - - #obj_actions{ - float: right; - } } } @@ -1554,10 +787,6 @@ dl.user_stats{ Alert Components -- v.0.0.1 [alert] (alert.scss) ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ -$font-family-base: "Lucida Sans Unicode", "Lucida Grande", Verdana, Arial, Helvetica, sans-serif; -$font-family-em: "Lucida Sans", "Lucida Sans Unicode", "Lucida Grande", Verdana, Arial, Helvetica, sans-serif; -$font-family-primary: Helvetica, Arial, "Lucida Grande", sans-serif; - .content.closed{ border-bottom: 1px solid #efefef; } @@ -1635,7 +864,6 @@ dl.alerts{ Pool Components -- v.0.0.1 [pool] (pool.scss) ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ -$font-family-primary: Helvetica, Arial, "Lucida Grande", sans-serif; $dd_padding: 10px; $dd_icon_padding_right: 4px; $bar_height: 37px; @@ -1874,16 +1102,10 @@ header + div.pool.overview{ Deployment Components -- v.0.0.1 [deployment] (deployment.scss) ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ -$font-family-base: "Lucida Sans Unicode", "Lucida Grande", Verdana, Arial, Helvetica, sans-serif; -$font-family-em: "Lucida Sans", "Lucida Sans Unicode", "Lucida Grande", Verdana, Arial, Helvetica, sans-serif; -$font-family-primary: Helvetica, Arial, "Lucida Grande", sans-serif; - /************************************************************************** */ /********************************************* Large Deployable Card Arrays */ /****************************************************************************/ -/* todo: move this elsewhere */ - $deployment-large-height: 154px; $deployment-large-width: 166px; $deployment-large-padding: 8px; @@ -2017,9 +1239,6 @@ ul.deployment-array.large + ul.deployment-array.large{ margin-top: 10px; } - - - /************************************************************************** */ /********************************************* Small Deployable Card Arrays */ /************************************************************************** */ @@ -2237,47 +1456,6 @@ ul.instances-array{ /********************************************* Deployable Detail page */ /************************************************************************** */ -#launch_deployment_button{ - @include display_inline_block; - margin: -7px 0px 0px 10px; - padding: 13px 12px 9px 46px; - font-weight: bold; - font-size: 14px; - color: white; - text-decoration: none; - border: 1px solid #669933; - -webkit-border-radius: 0.2em; -moz-border-radius: 0.2em; border-radius: 0.2em; - - background: #5AB45C url(../../images/deployment_large_icon_provider_white.png) no-repeat 12px center; /* Old browsers */ - background: url(../../images/deployment_large_icon_provider_white.png) 12px center no-repeat, -moz-linear-gradient(top, #ace3ac 0%, #5ab45c 100%); /* FF3.6+ */ - background: url(../../images/deployment_large_icon_provider_white.png) 12px center no-repeat, -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ace3ac), color-stop(100%,#5ab45c)); /* Chrome,Safari4+ */ - background: url(../../images/deployment_large_icon_provider_white.png) 12px center no-repeat, -webkit-linear-gradient(top, #ace3ac 0%,#5ab45c 100%); /* Chrome10+,Safari5.1+ */ - background: url(../../images/deployment_large_icon_provider_white.png) 12px center no-repeat, -o-linear-gradient(top, #ace3ac 0%,#5ab45c 100%); /* Opera 11.10+ */ - background: url(../../images/deployment_large_icon_provider_white.png) 12px center no-repeat, -ms-linear-gradient(top, #ace3ac 0%,#5ab45c 100%); /* IE10+ */ - background: url(../../images/deployment_large_icon_provider_white.png) 12px center no-repeat, linear-gradient(top, #ace3ac 0%,#5ab45c 100%); /* W3C */ - filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ace3ac', endColorstr='#5ab45c',GradientType=0 ); /* IE6-9 */ -&:active{ - background: #458944; /* Old browsers */ - background: url(../../images/deployment_large_icon_provider_white.png) 12px center no-repeat, -moz-linear-gradient(top, #9ecc9b 0%, #458944 100%); /* FF3.6+ */ - background: url(../../images/deployment_large_icon_provider_white.png) 12px center no-repeat, -webkit-gradient(linear, left top, left bottom, color-stop(0%,#9ecc9b), color-stop(100%,#458944)); /* Chrome,Safari4+ */ - background: url(../../images/deployment_large_icon_provider_white.png) 12px center no-repeat, -webkit-linear-gradient(top, #9ecc9b 0%, #458944 100%); /* Chrome10+,Safari5.1+ */ - background: url(../../images/deployment_large_icon_provider_white.png) 12px center no-repeat, -o-linear-gradient(top, #9ecc9b 0%, #458944 100%); /* Opera 11.10+ */ - background: url(../../images/deployment_large_icon_provider_white.png) 12px center no-repeat, -ms-linear-gradient(top, #9ecc9b 0%, #458944 100%); /* IE10+ */ - background: url(../../images/deployment_large_icon_provider_white.png) 12px center no-repeat, linear-gradient(top, #9ecc9b 0%, #458944 100%); /* W3C */ - filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9ecc9b', endColorstr='#458944',GradientType=0 ); /* IE6-9 */ - -webkit-box-shadow: inset 1px 1px 2px 0px #333; -moz-box-shadow: inset 1px 1px 2px 0px #333; box-shadow: inset 1px 1px 2px 0px #333; - } -&[type=submit][disabled=disabled], -&[disabled=disabled], -&.disabled{ - cursor: default; - zoom: 1; - filter: alpha(opacity=50); - -moz-opacity:0.5; - opacity: 0.5; - } -} - table.light_table{ margin: 10px; td,th{ padding: 5px 10px; vertical-align: middle;} @@ -2458,6 +1636,7 @@ div.build_status{ text-decoration: none; } div.catalog_with_checkbox{ + @include clearfix; padding: 7px 10px; input[type="checkbox"]{margin: 0px; padding: 0px; float: right;} } @@ -2489,14 +1668,6 @@ div.build_status{ margin-left: 2px; } -#obj_actions .catalog_link { - border-color: white; - -&:hover { - border-color: #999; - } -} - ul.catalog_pretty { border: 1px solid #ccc; -webkit-border-radius: 7px 7px 7px 7px; -moz-border-radius: 7px 7px 7px 7px; border-radius: 7px 7px 7px 7px; @@ -2623,8 +1794,6 @@ ul.image_builds{ 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 4px 10px; $td_padding: 5px 10px 3px 10px; @@ -2640,27 +1809,11 @@ $cell_header_text_color: #666666; $cell_anchor_text_color: #3286B8; -/* 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); -} - /* Filterable Form */ form.filterable-data{ - ul.obj_actions{ - padding: 6px 0px 6px 0px; - - list-style: none; - li{ @include display_inline_block; } - li + li{ padding-left: 6px; } - } - div.controls{ + @include clearfix; display: block; font-family: $font-family-primary; font-size: 12px; @@ -2992,10 +2145,14 @@ table.pool_families{ Form Components -- v.0.0.1 [form] (form.scss) ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ -$font-family-base: "Lucida Sans Unicode", "Lucida Grande", Verdana, Arial, Helvetica, sans-serif; -$label-font: "Lucida Sans", "Lucida Sans Unicode", "Lucida Grande", Verdana, Arial, Helvetica, sans-serif; -$font-family-primary: Helvetica, Arial, "Lucida Grande", sans-serif; +/* Global form settings + ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ +fieldset{ + margin-top: 20px; +} +/* Generic form + ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ form.generic{ div.field{ @@ -3016,20 +2173,20 @@ form.generic{ margin-top: 10px; } - fieldset{ - margin-top: 20px; - } - fieldset legend{ font-family: $font-family-primary; font-size: 16px; font-weight: light; } + fieldset.options{ +& > *{ vertical-align: middle; } + } + label{ display: block; padding-bottom: 2px; - font-family: $label-font; + font-family: $font-family-em; font-size: 12px; text-shadow: 0px 1px 0px #ffffff; font-weight: normal; diff --git a/src/app/stylesheets/login.scss b/src/app/stylesheets/login.scss index b50d2fd..da4fc4b 100644 --- a/src/app/stylesheets/login.scss +++ b/src/app/stylesheets/login.scss @@ -1,3 +1,5 @@ +@import "reset"; + $font-family-base: "Lucida Sans Unicode", "Lucida Grande", Verdana, Arial, Helvetica, sans-serif; $font-family-em: "Lucida Sans", "Lucida Sans Unicode", "Lucida Grande", Verdana, Arial, Helvetica, sans-serif; $font-family-primary: Helvetica, Arial, "Lucida Grande", sans-serif; diff --git a/src/app/views/catalogs/_section_header.html.haml b/src/app/views/catalogs/_section_header.html.haml index 0789f03..1460606 100644 --- a/src/app/views/catalogs/_section_header.html.haml +++ b/src/app/views/catalogs/_section_header.html.haml @@ -1,4 +1,4 @@ %header.page-header - #obj_actions.button-group + .obj_actions = link_to t('catalogs.new_catalog'), new_catalog_url, :class => 'button primary', :id => 'new_catalog_button' %h1.no-icon=t('catalogs.catalogs') diff --git a/src/app/views/catalogs/edit.html.haml b/src/app/views/catalogs/edit.html.haml index 0188837..a490f70 100644 --- a/src/app/views/catalogs/edit.html.haml +++ b/src/app/views/catalogs/edit.html.haml @@ -1,6 +1,6 @@ = render :partial => 'layouts/admin_nav' %header.page-header - #obj_actions.button-container + .obj_actions = link_to t('catalogs.new_catalog'), new_catalog_url, :class => 'button primary', :id => 'new_catalog_button' %h1.no-icon= @catalog.name diff --git a/src/app/views/catalogs/new.html.haml b/src/app/views/catalogs/new.html.haml index 22b716f..b6417ac 100644 --- a/src/app/views/catalogs/new.html.haml +++ b/src/app/views/catalogs/new.html.haml @@ -1,7 +1,7 @@ = render :partial => 'layouts/admin_nav' %header.page-header - #obj_actions + .obj_actions .return_to = t'return_to' = link_to t("catalogs.catalogs"), catalogs_path diff --git a/src/app/views/catalogs/show.html.haml b/src/app/views/catalogs/show.html.haml index d373b0f..b0d37e6 100644 --- a/src/app/views/catalogs/show.html.haml +++ b/src/app/views/catalogs/show.html.haml @@ -1,6 +1,6 @@ = render :partial => 'layouts/admin_nav' %header.page-header - #obj_actions.button-container + .obj_actions - if check_privilege(Privilege::CREATE, Catalog) = link_to t('catalogs.new_catalog'), new_catalog_url, :class => 'button primary', :id => 'new_catalog_button' .button-group diff --git a/src/app/views/deployables/_new_from_image.html.haml b/src/app/views/deployables/_new_from_image.html.haml index 9291f1e..beb4d42 100644 --- a/src/app/views/deployables/_new_from_image.html.haml +++ b/src/app/views/deployables/_new_from_image.html.haml @@ -35,7 +35,6 @@ .catalog_with_checkbox = check_box_tag 'catalog_id[]', catalog.id, @selected_catalogs.any?{|c| c.id == catalog.id} = catalog.name - .clear %fieldset.options.align-center = link_to t('deployables.form.cancel'), catalogs_path, :class => 'button danger' diff --git a/src/app/views/deployables/_section_header.html.haml b/src/app/views/deployables/_section_header.html.haml index 861a12d..35cc064 100644 --- a/src/app/views/deployables/_section_header.html.haml +++ b/src/app/views/deployables/_section_header.html.haml @@ -1,5 +1,5 @@ %header.page-header - #obj_actions.button-group + .obj_actions - if check_privilege(Privilege::CREATE, Deployable) = link_to "#{t'catalog_entries.new_catalog_entry'}", new_polymorphic_path([@catalog, Deployable]), :class => 'button primary', :id => 'new_catalog_entry_button' %h1.catalog_entries=t'catalog_entries.index.catalog_entries' diff --git a/src/app/views/deployables/show.html.haml b/src/app/views/deployables/show.html.haml index b8666e6..7ddb800 100644 --- a/src/app/views/deployables/show.html.haml +++ b/src/app/views/deployables/show.html.haml @@ -1,11 +1,11 @@ = render :partial => 'layouts/admin_nav' %header.page-header - #obj_actions.button-container + .obj_actions .button-group - if check_privilege(Privilege::MODIFY, @deployable) - = button_to t('.delete'), polymorphic_path([@catalog, @deployable]), :method => 'delete', :confirm => "#{t'catalog_entries.show.confirm_delete'}", :class => 'button danger', :id => 'delete' = link_to t('.edit'), edit_polymorphic_path([@catalog, @deployable]), :class => 'button', :id => 'edit_button' = link_to t('.edit_xml'), edit_polymorphic_path([@catalog, @deployable], :edit_xml => true), :class => 'button', :id => 'edit_xml_button' + = button_to t('.delete'), polymorphic_path([@catalog, @deployable]), :method => 'delete', :confirm => "#{t'catalog_entries.show.confirm_delete'}", :class => 'button danger', :id => 'delete' - launch_deployment_button_path = launch_time_params_deployments_path(:deployable_id => @deployable.id, :deployment => { :name => @deployable.name, :pool_id => @catalog.pool }) - if @catalog.present?&& @deployable_errors.empty?&& @pushed_count> 0 @@ -87,13 +87,13 @@ %section.content-section %header - %h2.catalogs= t('.catalogs') .section-controls = form_for(:catalog_entry, :url => catalog_entries_path) do |f| = f.label :catalog_id, t('.choose_catalog') = f.select :catalog_id, options_for_select(@catalogs_options.map {|c| [c.name, c.id]}) = f.hidden_field(:deployable_id, :value => @deployable.id) = f.submit t('.add_catalog'), :id => :add_catalog, :class => 'button pill', :disabled => @catalogs_options.empty? + %h2.catalogs= t('.catalogs') .content .centered %table.light_table diff --git a/src/app/views/deployments/_alerts_show.html.haml b/src/app/views/deployments/_alerts_show.html.haml index f850c6c..e208287 100644 --- a/src/app/views/deployments/_alerts_show.html.haml +++ b/src/app/views/deployments/_alerts_show.html.haml @@ -1,10 +1,11 @@ - if @failed_instances.count> 0 %section.content-section.alerts.collapse_entity %header - %h2=t 'alerts_label' - %span.label.badge.alert.count= @failed_instances.count .section-controls = link_to t("providers.edit.toggle_alerts"), "#", :class => 'collapse alerts' unless @statistics[:instances_failed].blank? + %h2.alerts + =t 'alerts_label' + %span.label.badge.alert.count= @failed_instances.count .content.collapsible %dl.alerts %ul diff --git a/src/app/views/deployments/_header_show.html.haml b/src/app/views/deployments/_header_show.html.haml index eb4ff67..46dc99f 100644 --- a/src/app/views/deployments/_header_show.html.haml +++ b/src/app/views/deployments/_header_show.html.haml @@ -1,6 +1,5 @@ %header.page-header - #obj_actions.button-container - .button-group - - if check_privilege(Privilege::MODIFY, @deployment) - = button_to t('delete'), deployment_path(@deployment), :method => :delete, :confirm => t("deployments.confirm_delete"), :class => "button danger", :id => 'delete' + .obj_actions + - if check_privilege(Privilege::MODIFY, @deployment) + = button_to t('delete'), deployment_path(@deployment), :method => :delete, :confirm => t("deployments.confirm_delete"), :class => "button danger", :id => 'delete' %h1.deployments= @title diff --git a/src/app/views/deployments/_launch_new.html.haml b/src/app/views/deployments/_launch_new.html.haml index bac7945..6cfce80 100644 --- a/src/app/views/deployments/_launch_new.html.haml +++ b/src/app/views/deployments/_launch_new.html.haml @@ -1,7 +1,7 @@ = if request.xhr? = render :partial => '/layouts/new_notification' %header.page-header - #obj_actions.button-container + .obj_actions = link_to t('cancel'), pool_path(@pool), :class => 'button danger', :id => 'cancel_deployment_button' %h1.deployments = @title diff --git a/src/app/views/deployments/launch_from_catalog.html.haml b/src/app/views/deployments/launch_from_catalog.html.haml index f38a600..cc2cf12 100644 --- a/src/app/views/deployments/launch_from_catalog.html.haml +++ b/src/app/views/deployments/launch_from_catalog.html.haml @@ -1,6 +1,6 @@ = render :partial => 'layouts/nav_history' %header.page-header - #obj_actions.button-container + .obj_actions = link_to t('edit'), edit_catalog_path(@catalog), :class => 'button', :id => 'edit_button' %h1.pools= @catalog.name diff --git a/src/app/views/deployments/show.html.haml b/src/app/views/deployments/show.html.haml index cbd0983..6006a55 100644 --- a/src/app/views/deployments/show.html.haml +++ b/src/app/views/deployments/show.html.haml @@ -4,6 +4,8 @@ = render :partial => 'alerts_show' %section.content-section %header#tab-container-1 + .section-controls + = pretty_filter_toggle(deployment_path(@deployment, :view => 'pretty', :page => params[:page]), deployment_path(@deployment, :view => 'filter', :page => params[:page])) %nav.faceted %ul#tab-container-1-nav - @tabs.each do |tab| @@ -13,10 +15,5 @@ = tab[:name] -if tab[:count] %span.label.badge.count.dark=tab[:count] - .section-controls - #obj_actions.button-container - .button-group - = pretty_filter_toggle(deployment_path(@deployment, :view => 'pretty', :page => params[:page]), - deployment_path(@deployment, :view => 'filter', :page => params[:page])) .content.collapsible.toggle-view.deployments#tab = render :partial => @view diff --git a/src/app/views/hardware_profiles/_form.html.haml b/src/app/views/hardware_profiles/_form.html.haml index 5b130b5..972cb69 100644 --- a/src/app/views/hardware_profiles/_form.html.haml +++ b/src/app/views/hardware_profiles/_form.html.haml @@ -1,23 +1,26 @@ - if @hardware_profile.errors.any? = render 'layouts/error_messages', :object => @hardware_profile -= hwp_form.label :name -= hwp_form.text_field :name -%table - %thead - %tr - - @header.each do |header| - %th - = header[:name] - - [:memory, :cpu, :storage, :architecture].each do |type| - = hwp_form.fields_for type do |hwpp_form| +%fieldset + = hwp_form.label :name, :class => 'em' + = hwp_form.text_field :name, :class => 'em' +%fieldset + %table + %thead %tr - %td= hwpp_form.text_field(:name, :readonly => "readonly") - %td= hwpp_form.text_field(:unit, :size => 5, :readonly => "readonly") - %td - -if type == :architecture - = hwpp_form.select("value", ["i386", "x86_64"], {}) - -else - = hwpp_form.text_field(:value) + - @header.each do |header| + %th + = header[:name] + - [:memory, :cpu, :storage, :architecture].each do |type| + = hwp_form.fields_for type do |hwpp_form| + %tr + %td= hwpp_form.text_field(:name, :readonly => "readonly") + %td= hwpp_form.text_field(:unit, :size => 5, :readonly => "readonly") + %td + -if type == :architecture + = hwpp_form.select("value", ["i386", "x86_64"], {}) + -else + = hwpp_form.text_field(:value) -= hwp_form.submit t('hardware_profiles.form.check_matches'), :class => 'danger button', :id => 'check_matches' -= hwp_form.submit t('save'), :class => 'submit button', :id => 'save_button' +%fieldset.options + = hwp_form.submit t('hardware_profiles.form.check_matches'), :class => 'danger button', :id => 'check_matches' + = hwp_form.submit t('save'), :class => 'submit button', :id => 'save_button' diff --git a/src/app/views/hardware_profiles/_section_header.html.haml b/src/app/views/hardware_profiles/_section_header.html.haml index 2ef093f..e5f40b5 100644 --- a/src/app/views/hardware_profiles/_section_header.html.haml +++ b/src/app/views/hardware_profiles/_section_header.html.haml @@ -1,4 +1,4 @@ %header.page-header - #obj_actions.button-group + .obj_actions = link_to t('hardware_profiles.list.new_hardware'), new_hardware_profile_url, :class => 'button primary', :id => 'new_hardware_profile_button' %h1.hardware_profiles=t'hardware_profiles.hardware_profiles' diff --git a/src/app/views/hardware_profiles/edit.html.haml b/src/app/views/hardware_profiles/edit.html.haml index 66219ad..306654f 100644 --- a/src/app/views/hardware_profiles/edit.html.haml +++ b/src/app/views/hardware_profiles/edit.html.haml @@ -1,18 +1,17 @@ = render :partial => 'layouts/admin_nav' %header.page-header - #obj_actions.button-container + .obj_actions = link_to t('hardware_profiles.list.new_hardware'), hardware_profile_url, :class => 'button primary', :id => 'new_user_button' - %div.button-group - = link_to t('hardware_profiles.edit.cancel_editing'), hardware_profile_path(@hardware_profile), :class => 'button pill danger', :id => 'new_user_button' + = link_to t('hardware_profiles.edit.cancel_editing'), hardware_profile_path(@hardware_profile), :class => 'button pill danger', :id => 'new_user_button' %h1.hardware_profiles= @title -%section.content-section.hardware_profile +%section.content-section %header %h2=t('hardware_profiles.edit.edit_hwp') .content - = form_for @hardware_profile, :url => hardware_profile_path(@hardware_profile), :html => { :multipart => true } do |hwp_form| + = form_for @hardware_profile, :url => hardware_profile_path(@hardware_profile), :html => { :multipart => true, :class => 'generic' } do |hwp_form| = render :partial => "form", :locals => { :hwp_form => hwp_form } = render :partial => 'matching_provider_hardware_profiles' if params[:commit] == 'Check Matches' diff --git a/src/app/views/hardware_profiles/new.html.haml b/src/app/views/hardware_profiles/new.html.haml index bedcda7..90d40f5 100644 --- a/src/app/views/hardware_profiles/new.html.haml +++ b/src/app/views/hardware_profiles/new.html.haml @@ -1,7 +1,7 @@ = render :partial => 'layouts/admin_nav' %header.page-header - #obj_actions + .obj_actions .return_to = t'return_to' = link_to t('hardware_profiles.hardware_profiles'), hardware_profiles_path diff --git a/src/app/views/hardware_profiles/show.html.haml b/src/app/views/hardware_profiles/show.html.haml index d89fe39..b2bbb83 100644 --- a/src/app/views/hardware_profiles/show.html.haml +++ b/src/app/views/hardware_profiles/show.html.haml @@ -1,6 +1,6 @@ = render :partial => 'layouts/admin_nav' %header.page-header - #obj_actions.button-container + .obj_actions - if check_privilege(Privilege::CREATE, HardwareProfile) = link_to t('hardware_profiles.list.new_hardware'), new_hardware_profile_url, :class => 'button primary', :id => 'new_role_button' .button-group diff --git a/src/app/views/images/edit_xml.html.haml b/src/app/views/images/edit_xml.html.haml index 4af44ec..a2b7ac7 100644 --- a/src/app/views/images/edit_xml.html.haml +++ b/src/app/views/images/edit_xml.html.haml @@ -1,6 +1,6 @@ = render :partial => 'layouts/admin_nav' %header.page-header - #obj_actions.button-container + .obj_actions .return_to = t :return_to = link_to t('images.environment', :environment => @environment.name), pool_family_path(@environment) diff --git a/src/app/views/images/import.html.haml b/src/app/views/images/import.html.haml index 9fdb103..ec5b3ac 100644 --- a/src/app/views/images/import.html.haml +++ b/src/app/views/images/import.html.haml @@ -1,6 +1,6 @@ = render :partial => 'layouts/admin_nav' %header.page-header - #obj_actions.button-container + .obj_actions.button-container .return_to = t :return_to = link_to t('images.environment', :environment => @environment.name), pool_family_path(@environment) diff --git a/src/app/views/images/new.html.haml b/src/app/views/images/new.html.haml index 59761e5..daf34bf 100644 --- a/src/app/views/images/new.html.haml +++ b/src/app/views/images/new.html.haml @@ -1,6 +1,6 @@ = render :partial => 'layouts/admin_nav' %header.page-header - #obj_actions.button-container + .obj_actions .return_to = t(:return_to) = link_to t('images.environment', :environment => @environment.name), pool_family_path(@environment) @@ -18,7 +18,6 @@ %a{ :href => '#image-file-form', :class => 'active'}= t('.upload') %li %a{ :href => '#image-url-form'}= t('.from_url') - .clear %section#image-file-form = form_tag(edit_xml_images_path, { :multipart => true, :class => 'generic horizontal' }) do diff --git a/src/app/views/images/overview.html.haml b/src/app/views/images/overview.html.haml index 0e0f70c..4d606b9 100644 --- a/src/app/views/images/overview.html.haml +++ b/src/app/views/images/overview.html.haml @@ -1,6 +1,6 @@ = render :partial => 'layouts/admin_nav' %header.page-header - #obj_actions.button-container + .obj_actions .return_to = t :return_to = link_to t('images.environment', :environment => @environment.name), pool_family_path(@environment) diff --git a/src/app/views/images/show.html.haml b/src/app/views/images/show.html.haml index 4ef868d..57385e4 100644 --- a/src/app/views/images/show.html.haml +++ b/src/app/views/images/show.html.haml @@ -1,6 +1,6 @@ = render :partial => 'layouts/admin_nav' %header.page-header - #obj_actions.button-container.images + .obj_actions .return_to =t'return_to' = link_to t('images.index.images'), images_path @@ -24,17 +24,16 @@ %section.content-section %header - %h2= t('.provider_images') .section-controls - if @builds.any? - = t'.view_build' + %span= t'.view_build' - if user_can_build = form_tag image_path(@image.id), :method => :get do = select_tag :build, options_for_build_select(@builds, @build, @latest_build) = submit_tag t('.select_build'), :id => 'select_build_button' - if user_can_build - if @image.imported? - = t('.can_not_build_imported_image') + %span= t('.can_not_build_imported_image') -else - if @builds.any? - build_text = '.rebuild' @@ -46,13 +45,14 @@ #push-all-btn - if @build&& @build.id == @latest_build&& @target_image_exists = button_to t('.push_all'), push_all_image_path(@image.id, :build_id => @build.id), :class => 'button pill' + %h2= t('.provider_images') .content - if @account_groups_listing.present? %ul.image_builds - @account_groups_listing.each do |driver, group| - timg = @target_images_by_target[driver] - %li + %li.clearfix %dl %dt .build-actions @@ -120,7 +120,6 @@ = button_to "", image_provider_image_path(@image.id, pimg.id), :method => :delete, :class => 'delete_image' - else - .clear - else .centered.align-center %strong= t("images.flash.error.no_provider_accounts") diff --git a/src/app/views/layouts/_admin_content_tabs.html.haml b/src/app/views/layouts/_admin_content_tabs.html.haml index 6f55e04..5e89f29 100644 --- a/src/app/views/layouts/_admin_content_tabs.html.haml +++ b/src/app/views/layouts/_admin_content_tabs.html.haml @@ -8,6 +8,5 @@ = tab[:name] -if tab[:count] %span.label.badge.count.dark=tab[:count] - .clear .content#tab = render :partial => 'list' diff --git a/src/app/views/layouts/_admin_users_tabs.html.haml b/src/app/views/layouts/_admin_users_tabs.html.haml index 6f55e04..5e89f29 100644 --- a/src/app/views/layouts/_admin_users_tabs.html.haml +++ b/src/app/views/layouts/_admin_users_tabs.html.haml @@ -8,6 +8,5 @@ = tab[:name] -if tab[:count] %span.label.badge.count.dark=tab[:count] - .clear .content#tab = render :partial => 'list' diff --git a/src/app/views/layouts/_filter_table.html.haml b/src/app/views/layouts/_filter_table.html.haml index 7fbaf75..83ef88b 100644 --- a/src/app/views/layouts/_filter_table.html.haml +++ b/src/app/views/layouts/_filter_table.html.haml @@ -8,7 +8,6 @@ - if content_for? form_header %ul.actions = yield form_header - .clear %table.flat.checkbox_table{ 'data-none_selected' => t("default_none_selected_message"), 'data-confirm' => t("default_confirm_message") } %thead @@ -24,7 +23,7 @@ = rows.collect {|row| capture_haml(row,&block)}.to_s.html_safe - if content_for? form_footer - %ul.obj_actions + %fieldset.options = yield form_footer - if rows.is_a?(WillPaginate::Collection) diff --git a/src/app/views/layouts/_pretty_filter_toggle.html.haml b/src/app/views/layouts/_pretty_filter_toggle.html.haml index 3ccb45b..73a2719 100644 --- a/src/app/views/layouts/_pretty_filter_toggle.html.haml +++ b/src/app/views/layouts/_pretty_filter_toggle.html.haml @@ -1,5 +1,3 @@ %span.view-toggle - %a.view-toggle.pretty#pretty_view{:href => pretty_link, :class => (filter_view? ? '' : 'active')} - %span Graphic View - %a.view-toggle.filter#filter_view{:href => filter_link, :class => (filter_view? ? 'active' : '')} - %span Filter View + %a.view-toggle.pretty#pretty_view{:href => pretty_link, :class => (filter_view? ? '' : 'active'), :title => "Pretty view"} + %a.view-toggle.filter#filter_view{:href => filter_link, :class => (filter_view? ? 'active' : ''), :title => "Filter view"} diff --git a/src/app/views/layouts/_tabpanel.html.haml b/src/app/views/layouts/_tabpanel.html.haml index 657c5bc..b603893 100644 --- a/src/app/views/layouts/_tabpanel.html.haml +++ b/src/app/views/layouts/_tabpanel.html.haml @@ -1,17 +1,16 @@ -%section.content-section - %header#tab-container-1 - %nav.faceted - %ul#tab-container-1-nav - - @tabs.each do |tab| - %li - %a{ :href => url_for(:details_tab => tab[:id], :view => "filter", :only_tab => true), - :id => "details_#{tab[:id]}", :class => "#{'active' if @details_tab[:id] == tab[:id]}", - 'data-pretty_view_toggle' => tab[:pretty_view_toggle] } - = tab[:name] - .section-controls - -#%a.collapse{'href'=>'#'} Collapse - .content.collapsible#tab - = render :partial => @details_tab[:view] +%header#tab-container-1 + .section-controls + -#%a.collapse{'href'=>'#'} Collapse + %nav.faceted + %ul#tab-container-1-nav + - @tabs.each do |tab| + %li + %a{ :href => url_for(:details_tab => tab[:id], :view => "filter", :only_tab => true), + :id => "details_#{tab[:id]}", :class => "#{'active' if @details_tab[:id] == tab[:id]}", + 'data-pretty_view_toggle' => tab[:pretty_view_toggle] } + = tab[:name] +.content.collapsible#tab + = render :partial => @details_tab[:view] :javascript $(document).ready(function() { diff --git a/src/app/views/layouts/application.html.haml b/src/app/views/layouts/application.html.haml index 93d3198..5450a6a 100644 --- a/src/app/views/layouts/application.html.haml +++ b/src/app/views/layouts/application.html.haml @@ -6,12 +6,8 @@ = t("layout.appname") = "| #{@title}" unless @title.blank? %link{:rel => 'shortcut icon', :href => '/favicon.ico'} - = stylesheet_link_tag '/stylesheets/reset.css' - = stylesheet_link_tag '/stylesheets/960.css' - = stylesheet_link_tag '/stylesheets/buttons.css' = stylesheet_link_tag '/stylesheets/compiled/layout.css' = stylesheet_link_tag 'jquery.ui-1.8.1/jquery-ui-1.8.1.custom.css' - = stylesheet_link_tag '/stylesheets/compiled/header.css' /[if lt IE 9] = javascript_include_tag 'http://html5shiv.googlecode.com/svn/trunk/html5.js' /[if lt IE 8] @@ -60,7 +56,6 @@ #content = render :partial => '/layouts/new_notification' if flash.present? or content_for?(:error_messages) = yield - .clear %footer.standard .container %span.copyright!= t('layout.copyright') diff --git a/src/app/views/permissions/_form.html.haml b/src/app/views/permissions/_form.html.haml index 187cdfa..7b401aa 100644 --- a/src/app/views/permissions/_form.html.haml +++ b/src/app/views/permissions/_form.html.haml @@ -2,8 +2,8 @@ = hidden_field_tag :permission_object_type, @permission_object.class.name = hidden_field_tag :permission_object_id, @permission_object.id = hidden_field_tag :path_prefix, @path_prefix - %li= restful_submit_tag t('permissions.form.grant_access'), "create", permissions_path, 'POST', :id => 'save_button', :class => 'button' - %li= link_to t('cancel'), @return_path, :class => 'button danger' + = link_to t('cancel'), @return_path, :class => 'button danger' + = restful_submit_tag t('permissions.form.grant_access'), "create", permissions_path, 'POST', :id => 'save_button', :class => 'button' = filter_table(@header, @users) do |user| %tr{:class => cycle('nostripe','stripe')} %td diff --git a/src/app/views/permissions/_new.html.haml b/src/app/views/permissions/_new.html.haml index e508363..0547e1e 100644 --- a/src/app/views/permissions/_new.html.haml +++ b/src/app/views/permissions/_new.html.haml @@ -1,5 +1,5 @@ %header.page-header - #obj_actions.button-group + .obj_actions .return_to = t'return_to' = link_to @return_text, @return_path, :id => 'new_pool_button' diff --git a/src/app/views/pool_families/_list.html.haml b/src/app/views/pool_families/_list.html.haml index 55006a1..cb590f3 100644 --- a/src/app/views/pool_families/_list.html.haml +++ b/src/app/views/pool_families/_list.html.haml @@ -1,9 +1,8 @@ %header - %h2.pools= @title .section-controls - #obj_actions - - if check_privilege(Privilege::CREATE, PoolFamily) - = link_to t("pool_families.index.new_pool_family"), new_pool_family_path, :class => 'button pill', :id => 'new_pool_family_button' + - if check_privilege(Privilege::CREATE, PoolFamily) + = link_to t("pool_families.index.new_pool_family"), new_pool_family_path, :class => 'button pill', :id => 'new_pool_family_button' + %h2.pools= @title .content - @pool_families.each do |pool_family| @@ -15,11 +14,10 @@ %h2 = link_to pool_family.name, pool_family .section-controls - #obj_actions - = link_to t("pools.new_pool"), new_pool_path(:pool_family_id => pool_family.id), :class => 'pool_family_button' - - if pool_family.pools.any? - = link_to t("images.import.import_image"), new_image_path(:environment => pool_family.id, :tab => 'import'), :class => 'new_image_button' - = link_to t("images.new.new_image"), new_image_path( :environment => pool_family.id), :class => 'new_image_button' + = link_to t("pools.new_pool"), new_pool_path(:pool_family_id => pool_family.id), :class => 'pool_family_button' + - if pool_family.pools.any? + = link_to t("images.import.import_image"), new_image_path(:environment => pool_family.id, :tab => 'import'), :class => 'new_image_button' + = link_to t("images.new.new_image"), new_image_path( :environment => pool_family.id), :class => 'new_image_button' - unless pool_family.pools.blank? %tr %th= t("pool_families.index.pool_name") diff --git a/src/app/views/pool_families/_section_header.html.haml b/src/app/views/pool_families/_section_header.html.haml index eab1a6c..a36c83e 100644 --- a/src/app/views/pool_families/_section_header.html.haml +++ b/src/app/views/pool_families/_section_header.html.haml @@ -1,4 +1,4 @@ %header.page-header - #obj_actions.button-group + .obj_actions = link_to 'New Pool Family', new_pool_family_url, :class => 'button primary', :id => 'new_pool_family_button' %h1.pool_families Pool Families diff --git a/src/app/views/pool_families/add_provider_accounts.html.haml b/src/app/views/pool_families/add_provider_accounts.html.haml index 2ca766e..95e5174 100644 --- a/src/app/views/pool_families/add_provider_accounts.html.haml +++ b/src/app/views/pool_families/add_provider_accounts.html.haml @@ -1,15 +1,14 @@ = render :partial => 'layouts/admin_nav' %header.page-header - #obj_actions.button-container + .obj_actions .return_to = t'return_to' = link_to @pool_family.name, pool_family_path(@pool_family, :details_tab => 'provider_accounts'), :id => 'new_pool_button' %h1.pool_families= @pool_family.name %section.content-section.pool_families - %h3= t("pool_families.choose_provider_accounts") - %header#tab-container-1 - %h2.settings= #t("settings.settings") - %nav.faceted - .content#tab + %header + .align-center + %strong= t("pool_families.choose_provider_accounts") + .content = render :partial => 'add_provider_accounts_form' diff --git a/src/app/views/pool_families/edit.html.haml b/src/app/views/pool_families/edit.html.haml index e69cda6..244660a 100644 --- a/src/app/views/pool_families/edit.html.haml +++ b/src/app/views/pool_families/edit.html.haml @@ -1,7 +1,7 @@ = render :partial => 'layouts/admin_nav' %header.page-header - #obj_actions + .obj_actions .return_to = t("return_to") = link_to t("pool_families.new.environments"), pool_families_path diff --git a/src/app/views/pool_families/new.html.haml b/src/app/views/pool_families/new.html.haml index 9cf6bbf..8a219d1 100644 --- a/src/app/views/pool_families/new.html.haml +++ b/src/app/views/pool_families/new.html.haml @@ -1,6 +1,6 @@ = render :partial => 'layouts/admin_nav' %header.page-header - #obj_actions + .obj_actions .return_to = t("return_to") = link_to t("pool_families.new.environments"), pool_families_path diff --git a/src/app/views/pool_families/show.html.haml b/src/app/views/pool_families/show.html.haml index 03318a5..a95af93 100644 --- a/src/app/views/pool_families/show.html.haml +++ b/src/app/views/pool_families/show.html.haml @@ -1,6 +1,6 @@ = render :partial => 'layouts/admin_nav' %header.page-header - #obj_actions.button-container + .obj_actions .button-group = link_to t('edit'), edit_pool_family_path(@pool_family), :class => 'button pill' = button_to t('delete'), pool_family_path(@pool_family), :method => :delete, :confirm => t("pool_families.confirm_delete"), :class => "button pill danger", :id => 'delete_pool_family_button' @@ -17,6 +17,5 @@ = tab[:name] -if tab[:count] %span.label.badge.count.dark=tab[:count] - .clear .content#tab = render :partial => @view diff --git a/src/app/views/pools/_alerts_index.html.haml b/src/app/views/pools/_alerts_index.html.haml index 2831e81..29cbbd9 100644 --- a/src/app/views/pools/_alerts_index.html.haml +++ b/src/app/views/pools/_alerts_index.html.haml @@ -1,10 +1,11 @@ - if @statistics[:instances_failed_count]> 0 %section.content-section.alerts.collapse_entity %header - %h2=t "alerts_label" - %span.label.badge.alert.count= @statistics[:instances_failed_count] .section-controls = link_to t("providers.edit.toggle_alerts"), "#", :class => 'collapse alerts' unless @statistics[:instances_failed].blank? + %h2.alerts + =t "alerts_label" + %span.label.badge.alert.count= @statistics[:instances_failed_count] .content.collapsible %dl.alerts %ul diff --git a/src/app/views/pools/_alerts_show.html.haml b/src/app/views/pools/_alerts_show.html.haml index 1f9865e..4807e8f 100644 --- a/src/app/views/pools/_alerts_show.html.haml +++ b/src/app/views/pools/_alerts_show.html.haml @@ -1,10 +1,11 @@ - if @statistics[:instances_failed_visible_count]> 0 %section.content-section.alerts.collapse_entity %header - %h2=t 'alerts_label' - %span.label.badge.alert.count= @statistics[:instances_failed_visible_count] .section-controls = link_to t("providers.edit.toggle_alerts"), "#", :class => 'collapse alerts' unless @statistics[:instances_failed].blank? + %h2.alerts + =t 'alerts_label' + %span.label.badge.alert.count= @statistics[:instances_failed_visible_count] .content.collapsible %dl.alerts %ul diff --git a/src/app/views/pools/_edit.html.haml b/src/app/views/pools/_edit.html.haml index 8849e42..17b33fe 100644 --- a/src/app/views/pools/_edit.html.haml +++ b/src/app/views/pools/_edit.html.haml @@ -1,5 +1,5 @@ %header.page-header - #obj_actions.button-container + .obj_actions - if check_privilege(Privilege::CREATE, Pool) = link_to t('pools.new_pool'), new_pool_url, :class => 'button primary', :id => 'new_pool_button' %h1.pools= @pool.name @@ -9,4 +9,4 @@ %h2= @title .content - = render :partial => 'form' + = render :partial => 'form' \ No newline at end of file diff --git a/src/app/views/pools/_form.html.haml b/src/app/views/pools/_form.html.haml index b93298b..94fa0cd 100644 --- a/src/app/views/pools/_form.html.haml +++ b/src/app/views/pools/_form.html.haml @@ -11,7 +11,7 @@ - if @pool_families = form.collection_select :pool_family_id, @pool_families, :id, :name - else - = form.label :pool_family_id, @pool.pool_family.name + %span.text_instead_input= @pool.pool_family.name = hidden_field_tag 'pool[pool_family_id]', @pool.pool_family_id .field = label_tag :quota, t('quota') diff --git a/src/app/views/pools/_header_index.html.haml b/src/app/views/pools/_header_index.html.haml index 702562a..5735208 100644 --- a/src/app/views/pools/_header_index.html.haml +++ b/src/app/views/pools/_header_index.html.haml @@ -1,5 +1,5 @@ %header.page-header - #obj_actions.button-container + .obj_actions .button-group = pretty_filter_toggle(pools_path(:view => 'pretty', :page => params[:page]), pools_path(:view => 'filter', :page => params[:page])) .button-group @@ -7,4 +7,4 @@ = link_to t('pools.new_pool'), new_pool_path, { :class => 'button primary', :id => 'new_pool_button' } %h1.section-index= t 'pools.index.overview' -= render :partial => 'scoreboard_index' += render :partial => 'scoreboard_index' \ No newline at end of file diff --git a/src/app/views/pools/_header_show.html.haml b/src/app/views/pools/_header_show.html.haml index b20fc18..cd0d54a 100644 --- a/src/app/views/pools/_header_show.html.haml +++ b/src/app/views/pools/_header_show.html.haml @@ -1,11 +1,11 @@ %header.page-header - #obj_actions.button-container + .obj_actions - if check_privilege(Privilege::CREATE, Deployment, @pool) = link_to t('deployments.new_deployment'), launch_new_deployments_path(:pool_id => @pool.id), :class => 'button primary', :id => 'new_deployment_button' %div.catalog_link = render :partial => 'layouts/catalog_dropdown', :locals => {:catalogs => @pool.catalogs} .button-group - if check_privilege(Privilege::MODIFY, @pool) - = link_to t('edit'), edit_pool_path(@pool), :class => 'button', :id => 'edit_pool_button' - = button_to t('delete'), pool_path(@pool), :method => :delete, :confirm => t('pools.index.confirm_delete'), :class => "button danger", :id => 'delete_pool_button' + = link_to t('edit'), edit_pool_path(@pool), :class => 'button pill', :id => 'edit_pool_button' + = button_to t('delete'), pool_path(@pool), :method => :delete, :confirm => t('pools.index.confirm_delete'), :class => "button pill danger", :id => 'delete_pool_button' %h1.pools= @title diff --git a/src/app/views/pools/show.html.haml b/src/app/views/pools/show.html.haml index b593c7d..882089b 100644 --- a/src/app/views/pools/show.html.haml +++ b/src/app/views/pools/show.html.haml @@ -5,6 +5,8 @@ %section.content-section %header#tab-container-1 + .section-controls + = pretty_filter_toggle(pool_path(@pool, :view => 'pretty', :details_tab => @details_tab[:id], :page => params[:page]), pool_path(@pool, :view => 'filter', :details_tab => @details_tab[:id], :page => params[:page])) %nav.faceted %ul#tab-container-1-nav - @tabs.each do |tab| @@ -13,10 +15,5 @@ = tab[:name] -if tab[:count] %span.label.badge.count.dark=tab[:count] - .section-controls - #obj_actions.button-container - .button-group - = pretty_filter_toggle(pool_path(@pool, :view => 'pretty', :details_tab => @details_tab[:id], :page => params[:page]), - pool_path(@pool, :view => 'filter', :details_tab => @details_tab[:id], :page => params[:page])) .content.collapsible.toggle-view.pools#tab = render :partial => @view diff --git a/src/app/views/provider_accounts/_section_header.html.haml b/src/app/views/provider_accounts/_section_header.html.haml index 1fe8cad..ca4d25d 100644 --- a/src/app/views/provider_accounts/_section_header.html.haml +++ b/src/app/views/provider_accounts/_section_header.html.haml @@ -1,4 +1,4 @@ %header.page-header - #obj_actions.button-group + .obj_actions = link_to t('provider_accounts.new.new_provider_account'), new_provider_account_url, :class => 'button primary', :id => 'new_provider_account_button' %h1.provider_accounts= t'provider_accounts.index.provider_accounts' diff --git a/src/app/views/provider_accounts/edit.html.haml b/src/app/views/provider_accounts/edit.html.haml index b3b0849..f2ce8a2 100644 --- a/src/app/views/provider_accounts/edit.html.haml +++ b/src/app/views/provider_accounts/edit.html.haml @@ -1,6 +1,6 @@ = render :partial => 'layouts/admin_nav' %header.page-header - #obj_actions + .obj_actions .return_to =t'return_to' = link_to t('provider_accounts.new.cloud_providers'), edit_provider_path(@provider, :details_tab => 'accounts') diff --git a/src/app/views/provider_accounts/new.html.haml b/src/app/views/provider_accounts/new.html.haml index b7c05be..b350d52 100644 --- a/src/app/views/provider_accounts/new.html.haml +++ b/src/app/views/provider_accounts/new.html.haml @@ -1,6 +1,6 @@ = render :partial => 'layouts/admin_nav' %header.page-header - #obj_actions + .obj_actions .return_to = t'return_to' = link_to t('provider_accounts.new.cloud_providers'), edit_provider_path(@provider, :details_tab => 'accounts') diff --git a/src/app/views/provider_accounts/show.html.haml b/src/app/views/provider_accounts/show.html.haml index 72b753b..a46ec37 100644 --- a/src/app/views/provider_accounts/show.html.haml +++ b/src/app/views/provider_accounts/show.html.haml @@ -1,6 +1,6 @@ = render :partial => 'layouts/admin_nav' %header.page-header - #obj_actions + .obj_actions .return_to =t'return_to' = link_to t('provider_accounts.new.cloud_providers'), edit_provider_path(@provider, :details_tab => 'accounts') diff --git a/src/app/views/provider_realms/_section_header.html.haml b/src/app/views/provider_realms/_section_header.html.haml index 8aea23e..c4b6121 100644 --- a/src/app/views/provider_realms/_section_header.html.haml +++ b/src/app/views/provider_realms/_section_header.html.haml @@ -1,4 +1,4 @@ %header.page-header - #obj_actions.button-group + .obj_actions = link_to t('realms.new_realm'), new_realm_url, :class => 'button primary', :id => 'new_realm_button' %h1.realms Realms diff --git a/src/app/views/provider_realms/show.html.haml b/src/app/views/provider_realms/show.html.haml index a6fa471..d9c414b 100644 --- a/src/app/views/provider_realms/show.html.haml +++ b/src/app/views/provider_realms/show.html.haml @@ -1,6 +1,6 @@ = render :partial => 'layouts/admin_nav' %header.page-header - #obj_actions.button_container + .obj_actions .return_to = t('return_to') = link_to t('provider_realms.provider_realms'), edit_provider_path(@realm.provider, :details_tab => 'realms', :only_tab => true), :id => 'back_to_provider_realms_button' diff --git a/src/app/views/providers/_section_header.html.haml b/src/app/views/providers/_section_header.html.haml index 039e3cf..c7d6ce9 100644 --- a/src/app/views/providers/_section_header.html.haml +++ b/src/app/views/providers/_section_header.html.haml @@ -1,5 +1,5 @@ %header.page-header - #obj_actions + .obj_actions %span.label.light= t("providers.choose_a_provider") %ul#provider_select %li diff --git a/src/app/views/providers/edit.html.haml b/src/app/views/providers/edit.html.haml index 241ef55..90277c2 100644 --- a/src/app/views/providers/edit.html.haml +++ b/src/app/views/providers/edit.html.haml @@ -11,14 +11,14 @@ = t("providers.edit.enable_configure_providers") = image_tag "provider_enable_hint.png" -%section.content-section.alerts.collapse_entity - %header - %h2.alerts - = t("alerts_label") - %span.label.badge.count.alert= @alerts.count - .section-controls - = link_to t("providers.edit.toggle_alerts"), "#", :class => 'collapse alerts' unless @alerts.blank? - - unless @alerts.blank? +- unless @alerts.blank? + %section.content-section.alerts.collapse_entity + %header + .section-controls + = link_to t("providers.edit.toggle_alerts"), "#", :class => 'collapse alerts' unless @alerts.blank? + %h2.alerts + = t("alerts_label") + %span.label.badge.count.alert= @alerts.count .content.collapsible %dl.alerts %ul diff --git a/src/app/views/providers/new.html.haml b/src/app/views/providers/new.html.haml index e98e58e..bcac552 100644 --- a/src/app/views/providers/new.html.haml +++ b/src/app/views/providers/new.html.haml @@ -1,6 +1,6 @@ = render :partial => 'layouts/admin_nav' %header.page-header - #obj_actions + .obj_actions %span.label.light Choose a provider: %ul#provider_select %li diff --git a/src/app/views/realms/_section_header.html.haml b/src/app/views/realms/_section_header.html.haml index 8aea23e..c4b6121 100644 --- a/src/app/views/realms/_section_header.html.haml +++ b/src/app/views/realms/_section_header.html.haml @@ -1,4 +1,4 @@ %header.page-header - #obj_actions.button-group + .obj_actions = link_to t('realms.new_realm'), new_realm_url, :class => 'button primary', :id => 'new_realm_button' %h1.realms Realms diff --git a/src/app/views/realms/edit.html.haml b/src/app/views/realms/edit.html.haml index b051543..d1564a3 100644 --- a/src/app/views/realms/edit.html.haml +++ b/src/app/views/realms/edit.html.haml @@ -1,10 +1,9 @@ = render :partial => 'layouts/admin_nav' %header.page-header - #obj_actions.button-container + .obj_actions = link_to t('realms.new_realm'), new_realm_url, :class => 'button primary', :id => 'new_user_button' - %div.button-group - = link_to t('realms.edit.cancel_editing'), realm_path(@realm), :class => 'button pill danger', :id => 'new_user_button' + = link_to t('realms.edit.cancel_editing'), realm_path(@realm), :class => 'button pill danger', :id => 'new_user_button' %h1.realms= @title %section.content-section.realm diff --git a/src/app/views/realms/new.html.haml b/src/app/views/realms/new.html.haml index 990b07c..539d7c3 100644 --- a/src/app/views/realms/new.html.haml +++ b/src/app/views/realms/new.html.haml @@ -1,6 +1,6 @@ = render :partial => 'layouts/admin_nav' %header.page-header - #obj_actions + .obj_actions .return_to =t'return_to' = link_to t('realms.realms'), realms_path diff --git a/src/app/views/realms/show.html.haml b/src/app/views/realms/show.html.haml index b0f8b44..5823a0b 100644 --- a/src/app/views/realms/show.html.haml +++ b/src/app/views/realms/show.html.haml @@ -1,6 +1,6 @@ = render :partial => 'layouts/admin_nav' %header.page-header - #obj_actions.button-container + .obj_actions .return_to =t'return_to' = link_to t('realms.realms'), realms_path diff --git a/src/app/views/roles/_form.html.haml b/src/app/views/roles/_form.html.haml index ff8475f..8edae18 100644 --- a/src/app/views/roles/_form.html.haml +++ b/src/app/views/roles/_form.html.haml @@ -1,8 +1,10 @@ - if @role.errors.any? = render 'layouts/error_messages', :object => @role %fieldset - = form.label :name - = form.text_field :name, :class => "em long" + .field + = form.label :name, :class => 'em' + .input + = form.text_field :name, :class => "em long" %fieldset.options - = form.submit t('save'), :class => "submit button" - = link_to t(:cancel), roles_path, :class => 'button button' + = form.submit t('save'), :class => "button" + = link_to t(:cancel), roles_path, :class => 'button danger' diff --git a/src/app/views/roles/_section_header.html.haml b/src/app/views/roles/_section_header.html.haml index c1b2ae5..9cbfe88 100644 --- a/src/app/views/roles/_section_header.html.haml +++ b/src/app/views/roles/_section_header.html.haml @@ -1,4 +1,4 @@ %header.page-header - #obj_actions.button-group + .obj_actions = link_to t('roles.new_role'), new_role_url, :class => 'button primary', :id => 'new_role_button' %h1.no-icon Roles diff --git a/src/app/views/roles/edit.html.haml b/src/app/views/roles/edit.html.haml index d3c175d..04cff39 100644 --- a/src/app/views/roles/edit.html.haml +++ b/src/app/views/roles/edit.html.haml @@ -1,20 +1,16 @@ = render :partial => 'layouts/admin_nav' %header.page-header - #obj_actions.button-container + .obj_actions = link_to t('roles.new_role'), new_role_url, :class => 'button primary', :id => 'new_role_button' - %div.button-group - = link_to t('roles.edit.cancel_editing'), role_path(@role), :class => 'button pill danger', :id => 'new_role_button' + = link_to t('roles.edit.cancel_editing'), role_path(@role), :class => 'button pill danger', :id => 'new_role_button' %h1.no-icon= @role.name.titlecase %section.content-section.role %header - %h2=t'roles.edit.properties' - - .content - if check_privilege(Privilege::MODIFY, Role) %h2=t('roles.edit.editing_role') + "#{@role.name}" - else %h2=t('roles.edit.editing_role') - + .content = form_for @role, :url => role_path(@role), :html => { :method => :put, :class => 'generic horizontal' } do |f| = render :partial => "form", :locals => { :form => f } diff --git a/src/app/views/roles/show.html.haml b/src/app/views/roles/show.html.haml index 98b61b5..a58c4b1 100644 --- a/src/app/views/roles/show.html.haml +++ b/src/app/views/roles/show.html.haml @@ -1,6 +1,6 @@ = render :partial => 'layouts/admin_nav' %header.page-header - #obj_actions.button-container + .obj_actions = link_to t('roles.new_role'), new_role_url, :class => 'button primary', :id => 'new_role_button' .button-group = link_to t('edit'), edit_role_path(@role), :class => 'button pill' diff --git a/src/app/views/settings/index.html.haml b/src/app/views/settings/index.html.haml index 2e7761f..d0484ca 100644 --- a/src/app/views/settings/index.html.haml +++ b/src/app/views/settings/index.html.haml @@ -2,14 +2,10 @@ = render :partial => 'section_header' %section.content-section.settings + %header + %h2= t('.permissions') .content - %ul.tiles{:class => 'container_16'} - - if check_privilege(Privilege::MODIFY) - %li#permissions.grid_8 - = image_tag "blnk.png", :class => "icon", :alt => "" - %h2 - = t('.permissions') - %p - = t('.permissions_desc') - = link_to t(:continue), self_service_settings_path, :class => 'button' - .clear + - if check_privilege(Privilege::MODIFY) + %p + = t('.permissions_desc') + = link_to t(:continue), self_service_settings_path, :class => 'button pill' diff --git a/src/app/views/settings/self_service.html.haml b/src/app/views/settings/self_service.html.haml index c623896..7194c58 100644 --- a/src/app/views/settings/self_service.html.haml +++ b/src/app/views/settings/self_service.html.haml @@ -1,6 +1,6 @@ = render :partial => 'layouts/admin_nav' %header.page-header - #obj_actions.button-group + .obj_actions .return_to = t 'return_to' = link_to "Settings", settings_path @@ -20,6 +20,6 @@ %label= t('.instances_quota') = text_field :self_service_default_quota, :maximum_running_instances, :class => 'grid_5' %fieldset.options - #obj_actions.button-group + .obj_actions.button-group = link_to t('reset'), self_service_settings_path, :class => 'button pill' = submit_tag t(:save), :class => "button pill" diff --git a/src/app/views/users/_list.html.haml b/src/app/views/users/_list.html.haml index 5978181..6d6cc51 100644 --- a/src/app/views/users/_list.html.haml +++ b/src/app/views/users/_list.html.haml @@ -1,11 +1,9 @@ %header %h2#users.users= @title - .section-controls - #obj_actions - = link_to "", new_user_path, :class => 'add-user-button', :id => 'add_user_button' - content_for :form_header do %li= restful_submit_tag "#{t'users.list.delete_selected'}", "destroy", multi_destroy_users_path, 'DELETE', :id => 'delete_button', :class => 'button danger' + %li= link_to t("users.list.add_user"), new_user_path, :class => 'button', :id => 'add_user_button' - content_for :filter_controls do %li diff --git a/src/app/views/users/_section_header.html.haml b/src/app/views/users/_section_header.html.haml index 73a64a1..c798674 100644 --- a/src/app/views/users/_section_header.html.haml +++ b/src/app/views/users/_section_header.html.haml @@ -1,5 +1,5 @@ %header.page-header - #obj_actions + .obj_actions .return_to =t'users.quick_jump' = link_to 'Groups', "#groups" diff --git a/src/app/views/users/edit.html.haml b/src/app/views/users/edit.html.haml index 619bf93..f19fb48 100644 --- a/src/app/views/users/edit.html.haml +++ b/src/app/views/users/edit.html.haml @@ -1,6 +1,6 @@ = render :partial => 'layouts/admin_nav' %header.page-header - #obj_actions + .obj_actions .return_to =t'users.return_to' = link_to "#{t'users.users'}", users_path diff --git a/src/app/views/users/new.html.haml b/src/app/views/users/new.html.haml index f6e1ce7..b1b4b5f 100644 --- a/src/app/views/users/new.html.haml +++ b/src/app/views/users/new.html.haml @@ -1,6 +1,6 @@ = render :partial => 'layouts/admin_nav' %header.page-header - #obj_actions + .obj_actions .return_to =t'return_to' = link_to "#{t'users.users'}", users_path diff --git a/src/app/views/users/show.html.haml b/src/app/views/users/show.html.haml index 16a7118..aa9ca5b 100644 --- a/src/app/views/users/show.html.haml +++ b/src/app/views/users/show.html.haml @@ -1,7 +1,7 @@ = render :partial => 'layouts/admin_nav' %header.page-header - if check_privilege(Privilege::VIEW, User) - #obj_actions + .obj_actions .return_to =t'return_to' = link_to t('users.users'), users_path @@ -17,11 +17,10 @@ %dd= @user.email %dt=t'users.show.username' %dd= @user.login - #obj_actions.button-group + .button-group = link_to "#{t('users.show.edit')}", edit_user_path(@user), :class => 'button' - unless @user.id == current_user.id = button_to "#{t('users.show.delete')}", user_path(@user), :method => :delete, :confirm => t('users.confirm_delete'), :class => "button danger" - .clear %dl.user_stats %ul %div @@ -44,7 +43,6 @@ %li %dt=t'users.show.last_login_ip' %dd= @user.last_login_ip - .clear /%section.content-section.user / %header diff --git a/src/config/locales/en.yml b/src/config/locales/en.yml index f6d3623..6bee3f4 100644 --- a/src/config/locales/en.yml +++ b/src/config/locales/en.yml @@ -45,6 +45,7 @@ en: neccessary_information: "Enter necessary information about your new user and click 'Save User' when you are finished." list: delete_selected: Delete Selected + add_user: Add User unlimited: Unlimited edit: edit_user: Edit User diff --git a/src/features/step_definitions/hardware_profile_steps.rb b/src/features/step_definitions/hardware_profile_steps.rb index be3c4a8..b2c3f35 100644 --- a/src/features/step_definitions/hardware_profile_steps.rb +++ b/src/features/step_definitions/hardware_profile_steps.rb @@ -89,7 +89,7 @@ Then /^I should not see the edit button$/ do end Then /^I should not see the delete button$/ do - within('#obj_actions') do + within('.obj_actions') do page.should have_no_selector('input[value=delete]') end end diff --git a/src/public/javascripts/application.js b/src/public/javascripts/application.js index f4054fb..52bb712 100644 --- a/src/public/javascripts/application.js +++ b/src/public/javascripts/application.js @@ -20,7 +20,7 @@ $.extend(Conductor, { e.preventDefault(); var url = $(this).attr('href'); - $('#tab').html('<span class="loading_tabs"></span>'); + $('#tab').html('<div class="loading_tabs"></div>'); $.get(url, function(data) { $('#tab').html(data).show(); }) @@ -85,7 +85,7 @@ $.extend(Conductor, { bind_pretty_toggle: function() { Conductor.nicelyHookAjaxClick($("#pretty_view"), function() { var link_element = this; - $('#content .toggle-view').html('<span class="loading_tabs"></span>'); + $('#content .toggle-view').html('<div class="loading_tabs"></div>'); $.get($(this).attr("href"), $(this).serialize(), function(result) { $('#content .toggle-view').html(result); $(link_element).addClass('active'); @@ -94,7 +94,7 @@ $.extend(Conductor, { }); Conductor.nicelyHookAjaxClick($("#filter_view"), function() { var link_element = this; - $('#content .toggle-view').html('<span class="loading_tabs"></span>'); + $('#content .toggle-view').html('<div class="loading_tabs"></div>'); $.get($(this).attr("href"), $(this).serialize(), function(result) { $('#content .toggle-view').html(result); $('#details-selected').hide(); diff --git a/src/public/stylesheets/960.css b/src/public/stylesheets/960.css deleted file mode 100644 index 1272675..0000000 --- a/src/public/stylesheets/960.css +++ /dev/null @@ -1,440 +0,0 @@ -/* - 960 Grid System ~ Core CSS. - Learn more ~ http://960.gs/ - - Licensed under GPL and MIT. -*/ - -/* - Forces backgrounds to span full width, - even if there is horizontal scrolling. - Increase this if your layout is wider. - - Note: IE6 works fine without this fix. -*/ - -body { - min-width: 960px; -} - -/* Containers -----------------------------------------------------------------------------------------------------*/ -.container_16 { - margin-left: auto; - margin-right: auto; - width: 960px; -} - -/* Grid>> Global -----------------------------------------------------------------------------------------------------*/ - -.grid_1, -.grid_2, -.grid_3, -.grid_4, -.grid_5, -.grid_6, -.grid_7, -.grid_8, -.grid_9, -.grid_10, -.grid_11, -.grid_12, -.grid_13, -.grid_14, -.grid_15, -.grid_16 { - display: inline; - float: left; - position: relative; - margin-left: 10px; - margin-right: 10px; -} - -.push_1, .pull_1, -.push_2, .pull_2, -.push_3, .pull_3, -.push_4, .pull_4, -.push_5, .pull_5, -.push_6, .pull_6, -.push_7, .pull_7, -.push_8, .pull_8, -.push_9, .pull_9, -.push_10, .pull_10, -.push_11, .pull_11, -.push_12, .pull_12, -.push_13, .pull_13, -.push_14, .pull_14, -.push_15, .pull_15, -.push_16, .pull_16 { - position: relative; -} - -/* Grid>> Children (Alpha ~ First, Omega ~ Last) -----------------------------------------------------------------------------------------------------*/ - -.alpha { - margin-left: 0; -} - -.omega { - margin-right: 0; -} - -/* Grid>> 16 Columns -----------------------------------------------------------------------------------------------------*/ - -.container_16 .grid_1 { - width: 40px; -} - -.container_16 .grid_2 { - width: 100px; -} - -.container_16 .grid_3 { - width: 160px; -} - -.container_16 .grid_4 { - width: 220px; -} - -.container_16 .grid_5 { - width: 280px; -} - -.container_16 .grid_6 { - width: 340px; -} - -.container_16 .grid_7 { - width: 400px; -} - -.container_16 .grid_8 { - width: 460px; -} - -.container_16 .grid_9 { - width: 520px; -} - -.container_16 .grid_10 { - width: 580px; -} - -.container_16 .grid_11 { - width: 640px; -} - -.container_16 .grid_12 { - width: 700px; -} - -.container_16 .grid_13 { - width: 760px; -} - -.container_16 .grid_14 { - width: 820px; -} - -.container_16 .grid_15 { - width: 880px; -} - -.container_16 .grid_16 { - width: 940px; -} - -/* Prefix Extra Space>> 16 Columns -----------------------------------------------------------------------------------------------------*/ - -.container_16 .prefix_1 { - padding-left: 60px; -} - -.container_16 .prefix_2 { - padding-left: 120px; -} - -.container_16 .prefix_3 { - padding-left: 180px; -} - -.container_16 .prefix_4 { - padding-left: 240px; -} - -.container_16 .prefix_5 { - padding-left: 300px; -} - -.container_16 .prefix_6 { - padding-left: 360px; -} - -.container_16 .prefix_7 { - padding-left: 420px; -} - -.container_16 .prefix_8 { - padding-left: 480px; -} - -.container_16 .prefix_9 { - padding-left: 540px; -} - -.container_16 .prefix_10 { - padding-left: 600px; -} - -.container_16 .prefix_11 { - padding-left: 660px; -} - -.container_16 .prefix_12 { - padding-left: 720px; -} - -.container_16 .prefix_13 { - padding-left: 780px; -} - -.container_16 .prefix_14 { - padding-left: 840px; -} - -.container_16 .prefix_15 { - padding-left: 900px; -} - -/* Suffix Extra Space>> 16 Columns -----------------------------------------------------------------------------------------------------*/ - -.container_16 .suffix_1 { - padding-right: 60px; -} - -.container_16 .suffix_2 { - padding-right: 120px; -} - -.container_16 .suffix_3 { - padding-right: 180px; -} - -.container_16 .suffix_4 { - padding-right: 240px; -} - -.container_16 .suffix_5 { - padding-right: 300px; -} - -.container_16 .suffix_6 { - padding-right: 360px; -} - -.container_16 .suffix_7 { - padding-right: 420px; -} - -.container_16 .suffix_8 { - padding-right: 480px; -} - -.container_16 .suffix_9 { - padding-right: 540px; -} - -.container_16 .suffix_10 { - padding-right: 600px; -} - -.container_16 .suffix_11 { - padding-right: 660px; -} - -.container_16 .suffix_12 { - padding-right: 720px; -} - -.container_16 .suffix_13 { - padding-right: 780px; -} - -.container_16 .suffix_14 { - padding-right: 840px; -} - -.container_16 .suffix_15 { - padding-right: 900px; -} - -/* Push Space>> 16 Columns -----------------------------------------------------------------------------------------------------*/ - -.container_16 .push_1 { - left: 60px; -} - -.container_16 .push_2 { - left: 120px; -} - -.container_16 .push_3 { - left: 180px; -} - -.container_16 .push_4 { - left: 240px; -} - -.container_16 .push_5 { - left: 300px; -} - -.container_16 .push_6 { - left: 360px; -} - -.container_16 .push_7 { - left: 420px; -} - -.container_16 .push_8 { - left: 480px; -} - -.container_16 .push_9 { - left: 540px; -} - -.container_16 .push_10 { - left: 600px; -} - -.container_16 .push_11 { - left: 660px; -} - -.container_16 .push_12 { - left: 720px; -} - -.container_16 .push_13 { - left: 780px; -} - -.container_16 .push_14 { - left: 840px; -} - -.container_16 .push_15 { - left: 900px; -} - -/* Pull Space>> 16 Columns -----------------------------------------------------------------------------------------------------*/ - -.container_16 .pull_1 { - left: -60px; -} - -.container_16 .pull_2 { - left: -120px; -} - -.container_16 .pull_3 { - left: -180px; -} - -.container_16 .pull_4 { - left: -240px; -} - -.container_16 .pull_5 { - left: -300px; -} - -.container_16 .pull_6 { - left: -360px; -} - -.container_16 .pull_7 { - left: -420px; -} - -.container_16 .pull_8 { - left: -480px; -} - -.container_16 .pull_9 { - left: -540px; -} - -.container_16 .pull_10 { - left: -600px; -} - -.container_16 .pull_11 { - left: -660px; -} - -.container_16 .pull_12 { - left: -720px; -} - -.container_16 .pull_13 { - left: -780px; -} - -.container_16 .pull_14 { - left: -840px; -} - -.container_16 .pull_15 { - left: -900px; -} - -/* `Clear Floated Elements -----------------------------------------------------------------------------------------------------*/ - -/* http://sonspring.com/journal/clearing-floats */ - -.clear { - clear: both; - display: block; - overflow: hidden; - visibility: hidden; - width: 0; - height: 0; -} - -/* http://www.yuiblog.com/blog/2010/09/27/clearfix-reloaded-overflowhidden-demystified */ - -.clearfix:before, -.clearfix:after { - content: '\0020'; - display: block; - overflow: hidden; - visibility: hidden; - width: 0; - height: 0; -} - -.clearfix:after { - clear: both; -} - -/* - The following zoom: 1 rule is specifically for IE6 + IE7. - Move to separate stylesheet if invalid CSS is a problem. -*/ - -.clearfix { - zoom: 1; -} \ No newline at end of file diff --git a/src/public/stylesheets/buttons.css b/src/public/stylesheets/buttons.css deleted file mode 100644 index 10876b1..0000000 --- a/src/public/stylesheets/buttons.css +++ /dev/null @@ -1,394 +0,0 @@ -/* ------------------------------------------ -CSS3 GITHUB BUTTONS (Nicolas Gallagher) -Licensed under Unlicense -http://github.com/necolas/css3-github-buttons ------------------------------------------- */ - - -/* ------------------------------------------------------------------------------------------------------------- BUTTON */ - -.button { - position: relative; - overflow: visible; - display: inline-block; - padding: 0.5em 1em; - border: 1px solid #d4d4d4; - margin: 0; - text-decoration: none; - text-shadow: 1px 1px 0 #fff; - font:11px/normal sans-serif; - color: #333; - white-space: nowrap; - cursor: pointer; - outline: none; - background-color: #ececec; - background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#f4f4f4), to(#ececec)); - background-image: -moz-linear-gradient(#f4f4f4, #ececec); - background-image: -o-linear-gradient(#f4f4f4, #ececec); - background-image: linear-gradient(#f4f4f4, #ececec); - -webkit-background-clip: padding; - -moz-background-clip: padding; - -o-background-clip: padding-box; - /*background-clip: padding-box;*/ /* commented out due to Opera 11.10 bug */ - -webkit-border-radius: 0.2em; - -moz-border-radius: 0.2em; - border-radius: 0.2em; - /* IE hacks */ - zoom: 1; - *display: inline; -} - -.button:hover, -.button:focus, -.button:active, -.button.active { - border-color: #3072b3; - border-bottom-color: #2a65a0; - text-decoration: none; - text-shadow: -1px -1px 0 rgba(0,0,0,0.3); - color: #fff; - background-color: #3C8DDE; - background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#599bdc), to(#3072b3)); - background-image: -moz-linear-gradient(#599bdc, #3072b3); - background-image: -o-linear-gradient(#599bdc, #3072b3); - background-image: linear-gradient(#599bdc, #3072b3); -} - -.button:active, -.button.active { - border-color: #2a65a0; - border-bottom-color: #3884CF; - background-color: #3072b3; - background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#3072b3), to(#599bdc)); - background-image: -moz-linear-gradient(#3072b3, #599bdc); - background-image: -o-linear-gradient(#3072b3, #599bdc); - background-image: linear-gradient(#3072b3, #599bdc); -} - -/* overrides extra padding on button elements in Firefox */ -.button::-moz-focus-inner { - padding: 0; - border: 0; -} - -/* ............................................................................................................. Icons */ - -.button.icon:before { - content: ""; - position: relative; - top: 1px; - float:left; - width: 12px; - height: 12px; - margin: 0 0.75em 0 -0.25em; - background: url(images/button-icons.png) 0 99px no-repeat; -} - -.button.arrowup.icon:before { background-position: 0 0; } -.button.arrowup.icon:hover:before, -.button.arrowup.icon:focus:before, -.button.arrowup.icon:active:before { background-position: -12px 0; } - -.button.arrowdown.icon:before { background-position: 0 -12px; } -.button.arrowdown.icon:hover:before, -.button.arrowdown.icon:focus:before, -.button.arrowdown.icon:active:before { background-position: -12px -12px; } - -.button.arrowleft.icon:before { background-position: 0 -24px; } -.button.arrowleft.icon:hover:before, -.button.arrowleft.icon:focus:before, -.button.arrowleft.icon:active:before { background-position: -12px -24px; } - -.button.arrowright.icon:before { float:right; margin: 0 -0.25em 0 0.5em; background-position: 0 -36px; } -.button.arrowright.icon:hover:before, -.button.arrowright.icon:focus:before, -.button.arrowright.icon:active:before { background-position: -12px -36px; } - -.button.approve.icon:before { background-position: 0 -48px; } -.button.approve.icon:hover:before, -.button.approve.icon:focus:before, -.button.approve.icon:active:before { background-position: -12px -48px; } - -.button.add.icon:before { background-position: 0 -288px; } -.button.add.icon:hover:before, -.button.add.icon:focus:before, -.button.add.icon:active:before { background-position: -12px -288px; } - -.button.remove.icon:before { background-position: 0 -60px; } -.button.remove.icon:hover:before, -.button.remove.icon:focus:before, -.button.remove.icon:active:before { background-position: -12px -60px; } - -.button.log.icon:before { background-position: 0 -72px; } -.button.log.icon:hover:before, -.button.log.icon:focus:before, -.button.log.icon:active:before { background-position: -12px -72px; } - -.button.calendar.icon:before { background-position: 0 -84px; } -.button.calendar.icon:hover:before, -.button.calendar.icon:focus:before, -.button.calendar.icon:active:before { background-position: -12px -84px; } - -.button.chat.icon:before { background-position: 0 -96px; } -.button.chat.icon:hover:before, -.button.chat.icon:focus:before, -.button.chat.icon:active:before { background-position: -12px -96px; } - -.button.clock.icon:before { background-position: 0 -108px; } -.button.clock.icon:hover:before, -.button.clock.icon:focus:before, -.button.clock.icon:active:before { background-position: -12px -108px; } - -.button.settings.icon:before { background-position: 0 -120px; } -.button.settings.icon:hover:before, -.button.settings.icon:focus:before, -.button.settings.icon:active:before { background-position: -12px -120px; } - -.button.comment.icon:before { background-position: 0 -132px; } -.button.comment.icon:hover:before, -.button.comment.icon:focus:before, -.button.comment.icon:active:before { background-position: -12px -132px; } - -.button.fork.icon:before { background-position: 0 -144px; } -.button.fork.icon:hover:before, -.button.fork.icon:focus:before, -.button.fork.icon:active:before { background-position: -12px -144px; } - -.button.like.icon:before { background-position: 0 -156px; } -.button.like.icon:hover:before, -.button.like.icon:focus:before, -.button.like.icon:active:before { background-position: -12px -156px; } - -.button.favorite.icon:before { background-position: 0 -348px; } -.button.favorite.icon:hover:before, -.button.favorite.icon:focus:before, -.button.favorite.icon:active:before { background-position: -12px -348px; } - -.button.home.icon:before { background-position: 0 -168px; } -.button.home.icon:hover:before, -.button.home.icon:focus:before, -.button.home.icon:active:before { background-position: -12px -168px; } - -.button.key.icon:before { background-position: 0 -180px; } -.button.key.icon:hover:before, -.button.key.icon:focus:before, -.button.key.icon:active:before { background-position: -12px -180px; } - -.button.lock.icon:before { background-position: 0 -192px; } -.button.lock.icon:hover:before, -.button.lock.icon:focus:before, -.button.lock.icon:active:before { background-position: -12px -192px; } - -.button.unlock.icon:before { background-position: 0 -204px; } -.button.unlock.icon:hover:before, -.button.unlock.icon:focus:before, -.button.unlock.icon:active:before { background-position: -12px -204px; } - -.button.loop.icon:before { background-position: 0 -216px; } -.button.loop.icon:hover:before, -.button.loop.icon:focus:before, -.button.loop.icon:active:before { background-position: -12px -216px; } - -.button.search.icon:before { background-position: 0 -228px; } -.button.search.icon:hover:before, -.button.search.icon:focus:before, -.button.search.icon:active:before { background-position: -12px -228px; } - -.button.mail.icon:before { background-position: 0 -240px; } -.button.mail.icon:hover:before, -.button.mail.icon:focus:before, -.button.mail.icon:active:before { background-position: -12px -240px; } - -.button.move.icon:before { background-position: 0 -252px; } -.button.move.icon:hover:before, -.button.move.icon:focus:before, -.button.move.icon:active:before { background-position: -12px -252px; } - -.button.edit.icon:before { background-position: 0 -264px; } -.button.edit.icon:hover:before, -.button.edit.icon:focus:before, -.button.edit.icon:active:before { background-position: -12px -264px; } - -.button.pin.icon:before { background-position: 0 -276px; } -.button.pin.icon:hover:before, -.button.pin.icon:focus:before, -.button.pin.icon:active:before { background-position: -12px -276px; } - -.button.reload.icon:before { background-position: 0 -300px; } -.button.reload.icon:hover:before, -.button.reload.icon:focus:before, -.button.reload.icon:active:before { background-position: -12px -300px; } - -.button.rss.icon:before { background-position: 0 -312px; } -.button.rss.icon:hover:before, -.button.rss.icon:focus:before, -.button.rss.icon:active:before { background-position: -12px -312px; } - -.button.tag.icon:before { background-position: 0 -324px; } -.button.tag.icon:hover:before, -.button.tag.icon:focus:before, -.button.tag.icon:active:before { background-position: -12px -324px; } - -.button.trash.icon:before { background-position: 0 -336px; } -.button.trash.icon:hover:before, -.button.trash.icon:focus:before, -.button.trash.icon:active:before { background-position: -12px -336px; } - -.button.user.icon:before { background-position: 0 -360px; } -.button.user.icon:hover:before, -.button.user.icon:focus:before, -.button.user.icon:active:before { background-position: -12px -360px; } - - -/* ------------------------------------------------------------------------------------------------------------- BUTTON EXTENSIONS */ - -/* ............................................................................................................. Primary */ - -.button.primary { - font-weight: bold; -} - -/* ............................................................................................................. Danger */ - -.button.danger { - color: #900; -} - -.button.danger:hover, -.button.danger:focus, -.button.danger:active { - border-color: #b53f3a; - border-bottom-color: #a0302a; - color: #fff; - background-color: #dc5f59; - background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#dc5f59), to(#b33630)); - background-image: -moz-linear-gradient(#dc5f59, #b33630); - background-image: -o-linear-gradient(#dc5f59, #b33630); - background-image: linear-gradient(#dc5f59, #b33630); -} - -.button.danger:active, -.button.danger.active { - border-color: #a0302a; - border-bottom-color: #bf4843; - background-color: #b33630; - background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#b33630), to(#dc5f59)); - background-image: -moz-linear-gradient(#b33630, #dc5f59); - background-image: -o-linear-gradient(#b33630, #dc5f59); - background-image: linear-gradient(#b33630, #dc5f59); -} - -/* ............................................................................................................. Pill */ - -.button.pill { - -webkit-border-radius: 50em; - -moz-border-radius: 50em; - border-radius: 50em; -} - -/* ............................................................................................................. Disable */ - -.button.disable { - opacity: 0.5; -} - -/* ............................................................................................................. Big */ - -.button.big { - font-size: 14px; -} - -.button.big.icon:before { top: 0; } - - -/* ------------------------------------------------------------------------------------------------------------- BUTTON GROUPS */ - -/* ............................................................................................................. Standard */ - -.button-group { - display: inline-block; - list-style: none; - padding: 0; - margin: 0; - /* IE hacks */ - zoom: 1; - *display: inline; -} - -.button + .button, -.button + .button-group, -.button-group + .button, -.button-group + .button-group { - margin-left: 15px; -} - -.button-group li { - float: left; - padding: 0; - margin: 0; -} - -.button-group .button { - float: left; - margin-left: -1px; -} - -.button-group> .button:not(:first-child):not(:last-child), -.button-group li:not(:first-child):not(:last-child) .button { - -webkit-border-radius: 0; - -moz-border-radius: 0; - border-radius: 0; -} - -.button-group> .button:first-child, -.button-group li:first-child .button { - margin-left: 0; - -webkit-border-top-right-radius: 0; - -webkit-border-bottom-right-radius: 0; - -moz-border-radius-topright: 0; - -moz-border-radius-bottomright: 0; - border-top-right-radius: 0; - border-bottom-right-radius: 0; -} - -.button-group> .button:last-child, -.button-group li:last-child> .button { - -webkit-border-top-left-radius: 0; - -webkit-border-bottom-left-radius: 0; - -moz-border-radius-topleft: 0; - -moz-border-radius-bottomleft: 0; - border-top-left-radius: 0; - border-bottom-left-radius: 0; -} - -/* ............................................................................................................. Minor */ - -.button-group.minor-group .button { - border: 1px solid #d4d4d4; - text-shadow: none; - background-image: none; - background-color: #fff; -} - -.button-group.minor-group .button:hover, -.button-group.minor-group .button:focus, -.button-group.minor-group .button:active { - background-color: #599bdc; -} - -.button-group.minor-group .button:active, -.button-group.minor-group .button.active { - background-color: #3072b3; -} - -.button-group.minor-group .button.icon:before { - opacity: 0.8; -} - -/* ------------------------------------------------------------------------------------------------------------- BUTTON CONTAINER */ -/* For mixing buttons and button groups, e.g., in a navigation bar */ - -.button-container .button, -.button-container .button-group { - vertical-align: top; -} diff --git a/src/public/stylesheets/facebox.css b/src/public/stylesheets/facebox.css deleted file mode 100644 index 1825bea..0000000 --- a/src/public/stylesheets/facebox.css +++ /dev/null @@ -1,101 +0,0 @@ -#facebox .b { - background:url(../images/b.png); -} - -#facebox .tl { - background:url(../images/tl.png); -} - -#facebox .tr { - background:url(../images/tr.png); -} - -#facebox .bl { - background:url(../images/bl.png); -} - -#facebox .br { - background:url(../images/br.png); -} - -#facebox { - position: absolute; - top: 0; - left: 0; - z-index: 100; - text-align: left; -} - -#facebox .popup { - position: relative; -} - -#facebox table { - border-collapse: collapse; -} - -#facebox td { - border-bottom: 0; - padding: 0; -} - -#facebox .body { - background: #fff; - width: 370px; -} - -#facebox .loading { - text-align: center; -} - -#facebox .image { - text-align: center; -} - -#facebox img { - border: 0; - margin: 0; -} - -#facebox .footer { - padding-top: 0px; - margin-top: 0px; - text-align: right; - display:none; -} - -#facebox .tl, #facebox .tr, #facebox .bl, #facebox .br { - height: 10px; - width: 10px; - overflow: auto; - padding: 0; -} - -#facebox_overlay { - position: fixed; - top: 0px; - left: 0px; - height:100%; - width:100%; -} - -.facebox_hide { - z-index:-100; -} - -.facebox_overlayBG { - background-color: #000; - z-index: 99; -} - -* html #facebox_overlay { /* ie6 hack */ - position: absolute; - height: expression(document.body.scrollHeight> document.body.offsetHeight ? document.body.scrollHeight : document.body.offsetHeight + 'px'); -} - - -.facebox_timfooter { - background: url(../images/fb_footer.jpg) repeat-x; - height: 37px; - padding: 9px 9px 0 9px; -} diff --git a/src/public/stylesheets/layout.css b/src/public/stylesheets/layout.css deleted file mode 100644 index c530bc6..0000000 --- a/src/public/stylesheets/layout.css +++ /dev/null @@ -1,270 +0,0 @@ -/* body */ -/* line 9, ../../app/stylesheets/layout.scss */ -html, body { - height: 100%; -} - -/* line 11, ../../app/stylesheets/layout.scss */ -body { - background: url("../images/body-bg.png"); - font-family: "Lucida Sans Unicode", "Lucida Grande", Verdana, Arial, Helvetica, sans-serif; - font-size: 0.750em; - /* 12px base */ - color: #333; -} - -/* line 18, ../../app/stylesheets/layout.scss */ -strong, em, b, i { - font-family: "Lucida Sans", "Lucida Sans Unicode", "Lucida Grande", Verdana, Arial, Helvetica, sans-serif; -} - -/* line 20, ../../app/stylesheets/layout.scss */ -#primary-container { - position: relative; - min-height: 100%; - margin-bottom: -60px; -} - -/* typography */ -/* line 28, ../../app/stylesheets/layout.scss */ -.label { - font-family: "Lucida Sans Unicode", "Lucida Grande", Verdana, Arial, Helvetica, sans-serif; -} - -/* line 32, ../../app/stylesheets/layout.scss */ -.label.strong { - font-weight: bold; - color: #333; -} - -/* line 37, ../../app/stylesheets/layout.scss */ -.label.small-caps { - text-transform: uppercase; - font-size: 0.917em; -} - -/* Query Inputs */ -/* line 44, ../../app/stylesheets/layout.scss */ -div.query-input { - display: inline-block; - background-image: -moz-linear-gradient(top, #d1d1d1, rgba(230, 230, 230, 0)); - background-image: -webkit-gradient(linear, left top, left bottom, from(#d1d1d1), to(rgba(230, 230, 230, 0))); - -webkit-border-radius: 16px; - -moz-border-radius: 16px; - border-radius: 16px; - padding: 3px; -} - -/* line 52, ../../app/stylesheets/layout.scss */ -div.query-input input[type="text"] { - display: inline; - -webkit-border-radius: 16px; - -moz-border-radius: 16px; - border-radius: 16px; - border: 1px solid #ccc; - height: 23px; - width: 180px; - outline: none; - padding: 0px 26px 0px 10px; - margin: 0px; - font-size: 12px; -} - -/* line 64, ../../app/stylesheets/layout.scss */ -div.query-input input[type="submit"] { - display: inline; - background: transparent url("../images/button-search.png") no-repeat left center; - color: transparent; - border: 0px; - width: 25px; - height: 25px; - margin-left: -25px; - outline: none; - cursor: pointer; -} -/* line 73, ../../app/stylesheets/layout.scss */ -div.query-input input[type="submit"]:hover { - background: transparent url("../images/button-search-over.png") no-repeat left center; -} -/* line 74, ../../app/stylesheets/layout.scss */ -div.query-input input[type="submit"]:active { - background: transparent url("../images/button-search-down.png") no-repeat left center; -} - -/* Content */ -/* line 79, ../../app/stylesheets/layout.scss */ -header#masthead { - height: 49px; - background-color: #E7E7E7; - background: url("../images/masthead-bg.png") repeat-x; - position: relative; - margin-bottom: 22px; -} -/* line 86, ../../app/stylesheets/layout.scss */ -header#masthead img#logo { - position: absolute; - top: 8px; -} -/* line 91, ../../app/stylesheets/layout.scss */ -header#masthead div.container { - margin: 0 auto; - width: 960px; - overflow: hidden; - position: relative; -} -/* line 98, ../../app/stylesheets/layout.scss */ -header#masthead a.user-dropdown { - border: 1px solid #ccc; - background: url("../images/button-userdrop.png") no-repeat center center; - background: url("../images/button-userdrop.png") no-repeat center center, -moz-linear-gradient(top, rgba(239, 239, 239, 0), rgba(204, 204, 204, 0)); - background: url("../images/button-userdrop.png") no-repeat center center, -webkit-gradient(linear, left top, left bottom, color-stop(0, #efefef), color-stop(1, #cccccc)); - width: 46px; - margin-left: 4px; - padding: 5px 2px 5px 2px; - color: transparent; - font-size: 12px; - /* match the font-size of the query box, for proper valign */ -} -/* line 109, ../../app/stylesheets/layout.scss */ -header#masthead a.user-dropdown:active { - background: url("../images/button-userdrop.png") no-repeat center center; - background: url("../images/button-userdrop.png") no-repeat center center, -moz-linear-gradient(top, rgba(232, 232, 232, 0), rgba(210, 210, 210, 0)); - background: url("../images/button-userdrop.png") no-repeat center center, -webkit-gradient(linear, left top, left bottom, color-stop(0, #e8e8e8), color-stop(1, #d2d2d2)); -} -/* line 117, ../../app/stylesheets/layout.scss */ -header#masthead nav#system { - float: right; - margin-top: 6px; -} -/* line 120, ../../app/stylesheets/layout.scss */ -header#masthead nav#system ul { - list-style: none; -} -/* line 122, ../../app/stylesheets/layout.scss */ -header#masthead nav#system ul li { - display: inline; -} -/* line 123, ../../app/stylesheets/layout.scss */ -header#masthead nav#system ul li + li { - margin-left: 10px; -} -/* line 124, ../../app/stylesheets/layout.scss */ -header#masthead nav#system ul li.separator { - background: url("../images/masthead-nav-separator.gif") no-repeat left top; - padding: 8px 1px 8px 1px; -} - -/* Primary Nav */ -/* line 136, ../../app/stylesheets/layout.scss */ -nav#primary ul.container { - width: 950px; - margin: 0 auto; - list-style: none; - padding-left: 24px; - height: 34px; -} -/* line 142, ../../app/stylesheets/layout.scss */ -nav#primary ul.container li { - float: left; - position: relative; - display: inline-block; - background: url("../images/tab-inactive-right.png") no-repeat right top; - height: 34px; - margin-right: 6px; - z-index: 1; -} -/* line 150, ../../app/stylesheets/layout.scss */ -nav#primary ul.container li a { - display: block; - background: url("../images/tab-inactive-left.png") no-repeat left top; - padding: 10px 16px 14px 16px; - margin-left: -11px; - font-family: "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; - font-size: 12px; - letter-spacing: 1px; - font-weight: normal; - text-transform: uppercase; - text-decoration: none; - font-weight: bold; - color: #fff; -} -/* line 165, ../../app/stylesheets/layout.scss */ -nav#primary ul.container li.active { - margin-top: -5px; - background: url("../images/tab-active-right.png") no-repeat right top; - z-index: 1000; - height: 43px; -} -/* line 170, ../../app/stylesheets/layout.scss */ -nav#primary ul.container li.active a { - background: url("../images/tab-active-left.png") no-repeat left top; - padding: 12px 20px 12px 20px; - font-size: 16px; - color: #666; -} -/* line 177, ../../app/stylesheets/layout.scss */ -nav#primary ul.container li + li { - margin-right: 6px; -} - -/* Content */ -/* line 187, ../../app/stylesheets/layout.scss */ -div#content { - width: 946px; - margin: 0 auto; - margin-bottom: 98px; - height: 200px; - -webkit-border-radius: 7px; - -moz-border-radius: 7px; - border-radius: 7px; - background-color: #FAFAFA; - padding: 7px; - box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.5); - -moz-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.5); - -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.5); - border: 1px solid #999; -} -/* line 200, ../../app/stylesheets/layout.scss */ -div#content div.header { - background-color: #ccc; - height: 60px; -} - -/* Footer */ -/* line 209, ../../app/stylesheets/layout.scss */ -footer.standard { - background: rgba(0, 0, 0, 0.12); - position: relative; - height: 40px; - width: 100%; - clear: both; -} -/* line 217, ../../app/stylesheets/layout.scss */ -footer.standard div.container { - margin: 0 auto; - width: 946px; - background: rgba(0, 0, 0, 0.12); - height: 36px; - position: relative; - padding: 26px 8px 0px 8px; - top: -20px; -} -/* line 227, ../../app/stylesheets/layout.scss */ -footer.standard img.logo { - float: right; -} -/* line 231, ../../app/stylesheets/layout.scss */ -footer.standard span.copyright { - font-size: 10px; - display: inline-block; - color: #666; -} -/* line 237, ../../app/stylesheets/layout.scss */ -footer.standard nav.footer { - display: inline-block; -} -/* line 239, ../../app/stylesheets/layout.scss */ -footer.standard nav.footer a { - color: #fff; - padding-right: 6px; -} diff --git a/src/public/stylesheets/layout_ie7.css b/src/public/stylesheets/layout_ie7.css index b8290e1..db85095 100644 --- a/src/public/stylesheets/layout_ie7.css +++ b/src/public/stylesheets/layout_ie7.css @@ -3,7 +3,7 @@ dl.alerts li.alert{ margin-bottom: 5px; } dl.alerts li.alert dt, dl.alerts li.alert dd{ display: inline; } /* add proper spacing to the catalog dropdown button on pools#show */ -#obj_actions .catalog_link { +.obj_actions .catalog_link { margin-right: 5px; } diff --git a/src/public/stylesheets/reset.css b/src/public/stylesheets/reset.css deleted file mode 100644 index 885707c..0000000 --- a/src/public/stylesheets/reset.css +++ /dev/null @@ -1,171 +0,0 @@ -/* `XHTML, HTML4, HTML5 Reset -----------------------------------------------------------------------------------------------------*/ - -a, -abbr, -acronym, -address, -applet, -article, -aside, -audio, -b, -big, -blockquote, -body, -canvas, -caption, -center, -cite, -code, -dd, -del, -details, -dfn, -dialog, -div, -dl, -dt, -em, -embed, -fieldset, -figcaption, -figure, -font, -footer, -form, -h1, -h2, -h3, -h4, -h5, -h6, -header, -hgroup, -hr, -html, -i, -iframe, -img, -ins, -kbd, -label, -legend, -li, -mark, -menu, -meter, -nav, -object, -ol, -output, -p, -pre, -progress, -q, -rp, -rt, -ruby, -s, -samp, -section, -small, -span, -strike, -strong, -sub, -summary, -sup, -table, -tbody, -td, -tfoot, -th, -thead, -time, -tr, -tt, -u, -ul, -var, -video, -xmp { - border: 0; - margin: 0; - padding: 0; - font-size: 100%; -} - -html, -body { - height: 100%; -} - -article, -aside, -details, -figcaption, -figure, -footer, -header, -hgroup, -menu, -nav, -section { -/* - Override the default (display: inline) for - browsers that do not recognize HTML5 tags. - - IE8 (and lower) requires a shiv: - http://ejohn.org/blog/html5-shiv -*/ - display: block; -} - -b, -strong { -/* - Makes browsers agree. - IE + Opera = font-weight: bold. - Gecko + WebKit = font-weight: bolder. -*/ - font-weight: bold; -} - -img { - color: transparent; - font-size: 0; - vertical-align: middle; -/* - For IE. - http://css-tricks.com/ie-fix-bicubic-scaling-for-images -*/ - -ms-interpolation-mode: bicubic; -} - -li { -/* - For IE6 + IE7. -*/ - display: list-item; -} - -table { - border-collapse: collapse; - border-spacing: 0; -} - -th, -td, -caption { - font-weight: normal; - vertical-align: top; - text-align: left; -} - -svg { -/* - For IE9. -*/ - overflow: hidden; -} \ No newline at end of file
aeolus-devel@lists.fedorahosted.org