X-Git-Url: http://git.onelab.eu/?a=blobdiff_plain;f=portal%2Fstatic%2Fcss%2Fonelab.css;h=7d1132402e76655705d5a1cea75e5d525a1ccaef;hb=cb3a40dfdc1c79ca57458d1c18732334d58734fd;hp=d5047550169d9a3cc7aa390a36585c4c28a1c033;hpb=a7337c66c2c7c3312c4205a8119252f04a1fbd58;p=myslice.git diff --git a/portal/static/css/onelab.css b/portal/static/css/onelab.css index d5047550..7d113240 100644 --- a/portal/static/css/onelab.css +++ b/portal/static/css/onelab.css @@ -1,481 +1,681 @@ -/* @override unfold/static/css/plugin.css */ +@import url("../fonts/opensans_bold_macroman/stylesheet.css"); -/*-------------------------------- MARKO'S STYLES -----*/ +html { height: 100% } -/* GENERAL */ - -.container { - padding: 0 ; +body { background-color:white; - color: black; - margin: 0; - width: 100%; - max-width: 100%; - min-height: 600px; + color:black; + margin:0; + padding:0; height: 100%; } - -div.plugin-outline-complete, -div.plugin-outline-body { - border: 0px solid; - border-radius: 0; - border-color: #ccc; - -webkit-transition: padding 200ms ease-out; - -moz-transition: padding 200ms ease-out; - -o-transition: padding 200ms ease-out; - transition: padding 0.2s ease-out; - padding: 20px; - margin: 0; -} -/* -div.plugin-outline-complete:hover, -div.plugin-outline-body:hover { - padding: 80px 80px 120px 80px; -} -*/ -a.plugin-tooltip { - font-size: 130%; - font-style: normal; - font-weight: bold; - padding: 5px; - color: #333; - font-family: Ubuntu, Arial, sans-serif; - text-transform: uppercase; +a, a:active, a:focus { + outline: 0; + text-decoration:none; + color:#760073; } - -a.plugin-tooltip:hover { - color: #fff; - text-decoration: none; +a:hover { + color:#0D0049; } - - -/* LIST VIEW */ -div.well-lg { - background-color: rgba(168, 32, 202, 0.5) ; +h1 { + border-bottom:1px solid #DDDDDD; + padding:0 0 0 0; + margin:15px 0 15px 0; + font-size:14pt; +} +h1 img { + vertical-align:middle; + margin-bottom:4px; + margin-right:10px; } -div.onelab-title { - background-color: rgba(168, 32, 202, 0.5) ; +h2 { + margin:0 0 15px 0; + font-size:14pt; + color:#333333; } - -h2.well.well-lg { +h3 { + margin:0 0 5px 0; + font-size:13pt; + color:#201E62; +} +h4 { + margin:0 0 5px 0; + font-size:12pt; + color:#333333; +} +input[type=text], input[type=password], input[type=email], input[type=tel], input[type=number], select, option { + min-width:260px; + padding:6px; + border:1pt solid #22606D; + vertical-align:bottom; border-radius:0; - border: 0; - font-family: Ubuntu, arial, sans-serif; - /* text-transform: ; */ - font-weight: normal; - font-size: 40px; - /* color: #30196d; */ - color: white; - margin-bottom: 0px; - margin-top: 0; - padding: 40px; - opacity: 1; - text-align: center; - background-color: #30196d; } -#complete-resources { -/* background-color: #92f79e ; */ - background-color: #B8B2FF ; +textarea { + padding:6px; + border:1pt solid #22606D !important; + border-radius:0 !important; } -#complete-filters { -/* background-color: #4af25d; */ - background-color: #add7ff; +span.label { + font-size:11pt; + color:gray; + font-weight:normal; + padding:0; } - -#complete-users { -/* background-color: #ff7394 ; */ - background-color: #add7ff ; +div.el { + padding-bottom:15px; } -/* -#complete-measurements { - background-color: ; +div.breadcrumbs { + margin:15px 0; + color:gray; + font-size:10pt; } -*/ -#complete-pending { -/* background-color: #add7ff ; */ - background-color: #B8B2FF ; - +div.breadcrumbs a { + color:gray; } - -#complete-customize-resources { - background-color: #efdfdf; +div.breadcrumbs a:hover { + text-decoration:underline; } - -#complete-msgs-pre { - background-color: #ccc; +.tab-pane { + padding-top:15px; +} +/* buttons */ +button.btn, input.btn { + padding:6px 10px; + border-radius:5px; + font-size:10pt; + font-weight:normal; +} +button.btn span.glyphicon { + margin-right:6px; +} +button.btn-default { + border-bottom:3px solid #cccccc; +} +button.btn-default:hover { + background-color:white; + border:1px solid #ADADAD; + border-bottom:3px solid #ADADAD; +} +button.btn-default:active { + background-color:white; + border:1px solid #ADADAD; + border-bottom:1px solid #ADADAD; + margin-top:2px; + box-shadow:none; +} +button.btn-primary { + border-bottom:3px solid #3071A9; +} +button.btn-primary:hover { + box-shadow:none; + background-color:#428bca; + border:1px solid #357ebd; + border-bottom:3px solid #3071A9; +} +button.btn-primary:active { + box-shadow:none; + border-bottom:1px solid #3071A9; + margin-top:2px; +} +button.btn-danger { + border-bottom:3px solid #A13F3A; +} +button.btn-danger:hover { + box-shadow:none; + background-color:#d9534f; + border:1px solid #d43f3a; + border-bottom:3px solid #A13F3A; +} +button.btn-danger:active { + border:1px solid #d43f3a; + box-shadow:none; + margin-top:2px; +} +button.btn-onelab, input.btn-onelab { + border:0; + border-bottom:3px solid #760073; + background-color:#302562; + color:white; +} +button.btn-onelab:hover, input.btn-onelab:hover { + border:0; + border-bottom:3px solid #760073; + background-color:#302562; + color:white; +} +button.btn-onelab:active, input.btn-onelab:active { + box-shadow:none; + border-bottom:1px solid #760073; + margin-top:2px; } -#complete-resources, -#complete-filters, -#complete-users, -#complete-measurements, -#complete-pending, -#complete-customize-resources, -#complete-msgs-pre { - opacity: 1; +.container-resource button { + padding:2px 4px; + border-radius:3px; + font-size:9pt; + font-weight:normal; +} +.container-resource select,.container-resource option, .container-resource input { + padding:2px 4px; + font-size:9pt; +} +.badge { + font-size:9pt; + margin-left:4px; +} +/***** Notifications *****/ +.warning { + border: 1px solid red; + margin: 20px 60px; + padding: 10px 20px; + color: red; + background-color: #f2dbdb; text-align: center; - color: #333; } -#complete-resources:hover, -#complete-filters:hover, -#complete-users:hover, -#complete-measurements:hover, -#complete-pending:hover, -#complete-customize-resources:hover, -#complete-msgs-pre:hover { - opacity: 1; +/* HOME DASHBOARD */ +div#home-dashboard { + color:black; + margin:0 auto 25px auto; } - - - - -.navbar-nav li a:hover { - color: #572bc9 ; +div#home-dashboard table { + margin:25px; + width:100%; } - -.navbar-nav li.active a { - background: #eee ; +div#home-dashboard table td { + text-align:center; + padding:15px 0; + width:33%; } - -/* Thierry : turning this off -ul.logged-in { - padding-top: 25px; +div#home-dashboard table tr:first-child td { + font-size:12pt; + font-weight:bold; + color:#270A5A; } -Thierry */ -button.logged-in { - font-size: 1em; - font-weight: bold; - margin-left: 5px; - margin-top: -5px; - background: #572bc9; - border: 2px solid #572bc9; - color: #eee; - padding: 5px 15px; - border-radius:5px; +div#home-dashboard table tr:last-child td { + vertical-align:top; + padding:25px 0; } - -button.logged-in:hover { - /* background: #4af25d; */ - background: #ff7394; - border: 2px solid #ff7394; - color: #333; +div#home-dashboard table tr:last-child td.logged-in { + border-right:1px solid #DDDDDD; + padding:25px; } -li.username { - margin-bottom: 10px; - font-size: 0.8em; - text-transform: none; - font-weight: normal; - color: #999; +div#home-dashboard table tr:last-child td.support { + border-left:1px solid #DDDDDD; + padding:25px; } - - -/* BOOTSTRAP */ - - -ul.pagination li a { - /* background: ; */ - color: #572bc9; - font-family: Ubuntu, Arial, sans-serif; +div#home-dashboard table tr:last-child td:first-child { +} +div#home-dashboard table tr:last-child td:last-child { + border-right:0; +} +div#home-dashboard table tr:last-child td.logged-in div { + text-align:left; + padding:25px 0; +} +div#home-dashboard table tr:last-child td.support div { + text-align:left; + padding:25px 0; +} +div#home-dashboard div.login-widget { + padding:20px; +} +div#home-dashboard table td.support { +} +div#home-dashboard table td.support a { +} +div#home-dashboard table td.support a:hover { + text-decoration:none; } -ul.pagination li.active a { - background: #572bc9; - border: 1px solid #572bc9; +div#home-dashboard div#manager { + display:none; } +div#home-dashboard div#home-slice-list { + margin:25px 0; + padding:0 25px; + text-align:left; +} +div#home-dashboard div#home-slice-list ul { + list-style: none; + padding:0; + margin:0; +} +div#home-dashboard div#home-slice-list li { + +} +/**/ -div.dataTables_length label, -div.dataTables_filter label, -div.dataTables_info { - font-family: Ubuntu, Arial, sans-serif ; +/**/ +/* WELL */ +div.well { +} +/**/ +/* TABLE */ +table.table { + margin:0; +} +table.table thead { + padding:0; +} +table.table tbody { + padding:0; +} +table.table tr { + padding:0; +} +table.table td { + padding:0; +} +/* INSTITUTION */ +div#institution { + color:black; +} +.form-hint { + font-size:11pt; + font-style:italic; + color:gray; } +.form-hint { + font-size:11pt; + font-style:italic; + color:gray; +} -/* QUERYTABLE */ -div.QueryTable table.dataTable th { - font: bold 12px/22px Ubuntu, Arial, sans-serif; - color: #333 ; - border-right: 0px solid #333 ; - border-bottom: 0px solid #C1DAD7 ; - border-top: 0px solid #C1DAD7 ; - letter-spacing: 1px; - text-transform: uppercase; - text-align: left; - padding: 8px 12px 4px 20px; - vertical-align:middle; - background: url('../img/tablesort-header.png') no-repeat ; +/* TICKET REQUEST */ +div#ticket-request { + color:black; } - -div.QueryTable table.dataTable td, div.QueryTable table.dataTable textarea, div.QueryTable table.dataTable input [type="text"] { - font: normal 12px Ubuntu, Arial, Helvetica, sans-serif; - border-right: 0px solid #fff ; - border-bottom: 1px solid #fff ; +.form-hint { + font-size:11pt; + font-style:italic; + color:gray; } - -div.QueryTable table.dataTable thead { - background: url('../img/tablesort-header.png') repeat-x ; - background-color: #caebea; +div#ticket-request p { + margin:20px 0; } -div.QueryTable table.dataTable tfoot { - background: url('../img/tablesort-header.png') repeat-x ; - /* background-color: # ; */ +ul.nav-tabs { + margin:0 0 15px 0; } +ul.nav-tabs ul {} +ul.nav-tabs li {} - -/* QUERY EDITOR */ - -table.query-editor { - margin: 40px auto ; - clear: both; - /* width: 80%;*/ - width: 100% ; - font-family: Ubuntu; +ul.nav-section li a { + color:black; + border-bottom:0; } - -.query-editor-spacer, -.plugin.QueryUpdater, -/* Thierry : turning this off -.plugin.Tabs -Thierry */ -{ - margin-top: 60px ; +ul.nav-section li:first-child { + padding:0; } - -table.query-editor td { - padding: 5px 5px ; - font: normal 12px Ubuntu, Arial, sans-serif ; +ul.nav-section li:first-child a { +} +ul.nav-section li:first-child.active a { } +ul.nav-resources { + margin:15px 0; +} +ul.nav-resources a { + padding: 4px 10px 5px 10px; +} +/* SLICE VIEW */ +div.container-resource, div.container-slice { + padding-right:15px; + padding-left:15px; +} +.table th { + border-top:0 !important; +} +div#slice-view { + margin:0; +} +div.list-group-item { + border:0; + -moz-border-radius: 0; + border-radius: 0; + background-color:white; + font-weight:bold; + padding-left:0; +} +a.list-group-item { + -moz-border-radius: 0; + border-radius: 0; + border:0; + background-color:white; + padding:3px 2px 3px 10px; + border-left:2pt white solid; +} +a.list-group-item.active, a.list-group-item.active:hover, a.list-group-item.active:focus { + -moz-border-radius: 0; + border-radius: 0; + font-weight: bold; + color:black; + background-color:#F5F5F5; + border-left:2pt blue solid; +} -/* DASHBOARD */ +a.list-group-item:hover { + -moz-border-radius: 0; + border-radius: 0; + border-left:2pt blue solid; +} +a.list-group-item p.list-group-item-text { + -moz-border-radius: 0; + border-radius: 0; + font-size:9pt; + font-style:italic; + font-weight: normal; + color: black !important; +} -#ms-dashboard-profile, -#ms-dashboard-testbeds, -#ms-dashboard-slices { - -webkit-transition: all 50ms ease-out; - -moz-transition: all 50ms ease-out; - -o-transition: all 50ms ease-out; - transition: all 0.05s ease-out; - padding-top: 140px; - padding-bottom: 60px; - margin-top: 60px; - color: #fff; - font-family: Ubuntu, Arial, sans-serif; +span.sl-resources { + font-size:9pt; + color:gray; +} +a.sl-resources, a.sl-resources:hover { + font-size:9pt; + border:0; + padding:2px 4px; + -moz-border-radius: 4px; + border-radius: 4px; + width:105px; + margin-left:4px; + margin-bottom:8px; text-align: center; - } - -#ms-dashboard-profile:hover, -#ms-dashboard-testbeds:hover, -#ms-dashboard-slices:hover { - margin-top: 65px; +a.sl-resources.active, a.sl-resources.active:hover, a.sl-resources.active:focus { + border:0; + -moz-border-radius: 4px; + border-radius: 4px; } - -#ms-dashboard-profile { - background: url("../img/icon_users_color.png") top center no-repeat; +a.sl-resources:first-child { + margin-left:12px; } - -#ms-dashboard-testbeds { - background: url("../img/icon_testbed_color.png") top center no-repeat; +button.btn-apply { + font-size:13px; + padding:2px 8px; } - -#ms-dashboard-slices { - background: url("../img/icon_slices_color.png") top center no-repeat; +div#slice-info { + margin-top:25px; } - -.ms-dashboard-content ul { - list-style-type: none ; - padding-left: 0; - text-align: center ; +div#slice-info table { + width:100%; + margin:0 auto; } - -.ms-dashboard-content { - padding: 0 ; +div#slice-info table td:first-child { + text-align:right; + font-weight:bold; + padding-right:15px; +} +div#slice-info td { + padding:5px; } - -#ms-dashboard-profile>div.ms-dashboard-caption { - background: no-repeat url(#) ; - padding-left: 0 ; -} - -#ms-dashboard-testbeds>div.ms-dashboard-caption { - background: no-repeat url(#) ; - padding-left: 0 ; -} - -#ms-dashboard-slices>div.ms-dashboard-caption { - background: no-repeat url(#) ; - padding-left: 0 ; -} - - - - - - - - - -/*** NEW CSS STYLES FOR ONLEAB ***/ - -body { - background-color:white; - color:black; +/* SLICE VIEW sections */ +.slice-sections, .slice-pending { margin:0; padding:0; } -a, a:active, a:focus { - outline: 0; +.slice-sections ul, .slice-pending ul { + margin:0; + padding:0; } - -div.wrapper { - width:980px; - margin:0 auto; - position:relative; +.slice-pending ul { + width:400px; + margin:0 auto 15px auto; } - -span.label { - font-size:11pt; - color:gray; - font-weight:normal; +.slice-sections li { + text-align:left; + margin:0; padding:0; } -/***** Notifications *****/ -.warning { - border: 1px solid red; - margin: 20px 60px; - padding: 10px 20px; - color: red; - background-color: #f2dbdb; - text-align: center; +.slice-pending li { + padding-right:15px; } -/* HEADER */ -div#header { - height:100px; - background-color:white; +.slice-sections li a, .slice-pending li a { + font-size:14px; + color:black; + padding:0; } - -div#secondary { - +.slice-sections li.active a, .slice-pending li.active a { + color:#201E62; + background-color:#EFEFEF; + text-decoration:underline; + padding:0; +} +.slice-sections ul.nav-pills li a:hover, .slice-pending ul.nav-pills li a:hover { + text-decoration:underline; + background-color:#EFEFEF; + color:black; } +.slice-sections ul.nav-pills li.active, .slice-pending ul.nav-pills li.active { -div#secondary ul { - position:absolute; - top:20px; - right:0; +} +.slice-sections li:first-child, .slice-sections li:first-child a { + color:#201E62; + font-weight:bold; +} +.slice-experiment { + text-align:right; + padding:0; +} +.slice-experiment button { + margin:3px 0 0 0; + background-color:#CC4125; + color:white; } -div#secondary li { - font-size:10pt; - float:left; - list-style:none; - margin-right:30px; +.slice-pending { } -div#secondary li a { - color:black; +.slice-pending button { + font-size:9pt; + margin:-2px 0 0 0; + padding:3px 5px; } -div#secondary li a:hover { - color:#270A5A; - text-decoration:none; +.slice-pending button.apply { + font-size:14px; + padding:2px 5px; } -div#secondary li:last-child { - margin-right:0; +.slice-pending button.clear { +} +tr.active, tr.active td { + background-color:#FFFFCC !important; +} +div.dataTables_filter label{ + float:left; + width:400px; } -div#navigation { - background-color:black; - width:100%; - height:40px; +/* HEADER */ + + +.header { + -moz-box-shadow: 0 0 1px rgba(82,82,82,0.6); + -webkit-box-shadow: 0 0 1px rgba(82,82,82,0.6); + box-shadow: 0 0 1px rgba(82,82,82,0.6); + height:61px; + background-color:white; } -div#navigation div.wrapper { - text-align:center; + +div.navigation { + } -div#navigation ul { - margin:0; +div.navigation ul { + margin:26px 0 0 0; padding:0; display: inline-block; list-style-type: none; white-space: nowrap; } -div#navigation li { - color:white; - font-family:helvetica, sans-serif; - font-size:10pt ; +div.navigation li { + color:#0C0047; + font-family:open_sansbold, sans-serif; + font-size:9pt; font-weight:normal; line-height:0.8em; - letter-spacing:0.6pt; + letter-spacing:0.4pt; list-style:none; float:left; - padding:0; - margin:15px 50px 0 0; + padding:0 15px; + margin:0; + text-transform:uppercase; } -div#navigation li a { - color:white; +div.navigation li:hover { +} +div.navigation li a { + color:#0C0047; } -div#navigation li a:hover { +div.navigation li a:hover, div.navigation li a.current { + color:#760073; text-decoration:none; - color:#B8B2FF; } -div#navigation li:last-child { + +div.navigation li:last-child { margin-right:0; } -/* HOME DASHBOARD */ -div#home-dashboard { + +div.navigation .dropdown-menu { color:black; - margin:25px auto; + -moz-box-shadow: 1px 1px 0px 0 rgba(58, 48, 100,0.8); + -webkit-box-shadow: 1px 1px 0px 0 rgba(58, 48, 100,0.8); + box-shadow: 1px 1px 0px 0 rgba(58, 48, 100,0.8); + border-radius:2px; + padding:0 5px 5px 5px; + margin-top:5px; + margin-left:20px; +} +div.navigation .dropdown-menu ul { + margin:0; + padding:15px 5px 5px 5px; + display:list-item; +} +div.navigation .dropdown-menu li { + margin:0 10px 0 0; + padding:0 0 8px 0; + display:list-item; + float:none; + text-transform: none; } -div#home-dashboard table { - margin:25px; - width:100%; + +div.navigation .dropdown-menu a { + font-family:Helvetica,sans-serif; + font-size:10pt; + color:black; } -div#home-dashboard table td { - text-align:center; - padding:15px 0; - width:33%; +div.navigation .dropdown-menu li.title { + margin-bottom:10px; } -div#home-dashboard table tr:first-child td { - font-size:12pt; - font-weight:bold; - color:#270A5A; +div.navigation .dropdown-menu li.title a { + font-family:open_sansbold, sans-serif; } -div#home-dashboard table tr:last-child td { - font-size:12pt; - vertical-align:top; - border-right:1px solid #DDDDDD; - padding:25px; + + +div.navigation .dropdown-menu li:first-child { + border-bottom:1px solid white; + padding-bottom:5px; + } -div#home-dashboard table tr:last-child td:first-child { + +div.secondary { + text-align:right; } -div#home-dashboard table tr:last-child td:last-child { - border-right:0; + +div.secondary ul { + margin:6px 0 0 0; + padding:0; } -div#home-dashboard table tr:last-child td div { - text-align:left; - padding:25px 0; + +div.secondary li { + font-size:9pt; + display:inline; + list-style:none; + margin:0px; + padding:0; + margin-right:15px; + color:#747474; + letter-spacing:0.4px; } -div#home-dashboard table td.support { +div.secondary li:last-child { + margin-right:0; } -div#home-dashboard table td.support a { +div.secondary li a { + color:#747474; } -div#home-dashboard table td.support a:hover { +div.secondary li a:hover { text-decoration:none; } +div.secondary .button { + width:300px; + margin-top:15px; +} +div.secondary .account { + margin-top:10px; + padding:0; + font-size:9pt; + color:gray; + text-align:right; +} +div.secondary .account span { + font-size:8pt; +} +div.secondary .account a { + color:black; +} +div.home { + font-size:11pt; + line-height:1.2em; + letter-spacing:0.3pt; + min-height:500px; + background-image: url('../img/bg-experiment.png'); + background-repeat:no-repeat; + background-size:cover; + background-position:center top; + background-color:#086274; + padding:100px 0; +} +div.home h2 { + color:white; + line-height:1.2em; + font-size:18pt; +} +div.home h3 { + color:white; + line-height:1.4em; +} +div.dashboard { + text-align:center; +} +div.dashboard div { + margin:25px 0; +} +div.dashboard ul { + text-align:left; + margin-left:24px; + list-style:none; +} +div.registration-form { + padding-top:150px; + text-align:center; +} -div#home-dashboard div#manager { - display:none; +.login-form input { + width:320px; +} +.login-form input[type=submit] { + width:108px; } .login-submit { @@ -484,45 +684,51 @@ div#home-dashboard div#manager { } .lost-password { font-size:10pt; - color:#CCCCCC; + color:black; text-align:right; padding:0px; } .lost-password a { + color:white; + text-shadow:0.5px 0.5px black; } .login-signup { - border-top:1px solid #CCCCCC; - text-align:center; - margin-top:15px; - padding:5px 0 0 0; + font-size:12pt; + color:white; + text-shadow:0.5px 0.5px black; + margin-top:45px; + padding:5px 0 0 4px; + } -/**/ - -/* NAV TABS */ - -.nav.nav-tabs { +.login-signup a { + color:white; + text-shadow:0.5px 0.5px black; + padding-bottom:2px; + border-bottom:2pt solid white; } - -.nav.nav-tabs li.active a { - +.login-signup a:hover { + text-decoration:none; } - -.nav.nav-tabs li a { +.login-signup button { + padding:8px; + border:0; + border-bottom:2px solid #540086; + background-color:#302562; + color:white; + width:100px; + border-radius:5px; + font-size:12pt; } - -.nav.nav-tabs li a:hover { +div.slogan { + text-align:center; + color:white; + padding-top:60px; + text-shadow: 1px 1px #013540; } -/**/ -/* WELL */ -div.well { +th { + border:0 !important; } -/**/ -/* BUTTON */ -.btn.btn-default { - font-weight: bold; +th.checkbox { + } - -.btn.btn-default:hover { - font-weight: bold; -} \ No newline at end of file