X-Git-Url: http://git.onelab.eu/?a=blobdiff_plain;f=portal%2Fstatic%2Fcss%2Fonelab.css;h=44cdc4a5e832fe30bc10d0b69d1452e33f555a8f;hb=895735ab33d121bf9cea8e6fadaa3ac94de1b33e;hp=d5047550169d9a3cc7aa390a36585c4c28a1c033;hpb=3d16aa36af64e8e0e5ce3a48c34df158fbfaae29;p=unfold.git diff --git a/portal/static/css/onelab.css b/portal/static/css/onelab.css index d5047550..44cdc4a5 100644 --- a/portal/static/css/onelab.css +++ b/portal/static/css/onelab.css @@ -1,342 +1,36 @@ -/* @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.plugin-tooltip:hover { - color: #fff; - text-decoration: none; -} - - - -/* LIST VIEW */ -div.well-lg { - background-color: rgba(168, 32, 202, 0.5) ; -} -div.onelab-title { - background-color: rgba(168, 32, 202, 0.5) ; -} - -h2.well.well-lg { - 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 ; -} - -#complete-filters { -/* background-color: #4af25d; */ - background-color: #add7ff; -} - -#complete-users { -/* background-color: #ff7394 ; */ - background-color: #add7ff ; -} -/* -#complete-measurements { - background-color: ; -} -*/ -#complete-pending { -/* background-color: #add7ff ; */ - background-color: #B8B2FF ; - -} - -#complete-customize-resources { - background-color: #efdfdf; -} - -#complete-msgs-pre { - background-color: #ccc; -} - -#complete-resources, -#complete-filters, -#complete-users, -#complete-measurements, -#complete-pending, -#complete-customize-resources, -#complete-msgs-pre { - opacity: 1; - 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; -} - - - - -.navbar-nav li a:hover { - color: #572bc9 ; -} - -.navbar-nav li.active a { - background: #eee ; -} - -/* Thierry : turning this off -ul.logged-in { - padding-top: 25px; -} -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; -} - -button.logged-in:hover { - /* background: #4af25d; */ - background: #ff7394; - border: 2px solid #ff7394; - color: #333; -} -li.username { - margin-bottom: 10px; - font-size: 0.8em; - text-transform: none; - font-weight: normal; - color: #999; -} - - -/* BOOTSTRAP */ - - -ul.pagination li a { - /* background: ; */ - color: #572bc9; - font-family: Ubuntu, Arial, sans-serif; -} - -ul.pagination li.active a { - background: #572bc9; - border: 1px solid #572bc9; +a, a:active, a:focus { + outline: 0; } - - -div.dataTables_length label, -div.dataTables_filter label, -div.dataTables_info { - font-family: Ubuntu, Arial, sans-serif ; +h1 { + border-bottom:1px solid #DDDDDD; + padding:0 0 0 0; + margin:0 0 0 0; + font-size:14pt; } - - - - -/* 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; +h1 img { vertical-align:middle; - background: url('../img/tablesort-header.png') no-repeat ; + margin-bottom:4px; + margin-right:10px; } - -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 ; -} - -div.QueryTable table.dataTable thead { - background: url('../img/tablesort-header.png') repeat-x ; - background-color: #caebea; -} - -div.QueryTable table.dataTable tfoot { - background: url('../img/tablesort-header.png') repeat-x ; - /* background-color: # ; */ -} - - -/* QUERY EDITOR */ - -table.query-editor { - margin: 40px auto ; - clear: both; - /* width: 80%;*/ - width: 100% ; - font-family: Ubuntu; -} - -.query-editor-spacer, -.plugin.QueryUpdater, -/* Thierry : turning this off -.plugin.Tabs -Thierry */ -{ - margin-top: 60px ; +h2 { + font-size:14pt; + color:#333333; } - -table.query-editor td { - padding: 5px 5px ; - font: normal 12px Ubuntu, Arial, sans-serif ; -} - - - -/* DASHBOARD */ - -#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; - text-align: center; - -} - -#ms-dashboard-profile:hover, -#ms-dashboard-testbeds:hover, -#ms-dashboard-slices:hover { - margin-top: 65px; -} - -#ms-dashboard-profile { - background: url("../img/icon_users_color.png") top center no-repeat; -} - -#ms-dashboard-testbeds { - background: url("../img/icon_testbed_color.png") top center no-repeat; -} - -#ms-dashboard-slices { - background: url("../img/icon_slices_color.png") top center no-repeat; -} - -.ms-dashboard-content ul { - list-style-type: none ; - padding-left: 0; - text-align: center ; -} - -.ms-dashboard-content { - padding: 0 ; -} - - -#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; - margin:0; - padding:0; -} -a, a:active, a:focus { - outline: 0; +h3 { + font-size:13pt; + color:#201E62; } div.wrapper { @@ -344,6 +38,14 @@ div.wrapper { margin:0 auto; position:relative; } +div.container { + /*width:980px; + margin:25px auto;*/ +} +div.wide { + margin:25px auto; + padding:0 25px; +} span.label { font-size:11pt; @@ -361,29 +63,36 @@ span.label { text-align: center; } /* HEADER */ -div#header { - height:100px; - background-color:white; +#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; + z-index:2; } + div#secondary { } div#secondary ul { position:absolute; - top:20px; + top:8px; right:0; } div#secondary li { - font-size:10pt; + font-size:9pt; float:left; list-style:none; margin-right:30px; + color:gray; } div#secondary li a { - color:black; + color:gray; } div#secondary li a:hover { color:#270A5A; @@ -432,10 +141,47 @@ div#navigation li:last-child { margin-right:0; } +div#navigation li.active { + padding:5px; + padding-top: 15px; + min-height: 40px; + margin-top: 0px; + background-color:gray; + color:#FF0000; +} +div#navigation li.slices { + position:relative; + cursor:pointer; +} +div#navigation .dropdown-menu { + color:white; + padding:0 15px 15px 15px; + margin-top:5px; + margin-left:-16px; + background-color:black; +} +div#navigation .dropdown-menu a { + color:white; +} + +div#menu-slice-list{ + display:none; + position:absolute; + background-color:black; + padding:15px; + left:-15px; + z-index:10; +} + +div#navigation .dropdown-menu li:first-child { + border-bottom:1px solid white; + padding-bottom:5px; + +} /* HOME DASHBOARD */ div#home-dashboard { color:black; - margin:25px auto; + margin:0 auto 25px auto; } div#home-dashboard table { margin:25px; @@ -452,20 +198,33 @@ div#home-dashboard table tr:first-child td { color:#270A5A; } div#home-dashboard table tr:last-child td { - font-size:12pt; vertical-align:top; + padding:25px 0; +} +div#home-dashboard table tr:last-child td.logged-in { border-right:1px solid #DDDDDD; padding:25px; } +div#home-dashboard table tr:last-child td.support { + border-left:1px solid #DDDDDD; + padding:25px; +} 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 div { +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 { @@ -478,51 +237,375 @@ div#home-dashboard div#manager { display:none; } -.login-submit { - vertical-align:middle; +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; } -.lost-password { - font-size:10pt; - color:#CCCCCC; - text-align:right; - padding:0px; +div#home-dashboard div#home-slice-list li { + } -.lost-password a { + +/**/ + +/**/ +/* WELL */ +div.well { } -.login-signup { - border-top:1px solid #CCCCCC; - text-align:center; - margin-top:15px; - padding:5px 0 0 0; +/**/ +/* BUTTON */ +.btn.btn-default { + font-weight: bold; +} + +.btn.btn-default:hover { + font-weight: bold; } /**/ +/* 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; +} -/* NAV TABS */ -.nav.nav-tabs { +.form-hint { + font-size:11pt; + font-style:italic; + color:gray; } -.nav.nav-tabs li.active a { - + + +/* TICKET REQUEST */ +div#ticket-request { + color:black; +} +.form-hint { + font-size:11pt; + font-style:italic; + color:gray; +} +div#ticket-request p { + margin:20px 0; } -.nav.nav-tabs li a { +ul.nav-tabs {} +ul.nav-tabs ul {} +ul.nav-tabs li {} + +ul.nav-section li a { + border-bottom:0; +} +ul.nav-section li:first-child { + padding:0; +} +ul.nav-section li:first-child a { + font-weight:bold; + padding:6px 15px 4px 15px; +} +ul.nav-section li:first-child.active a { + padding:6px 15px 3px 15px; +} +ul.nav-section li:first-child img { + margin:0 4px 1px 0; + padding:0; } -.nav.nav-tabs li a:hover { +ul.nav-resources { + margin:15px 0; +} +ul.nav-resources a { + padding: 4px 10px 5px 10px; } -/**/ -/* WELL */ -div.well { +/* SLICE VIEW */ + + +div#slice-view { + margin:0; } -/**/ -/* BUTTON */ -.btn.btn-default { +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; } -.btn.btn-default:hover { - font-weight: bold; +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; +} + +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 { +} +.slice-pending button.clear { +} +tr.active, tr.active td { + background-color:#FFFFCC !important; +} +div.dataTables_filter label{ + float:left; + width:400px; +} + +/**/ +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:10pt; + 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.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.registration-form { + padding-top:150px; + text-align:center; +} +div.login-form input[type=text] { + + + +} +.login-form input { + font-size:12pt; + width:320px; + padding:8px; + border:1pt solid #22606D; +} +.login-form input[type=submit] { + border:0; + border-bottom:2px solid #540086; + background-color:#302562; + color:white; + width:100px; + border-radius:5px; + font-size:12pt; +} + +.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; } \ No newline at end of file