slider.css 38 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211121212131214121512161217121812191220122112221223122412251226122712281229123012311232123312341235123612371238123912401241124212431244124512461247124812491250125112521253125412551256125712581259126012611262126312641265126612671268126912701271127212731274127512761277127812791280128112821283128412851286128712881289129012911292129312941295129612971298129913001301130213031304130513061307130813091310131113121313131413151316131713181319132013211322132313241325132613271328132913301331133213331334133513361337133813391340134113421343134413451346134713481349135013511352135313541355135613571358135913601361136213631364136513661367136813691370137113721373137413751376137713781379138013811382138313841385138613871388138913901391139213931394139513961397139813991400140114021403140414051406140714081409141014111412141314141415141614171418141914201421142214231424142514261427142814291430143114321433143414351436143714381439144014411442144314441445144614471448144914501451145214531454145514561457145814591460146114621463146414651466146714681469147014711472147314741475147614771478147914801481148214831484148514861487148814891490149114921493149414951496149714981499150015011502150315041505
  1. /* BEM support Func
  2. -------------------------- */
  3. /* Element Chalk Variables */
  4. /* Transition
  5. -------------------------- */
  6. /* Colors
  7. -------------------------- */
  8. /* 53a8ff */
  9. /* 66b1ff */
  10. /* 79bbff */
  11. /* 8cc5ff */
  12. /* a0cfff */
  13. /* b3d8ff */
  14. /* c6e2ff */
  15. /* d9ecff */
  16. /* ecf5ff */
  17. /* Link
  18. -------------------------- */
  19. /* Background
  20. -------------------------- */
  21. /* Border
  22. -------------------------- */
  23. /* Box-shadow
  24. -------------------------- */
  25. /* Fill
  26. -------------------------- */
  27. /* Font
  28. -------------------------- */
  29. /* Size
  30. -------------------------- */
  31. /* z-index
  32. -------------------------- */
  33. /* Disable base
  34. -------------------------- */
  35. /* Icon
  36. -------------------------- */
  37. /* Checkbox
  38. -------------------------- */
  39. /* Radio
  40. -------------------------- */
  41. /* Select
  42. -------------------------- */
  43. /* Alert
  44. -------------------------- */
  45. /* Message Box
  46. -------------------------- */
  47. /* Message
  48. -------------------------- */
  49. /* Notification
  50. -------------------------- */
  51. /* Input
  52. -------------------------- */
  53. /* Cascader
  54. -------------------------- */
  55. /* Group
  56. -------------------------- */
  57. /* Tab
  58. -------------------------- */
  59. /* Button
  60. -------------------------- */
  61. /* cascader
  62. -------------------------- */
  63. /* Switch
  64. -------------------------- */
  65. /* Dialog
  66. -------------------------- */
  67. /* Table
  68. -------------------------- */
  69. /* Pagination
  70. -------------------------- */
  71. /* Popover
  72. -------------------------- */
  73. /* Tooltip
  74. -------------------------- */
  75. /* Tag
  76. -------------------------- */
  77. /* Tree
  78. -------------------------- */
  79. /* Dropdown
  80. -------------------------- */
  81. /* Badge
  82. -------------------------- */
  83. /* Card
  84. --------------------------*/
  85. /* Slider
  86. --------------------------*/
  87. /* Steps
  88. --------------------------*/
  89. /* MenuSlide
  90. --------------------------*/
  91. /* Rate
  92. --------------------------*/
  93. /* DatePicker
  94. --------------------------*/
  95. /* Loading
  96. --------------------------*/
  97. /* Scrollbar
  98. --------------------------*/
  99. /* Carousel
  100. --------------------------*/
  101. /* Collapse
  102. --------------------------*/
  103. /* Transfer
  104. --------------------------*/
  105. /* Header
  106. --------------------------*/
  107. /* Footer
  108. --------------------------*/
  109. /* Main
  110. --------------------------*/
  111. /* Break-point
  112. --------------------------*/
  113. /* Break-points
  114. -------------------------- */
  115. /* Scrollbar
  116. -------------------------- */
  117. /* Placeholder
  118. -------------------------- */
  119. /* BEM
  120. -------------------------- */
  121. /* BEM support Func
  122. -------------------------- */
  123. /* Element Chalk Variables */
  124. /* Transition
  125. -------------------------- */
  126. /* Colors
  127. -------------------------- */
  128. /* 53a8ff */
  129. /* 66b1ff */
  130. /* 79bbff */
  131. /* 8cc5ff */
  132. /* a0cfff */
  133. /* b3d8ff */
  134. /* c6e2ff */
  135. /* d9ecff */
  136. /* ecf5ff */
  137. /* Link
  138. -------------------------- */
  139. /* Background
  140. -------------------------- */
  141. /* Border
  142. -------------------------- */
  143. /* Box-shadow
  144. -------------------------- */
  145. /* Fill
  146. -------------------------- */
  147. /* Font
  148. -------------------------- */
  149. /* Size
  150. -------------------------- */
  151. /* z-index
  152. -------------------------- */
  153. /* Disable base
  154. -------------------------- */
  155. /* Icon
  156. -------------------------- */
  157. /* Checkbox
  158. -------------------------- */
  159. /* Radio
  160. -------------------------- */
  161. /* Select
  162. -------------------------- */
  163. /* Alert
  164. -------------------------- */
  165. /* Message Box
  166. -------------------------- */
  167. /* Message
  168. -------------------------- */
  169. /* Notification
  170. -------------------------- */
  171. /* Input
  172. -------------------------- */
  173. /* Cascader
  174. -------------------------- */
  175. /* Group
  176. -------------------------- */
  177. /* Tab
  178. -------------------------- */
  179. /* Button
  180. -------------------------- */
  181. /* cascader
  182. -------------------------- */
  183. /* Switch
  184. -------------------------- */
  185. /* Dialog
  186. -------------------------- */
  187. /* Table
  188. -------------------------- */
  189. /* Pagination
  190. -------------------------- */
  191. /* Popover
  192. -------------------------- */
  193. /* Tooltip
  194. -------------------------- */
  195. /* Tag
  196. -------------------------- */
  197. /* Tree
  198. -------------------------- */
  199. /* Dropdown
  200. -------------------------- */
  201. /* Badge
  202. -------------------------- */
  203. /* Card
  204. --------------------------*/
  205. /* Slider
  206. --------------------------*/
  207. /* Steps
  208. --------------------------*/
  209. /* MenuSlide
  210. --------------------------*/
  211. /* Rate
  212. --------------------------*/
  213. /* DatePicker
  214. --------------------------*/
  215. /* Loading
  216. --------------------------*/
  217. /* Scrollbar
  218. --------------------------*/
  219. /* Carousel
  220. --------------------------*/
  221. /* Collapse
  222. --------------------------*/
  223. /* Transfer
  224. --------------------------*/
  225. /* Header
  226. --------------------------*/
  227. /* Footer
  228. --------------------------*/
  229. /* Main
  230. --------------------------*/
  231. /* Break-point
  232. --------------------------*/
  233. /* Break-points
  234. -------------------------- */
  235. /* Scrollbar
  236. -------------------------- */
  237. /* Placeholder
  238. -------------------------- */
  239. /* BEM
  240. -------------------------- */
  241. /* Element Chalk Variables */
  242. /* Transition
  243. -------------------------- */
  244. /* Colors
  245. -------------------------- */
  246. /* 53a8ff */
  247. /* 66b1ff */
  248. /* 79bbff */
  249. /* 8cc5ff */
  250. /* a0cfff */
  251. /* b3d8ff */
  252. /* c6e2ff */
  253. /* d9ecff */
  254. /* ecf5ff */
  255. /* Link
  256. -------------------------- */
  257. /* Background
  258. -------------------------- */
  259. /* Border
  260. -------------------------- */
  261. /* Box-shadow
  262. -------------------------- */
  263. /* Fill
  264. -------------------------- */
  265. /* Font
  266. -------------------------- */
  267. /* Size
  268. -------------------------- */
  269. /* z-index
  270. -------------------------- */
  271. /* Disable base
  272. -------------------------- */
  273. /* Icon
  274. -------------------------- */
  275. /* Checkbox
  276. -------------------------- */
  277. /* Radio
  278. -------------------------- */
  279. /* Select
  280. -------------------------- */
  281. /* Alert
  282. -------------------------- */
  283. /* Message Box
  284. -------------------------- */
  285. /* Message
  286. -------------------------- */
  287. /* Notification
  288. -------------------------- */
  289. /* Input
  290. -------------------------- */
  291. /* Cascader
  292. -------------------------- */
  293. /* Group
  294. -------------------------- */
  295. /* Tab
  296. -------------------------- */
  297. /* Button
  298. -------------------------- */
  299. /* cascader
  300. -------------------------- */
  301. /* Switch
  302. -------------------------- */
  303. /* Dialog
  304. -------------------------- */
  305. /* Table
  306. -------------------------- */
  307. /* Pagination
  308. -------------------------- */
  309. /* Popover
  310. -------------------------- */
  311. /* Tooltip
  312. -------------------------- */
  313. /* Tag
  314. -------------------------- */
  315. /* Tree
  316. -------------------------- */
  317. /* Dropdown
  318. -------------------------- */
  319. /* Badge
  320. -------------------------- */
  321. /* Card
  322. --------------------------*/
  323. /* Slider
  324. --------------------------*/
  325. /* Steps
  326. --------------------------*/
  327. /* MenuSlide
  328. --------------------------*/
  329. /* Rate
  330. --------------------------*/
  331. /* DatePicker
  332. --------------------------*/
  333. /* Loading
  334. --------------------------*/
  335. /* Scrollbar
  336. --------------------------*/
  337. /* Carousel
  338. --------------------------*/
  339. /* Collapse
  340. --------------------------*/
  341. /* Transfer
  342. --------------------------*/
  343. /* Header
  344. --------------------------*/
  345. /* Footer
  346. --------------------------*/
  347. /* Main
  348. --------------------------*/
  349. /* Break-point
  350. --------------------------*/
  351. /* BEM support Func
  352. -------------------------- */
  353. /* Element Chalk Variables */
  354. /* Transition
  355. -------------------------- */
  356. /* Colors
  357. -------------------------- */
  358. /* 53a8ff */
  359. /* 66b1ff */
  360. /* 79bbff */
  361. /* 8cc5ff */
  362. /* a0cfff */
  363. /* b3d8ff */
  364. /* c6e2ff */
  365. /* d9ecff */
  366. /* ecf5ff */
  367. /* Link
  368. -------------------------- */
  369. /* Background
  370. -------------------------- */
  371. /* Border
  372. -------------------------- */
  373. /* Box-shadow
  374. -------------------------- */
  375. /* Fill
  376. -------------------------- */
  377. /* Font
  378. -------------------------- */
  379. /* Size
  380. -------------------------- */
  381. /* z-index
  382. -------------------------- */
  383. /* Disable base
  384. -------------------------- */
  385. /* Icon
  386. -------------------------- */
  387. /* Checkbox
  388. -------------------------- */
  389. /* Radio
  390. -------------------------- */
  391. /* Select
  392. -------------------------- */
  393. /* Alert
  394. -------------------------- */
  395. /* Message Box
  396. -------------------------- */
  397. /* Message
  398. -------------------------- */
  399. /* Notification
  400. -------------------------- */
  401. /* Input
  402. -------------------------- */
  403. /* Cascader
  404. -------------------------- */
  405. /* Group
  406. -------------------------- */
  407. /* Tab
  408. -------------------------- */
  409. /* Button
  410. -------------------------- */
  411. /* cascader
  412. -------------------------- */
  413. /* Switch
  414. -------------------------- */
  415. /* Dialog
  416. -------------------------- */
  417. /* Table
  418. -------------------------- */
  419. /* Pagination
  420. -------------------------- */
  421. /* Popover
  422. -------------------------- */
  423. /* Tooltip
  424. -------------------------- */
  425. /* Tag
  426. -------------------------- */
  427. /* Tree
  428. -------------------------- */
  429. /* Dropdown
  430. -------------------------- */
  431. /* Badge
  432. -------------------------- */
  433. /* Card
  434. --------------------------*/
  435. /* Slider
  436. --------------------------*/
  437. /* Steps
  438. --------------------------*/
  439. /* MenuSlide
  440. --------------------------*/
  441. /* Rate
  442. --------------------------*/
  443. /* DatePicker
  444. --------------------------*/
  445. /* Loading
  446. --------------------------*/
  447. /* Scrollbar
  448. --------------------------*/
  449. /* Carousel
  450. --------------------------*/
  451. /* Collapse
  452. --------------------------*/
  453. /* Transfer
  454. --------------------------*/
  455. /* Header
  456. --------------------------*/
  457. /* Footer
  458. --------------------------*/
  459. /* Main
  460. --------------------------*/
  461. /* Break-point
  462. --------------------------*/
  463. /* Break-points
  464. -------------------------- */
  465. /* Scrollbar
  466. -------------------------- */
  467. /* Placeholder
  468. -------------------------- */
  469. /* BEM
  470. -------------------------- */
  471. /* Element Chalk Variables */
  472. /* Transition
  473. -------------------------- */
  474. /* Colors
  475. -------------------------- */
  476. /* 53a8ff */
  477. /* 66b1ff */
  478. /* 79bbff */
  479. /* 8cc5ff */
  480. /* a0cfff */
  481. /* b3d8ff */
  482. /* c6e2ff */
  483. /* d9ecff */
  484. /* ecf5ff */
  485. /* Link
  486. -------------------------- */
  487. /* Background
  488. -------------------------- */
  489. /* Border
  490. -------------------------- */
  491. /* Box-shadow
  492. -------------------------- */
  493. /* Fill
  494. -------------------------- */
  495. /* Font
  496. -------------------------- */
  497. /* Size
  498. -------------------------- */
  499. /* z-index
  500. -------------------------- */
  501. /* Disable base
  502. -------------------------- */
  503. /* Icon
  504. -------------------------- */
  505. /* Checkbox
  506. -------------------------- */
  507. /* Radio
  508. -------------------------- */
  509. /* Select
  510. -------------------------- */
  511. /* Alert
  512. -------------------------- */
  513. /* Message Box
  514. -------------------------- */
  515. /* Message
  516. -------------------------- */
  517. /* Notification
  518. -------------------------- */
  519. /* Input
  520. -------------------------- */
  521. /* Cascader
  522. -------------------------- */
  523. /* Group
  524. -------------------------- */
  525. /* Tab
  526. -------------------------- */
  527. /* Button
  528. -------------------------- */
  529. /* cascader
  530. -------------------------- */
  531. /* Switch
  532. -------------------------- */
  533. /* Dialog
  534. -------------------------- */
  535. /* Table
  536. -------------------------- */
  537. /* Pagination
  538. -------------------------- */
  539. /* Popover
  540. -------------------------- */
  541. /* Tooltip
  542. -------------------------- */
  543. /* Tag
  544. -------------------------- */
  545. /* Tree
  546. -------------------------- */
  547. /* Dropdown
  548. -------------------------- */
  549. /* Badge
  550. -------------------------- */
  551. /* Card
  552. --------------------------*/
  553. /* Slider
  554. --------------------------*/
  555. /* Steps
  556. --------------------------*/
  557. /* MenuSlide
  558. --------------------------*/
  559. /* Rate
  560. --------------------------*/
  561. /* DatePicker
  562. --------------------------*/
  563. /* Loading
  564. --------------------------*/
  565. /* Scrollbar
  566. --------------------------*/
  567. /* Carousel
  568. --------------------------*/
  569. /* Collapse
  570. --------------------------*/
  571. /* Transfer
  572. --------------------------*/
  573. /* Header
  574. --------------------------*/
  575. /* Footer
  576. --------------------------*/
  577. /* Main
  578. --------------------------*/
  579. /* Break-point
  580. --------------------------*/
  581. .el-input {
  582. position: relative;
  583. font-size: 14px;
  584. display: inline-block;
  585. width: 100%; }
  586. .el-input::-webkit-scrollbar {
  587. z-index: 11;
  588. width: 6px; }
  589. .el-input::-webkit-scrollbar:horizontal {
  590. height: 6px; }
  591. .el-input::-webkit-scrollbar-thumb {
  592. border-radius: 5px;
  593. width: 6px;
  594. background: #b4bccc; }
  595. .el-input::-webkit-scrollbar-corner {
  596. background: #fff; }
  597. .el-input::-webkit-scrollbar-track {
  598. background: #fff; }
  599. .el-input::-webkit-scrollbar-track-piece {
  600. background: #fff;
  601. width: 6px; }
  602. .el-input__inner {
  603. -webkit-appearance: none;
  604. background-color: #fff;
  605. background-image: none;
  606. border-radius: 4px;
  607. border: 1px solid #d8dce5;
  608. -webkit-box-sizing: border-box;
  609. box-sizing: border-box;
  610. color: #5a5e66;
  611. display: inline-block;
  612. font-size: inherit;
  613. height: 40px;
  614. line-height: 1;
  615. outline: none;
  616. padding: 0 15px;
  617. -webkit-transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
  618. transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
  619. width: 100%; }
  620. .el-input__inner::-webkit-input-placeholder {
  621. color: #b4bccc; }
  622. .el-input__inner:-ms-input-placeholder {
  623. color: #b4bccc; }
  624. .el-input__inner::-ms-input-placeholder {
  625. color: #b4bccc; }
  626. .el-input__inner::placeholder {
  627. color: #b4bccc; }
  628. .el-input__inner:hover {
  629. border-color: #b4bccc; }
  630. .el-input__inner:focus {
  631. outline: none;
  632. border-color: #1b1e24; }
  633. .el-input__suffix {
  634. position: absolute;
  635. height: 100%;
  636. right: 5px;
  637. top: 0;
  638. text-align: center;
  639. color: #b4bccc;
  640. -webkit-transition: all .3s;
  641. transition: all .3s;
  642. pointer-events: none; }
  643. .el-input__suffix-inner {
  644. pointer-events: all; }
  645. .el-input__prefix {
  646. position: absolute;
  647. height: 100%;
  648. left: 5px;
  649. top: 0;
  650. text-align: center;
  651. color: #b4bccc;
  652. -webkit-transition: all .3s;
  653. transition: all .3s; }
  654. .el-input__icon {
  655. height: 100%;
  656. width: 25px;
  657. text-align: center;
  658. -webkit-transition: all .3s;
  659. transition: all .3s;
  660. line-height: 40px; }
  661. .el-input__icon:after {
  662. content: '';
  663. height: 100%;
  664. width: 0;
  665. display: inline-block;
  666. vertical-align: middle; }
  667. .el-input__validateIcon {
  668. pointer-events: none; }
  669. .el-input.is-active .el-input__inner {
  670. outline: none;
  671. border-color: #1b1e24; }
  672. .el-input.is-disabled .el-input__inner {
  673. background-color: #011638;
  674. border-color: #dfe4ed;
  675. color: #b4bccc;
  676. cursor: not-allowed; }
  677. .el-input.is-disabled .el-input__inner::-webkit-input-placeholder {
  678. color: #b4bccc; }
  679. .el-input.is-disabled .el-input__inner:-ms-input-placeholder {
  680. color: #b4bccc; }
  681. .el-input.is-disabled .el-input__inner::-ms-input-placeholder {
  682. color: #b4bccc; }
  683. .el-input.is-disabled .el-input__inner::placeholder {
  684. color: #b4bccc; }
  685. .el-input.is-disabled .el-input__icon {
  686. cursor: not-allowed; }
  687. .el-input--suffix .el-input__inner {
  688. padding-right: 30px; }
  689. .el-input--prefix .el-input__inner {
  690. padding-left: 30px; }
  691. .el-input--medium {
  692. font-size: 14px; }
  693. .el-input--medium .el-input__inner {
  694. height: 36px; }
  695. .el-input--medium .el-input__icon {
  696. line-height: 36px; }
  697. .el-input--small {
  698. font-size: 13px; }
  699. .el-input--small .el-input__inner {
  700. height: 32px; }
  701. .el-input--small .el-input__icon {
  702. line-height: 32px; }
  703. .el-input--mini {
  704. font-size: 12px; }
  705. .el-input--mini .el-input__inner {
  706. height: 28px; }
  707. .el-input--mini .el-input__icon {
  708. line-height: 28px; }
  709. .el-input-group {
  710. line-height: normal;
  711. display: inline-table;
  712. width: 100%;
  713. border-collapse: separate; }
  714. .el-input-group > .el-input__inner {
  715. vertical-align: middle;
  716. display: table-cell; }
  717. .el-input-group__append, .el-input-group__prepend {
  718. background-color: #011638;
  719. color: #777;
  720. vertical-align: middle;
  721. display: table-cell;
  722. position: relative;
  723. border: 1px solid #d8dce5;
  724. border-radius: 4px;
  725. padding: 0 20px;
  726. width: 1px;
  727. white-space: nowrap; }
  728. .el-input-group__append:focus, .el-input-group__prepend:focus {
  729. outline: none; }
  730. .el-input-group__append .el-select, .el-input-group__append .el-button, .el-input-group__prepend .el-select, .el-input-group__prepend .el-button {
  731. display: inline-block;
  732. margin: -20px; }
  733. .el-input-group__append button.el-button, .el-input-group__append div.el-select .el-input__inner, .el-input-group__append div.el-select:hover .el-input__inner, .el-input-group__prepend button.el-button, .el-input-group__prepend div.el-select .el-input__inner, .el-input-group__prepend div.el-select:hover .el-input__inner {
  734. border-color: transparent;
  735. background-color: transparent;
  736. color: inherit;
  737. border-top: 0;
  738. border-bottom: 0; }
  739. .el-input-group__append .el-button, .el-input-group__append .el-input, .el-input-group__prepend .el-button, .el-input-group__prepend .el-input {
  740. font-size: inherit; }
  741. .el-input-group__prepend {
  742. border-right: 0;
  743. border-top-right-radius: 0;
  744. border-bottom-right-radius: 0; }
  745. .el-input-group__append {
  746. border-left: 0;
  747. border-top-left-radius: 0;
  748. border-bottom-left-radius: 0; }
  749. .el-input-group--prepend .el-input__inner {
  750. border-top-left-radius: 0;
  751. border-bottom-left-radius: 0; }
  752. .el-input-group--append .el-input__inner {
  753. border-top-right-radius: 0;
  754. border-bottom-right-radius: 0; }
  755. .el-textarea {
  756. display: inline-block;
  757. width: 100%;
  758. vertical-align: bottom; }
  759. .el-textarea__inner {
  760. display: block;
  761. resize: vertical;
  762. padding: 5px 15px;
  763. line-height: 1.5;
  764. -webkit-box-sizing: border-box;
  765. box-sizing: border-box;
  766. width: 100%;
  767. font-size: 14px;
  768. color: #5a5e66;
  769. background-color: #fff;
  770. background-image: none;
  771. border: 1px solid #d8dce5;
  772. border-radius: 4px;
  773. -webkit-transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
  774. transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1); }
  775. .el-textarea__inner::-webkit-input-placeholder {
  776. color: #b4bccc; }
  777. .el-textarea__inner:-ms-input-placeholder {
  778. color: #b4bccc; }
  779. .el-textarea__inner::-ms-input-placeholder {
  780. color: #b4bccc; }
  781. .el-textarea__inner::placeholder {
  782. color: #b4bccc; }
  783. .el-textarea__inner:hover {
  784. border-color: #b4bccc; }
  785. .el-textarea__inner:focus {
  786. outline: none;
  787. border-color: #1b1e24; }
  788. .el-textarea.is-disabled .el-textarea__inner {
  789. background-color: #011638;
  790. border-color: #dfe4ed;
  791. color: #b4bccc;
  792. cursor: not-allowed; }
  793. .el-textarea.is-disabled .el-textarea__inner::-webkit-input-placeholder {
  794. color: #b4bccc; }
  795. .el-textarea.is-disabled .el-textarea__inner:-ms-input-placeholder {
  796. color: #b4bccc; }
  797. .el-textarea.is-disabled .el-textarea__inner::-ms-input-placeholder {
  798. color: #b4bccc; }
  799. .el-textarea.is-disabled .el-textarea__inner::placeholder {
  800. color: #b4bccc; }
  801. .el-input-number {
  802. position: relative;
  803. display: inline-block;
  804. width: 180px;
  805. line-height: 38px; }
  806. .el-input-number .el-input {
  807. display: block; }
  808. .el-input-number .el-input__inner {
  809. -webkit-appearance: none;
  810. padding-left: 50px;
  811. padding-right: 50px;
  812. text-align: center; }
  813. .el-input-number__increase, .el-input-number__decrease {
  814. position: absolute;
  815. z-index: 1;
  816. top: 1px;
  817. width: 40px;
  818. height: auto;
  819. text-align: center;
  820. background: #011638;
  821. color: #5a5e66;
  822. cursor: pointer;
  823. font-size: 13px; }
  824. .el-input-number__increase:hover, .el-input-number__decrease:hover {
  825. color: #1b1e24; }
  826. .el-input-number__increase:hover:not(.is-disabled) ~ .el-input .el-input__inner:not(.is-disabled), .el-input-number__decrease:hover:not(.is-disabled) ~ .el-input .el-input__inner:not(.is-disabled) {
  827. border-color: #1b1e24; }
  828. .el-input-number__increase.is-disabled, .el-input-number__decrease.is-disabled {
  829. color: #b4bccc;
  830. cursor: not-allowed; }
  831. .el-input-number__increase {
  832. right: 1px;
  833. border-radius: 0 4px 4px 0;
  834. border-left: 1px solid #d8dce5; }
  835. .el-input-number__decrease {
  836. left: 1px;
  837. border-radius: 4px 0 0 4px;
  838. border-right: 1px solid #d8dce5; }
  839. .el-input-number.is-disabled .el-input-number__increase, .el-input-number.is-disabled .el-input-number__decrease {
  840. border-color: #dfe4ed;
  841. color: #dfe4ed; }
  842. .el-input-number.is-disabled .el-input-number__increase:hover, .el-input-number.is-disabled .el-input-number__decrease:hover {
  843. color: #dfe4ed;
  844. cursor: not-allowed; }
  845. .el-input-number--medium {
  846. width: 200px;
  847. line-height: 34px; }
  848. .el-input-number--medium .el-input-number__increase, .el-input-number--medium .el-input-number__decrease {
  849. width: 36px;
  850. font-size: 14px; }
  851. .el-input-number--medium .el-input__inner {
  852. padding-left: 43px;
  853. padding-right: 43px; }
  854. .el-input-number--small {
  855. width: 130px;
  856. line-height: 30px; }
  857. .el-input-number--small .el-input-number__increase, .el-input-number--small .el-input-number__decrease {
  858. width: 32px;
  859. font-size: 13px; }
  860. .el-input-number--small .el-input-number__increase [class*=el-icon], .el-input-number--small .el-input-number__decrease [class*=el-icon] {
  861. -webkit-transform: scale(0.9);
  862. transform: scale(0.9); }
  863. .el-input-number--small .el-input__inner {
  864. padding-left: 39px;
  865. padding-right: 39px; }
  866. .el-input-number--mini {
  867. width: 130px;
  868. line-height: 26px; }
  869. .el-input-number--mini .el-input-number__increase, .el-input-number--mini .el-input-number__decrease {
  870. width: 28px;
  871. font-size: 12px; }
  872. .el-input-number--mini .el-input-number__increase [class*=el-icon], .el-input-number--mini .el-input-number__decrease [class*=el-icon] {
  873. -webkit-transform: scale(0.8);
  874. transform: scale(0.8); }
  875. .el-input-number--mini .el-input__inner {
  876. padding-left: 35px;
  877. padding-right: 35px; }
  878. .el-input-number.is-without-controls .el-input__inner {
  879. padding-left: 15px;
  880. padding-right: 15px; }
  881. .el-input-number.is-controls-right .el-input__inner {
  882. padding-left: 15px;
  883. padding-right: 50px; }
  884. .el-input-number.is-controls-right .el-input-number__increase, .el-input-number.is-controls-right .el-input-number__decrease {
  885. height: auto;
  886. line-height: 19px; }
  887. .el-input-number.is-controls-right .el-input-number__increase [class*=el-icon], .el-input-number.is-controls-right .el-input-number__decrease [class*=el-icon] {
  888. -webkit-transform: scale(0.8);
  889. transform: scale(0.8); }
  890. .el-input-number.is-controls-right .el-input-number__increase {
  891. border-radius: 0 4px 0 0;
  892. border-bottom: 1px solid #d8dce5; }
  893. .el-input-number.is-controls-right .el-input-number__decrease {
  894. right: 1px;
  895. bottom: 1px;
  896. top: auto;
  897. left: auto;
  898. border-right: none;
  899. border-left: 1px solid #d8dce5;
  900. border-radius: 0 0 4px 0; }
  901. .el-input-number.is-controls-right[class*=medium] [class*=increase], .el-input-number.is-controls-right[class*=medium] [class*=decrease] {
  902. line-height: 17px; }
  903. .el-input-number.is-controls-right[class*=small] [class*=increase], .el-input-number.is-controls-right[class*=small] [class*=decrease] {
  904. line-height: 15px; }
  905. .el-input-number.is-controls-right[class*=mini] [class*=increase], .el-input-number.is-controls-right[class*=mini] [class*=decrease] {
  906. line-height: 13px; }
  907. /* BEM support Func
  908. -------------------------- */
  909. /* Element Chalk Variables */
  910. /* Transition
  911. -------------------------- */
  912. /* Colors
  913. -------------------------- */
  914. /* 53a8ff */
  915. /* 66b1ff */
  916. /* 79bbff */
  917. /* 8cc5ff */
  918. /* a0cfff */
  919. /* b3d8ff */
  920. /* c6e2ff */
  921. /* d9ecff */
  922. /* ecf5ff */
  923. /* Link
  924. -------------------------- */
  925. /* Background
  926. -------------------------- */
  927. /* Border
  928. -------------------------- */
  929. /* Box-shadow
  930. -------------------------- */
  931. /* Fill
  932. -------------------------- */
  933. /* Font
  934. -------------------------- */
  935. /* Size
  936. -------------------------- */
  937. /* z-index
  938. -------------------------- */
  939. /* Disable base
  940. -------------------------- */
  941. /* Icon
  942. -------------------------- */
  943. /* Checkbox
  944. -------------------------- */
  945. /* Radio
  946. -------------------------- */
  947. /* Select
  948. -------------------------- */
  949. /* Alert
  950. -------------------------- */
  951. /* Message Box
  952. -------------------------- */
  953. /* Message
  954. -------------------------- */
  955. /* Notification
  956. -------------------------- */
  957. /* Input
  958. -------------------------- */
  959. /* Cascader
  960. -------------------------- */
  961. /* Group
  962. -------------------------- */
  963. /* Tab
  964. -------------------------- */
  965. /* Button
  966. -------------------------- */
  967. /* cascader
  968. -------------------------- */
  969. /* Switch
  970. -------------------------- */
  971. /* Dialog
  972. -------------------------- */
  973. /* Table
  974. -------------------------- */
  975. /* Pagination
  976. -------------------------- */
  977. /* Popover
  978. -------------------------- */
  979. /* Tooltip
  980. -------------------------- */
  981. /* Tag
  982. -------------------------- */
  983. /* Tree
  984. -------------------------- */
  985. /* Dropdown
  986. -------------------------- */
  987. /* Badge
  988. -------------------------- */
  989. /* Card
  990. --------------------------*/
  991. /* Slider
  992. --------------------------*/
  993. /* Steps
  994. --------------------------*/
  995. /* MenuSlide
  996. --------------------------*/
  997. /* Rate
  998. --------------------------*/
  999. /* DatePicker
  1000. --------------------------*/
  1001. /* Loading
  1002. --------------------------*/
  1003. /* Scrollbar
  1004. --------------------------*/
  1005. /* Carousel
  1006. --------------------------*/
  1007. /* Collapse
  1008. --------------------------*/
  1009. /* Transfer
  1010. --------------------------*/
  1011. /* Header
  1012. --------------------------*/
  1013. /* Footer
  1014. --------------------------*/
  1015. /* Main
  1016. --------------------------*/
  1017. /* Break-point
  1018. --------------------------*/
  1019. /* Break-points
  1020. -------------------------- */
  1021. /* Scrollbar
  1022. -------------------------- */
  1023. /* Placeholder
  1024. -------------------------- */
  1025. /* BEM
  1026. -------------------------- */
  1027. /* Element Chalk Variables */
  1028. /* Transition
  1029. -------------------------- */
  1030. /* Colors
  1031. -------------------------- */
  1032. /* 53a8ff */
  1033. /* 66b1ff */
  1034. /* 79bbff */
  1035. /* 8cc5ff */
  1036. /* a0cfff */
  1037. /* b3d8ff */
  1038. /* c6e2ff */
  1039. /* d9ecff */
  1040. /* ecf5ff */
  1041. /* Link
  1042. -------------------------- */
  1043. /* Background
  1044. -------------------------- */
  1045. /* Border
  1046. -------------------------- */
  1047. /* Box-shadow
  1048. -------------------------- */
  1049. /* Fill
  1050. -------------------------- */
  1051. /* Font
  1052. -------------------------- */
  1053. /* Size
  1054. -------------------------- */
  1055. /* z-index
  1056. -------------------------- */
  1057. /* Disable base
  1058. -------------------------- */
  1059. /* Icon
  1060. -------------------------- */
  1061. /* Checkbox
  1062. -------------------------- */
  1063. /* Radio
  1064. -------------------------- */
  1065. /* Select
  1066. -------------------------- */
  1067. /* Alert
  1068. -------------------------- */
  1069. /* Message Box
  1070. -------------------------- */
  1071. /* Message
  1072. -------------------------- */
  1073. /* Notification
  1074. -------------------------- */
  1075. /* Input
  1076. -------------------------- */
  1077. /* Cascader
  1078. -------------------------- */
  1079. /* Group
  1080. -------------------------- */
  1081. /* Tab
  1082. -------------------------- */
  1083. /* Button
  1084. -------------------------- */
  1085. /* cascader
  1086. -------------------------- */
  1087. /* Switch
  1088. -------------------------- */
  1089. /* Dialog
  1090. -------------------------- */
  1091. /* Table
  1092. -------------------------- */
  1093. /* Pagination
  1094. -------------------------- */
  1095. /* Popover
  1096. -------------------------- */
  1097. /* Tooltip
  1098. -------------------------- */
  1099. /* Tag
  1100. -------------------------- */
  1101. /* Tree
  1102. -------------------------- */
  1103. /* Dropdown
  1104. -------------------------- */
  1105. /* Badge
  1106. -------------------------- */
  1107. /* Card
  1108. --------------------------*/
  1109. /* Slider
  1110. --------------------------*/
  1111. /* Steps
  1112. --------------------------*/
  1113. /* MenuSlide
  1114. --------------------------*/
  1115. /* Rate
  1116. --------------------------*/
  1117. /* DatePicker
  1118. --------------------------*/
  1119. /* Loading
  1120. --------------------------*/
  1121. /* Scrollbar
  1122. --------------------------*/
  1123. /* Carousel
  1124. --------------------------*/
  1125. /* Collapse
  1126. --------------------------*/
  1127. /* Transfer
  1128. --------------------------*/
  1129. /* Header
  1130. --------------------------*/
  1131. /* Footer
  1132. --------------------------*/
  1133. /* Main
  1134. --------------------------*/
  1135. /* Break-point
  1136. --------------------------*/
  1137. .el-tooltip:focus:not(.focusing), .el-tooltip:focus:hover {
  1138. outline-width: 0; }
  1139. .el-tooltip__popper {
  1140. position: absolute;
  1141. border-radius: 4px;
  1142. padding: 10px;
  1143. z-index: 2000;
  1144. font-size: 12px;
  1145. line-height: 1.2; }
  1146. .el-tooltip__popper .popper__arrow, .el-tooltip__popper .popper__arrow::after {
  1147. position: absolute;
  1148. display: block;
  1149. width: 0;
  1150. height: 0;
  1151. border-color: transparent;
  1152. border-style: solid; }
  1153. .el-tooltip__popper .popper__arrow {
  1154. border-width: 6px; }
  1155. .el-tooltip__popper .popper__arrow::after {
  1156. content: " ";
  1157. border-width: 5px; }
  1158. .el-tooltip__popper[x-placement^="top"] {
  1159. margin-bottom: 12px; }
  1160. .el-tooltip__popper[x-placement^="top"] .popper__arrow {
  1161. bottom: -6px;
  1162. border-top-color: #8b91a0;
  1163. border-bottom-width: 0; }
  1164. .el-tooltip__popper[x-placement^="top"] .popper__arrow::after {
  1165. bottom: 1px;
  1166. margin-left: -5px;
  1167. border-top-color: #8b91a0;
  1168. border-bottom-width: 0; }
  1169. .el-tooltip__popper[x-placement^="bottom"] {
  1170. margin-top: 12px; }
  1171. .el-tooltip__popper[x-placement^="bottom"] .popper__arrow {
  1172. top: -6px;
  1173. border-top-width: 0;
  1174. border-bottom-color: #8b91a0; }
  1175. .el-tooltip__popper[x-placement^="bottom"] .popper__arrow::after {
  1176. top: 1px;
  1177. margin-left: -5px;
  1178. border-top-width: 0;
  1179. border-bottom-color: #8b91a0; }
  1180. .el-tooltip__popper[x-placement^="right"] {
  1181. margin-left: 12px; }
  1182. .el-tooltip__popper[x-placement^="right"] .popper__arrow {
  1183. left: -6px;
  1184. border-right-color: #8b91a0;
  1185. border-left-width: 0; }
  1186. .el-tooltip__popper[x-placement^="right"] .popper__arrow::after {
  1187. bottom: -5px;
  1188. left: 1px;
  1189. border-right-color: #8b91a0;
  1190. border-left-width: 0; }
  1191. .el-tooltip__popper[x-placement^="left"] {
  1192. margin-right: 12px; }
  1193. .el-tooltip__popper[x-placement^="left"] .popper__arrow {
  1194. right: -6px;
  1195. border-right-width: 0;
  1196. border-left-color: #8b91a0; }
  1197. .el-tooltip__popper[x-placement^="left"] .popper__arrow::after {
  1198. right: 1px;
  1199. bottom: -5px;
  1200. margin-left: -5px;
  1201. border-right-width: 0;
  1202. border-left-color: #8b91a0; }
  1203. .el-tooltip__popper.is-dark {
  1204. background: #8b91a0;
  1205. color: #fff; }
  1206. .el-tooltip__popper.is-light {
  1207. background: #fff;
  1208. border: 1px solid #8b91a0; }
  1209. .el-tooltip__popper.is-light[x-placement^="top"] .popper__arrow {
  1210. border-top-color: #8b91a0; }
  1211. .el-tooltip__popper.is-light[x-placement^="top"] .popper__arrow::after {
  1212. border-top-color: #fff; }
  1213. .el-tooltip__popper.is-light[x-placement^="bottom"] .popper__arrow {
  1214. border-bottom-color: #8b91a0; }
  1215. .el-tooltip__popper.is-light[x-placement^="bottom"] .popper__arrow::after {
  1216. border-bottom-color: #fff; }
  1217. .el-tooltip__popper.is-light[x-placement^="left"] .popper__arrow {
  1218. border-left-color: #8b91a0; }
  1219. .el-tooltip__popper.is-light[x-placement^="left"] .popper__arrow::after {
  1220. border-left-color: #fff; }
  1221. .el-tooltip__popper.is-light[x-placement^="right"] .popper__arrow {
  1222. border-right-color: #8b91a0; }
  1223. .el-tooltip__popper.is-light[x-placement^="right"] .popper__arrow::after {
  1224. border-right-color: #fff; }
  1225. /* Element Chalk Variables */
  1226. /* Transition
  1227. -------------------------- */
  1228. /* Colors
  1229. -------------------------- */
  1230. /* 53a8ff */
  1231. /* 66b1ff */
  1232. /* 79bbff */
  1233. /* 8cc5ff */
  1234. /* a0cfff */
  1235. /* b3d8ff */
  1236. /* c6e2ff */
  1237. /* d9ecff */
  1238. /* ecf5ff */
  1239. /* Link
  1240. -------------------------- */
  1241. /* Background
  1242. -------------------------- */
  1243. /* Border
  1244. -------------------------- */
  1245. /* Box-shadow
  1246. -------------------------- */
  1247. /* Fill
  1248. -------------------------- */
  1249. /* Font
  1250. -------------------------- */
  1251. /* Size
  1252. -------------------------- */
  1253. /* z-index
  1254. -------------------------- */
  1255. /* Disable base
  1256. -------------------------- */
  1257. /* Icon
  1258. -------------------------- */
  1259. /* Checkbox
  1260. -------------------------- */
  1261. /* Radio
  1262. -------------------------- */
  1263. /* Select
  1264. -------------------------- */
  1265. /* Alert
  1266. -------------------------- */
  1267. /* Message Box
  1268. -------------------------- */
  1269. /* Message
  1270. -------------------------- */
  1271. /* Notification
  1272. -------------------------- */
  1273. /* Input
  1274. -------------------------- */
  1275. /* Cascader
  1276. -------------------------- */
  1277. /* Group
  1278. -------------------------- */
  1279. /* Tab
  1280. -------------------------- */
  1281. /* Button
  1282. -------------------------- */
  1283. /* cascader
  1284. -------------------------- */
  1285. /* Switch
  1286. -------------------------- */
  1287. /* Dialog
  1288. -------------------------- */
  1289. /* Table
  1290. -------------------------- */
  1291. /* Pagination
  1292. -------------------------- */
  1293. /* Popover
  1294. -------------------------- */
  1295. /* Tooltip
  1296. -------------------------- */
  1297. /* Tag
  1298. -------------------------- */
  1299. /* Tree
  1300. -------------------------- */
  1301. /* Dropdown
  1302. -------------------------- */
  1303. /* Badge
  1304. -------------------------- */
  1305. /* Card
  1306. --------------------------*/
  1307. /* Slider
  1308. --------------------------*/
  1309. /* Steps
  1310. --------------------------*/
  1311. /* MenuSlide
  1312. --------------------------*/
  1313. /* Rate
  1314. --------------------------*/
  1315. /* DatePicker
  1316. --------------------------*/
  1317. /* Loading
  1318. --------------------------*/
  1319. /* Scrollbar
  1320. --------------------------*/
  1321. /* Carousel
  1322. --------------------------*/
  1323. /* Collapse
  1324. --------------------------*/
  1325. /* Transfer
  1326. --------------------------*/
  1327. /* Header
  1328. --------------------------*/
  1329. /* Footer
  1330. --------------------------*/
  1331. /* Main
  1332. --------------------------*/
  1333. /* Break-point
  1334. --------------------------*/
  1335. .el-slider::before, .el-slider::after {
  1336. display: table;
  1337. content: ""; }
  1338. .el-slider::after {
  1339. clear: both; }
  1340. .el-slider__runway {
  1341. width: 100%;
  1342. height: 6px;
  1343. margin: 16px 0;
  1344. background-color: #dfe4ed;
  1345. border-radius: 3px;
  1346. position: relative;
  1347. cursor: pointer;
  1348. vertical-align: middle; }
  1349. .el-slider__runway.show-input {
  1350. margin-right: 160px;
  1351. width: auto; }
  1352. .el-slider__runway.disabled {
  1353. cursor: default; }
  1354. .el-slider__runway.disabled .el-slider__bar {
  1355. background-color: #b4bccc; }
  1356. .el-slider__runway.disabled .el-slider__button {
  1357. border-color: #b4bccc; }
  1358. .el-slider__runway.disabled .el-slider__button-wrapper:hover, .el-slider__runway.disabled .el-slider__button-wrapper.hover {
  1359. cursor: not-allowed; }
  1360. .el-slider__runway.disabled .el-slider__button-wrapper.dragging {
  1361. cursor: not-allowed; }
  1362. .el-slider__runway.disabled .el-slider__button:hover, .el-slider__runway.disabled .el-slider__button.hover, .el-slider__runway.disabled .el-slider__button.dragging {
  1363. -webkit-transform: scale(1);
  1364. transform: scale(1); }
  1365. .el-slider__runway.disabled .el-slider__button:hover, .el-slider__runway.disabled .el-slider__button.hover {
  1366. cursor: not-allowed; }
  1367. .el-slider__runway.disabled .el-slider__button.dragging {
  1368. cursor: not-allowed; }
  1369. .el-slider__input {
  1370. float: right;
  1371. margin-top: 3px; }
  1372. .el-slider__bar {
  1373. height: 6px;
  1374. background-color: #1b1e24;
  1375. border-top-left-radius: 3px;
  1376. border-bottom-left-radius: 3px;
  1377. position: absolute; }
  1378. .el-slider__button-wrapper {
  1379. height: 36px;
  1380. width: 36px;
  1381. position: absolute;
  1382. z-index: 1001;
  1383. top: -15px;
  1384. -webkit-transform: translateX(-50%);
  1385. transform: translateX(-50%);
  1386. background-color: transparent;
  1387. text-align: center;
  1388. -webkit-user-select: none;
  1389. -moz-user-select: none;
  1390. -ms-user-select: none;
  1391. user-select: none; }
  1392. .el-slider__button-wrapper::after {
  1393. display: inline-block;
  1394. content: "";
  1395. height: 100%;
  1396. vertical-align: middle; }
  1397. .el-slider__button-wrapper .el-tooltip {
  1398. vertical-align: middle;
  1399. display: inline-block; }
  1400. .el-slider__button-wrapper:hover, .el-slider__button-wrapper.hover {
  1401. cursor: -webkit-grab;
  1402. cursor: grab; }
  1403. .el-slider__button-wrapper.dragging {
  1404. cursor: -webkit-grabbing;
  1405. cursor: grabbing; }
  1406. .el-slider__button {
  1407. width: 16px;
  1408. height: 16px;
  1409. border: solid 2px #1b1e24;
  1410. background-color: #fff;
  1411. border-radius: 50%;
  1412. -webkit-transition: .2s;
  1413. transition: .2s;
  1414. -webkit-user-select: none;
  1415. -moz-user-select: none;
  1416. -ms-user-select: none;
  1417. user-select: none; }
  1418. .el-slider__button:hover, .el-slider__button.hover, .el-slider__button.dragging {
  1419. -webkit-transform: scale(1.2);
  1420. transform: scale(1.2); }
  1421. .el-slider__button:hover, .el-slider__button.hover {
  1422. cursor: -webkit-grab;
  1423. cursor: grab; }
  1424. .el-slider__button.dragging {
  1425. cursor: -webkit-grabbing;
  1426. cursor: grabbing; }
  1427. .el-slider__stop {
  1428. position: absolute;
  1429. height: 6px;
  1430. width: 6px;
  1431. border-radius: 100%;
  1432. background-color: #fff;
  1433. -webkit-transform: translateX(-50%);
  1434. transform: translateX(-50%); }
  1435. .el-slider.is-vertical {
  1436. position: relative; }
  1437. .el-slider.is-vertical .el-slider__runway {
  1438. width: 6px;
  1439. height: 100%;
  1440. margin: 0 16px; }
  1441. .el-slider.is-vertical .el-slider__bar {
  1442. width: 6px;
  1443. height: auto;
  1444. border-radius: 0 0 3px 3px; }
  1445. .el-slider.is-vertical .el-slider__button-wrapper {
  1446. top: auto;
  1447. left: -15px;
  1448. -webkit-transform: translateY(50%);
  1449. transform: translateY(50%); }
  1450. .el-slider.is-vertical .el-slider__stop {
  1451. -webkit-transform: translateY(50%);
  1452. transform: translateY(50%); }
  1453. .el-slider.is-vertical.el-slider--with-input {
  1454. padding-bottom: 58px; }
  1455. .el-slider.is-vertical.el-slider--with-input .el-slider__input {
  1456. overflow: visible;
  1457. float: none;
  1458. position: absolute;
  1459. bottom: 22px;
  1460. width: 36px;
  1461. margin-top: 15px; }
  1462. .el-slider.is-vertical.el-slider--with-input .el-slider__input .el-input__inner {
  1463. text-align: center;
  1464. padding-left: 5px;
  1465. padding-right: 5px; }
  1466. .el-slider.is-vertical.el-slider--with-input .el-slider__input .el-input-number__decrease,
  1467. .el-slider.is-vertical.el-slider--with-input .el-slider__input .el-input-number__increase {
  1468. top: 32px;
  1469. margin-top: -1px;
  1470. border: 1px solid #d8dce5;
  1471. line-height: 20px;
  1472. -webkit-box-sizing: border-box;
  1473. box-sizing: border-box;
  1474. -webkit-transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
  1475. transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1); }
  1476. .el-slider.is-vertical.el-slider--with-input .el-slider__input .el-input-number__decrease {
  1477. width: 18px;
  1478. right: 18px;
  1479. border-bottom-left-radius: 4px; }
  1480. .el-slider.is-vertical.el-slider--with-input .el-slider__input .el-input-number__increase {
  1481. width: 19px;
  1482. border-bottom-right-radius: 4px; }
  1483. .el-slider.is-vertical.el-slider--with-input .el-slider__input .el-input-number__increase ~ .el-input .el-input__inner {
  1484. border-bottom-left-radius: 0;
  1485. border-bottom-right-radius: 0; }
  1486. .el-slider.is-vertical.el-slider--with-input .el-slider__input:hover .el-input-number__decrease,
  1487. .el-slider.is-vertical.el-slider--with-input .el-slider__input:hover .el-input-number__increase {
  1488. border-color: #b4bccc; }
  1489. .el-slider.is-vertical.el-slider--with-input .el-slider__input:active .el-input-number__decrease,
  1490. .el-slider.is-vertical.el-slider--with-input .el-slider__input:active .el-input-number__increase {
  1491. border-color: #1b1e24; }