You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
313 lines
7.9 KiB
313 lines
7.9 KiB
@import "../common/domButtons/DomButtonWhiteCross.css"; |
|
/* dojox.mobile.TabBar */ |
|
.mblTabBar { |
|
position: relative; |
|
margin: 0px; |
|
overflow: hidden; |
|
white-space: nowrap; |
|
text-overflow: ellipsis; |
|
padding: 0px 6px; |
|
height: 42px; |
|
text-align: center; |
|
color: white; |
|
border-top: 1px solid #cdd5df; |
|
border-bottom: 1px solid #007aff; |
|
} |
|
/* dojox.mobile.TabBarButton */ |
|
.mblTabBarFill .mblTabBarButton { |
|
box-sizing: border-box; |
|
-moz-box-sizing: border-box; |
|
-webkit-box-sizing: border-box; |
|
} |
|
.mblTabBarButton { |
|
overflow: hidden; |
|
cursor: pointer; |
|
-webkit-tap-highlight-color: rgba(255, 255, 255, 0); |
|
position: relative; |
|
list-style-type: none; |
|
float: left; |
|
} |
|
.mblTabBarButtonIconArea { |
|
margin: 0 auto; |
|
width: 29px; |
|
} |
|
.mblTabBarButtonIconParent1 { |
|
display: block; |
|
} |
|
.mblTabBarButtonIconParent2 { |
|
display: none; |
|
} |
|
.mblTabBarButtonSelected .mblTabBarButtonIconParent1 { |
|
display: none; |
|
} |
|
.mblTabBarButtonSelected .mblTabBarButtonIconParent2 { |
|
display: block; |
|
} |
|
/* barType="tabBar" */ |
|
.mblTabBarTabBar { |
|
height: 48px; |
|
border-top: 1px solid #000000; |
|
background-color: #eeeeee; |
|
border: none; |
|
line-height: 0.5em; |
|
} |
|
.mblTabBarTabBar .mblTabBarButton { |
|
height: 47px; |
|
} |
|
.mblTabBarTabBar .mblTabBarButtonIconArea { |
|
padding-top: 4px; |
|
} |
|
.mblTabBarTabBar .mblTabBarButtonLabel { |
|
font-family: "Helvetica Neue", Helvetica; |
|
font-size: 11px; |
|
} |
|
.mblTabBarTabBar .mblTabBarButtonSelected { |
|
border-radius: 3px; |
|
color: #007aff; |
|
} |
|
/* barType="segmentedControl" */ |
|
.mblTabBarSegmentedControl { |
|
background-image: none; |
|
background-color: #eeeeee; |
|
border: none; |
|
} |
|
.mblTabBarSegmentedControl.mblTabBarNoText .mblTabBarButton { |
|
width: auto; |
|
padding: 0 3px; |
|
} |
|
.mblTabBarSegmentedControl.mblTabBarNoText .mblTabBarButtonIconArea { |
|
position: relative; |
|
} |
|
.mblTabBarSegmentedControl .mblTabBarButton { |
|
margin: 6px 0; |
|
width: 100px; |
|
height: 29px; |
|
border-width: 1px 1px 1px 0px; |
|
font-family: Helvetica; |
|
font-size: 13px; |
|
font-weight: bold; |
|
text-align: center; |
|
line-height: 29px; |
|
color: #007aff; |
|
height: 28px; |
|
font-weight: normal; |
|
} |
|
.mblTabBarSegmentedControl .mblTabBarButton:first-child { |
|
border-left-width: 1px; |
|
border-top-left-radius: 0px; |
|
border-bottom-left-radius: 0px; |
|
} |
|
.mblTabBarSegmentedControl .mblTabBarButton:last-child { |
|
border-top-right-radius: 0px; |
|
border-bottom-right-radius: 0px; |
|
} |
|
.mblTabBarSegmentedControl .mblTabBarButtonIconArea { |
|
position: absolute; |
|
top: 0px; |
|
left: 0px; |
|
} |
|
.mblTabBarSegmentedControl .mblTabBarButtonSelected { |
|
height: 28px; |
|
background-color: #007aff; |
|
color: white; |
|
font-weight: normal; |
|
} |
|
.mblHeading .mblTabBarSegmentedControl { |
|
display: inline; |
|
float: left; |
|
height: auto; |
|
border: none; |
|
} |
|
/* barType="standardTab" */ |
|
.mblTabBarStandardTab { |
|
background-image: none; |
|
background-color: #eeeeee; |
|
border: none; |
|
font-weight: normal; |
|
} |
|
.mblTabBarStandardTab .mblTabBarButton { |
|
margin-top: 9px; |
|
padding: 9px; |
|
border: 1px solid #62676d; |
|
border-top-left-radius: 4px; |
|
border-top-right-radius: 4px; |
|
font-family: Helvetica; |
|
font-size: 14px; |
|
font-weight: bold; |
|
} |
|
.mblTabBarStandardTab .mblTabBarButtonIconArea { |
|
position: absolute; |
|
top: 3px; |
|
left: 0px; |
|
} |
|
.mblTabBarStandardTab .mblTabBarButtonLabel { |
|
font-weight: normal; |
|
} |
|
.mblTabBarStandardTab .mblTabBarButtonSelected { |
|
color: white; |
|
background-color: #007aff; |
|
} |
|
.mblTabBarStandardTab .mblTabBarButtonHasIcon .mblTabBarButtonLabel { |
|
margin-left: 20px; |
|
} |
|
/* barType="slimTab" */ |
|
.mblTabBarSlimTab { |
|
height: 30px; |
|
padding: 0px; |
|
border: 1px solid #007aff; |
|
background-color: #000000; |
|
background-image: -webkit-gradient(linear, left top, left bottom, from(#2d2d2d), to(#000000), color-stop(0.5, #141414), color-stop(0.5, #000000)); |
|
background-image: linear-gradient(to bottom, #2d2d2d 0%, #141414 50%, #000000 50%, #000000 100%); |
|
} |
|
.mblTabBarSlimTab .mblTabBarButton { |
|
padding: 7px; |
|
border-right: 1px solid #4e4e4e; |
|
background-image: -webkit-gradient(linear, left top, left bottom, from(#2d2d2d), to(#000000), color-stop(0.5, #141414), color-stop(0.5, #000000)); |
|
background-image: linear-gradient(to bottom, #2d2d2d 0%, #141414 50%, #000000 50%, #000000 100%); |
|
font-family: Helvetica; |
|
font-size: 14px; |
|
font-weight: bold; |
|
color: white; |
|
text-shadow: rgba(100, 100, 100, 0.6) 0px -1px 0px; |
|
text-align: center; |
|
} |
|
.mblTabBarSlimTab .mblTabBarButton:first-child { |
|
border-left: 1px solid #4e4e4e; |
|
} |
|
.mblTabBarSlimTab .mblTabBarButtonIconArea { |
|
position: absolute; |
|
top: 0px; |
|
left: 0px; |
|
} |
|
.mblTabBarSlimTab .mblTabBarButtonSelected { |
|
background-color: #404040; |
|
background-image: -webkit-gradient(linear, left top, left bottom, from(#313031), to(#959595), color-stop(0.5, #5a555a), color-stop(0.5, #616161)); |
|
background-image: linear-gradient(to bottom, #313031 0%, #5a555a 50%, #616161 50%, #959595 100%); |
|
} |
|
.mblTabBarSlimTab .mblTabBarButtonHasIcon .mblTabBarButtonLabel { |
|
margin-left: 20px; |
|
} |
|
/* barType="flatTab" */ |
|
.mblTabBarFlatTab { |
|
height: 30px; |
|
padding: 0px; |
|
border-style: none; |
|
background-color: transparent; |
|
background-image: none; |
|
} |
|
.mblTabBarFlatTab .mblTabBarButton { |
|
padding: 7px; |
|
background-image: none; |
|
font-family: Helvetica; |
|
font-size: 14px; |
|
font-weight: bold; |
|
text-shadow: rgba(100, 100, 100, 0.6) 0px -1px 0px; |
|
text-align: center; |
|
} |
|
.mblTabBarFlatTab .mblTabBarButtonIconArea { |
|
position: absolute; |
|
top: 0px; |
|
left: 0px; |
|
} |
|
.mblTabBarFlatTab .mblTabBarButtonHasIcon .mblTabBarButtonLabel { |
|
margin-left: 20px; |
|
} |
|
/* barType="tallTab" */ |
|
.mblTabBarTallTab { |
|
height: 64px; |
|
border-top: 1px solid #cdd5df; |
|
border-bottom: 2px solid #949694; |
|
background-color: #eeeeee; |
|
border: none; |
|
} |
|
.mblTabBarTallTab .mblTabBarButton { |
|
margin-top: 3px; |
|
margin-right: 2px; |
|
width: 78px; |
|
height: 61px; |
|
border-width: 0px 1px 0px 1px; |
|
border-style: solid; |
|
border-color: black #182018 black #393c39; |
|
background-image: -webkit-gradient(linear, left top, left bottom, from(#181818), to(#100c10), color-stop(0.1, #313031)); |
|
background-image: linear-gradient(to bottom, #181818 0%, #313031 10%, #100c10 100%); |
|
font-family: Helvetica; |
|
font-size: 13px; |
|
color: white; |
|
text-align: center; |
|
} |
|
.mblTabBarTallTab .mblTabBarButtonIconArea { |
|
margin-top: 8px; |
|
} |
|
.mblTabBarTallTab .mblTabBarButtonLabel { |
|
font-family: "Helvetica Neue", Helvetica; |
|
font-size: 11px; |
|
} |
|
.mblTabBarTallTab .mblTabBarButtonSelected { |
|
background-image: -webkit-gradient(linear, left top, left bottom, from(#a59ea5), to(#848284)); |
|
background-image: linear-gradient(to bottom, #a59ea5 0%, #848284 100%); |
|
} |
|
.mblTabBar { |
|
color: #929292; |
|
font-weight: normal; |
|
} |
|
.mblTabBarSegmentedControl .mblTabBarButton { |
|
border-top: solid 2px #007aff; |
|
border-bottom: solid 2px #007aff; |
|
border-left: solid 1px #007aff; |
|
border-right: solid 1px #007aff; |
|
} |
|
.mblTabBarSegmentedControl .mblTabBarButton:first-child { |
|
border-left: solid 2px #007aff; |
|
border-top-left-radius: 7px; |
|
border-bottom-left-radius: 7px; |
|
} |
|
.mblTabBarSegmentedControl .mblTabBarButton:last-child { |
|
border-right: solid 2px #007aff; |
|
border-top-right-radius: 7px; |
|
border-bottom-right-radius: 7px; |
|
} |
|
.mblHeading .mblTabBar { |
|
background-color: rgba(0, 0, 0, 0); |
|
} |
|
.mblTabBarSlimTab { |
|
border: none; |
|
background-color: #007aff; |
|
background-image: none; |
|
} |
|
.mblTabBarSlimTab .mblTabBarButton, |
|
.mblTabBarFlatTab .mblTabBarButton { |
|
background-color: rgba(0, 0, 0, 0); |
|
background-image: none; |
|
color: #f7f7f7; |
|
font-weight: normal; |
|
text-shadow: none; |
|
border-color: white; |
|
} |
|
.mblTabBarFlatTab .mblTabBarButton { |
|
color: black; |
|
} |
|
.mblTabBarSlimTab .mblTabBarButton:first-child { |
|
border-color: white; |
|
} |
|
.mblTabBarSlimTab .mblTabBarButtonSelected, |
|
.mblTabBarFlatTab .mblTabBarButtonSelected { |
|
background-color: white; |
|
background-image: none; |
|
color: #007aff; |
|
border-color: white; |
|
font-weight: normal; |
|
} |
|
.mblTabBarTallTab { |
|
background-color: #007aff; |
|
background-image: none; |
|
margin: 0; |
|
} |
|
.mblTabBarTallTab .mblTabBarButton { |
|
background-image: none; |
|
border: none; |
|
} |
|
.mblTabBarTallTab .mblTabBarButtonSelected { |
|
color: #007aff; |
|
background-color: white; |
|
border: none; |
|
}
|
|
|