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
11 KiB

7 years ago
  1. /*!
  2. * Angular Material Design
  3. * https://github.com/angular/material
  4. * @license MIT
  5. * v1.1.3
  6. */
  7. @-webkit-keyframes md-tab-content-hide {
  8. 0% {
  9. opacity: 1; }
  10. 50% {
  11. opacity: 1; }
  12. 100% {
  13. opacity: 0; } }
  14. @keyframes md-tab-content-hide {
  15. 0% {
  16. opacity: 1; }
  17. 50% {
  18. opacity: 1; }
  19. 100% {
  20. opacity: 0; } }
  21. md-tab-data {
  22. position: absolute;
  23. top: 0;
  24. left: 0;
  25. right: 0;
  26. bottom: 0;
  27. z-index: -1;
  28. opacity: 0; }
  29. md-tabs {
  30. display: block;
  31. margin: 0;
  32. border-radius: 2px;
  33. overflow: hidden;
  34. position: relative;
  35. -webkit-flex-shrink: 0;
  36. flex-shrink: 0; }
  37. md-tabs:not(.md-no-tab-content):not(.md-dynamic-height) {
  38. min-height: 248px; }
  39. md-tabs[md-align-tabs="bottom"] {
  40. padding-bottom: 48px; }
  41. md-tabs[md-align-tabs="bottom"] md-tabs-wrapper {
  42. position: absolute;
  43. bottom: 0;
  44. left: 0;
  45. right: 0;
  46. height: 48px;
  47. z-index: 2; }
  48. md-tabs[md-align-tabs="bottom"] md-tabs-content-wrapper {
  49. top: 0;
  50. bottom: 48px; }
  51. md-tabs.md-dynamic-height md-tabs-content-wrapper {
  52. min-height: 0;
  53. position: relative;
  54. top: auto;
  55. left: auto;
  56. right: auto;
  57. bottom: auto;
  58. overflow: visible; }
  59. md-tabs.md-dynamic-height md-tab-content.md-active {
  60. position: relative; }
  61. md-tabs[md-border-bottom] md-tabs-wrapper {
  62. border-width: 0 0 1px;
  63. border-style: solid; }
  64. md-tabs[md-border-bottom]:not(.md-dynamic-height) md-tabs-content-wrapper {
  65. top: 49px; }
  66. md-tabs-wrapper {
  67. display: block;
  68. position: relative;
  69. -webkit-transform: translate3d(0, 0, 0);
  70. transform: translate3d(0, 0, 0); }
  71. md-tabs-wrapper md-prev-button, md-tabs-wrapper md-next-button {
  72. height: 100%;
  73. width: 32px;
  74. position: absolute;
  75. top: 50%;
  76. -webkit-transform: translateY(-50%);
  77. transform: translateY(-50%);
  78. line-height: 1em;
  79. z-index: 2;
  80. cursor: pointer;
  81. font-size: 16px;
  82. background: transparent no-repeat center center;
  83. -webkit-transition: all 0.5s cubic-bezier(0.35, 0, 0.25, 1);
  84. transition: all 0.5s cubic-bezier(0.35, 0, 0.25, 1); }
  85. md-tabs-wrapper md-prev-button:focus, md-tabs-wrapper md-next-button:focus {
  86. outline: none; }
  87. md-tabs-wrapper md-prev-button.md-disabled, md-tabs-wrapper md-next-button.md-disabled {
  88. opacity: 0.25;
  89. cursor: default; }
  90. md-tabs-wrapper md-prev-button.ng-leave, md-tabs-wrapper md-next-button.ng-leave {
  91. -webkit-transition: none;
  92. transition: none; }
  93. md-tabs-wrapper md-prev-button md-icon, md-tabs-wrapper md-next-button md-icon {
  94. position: absolute;
  95. top: 50%;
  96. left: 50%;
  97. -webkit-transform: translate3d(-50%, -50%, 0);
  98. transform: translate3d(-50%, -50%, 0); }
  99. md-tabs-wrapper md-prev-button {
  100. left: 0;
  101. background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDE3LjEuMCwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPiA8IURPQ1RZUEUgc3ZnIFBVQkxJQyAiLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4iICJodHRwOi8vd3d3LnczLm9yZy9HcmFwaGljcy9TVkcvMS4xL0RURC9zdmcxMS5kdGQiPiA8c3ZnIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeD0iMHB4IiB5PSIwcHgiIHdpZHRoPSIyNHB4IiBoZWlnaHQ9IjI0cHgiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZW5hYmxlLWJhY2tncm91bmQ9Im5ldyAwIDAgMjQgMjQiIHhtbDpzcGFjZT0icHJlc2VydmUiPiA8ZyBpZD0iSGVhZGVyIj4gPGc+IDxyZWN0IHg9Ii02MTgiIHk9Ii0xMjA4IiBmaWxsPSJub25lIiB3aWR0aD0iMTQwMCIgaGVpZ2h0PSIzNjAwIi8+IDwvZz4gPC9nPiA8ZyBpZD0iTGFiZWwiPiA8L2c+IDxnIGlkPSJJY29uIj4gPGc+IDxwb2x5Z29uIHBvaW50cz0iMTUuNCw3LjQgMTQsNiA4LDEyIDE0LDE4IDE1LjQsMTYuNiAxMC44LDEyIAkJIiBzdHlsZT0iZmlsbDp3aGl0ZTsiLz4gPHJlY3QgZmlsbD0ibm9uZSIgd2lkdGg9IjI0IiBoZWlnaHQ9IjI0Ii8+IDwvZz4gPC9nPiA8ZyBpZD0iR3JpZCIgZGlzcGxheT0ibm9uZSI+IDxnIGRpc3BsYXk9ImlubGluZSI+IDwvZz4gPC9nPiA8L3N2Zz4NCg=="); }
  102. [dir=rtl] md-tabs-wrapper md-prev-button {
  103. left: auto;
  104. right: 0; }
  105. md-tabs-wrapper md-next-button {
  106. right: 0;
  107. background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDE3LjEuMCwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPiA8IURPQ1RZUEUgc3ZnIFBVQkxJQyAiLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4iICJodHRwOi8vd3d3LnczLm9yZy9HcmFwaGljcy9TVkcvMS4xL0RURC9zdmcxMS5kdGQiPiA8c3ZnIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeD0iMHB4IiB5PSIwcHgiIHdpZHRoPSIyNHB4IiBoZWlnaHQ9IjI0cHgiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZW5hYmxlLWJhY2tncm91bmQ9Im5ldyAwIDAgMjQgMjQiIHhtbDpzcGFjZT0icHJlc2VydmUiPiA8ZyBpZD0iSGVhZGVyIj4gPGc+IDxyZWN0IHg9Ii02MTgiIHk9Ii0xMzM2IiBmaWxsPSJub25lIiB3aWR0aD0iMTQwMCIgaGVpZ2h0PSIzNjAwIi8+IDwvZz4gPC9nPiA8ZyBpZD0iTGFiZWwiPiA8L2c+IDxnIGlkPSJJY29uIj4gPGc+IDxwb2x5Z29uIHBvaW50cz0iMTAsNiA4LjYsNy40IDEzLjIsMTIgOC42LDE2LjYgMTAsMTggMTYsMTIgCQkiIHN0eWxlPSJmaWxsOndoaXRlOyIvPiA8cmVjdCBmaWxsPSJub25lIiB3aWR0aD0iMjQiIGhlaWdodD0iMjQiLz4gPC9nPiA8L2c+IDxnIGlkPSJHcmlkIiBkaXNwbGF5PSJub25lIj4gPGcgZGlzcGxheT0iaW5saW5lIj4gPC9nPiA8L2c+IDwvc3ZnPg0K"); }
  108. [dir=rtl] md-tabs-wrapper md-next-button {
  109. right: auto;
  110. left: 0; }
  111. md-tabs-wrapper md-next-button md-icon {
  112. -webkit-transform: translate3d(-50%, -50%, 0) rotate(180deg);
  113. transform: translate3d(-50%, -50%, 0) rotate(180deg); }
  114. md-tabs-wrapper.md-stretch-tabs md-pagination-wrapper {
  115. width: 100%;
  116. -webkit-box-orient: horizontal;
  117. -webkit-box-direction: normal;
  118. -webkit-flex-direction: row;
  119. flex-direction: row; }
  120. md-tabs-wrapper.md-stretch-tabs md-pagination-wrapper md-tab-item {
  121. -webkit-box-flex: 1;
  122. -webkit-flex-grow: 1;
  123. flex-grow: 1; }
  124. md-tabs-canvas {
  125. position: relative;
  126. overflow: hidden;
  127. display: block;
  128. height: 48px; }
  129. md-tabs-canvas:after {
  130. content: '';
  131. display: table;
  132. clear: both; }
  133. md-tabs-canvas .md-dummy-wrapper {
  134. position: absolute;
  135. top: 0;
  136. left: 0; }
  137. [dir=rtl] md-tabs-canvas .md-dummy-wrapper {
  138. left: auto;
  139. right: 0; }
  140. md-tabs-canvas.md-paginated {
  141. margin: 0 32px; }
  142. md-tabs-canvas.md-center-tabs {
  143. display: -webkit-box;
  144. display: -webkit-flex;
  145. display: flex;
  146. -webkit-box-orient: vertical;
  147. -webkit-box-direction: normal;
  148. -webkit-flex-direction: column;
  149. flex-direction: column;
  150. text-align: center; }
  151. md-tabs-canvas.md-center-tabs .md-tab {
  152. float: none;
  153. display: inline-block; }
  154. md-pagination-wrapper {
  155. height: 48px;
  156. display: -webkit-box;
  157. display: -webkit-flex;
  158. display: flex;
  159. -webkit-transition: -webkit-transform 0.5s cubic-bezier(0.35, 0, 0.25, 1);
  160. transition: -webkit-transform 0.5s cubic-bezier(0.35, 0, 0.25, 1);
  161. transition: transform 0.5s cubic-bezier(0.35, 0, 0.25, 1);
  162. transition: transform 0.5s cubic-bezier(0.35, 0, 0.25, 1), -webkit-transform 0.5s cubic-bezier(0.35, 0, 0.25, 1);
  163. position: absolute;
  164. left: 0;
  165. -webkit-transform: translate3d(0, 0, 0);
  166. transform: translate3d(0, 0, 0); }
  167. md-pagination-wrapper:after {
  168. content: '';
  169. display: table;
  170. clear: both; }
  171. [dir=rtl] md-pagination-wrapper {
  172. left: auto;
  173. right: 0; }
  174. md-pagination-wrapper.md-center-tabs {
  175. position: relative;
  176. -webkit-box-pack: center;
  177. -webkit-justify-content: center;
  178. justify-content: center; }
  179. md-tabs-content-wrapper {
  180. display: block;
  181. position: absolute;
  182. top: 48px;
  183. left: 0;
  184. right: 0;
  185. bottom: 0;
  186. overflow: hidden; }
  187. md-tab-content {
  188. display: -webkit-box;
  189. display: -webkit-flex;
  190. display: flex;
  191. position: absolute;
  192. top: 0;
  193. left: 0;
  194. right: 0;
  195. bottom: 0;
  196. -webkit-transition: -webkit-transform 0.5s cubic-bezier(0.35, 0, 0.25, 1);
  197. transition: -webkit-transform 0.5s cubic-bezier(0.35, 0, 0.25, 1);
  198. transition: transform 0.5s cubic-bezier(0.35, 0, 0.25, 1);
  199. transition: transform 0.5s cubic-bezier(0.35, 0, 0.25, 1), -webkit-transform 0.5s cubic-bezier(0.35, 0, 0.25, 1);
  200. overflow: auto;
  201. -webkit-transform: translate3d(0, 0, 0);
  202. transform: translate3d(0, 0, 0); }
  203. md-tab-content.md-no-scroll {
  204. bottom: auto;
  205. overflow: hidden; }
  206. md-tab-content.ng-leave, md-tab-content.md-no-transition {
  207. -webkit-transition: none;
  208. transition: none; }
  209. md-tab-content.md-left:not(.md-active) {
  210. -webkit-transform: translateX(-100%);
  211. transform: translateX(-100%);
  212. -webkit-animation: 1s md-tab-content-hide;
  213. animation: 1s md-tab-content-hide;
  214. opacity: 0; }
  215. [dir=rtl] md-tab-content.md-left:not(.md-active) {
  216. -webkit-transform: translateX(100%);
  217. transform: translateX(100%); }
  218. md-tab-content.md-left:not(.md-active) * {
  219. -webkit-transition: visibility 0s linear;
  220. transition: visibility 0s linear;
  221. -webkit-transition-delay: 0.5s;
  222. transition-delay: 0.5s;
  223. visibility: hidden; }
  224. md-tab-content.md-right:not(.md-active) {
  225. -webkit-transform: translateX(100%);
  226. transform: translateX(100%);
  227. -webkit-animation: 1s md-tab-content-hide;
  228. animation: 1s md-tab-content-hide;
  229. opacity: 0; }
  230. [dir=rtl] md-tab-content.md-right:not(.md-active) {
  231. -webkit-transform: translateX(-100%);
  232. transform: translateX(-100%); }
  233. md-tab-content.md-right:not(.md-active) * {
  234. -webkit-transition: visibility 0s linear;
  235. transition: visibility 0s linear;
  236. -webkit-transition-delay: 0.5s;
  237. transition-delay: 0.5s;
  238. visibility: hidden; }
  239. md-tab-content > div {
  240. -webkit-box-flex: 1;
  241. -webkit-flex: 1 0 100%;
  242. flex: 1 0 100%;
  243. min-width: 0; }
  244. md-tab-content > div.ng-leave {
  245. -webkit-animation: 1s md-tab-content-hide;
  246. animation: 1s md-tab-content-hide; }
  247. md-ink-bar {
  248. position: absolute;
  249. left: auto;
  250. right: auto;
  251. bottom: 0;
  252. height: 2px; }
  253. md-ink-bar.md-left {
  254. -webkit-transition: left 0.125s cubic-bezier(0.35, 0, 0.25, 1), right 0.25s cubic-bezier(0.35, 0, 0.25, 1);
  255. transition: left 0.125s cubic-bezier(0.35, 0, 0.25, 1), right 0.25s cubic-bezier(0.35, 0, 0.25, 1); }
  256. md-ink-bar.md-right {
  257. -webkit-transition: left 0.25s cubic-bezier(0.35, 0, 0.25, 1), right 0.125s cubic-bezier(0.35, 0, 0.25, 1);
  258. transition: left 0.25s cubic-bezier(0.35, 0, 0.25, 1), right 0.125s cubic-bezier(0.35, 0, 0.25, 1); }
  259. md-tab {
  260. position: absolute;
  261. z-index: -1;
  262. left: -9999px; }
  263. .md-tab {
  264. font-size: 14px;
  265. text-align: center;
  266. line-height: 24px;
  267. padding: 12px 24px;
  268. -webkit-transition: background-color 0.35s cubic-bezier(0.35, 0, 0.25, 1);
  269. transition: background-color 0.35s cubic-bezier(0.35, 0, 0.25, 1);
  270. cursor: pointer;
  271. white-space: nowrap;
  272. position: relative;
  273. text-transform: uppercase;
  274. float: left;
  275. font-weight: 500;
  276. box-sizing: border-box;
  277. overflow: hidden;
  278. text-overflow: ellipsis; }
  279. [dir=rtl] .md-tab {
  280. float: right; }
  281. .md-tab.md-focused {
  282. box-shadow: none;
  283. outline: none; }
  284. .md-tab.md-active {
  285. cursor: default; }
  286. .md-tab.md-disabled {
  287. pointer-events: none;
  288. touch-action: pan-y;
  289. -webkit-user-select: none;
  290. -moz-user-select: none;
  291. -ms-user-select: none;
  292. user-select: none;
  293. -webkit-user-drag: none;
  294. opacity: 0.5;
  295. cursor: default; }
  296. .md-tab.ng-leave {
  297. -webkit-transition: none;
  298. transition: none; }
  299. md-toolbar + md-tabs {
  300. border-top-left-radius: 0;
  301. border-top-right-radius: 0; }