From c5d59f48a8bccc8770b257f851bba18bdce61d2e Mon Sep 17 00:00:00 2001 From: Jose Antonio Marquez Date: Fri, 13 Jul 2012 11:45:09 -0700 Subject: New: Improved Breadcrumb Layout Added new CSS/HTML layout for the breadcrumb component. --- .../bread-crumb-button.reel/bread-crumb-button.css | 45 ++++++++++++++++++++++ .../bread-crumb-button.html | 5 ++- .../layout/bread-crumb.reel/bread-crumb.css | 8 ++-- 3 files changed, 51 insertions(+), 7 deletions(-) diff --git a/js/components/layout/bread-crumb-button.reel/bread-crumb-button.css b/js/components/layout/bread-crumb-button.reel/bread-crumb-button.css index 9d6c37a7..eb5a29e0 100755 --- a/js/components/layout/bread-crumb-button.reel/bread-crumb-button.css +++ b/js/components/layout/bread-crumb-button.reel/bread-crumb-button.css @@ -28,3 +28,48 @@ CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE. */ + +.breadcrumbComp { + float: left; + margin: 3px -10px 0 0; +} + +.breadcrumbButton { + color: #FFF; + float: left; + background: rgb(80, 80, 80); + border: none; + padding: 0 8px 0 14px; + height: 20px; + margin: 0; + border-top: 1px solid rgb(60, 60, 60); + border-left: 1px solid rgb(60, 60, 60); + border-bottom: 1px solid rgb(60, 60, 60); + cursor: pointer; + text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5); +} + +.breadcrumbButton:active, .breadcrumbButton:hover, .breadcrumbButton:focus { + -webkit-box-shadow: none !important; + outline: none !important; +} + +.breadcrumbTipMask +{ + display: block; + width: 11px; + height: 20px; + float: left; + overflow: hidden; +} + +.breadcrumbTip { + display: block; + width: 14px; + height: 14px; + margin: 3px 0 0 -7px; + -webkit-transform: rotate(45deg); + background: rgb(80, 80, 80); + border-top: 1px solid rgb(60, 60, 60); + border-right: 1px solid rgb(60, 60, 60); +} \ No newline at end of file diff --git a/js/components/layout/bread-crumb-button.reel/bread-crumb-button.html b/js/components/layout/bread-crumb-button.reel/bread-crumb-button.html index 6c881277..596975de 100755 --- a/js/components/layout/bread-crumb-button.reel/bread-crumb-button.html +++ b/js/components/layout/bread-crumb-button.reel/bread-crumb-button.html @@ -67,8 +67,9 @@ POSSIBILITY OF SUCH DAMAGE. -

- +

+ +

diff --git a/js/components/layout/bread-crumb.reel/bread-crumb.css b/js/components/layout/bread-crumb.reel/bread-crumb.css index 2dd34af3..ab00bcc8 100755 --- a/js/components/layout/bread-crumb.reel/bread-crumb.css +++ b/js/components/layout/bread-crumb.reel/bread-crumb.css @@ -43,9 +43,7 @@ POSSIBILITY OF SUCH DAMAGE. border-bottom:1px solid #000; margin-bottom:1px; } -.breadcrumbTrail button.nj-skinned { - float: left; - width: 60px; - margin: 2px; -} +.breadcrumbTrail div:first-child { + margin-left: 2px; +} -- cgit v1.2.3