res.ui.webconsole.css Maven / Gradle / Ivy

Go to download
Show more of this group Show more artifacts with this name
Show all versions of org.apache.felix.webconsole Show documentation
Web Based Management Console for OSGi Frameworks. See http://felix.apache.org/site/apache-felix-web-console.html for more information on this bundle.
There is a newer version: 5.0.8
Show newest version
/*
 * Licensed to the Apache Software Foundation (ASF) under one or more
 * contributor license agreements.  See the NOTICE file distributed with
 * this work for additional information regarding copyright ownership.
 * The ASF licenses this file to You under the Apache License, Version 2.0
 * (the "License"); you may not use this file except in compliance with
 * the License.  You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */

/*
 * The webconsole.css is the main CSS which sets up the following parts
 *
 *   div main -> outermost div just inside body
 *   div lead -> the page lead with title and logo
 *   div technav -> the top navigation
 *   div content -> the div surrounding the content being rendered by
 *      the plugin in the renderContent (or service) method
 *
 * See also http://felix.apache.org/site/branding-the-web-console.html
 */ 
#main {
	width: 90% !important;
	margin-left: 5%;
}
#main img { border: none }


/* LOGO & BRANDING */
#lead {
	padding-top: 10px;
	margin: 0;
	height: 73px; /* must be the same as logo (#lead p) height */
}
#lead h1 { /* This contains the page title */
	font-size: 26px;
	font-weight: bold;
	float: left;
}
#lead p { /* This contains the logo */
	float: right;
	height: 73px; /* must be the same as #lead height */
}
#lead p img { /* This is the logo */
	height: 63px; /* must be #lead.height - #lead.padding-top */
}


/* TOP NAVIGATION */
#technav {
	font-size: 10px;
	line-height: 21px;
	padding: 0;
	margin: 0;
}
#technav div {
	display: inline;
	padding: .2em 1em;
	white-space: nowrap;
}

/* New Category Based Navigation Tree (FELIX-3769) */
#navmenu {
     width: auto;
     padding: 2px;
}

#navmenu li.ui-menu-item {
     width: auto;
}

#navmenu li.ui-menu-item a {
    text-decoration: none;
    display: block;
    padding: 2px .4em;
    line-height: 1.5;
    zoom: 1;
    font-weight: normal;
}

#navmenu li.navMenuItem-0 {
    display: inline-block;
}

/* Don't display caret on top-level menu (FELIX-3841) */
#navmenu li.navMenuItem-0 > a > span {
    display: none;
}

/* CENTRAL CONTENT AREA STYLING */
#content, .ui-widget, .ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button { font-size: 8pt }


/* used in some plugins - showing ID (long) element in tables */
.col_Id {
	width: 5em;
}

/* styling button groups like in the bundles & log plugins */
.buttonGroup {
	text-align: right;
	padding: .5em 1em .5em 0;
	vertical-align: middle;
}
.buttonGroup select {
	display: inline;
	float: none;
	margin: 0;
}

/* The following styles are not complete. They usually apply only padding, 
 * margin... mostly *WHERE* the elements are visualised. Visual styling like
 * colors and fonts are applied automatically by a JavaScript that borrows
 * the visual element styles from the JQuery UI theme 
 */

/* input box, checkbox & buttons styling */
.inputText, input.text, input.password, input.file, textarea, select {
	color: #184054;
	background-color: #f0f0f0;
}
.inputText, input.text, input.password, textarea {
	border: 1px solid #999999;
	border-bottom: 1px solid #cccccc;
	border-right: 1px solid #cccccc;
}

/* tables styling - must be in synch with tablesorter CSS */
td, th { vertical-align: top }
table.nicetable {
	width: 100%;
	text-align: left;
}
table.nicetable th, table.nicetable td {
	border-bottom: 1px solid #cccccc;
	text-align: left;
	padding: .2em;
	padding-left: .8em;
}

/* tablesorter styling */
tr .header {
	background-image: url(../lib/bg.gif) !important;
	background-repeat: no-repeat !important;
	background-position: center right !important;
	cursor: pointer !important;
}
tr .headerSortUp {
	background-image: url(../lib/asc.gif) !important;
}
tr .headerSortDown {
	background-image: url(../lib/desc.gif) !important;
}

/* status line */
.statline {
	margin-top: .5em !important;
	margin-bottom: .5em !important;
	padding: .2em;
}

/* zebra tables */
.even {
	/* default background unmodified from JQuery UI Theme */
}

.odd {
	/* overwrite background from JQuery UI Theme */
	background: none !important;
}

/*
 * Common UI style to define button icons like in bundles plugin. The HTML markup is:
 * 
 *    
 * 
 */
ul.icons {
	margin: 0;
	padding: 0
}
ul.icons span.ui-icon {
	float: left;
	margin: 0 1px
}
ul.icons li {
	margin: 1px;
	position: relative;
	padding: 1px 0;
	cursor: pointer;
	float: left;
	list-style: none
}
/* language selection element */
#langSelect { position: absolute; top: 5px; right: 5px }
#langSelect img   { display: block; padding: 2px 0 }
/* logout element */
.logoutButton { float: right; text-decoration: none }


.filterBox      { float: left; margin-left: 1em }
.servicesFilter { width: 400px; }
.servicesFilterApply { width: 85px; }