From 3920b36b4aa1dda06cea09b09d4e327e07edfdc9 Mon Sep 17 00:00:00 2001 From: Adam Young Date: Thu, 6 Jan 2011 11:22:57 -0500 Subject: action panel style make clickable links blue change spacing to keep headers from wrapping convert most px values to em, to support scaling indent action controls and place them under the active facet set default font size to 11px --- install/static/entity.js | 37 ++++++++-- install/static/ipa.css | 172 ++++++++++++++++++++++------------------------- 2 files changed, 110 insertions(+), 99 deletions(-) diff --git a/install/static/entity.js b/install/static/entity.js index 8620ef09..a6f31e84 100644 --- a/install/static/entity.js +++ b/install/static/entity.js @@ -486,11 +486,22 @@ function ipa_facet_create_action_panel(container) { /*assume for now that entities with only a single facet do not have search*/ if (entity.facets.length > 0 ){ - main_facet.text( 'List ' + IPA.metadata[entity_name].label); + if ( entity.facets[0].name === ipa_current_facet( entity)){ + main_facet.text( IPA.metadata[entity_name].label); + main_facet.appendTo(ul); + ul.append($('
    • ')); + }else{ + main_facet.html( + $('',{ + "class":"input_link" + }).append( + $('',{ + "class":"ui-icon ui-icon-triangle-1-w " + }) + ).append('Back to List ')); + main_facet.appendTo(ul); + } } - main_facet.appendTo(ul); - - ul.append($('
    • ')); var facet_groups = {}; for (var i=1; i'). + append('
  • '+ text+'
    • '). + append($('
  • ',{ + html:$('',{ + class:"action-controls"})}))); + } facet_groups[facet_group] = li.next(); + } else { ul.append(build_link(other_facet, other_facet.label)); + if ( other_facet.name === ipa_current_facet( entity)){ + ul.append($('
    • ')); + } } } }else{ diff --git a/install/static/ipa.css b/install/static/ipa.css index df138aa2..85ec91f3 100644 --- a/install/static/ipa.css +++ b/install/static/ipa.css @@ -8,15 +8,19 @@ */ +@font-face {font-family: "FreeWay"; src:url("FreeWay.otf");} +@font-face {font-family: "FreeWayBold"; src:url("FreeWay-Bold.otf");} + body{ border-width: 0; font-family:"Liberation Sans",Arial,Sans; - font-size:62.5%; + font-size:11px; margin: 0; } -@font-face {font-family: "FreeWay"; src:url("FreeWay.otf");} -@font-face {font-family: "FreeWayBold"; src:url("FreeWay-Bold.otf");} +.ui-widget { + font-size: 1em; +} .input_link { padding: .4em 1em .4em 2em; @@ -28,18 +32,17 @@ body{ .input_link span.ui-icon { -moz-border-radius: 0.3em; border: 1px solid #B8B8B8; - margin: -9px 0.4em 0em -0.3em; + margin: -0.9em 0.4em 0em -0.3em; position: absolute; left: .2em; top: 50%; - } /* ---- Header ---- */ div.header { background-color:#0C3B00; width: 100%; - height: 40px; + height: 4em; } div.header a { @@ -65,32 +68,22 @@ div.header span.header-logo a img { } div.header span.header-loggedinas { - width: 960px; + width: 96em; color: #fff; display: block; padding-left: none; - margin-top: -26px; + margin-top: -2.6em; margin-left: auto; - margin-right: 276px; - width: 200px; + margin-right: 27.6em; + width: 20em; } - - /* ---- Navigation ---- */ div.tabs { overflow: auto; width: 100%; height: 100%; - min-height: 400px; -} - -h1 { - font-size: 26pt; - font-weight: bold; - margin-bottom: 30px; - margin-left: 15px; - margin-top: 18px; + min-height: 40em; } div#content { @@ -101,7 +94,7 @@ div#content { ul#viewtype { - padding-left: 20px; + padding-left: 2em; } ul#viewtype li { @@ -109,7 +102,7 @@ ul#viewtype li { display: inline; font-weight: bold; list-style-type: none; - padding-right: 20px; + padding-right: 2em; } @@ -123,7 +116,7 @@ ul#viewtype li a { div.content div.content-buttons { float: right; - margin-right: 15px; + margin-right: 1.5em; } div.content div.content-buttons img { @@ -136,8 +129,8 @@ h2 { font-weight: normal; color: #333333; text-transform: uppercase; - margin-left: 15px; - margin-bottom: 0px; + margin-left: 1em; + margin-bottom: 0; text-align: left; } @@ -155,19 +148,19 @@ hr { background-color: #EEEEEE; clear: both; color: #FFFFFF; - height: 1px; - margin-left: 15px; - margin-right: 15px; - margin-top: 10px; + height: 0.1em; + margin-left: 1.5em; + margin-right: 1.5em; + margin-top: 1em; } .details-section { - margin-left: 45px; - margin-right: 15px; - margin-top: 18px; + margin-left: 4.5em; + margin-right: 1.5em; + margin-top: 1.8em; white-space: nowrap; - padding-bottom: 18px; - padding-right: 18px; + padding-bottom: 1.8em; + padding-right: 1.8em; } .undo { @@ -176,52 +169,47 @@ hr { dl.entryattrs { clear: both; - margin-left: 15px; - margin-top: 18px; + margin-left: 1.5em; + margin-top: 1.8em; white-space: nowrap; } dl.entryattrs dt { clear: left; float: left; - padding-bottom: 18px; - padding-right: 18px; + padding-bottom: 1.8em; + padding-right: 1.8em; text-align: right; - width: 160px; + width: 16em; margin: 0.5em -0.5em 0 -6em; } dl.entryattrs dd { float: left; - padding-bottom: 18px; + padding-bottom: 1.8em; } dl.entryattrs dd.first { - margin-left: 0px; - margin-top: 7px; + margin-left: 0; + margin-top: 0.7em; } dl.entryattrs dd.other { clear: both; - margin-left: 107px; + margin-left: 10.7em; } dl.entryattrs input { - margin-right: 5px; - margin-top: -12px; - min-width: 275px; + margin-right: 0.5em; + margin-top: -1.2em; + min-width: 27.5em; } -div#backtotop { - margin-left: 20px; - margin-right: 20px; - text-align: right; -} span.attrhint { font-size: 8pt; - left: 40em; - margin-left: 100px; + left: 5em; + margin-left: 12.5em; position: absolute; overflow-x: hidden; } @@ -235,13 +223,14 @@ span.attrhint { border: none; background-image: url(Mainnav-background.png); -moz-border-radius: 0; - } .ui-tabs { padding:0; } +#the positions for these are in the large icon image, +#and need to be specified in pixels. .ui-icon-plus { background-position: -16px -129px; } @@ -343,7 +332,7 @@ span.attrhint { .tabs2 .ui-tabs-nav { padding: 0.3em 6em 0 7em; - margin: 0px; + margin: 0; height: 2.5em; background-image: url(Subnav-background.png); } @@ -351,7 +340,7 @@ span.attrhint { .tabs2 .ui-tabs-nav li { width:auto; padding-left: 1em; - margin: 0px 0; + margin: 0; background: #326122 !important; color: white; } @@ -383,7 +372,6 @@ span.attrhint { } .tabs2 .ui-tabs-nav li.ui-tabs-selected a{ - # border:1px solid #1C3612; background: none repeat scroll 0 0 #1C3612; color: white; @@ -408,7 +396,7 @@ span.main-separator{ .entity-container{ position: relative; - left: 250px; + left: 25em; width: 80%; margin: 0.06em; padding: 0.06em; @@ -417,7 +405,7 @@ span.main-separator{ .action-panel { position: fixed; - height: 330px; + height: 33em; left: 3em; border: none; float: left; @@ -425,7 +413,7 @@ span.main-separator{ margin-left: 2.5em; padding-left: 0.5em; padding-bottom: 1em; - width: 15.5em; + width: 18em; background-image:url('panel-background.png'); background-repeat:no-repeat; background-position:right; @@ -457,13 +445,13 @@ span.main-separator{ font-size: 1.1em; color: #1d85d5; list-style-type: none; - height: 2.1em; + min-height: 2.1em; padding: none; } .action-panel li.search-facet { font-family: "FreeWayBold", "Liberation Sans", Arial, Sans; - color: #333333; + color: #1D85D5; cursor: pointer; text-transform: uppercase; font-size: 1.2em; @@ -500,11 +488,15 @@ span.main-separator{ font-size: 0.9em; } +.action-controls { + padding-left: 2em; +} .client { + font-size: 10px; margin-top: 0.4em; float: left; - min-width: 700px; + min-width: 70em; } @@ -512,11 +504,11 @@ span.main-separator{ .search-controls { -moz-border-radius: .7em .7em 0 0; - height: 25px; + height:2.5em; background: -moz-linear-gradient(top, #eeeeee, #dfdfdf); position: relative; padding: 1em 1.5em; - margin-top: 15px; + margin-top: 1.5em; } .search-table > a:link,a:visted{ @@ -640,59 +632,55 @@ table.scrollable tbody { } .adder-dialog-filter { - height: 25px; -} - -.adder-dialog-filter { - height: 25px; + height: 2.5em; } .adder-dialog-results { position: relative; - height: 200px; + height: 20.0em; } .adder-dialog-available { border: 1px solid black; position: absolute; - top: 0px; - left: 0px; - bottom: 0px; - width: 250px; + top: 0; + left: 0; + bottom: 0; + width: 25.0em; } .adder-dialog-buttons { position: absolute; - top: 15px; - left: 250px; - right: 250px; - bottom: 0px; + top: 1.5em; + left: 25em; + right: 25; + bottom: 0; text-align: center; } .adder-dialog-selected { border: 1px solid black; position: absolute; - top: 0px; - right: 0px; - bottom: 0px; - width: 250px; + top: 0; + right: 0; + bottom: 0; + width: 25em; } .adder-dialog-internal { border: 1px solid black; position: absolute; - top: 0px; - left: 0px; - bottom: 45px; - width: 250px; + top: 0; + left: 0; + bottom: 4.5em; + width: 25em; } .adder-dialog-external { border: 1px solid black; position: absolute; - left: 0px; - bottom: 0px; - width: 250px; - height: 40px; + left: 0; + bottom: 0; + width: 25em; + height: 4em; } -- cgit