X-Git-Url: http://git.onelab.eu/?a=blobdiff_plain;f=portal%2Fstatic%2Fcss%2Fonelab.css;h=5f15c77a48a4270fe0f05cdb431109c42ab15fbf;hb=33b8be6fd7245e0902e11137ed16ccbce2afe701;hp=dc8932ce264d153b25074d5a2e9422d5247146ca;hpb=574ab14b3b3daf0f407dcc2a73a54ad5f87af372;p=myslice.git diff --git a/portal/static/css/onelab.css b/portal/static/css/onelab.css index dc8932ce..5f15c77a 100644 --- a/portal/static/css/onelab.css +++ b/portal/static/css/onelab.css @@ -1,34 +1,81 @@ -/* @override unfold/static/css/plugin.css */ +@import url("../fonts/opensans_bold_macroman/stylesheet.css"); -/*-------------------------------- MARKO'S STYLES -----*/ - - - - -/*** NEW CSS STYLES FOR ONLEAB ***/ +html { height: 100% } body { background-color:white; color:black; margin:0; padding:0; + height: 100%; + letter-spacing:0.6px; } a, a:active, a:focus { outline: 0; + text-decoration:none; + color:#760073; +} +a:hover { + color:#0D0049; } +a.current { + text-decoration:underline; + color:#333333; +} h1 { border-bottom:1px solid #DDDDDD; - padding:0 0 15px 0; - margin:0 0 15px 0; + padding:0 0 0 0; + margin:15px 0 15px 0; + font-size:14pt; } h1 img { - vertical-align:top; + vertical-align:middle; + margin-bottom:4px; + margin-right:10px; } -div.wrapper { - width:980px; - margin:0 auto; - position:relative; +h2 { + margin:0 0 15px 0; + font-size:14pt; + color:#333333; +} +h3 { + margin:0 0 5px 0; + font-size:13pt; + color:#201E62; +} +h4 { + margin:0 0 5px 0; + font-size:12pt; + color:#333333; +} +span.subtitle { + color:#454545; + font-size:9pt; + font-weight:normal; + text-transform:uppercase; +} +span.htitle { + color:#454545; + font-size:9pt; + font-weight:normal; +} +span.version { + font-size:8pt; + color:#888888; +} +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; +} + +textarea { + padding:6px; + border:1pt solid #22606D !important; + border-radius:0 !important; } span.label { @@ -37,91 +84,122 @@ span.label { font-weight:normal; padding:0; } -/***** Notifications *****/ -.warning { - border: 1px solid red; - margin: 20px 60px; - padding: 10px 20px; - color: red; - background-color: #f2dbdb; - text-align: center; +div.el { + padding-bottom:15px; } -/* HEADER */ -div#header { - height:100px; - background-color:white; +div.breadcrumbs { + margin:15px 0; + color:gray; + font-size:10pt; } - -div#secondary { - +div.breadcrumbs a { + color:gray; } - -div#secondary ul { - position:absolute; - top:20px; - right:0; +div.breadcrumbs a:hover { + text-decoration:underline; } - -div#secondary li { +.tab-pane { + padding-top:15px; +} +/* buttons */ +button.btn, input.btn { + padding:6px 10px; + border-radius:5px; font-size:10pt; - float:left; - list-style:none; - margin-right:30px; + font-weight:normal; } -div#secondary li a { - color:black; +button.btn span.glyphicon { + margin-right:6px; } -div#secondary li a:hover { - color:#270A5A; - text-decoration:none; +button.btn-default { + border-bottom:3px solid #cccccc; } -div#secondary li:last-child { - margin-right:0; +button.btn-default:hover { + background-color:white; + border:1px solid #ADADAD; + border-bottom:3px solid #ADADAD; } - -div#navigation { - background-color:black; - width:100%; - height:40px; +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; } -div#navigation div.wrapper { - text-align:center; +button.btn-onelab:hover, input.btn-onelab:hover { + border:0; + border-bottom:3px solid #760073; + background-color:#302562; + color:white; } -div#navigation ul { - margin:0; - padding:0; - display: inline-block; - list-style-type: none; - white-space: nowrap; +button.btn-onelab:active, input.btn-onelab:active { + box-shadow:none; + border-bottom:1px solid #760073; + margin-top:2px; } -div#navigation li { - color:white; - font-family:helvetica, sans-serif; - font-size:10pt ; +.container-resource button { + padding:2px 4px; + border-radius:3px; + font-size:9pt; font-weight:normal; - line-height:0.8em; - letter-spacing:0.6pt; - list-style:none; - float:left; - padding:0; - margin:15px 50px 0 0; } -div#navigation li a { - color:white; +.container-resource select,.container-resource option, .container-resource input { + padding:2px 4px; + font-size:9pt; } -div#navigation li a:hover { - text-decoration:none; - color:#B8B2FF; +.badge { + font-size:9pt; + margin-left:4px; } -div#navigation li:last-child { - margin-right:0; +/***** Notifications *****/ +.warning { + border: 1px solid red; + margin: 20px 60px; + padding: 10px 20px; + color: red; + background-color: #f2dbdb; + text-align: center; } /* HOME DASHBOARD */ div#home-dashboard { color:black; - margin:25px auto; + margin:0 auto 25px auto; } div#home-dashboard table { margin:25px; @@ -191,60 +269,32 @@ div#home-dashboard div#home-slice-list li { } -.login-submit { - vertical-align:middle; - padding:0; -} -.lost-password { - font-size:10pt; - color:#CCCCCC; - text-align:right; - padding:0px; -} -.lost-password a { -} -.login-signup { - border-top:1px solid #CCCCCC; - text-align:center; - margin-top:15px; - padding:5px 0 0 0; -} /**/ -/* NAV TABS */ - -.nav.nav-tabs { -} - -.nav.nav-tabs li.active a { - -} - -.nav.nav-tabs li a { -} - -.nav.nav-tabs li a:hover { -} - /**/ /* WELL */ div.well { } /**/ -/* BUTTON */ -.btn.btn-default { - font-weight: bold; +/* TABLE */ +table.table { + margin:0; } - -.btn.btn-default:hover { - font-weight: bold; +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; - margin:25px auto; } .form-hint { font-size:11pt; @@ -252,11 +302,7 @@ div#institution { color:gray; } -/* SLICE REQUEST */ -div#slice-request { - color:black; - margin:25px auto; -} + .form-hint { font-size:11pt; font-style:italic; @@ -268,7 +314,6 @@ div#slice-request { /* TICKET REQUEST */ div#ticket-request { color:black; - margin:25px auto; } .form-hint { font-size:11pt; @@ -278,3 +323,477 @@ div#ticket-request { div#ticket-request p { margin:20px 0; } + +ul.nav-tabs { + margin:0 0 15px 0; +} +ul.nav-tabs ul {} +ul.nav-tabs li {} + +ul.nav-section li a { + color:black; + border-bottom:0; +} +ul.nav-section li:first-child { + padding:0; +} +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; +} + +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; +} + +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; +} +a.sl-resources.active, a.sl-resources.active:hover, a.sl-resources.active:focus { + border:0; + -moz-border-radius: 4px; + border-radius: 4px; +} +a.sl-resources:first-child { + margin-left:12px; +} +button.btn-apply { + font-size:13px; + padding:2px 8px; +} +div#slice-info { + margin-top:25px; +} +div#slice-info table { + width:100%; + margin:0 auto; +} +div#slice-info table td:first-child { + text-align:right; + font-weight:bold; + padding-right:15px; +} +div#slice-info td { + padding:5px; +} + +/* SLICE VIEW sections */ +.slice-sections, .slice-pending { + margin:0; + padding:0; +} +.slice-sections ul, .slice-pending ul { + margin:0; + padding:0; +} +.slice-pending ul { + width:400px; + margin:0 auto 15px auto; +} +.slice-sections li { + text-align:left; + margin:0; + padding:0; +} +.slice-pending li { + padding-right:15px; +} +.slice-sections li a, .slice-pending li a { + font-size:14px; + color:black; + padding:0; +} +.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 { + +} +.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; +} + +.slice-pending { +} +.slice-pending button { + font-size:9pt; + margin:-2px 0 0 0; + padding:3px 5px; +} +.slice-pending button.apply { + font-size:14px; + padding:2px 5px; +} +.slice-pending button.clear { +} +tr.active, tr.active td { + background-color:#FFFFCC !important; +} +div.dataTables_filter label{ + float:left; + width:400px; +} + +/* 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.navigation ul { + margin:26px 0 0 0; + padding:0; + display: inline-block; + list-style-type: none; + white-space: nowrap; +} + +div.navigation li { + color:#0C0047; + font-family:open_sansbold, sans-serif; + font-size:9pt; + font-weight:normal; + line-height:0.8em; + letter-spacing:0.4pt; + list-style:none; + float:left; + padding:0 15px; + margin:0; + text-transform:uppercase; +} +div.navigation li:hover { +} +div.navigation li a { + color:#0C0047; +} +div.navigation li a:hover, div.navigation li a.current { + color:#760073; + text-decoration:none; +} + +div.navigation li:last-child { + margin-right:0; +} + + +div.navigation .dropdown-menu { + color:black; + -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.navigation .dropdown-menu a { + font-family:Helvetica,sans-serif; + font-size:10pt; + color:black; +} +div.navigation .dropdown-menu li.title { + margin-bottom:10px; +} +div.navigation .dropdown-menu li.title a { + font-family:open_sansbold, sans-serif; +} + + +div.navigation .dropdown-menu li:first-child { + border-bottom:1px solid white; + padding-bottom:5px; + +} + +div.secondary { + text-align:right; +} + +div.secondary ul { + margin:6px 0 0 0; + padding: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.secondary li:last-child { + margin-right:0; +} +div.secondary li a { + color:#747474; +} +div.secondary li a:hover { + text-decoration:underline; +} +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.footer { + padding-top:15px; +} +div.footer div.bottom { + position:absolute; + bottom:0; +} +div.footer ul { + margin:6px 0 0 0; + padding:0; +} + +div.footer li { + font-size:9pt; + display:inline; + list-style:none; + margin:0px; + padding:0; + margin-right:15px; + color:#747474; + letter-spacing:0.4px; +} + +div.footer li a { + color:#747474; +} +div.footer li a:hover { + text-decoration:underline; +} +div.copy { + font-size:8pt; + color:gray; + padding-top:15px; + padding-bottom:15px; +} + +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; +} + +.login-form input { + width:320px; +} +.login-form input[type=submit] { + width:108px; +} + +.login-submit { + vertical-align:middle; + padding:0; +} +.lost-password { + font-size:10pt; + color:black; + text-align:right; + padding:0px; +} +.lost-password a { + color:white; + text-shadow:0.5px 0.5px black; +} +.login-signup { + font-size:12pt; + color:white; + text-shadow:0.5px 0.5px black; + margin-top:45px; + padding:5px 0 0 4px; + +} +.login-signup a { + color:white; + text-shadow:0.5px 0.5px black; + padding-bottom:2px; + border-bottom:2pt solid white; +} +.login-signup a:hover { + text-decoration:none; +} +.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; +} +div.slogan { + text-align:center; + color:white; + padding-top:60px; + text-shadow: 1px 1px #013540; +} + +th { + border:0 !important; +} + +div.monitor { + padding:40px 0 25px 0; +} +div.monitor h1 { + margin-bottom:25px; +} +div.s-monitor { + padding-bottom:25px; +}