API tools faq
paste
Advertisement
sergeuniquite

Untitled

sergeuniquite
Apr 12th, 2021
40
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 11.35 KB | None | 0 0
raw download clone embed print report
  1. .input-wrapper
  2. display flex
  3. flex-direction column
  4. position relative
  5. width 100%
  6.  
  7. &__link
  8. font-family ProximaNova-Regular
  9. font-size 14px
  10. line-height 24px
  11. color alpha(night-blue, 0.7)
  12. text-decoration none
  13. transition all .2s
  14.  
  15. +below(mobile-breakpoint)
  16. font-size 12px
  17. line-height 18px
  18.  
  19. &:hover
  20. text-decoration none
  21. color color-exchange-accent
  22.  
  23. &__subtitle
  24. font-family ProximaNova-Regular
  25. font-size 14px
  26. line-height 24px
  27. color alpha(night-blue, 0.7)
  28.  
  29. &__header
  30. &--between
  31. display flex
  32. align-items center
  33. justify-content space-between
  34.  
  35. &__label
  36. font-family ProximaNova-Bold
  37. font-size 14px
  38. line-height 24px
  39. color night-blue
  40.  
  41. +below(mobile-breakpoint)
  42. font-size 12px
  43. line-height 18px
  44.  
  45. &__content
  46. margin-top 5px
  47. +below(mobile-breakpoint)
  48. margin-top 10px
  49.  
  50. &__colums
  51. display flex
  52. align-items flex-start
  53. justify-content space-between
  54.  
  55. &__col
  56. width calc(50% - 15px)
  57.  
  58. .input-control-two-values
  59. display flex
  60. align-items center
  61. width 100%
  62.  
  63. +below(mobile-breakpoint)
  64. flex-direction column
  65.  
  66. .input-control-wrap
  67. flex-grow 1
  68.  
  69. &__icon
  70. width 70px
  71. display flex
  72. align-items center
  73. justify-content center
  74. flex-shrink 0
  75.  
  76. +below(mobile-breakpoint)
  77. width 100%
  78. height 34px
  79.  
  80. .icon
  81. width 29px
  82. height 17px
  83. fill alpha(#7e87a7, .5)
  84.  
  85. &--color-default
  86. .icon
  87. fill #000000
  88.  
  89. &--minus
  90. width 30px
  91. color color-dark-text
  92.  
  93. &--text
  94. font-family ProximaNova-Semibold
  95. font-size 14px
  96. line-height 17px
  97. color alpha(night-blue, .7)
  98.  
  99. &--text-sm
  100. width 30px
  101. font-size 10px
  102. line-height 12px
  103.  
  104. &__item
  105. flex-grow 1
  106.  
  107. &__label
  108. font-family ProximaNova-Semibold
  109. font-size 14px
  110. line-height 17px
  111. color night-blue
  112. margin-bottom 20px
  113.  
  114. &__item-wrapper
  115. display flex
  116. flex-grow 1
  117. align-items flex-end
  118. flex-shrink 0
  119. width calc(50% + 15px)
  120.  
  121. &--no-separate
  122. padding-left 30px
  123.  
  124. .dropdown-header
  125. width 100%
  126.  
  127. +below(mobile-breakpoint)
  128. padding-left 0
  129. margin-top 25px
  130.  
  131. &--align-end
  132. align-items flex-end
  133.  
  134. & ^[0]__icon
  135. &--text
  136. height 36px
  137.  
  138. &--full-left-mobile
  139. +below(mobile-breakpoint)
  140. align-items stretch
  141.  
  142. & ^[0]__icon
  143. height 57px
  144. justify-content flex-start
  145.  
  146. &--full-mobile
  147. +below(mobile-breakpoint)
  148. flex-direction column !important
  149. align-items flex-start
  150.  
  151. .text-counter-out
  152. display block !important
  153.  
  154. .input-error-out
  155. position relative
  156.  
  157. & ^[0]__icon
  158. font-size 14px !important
  159. line-height 17px
  160. height 50px
  161. justify-content flex-start
  162.  
  163. & ^[0]__item-wrapper
  164. flex-direction column
  165. align-items flex-start
  166. width 100%
  167.  
  168. &--input-dropdown
  169. align-items stretch
  170.  
  171. .text-counter-out
  172. margin-top 0
  173.  
  174. .input-main
  175. height 100%
  176.  
  177. .input-control-wrap
  178. position relative
  179. width 100%
  180.  
  181. &--label
  182. input
  183. padding-right 50px
  184.  
  185. .input-label
  186. position absolute
  187. right 17px
  188. top 50%
  189. transform translateY(-50%)
  190.  
  191. &--notes
  192. .text-counter-out
  193. position absolute
  194. bottom 100%
  195. right 0
  196. margin-top 0
  197. margin-bottom 5px
  198.  
  199. &--notes-bottom
  200. display flex
  201. .text-counter-out
  202. position absolute
  203. top 100%
  204. right 0
  205. margin-top 10px
  206.  
  207. &--notes-top
  208. display flex
  209. flex-direction column-reverse
  210. align-items flex-start
  211.  
  212. .text-counter-out
  213. margin-bottom 15px
  214. margin-top 0
  215.  
  216. &--error-bottom
  217. .input-error-out
  218. bottom auto
  219. top 100%
  220. margin-top 5px
  221. margin-bottom 0 !important
  222. right auto
  223. left 0
  224.  
  225. +below(mobile-breakpoint)
  226. .input-label
  227. top: 18px
  228. transform none
  229. margin-top -9px
  230.  
  231. .input-error-out
  232. position relative !important
  233. order -1
  234. bottom auto
  235. left auto
  236.  
  237. .text-counter-out
  238. font-family ProximaNova-Regular
  239. line-height 14px
  240. font-size 12px
  241. color alpha(night-blue, .7)
  242. text-align right
  243. margin-top 5px
  244.  
  245. &--light
  246. color alpha(night-blue, .5)
  247.  
  248. &--dark
  249. color night-blue
  250.  
  251. &--md-mb
  252. margin-bottom 10px !important
  253.  
  254. &--big
  255. font-size 14px
  256. line-height 17px
  257.  
  258. &--positive
  259. color color-positive-new
  260.  
  261. &--negative
  262. color color-negative-new
  263.  
  264. &--default
  265. color night-blue
  266.  
  267. &--ff-semibold
  268. font-family ProximaNova-Semibold
  269.  
  270. &--text-left
  271. text-align left
  272.  
  273. .input-label
  274. font-family ProximaNova-Medium
  275. font-size 14px
  276. line-height 17px
  277. color color-dark-text
  278.  
  279. &--light
  280. color alpha(night-blue, .5)
  281.  
  282. &--light-dark
  283. color alpha(color-dark-text, .5)
  284.  
  285. &--night
  286. color night-blue
  287.  
  288. &--error
  289. color color-negative-new
  290. display flex
  291. align-items center
  292. transition all .2s
  293.  
  294. span
  295. cursor pointer
  296. text-decoration underline
  297. font-size 10px
  298.  
  299. img
  300. margin-right 5px
  301. display flex
  302.  
  303. &:hover
  304. span
  305. text-decoration none
  306.  
  307. &--success
  308. color color-exchange-accent
  309. display flex
  310. align-items center
  311. transition all .2s
  312.  
  313. span
  314. cursor pointer
  315. text-decoration underline
  316. font-size 10px
  317.  
  318. img
  319. margin-right 5px
  320. display flex
  321.  
  322. &:hover
  323. span
  324. text-decoration none
  325.  
  326. &--big
  327. font-size 16px
  328. line-height 19px
  329.  
  330. .input-control
  331. font-family ProximaNova-Regular
  332. font-size 16px
  333. line-height 19px
  334. placeholder-color(#a6aab8)
  335. border-radius 6px
  336. border solid 1px rgba(34, 44, 77, 0.3)
  337. display flex
  338. align-items center
  339. padding 14px
  340. width 100%
  341. color night-blue
  342. height 50px
  343. outline none
  344. background-color #fff
  345. resize none
  346.  
  347. +below(mobile-breakpoint)
  348. background-color transparent
  349. font-size 14px
  350. line-height 17px
  351.  
  352. &:focus
  353. border-color night-blue
  354. outline none
  355.  
  356. &[disabled],.disabled
  357. color color-dark-text
  358. cursor default
  359.  
  360. &.error
  361. border-color color-negative-new
  362.  
  363. &.success
  364. border-color color-positive-new
  365.  
  366. &--main
  367. border 0
  368. background-color rgba(49, 52, 88, 0.05)
  369. height 36px
  370. padding 9px 10px
  371.  
  372. &--sm
  373. padding-left 15px
  374. font-size 14px
  375. line-height 17px
  376.  
  377. &--light
  378. placeholder-color(alpha(night-blue, .4))
  379. border-color rgba(0,0,0,.1)
  380. background transparent
  381.  
  382. &:focus
  383. border-color rgba(0,0,0,.1)
  384.  
  385. .input-main
  386. width 100%
  387. border-radius 6px
  388. background-color rgba(49, 52, 88, 0.05)
  389. border 1px solid transparent
  390. font-family ProximaNova-Regular
  391. color color-dark-text
  392. font-size 14px
  393. padding 8px 10px 8px
  394. min-height 36px
  395. height 36px
  396. line-height 17px
  397. outline none
  398. resize none
  399. placeholder-color(rgba(48,48,48,.5))
  400.  
  401. &--md-padding
  402. padding 8px 15px
  403.  
  404. &[disabled],.disabled
  405. cursor default
  406.  
  407. &:focus
  408. border-color rgba(79,91,115,.2)
  409.  
  410. &.error
  411. border-color color-negative-new
  412.  
  413. &:focus
  414. border-color rgba(79,91,115,.2)
  415.  
  416. & + .input-error-out
  417. position absolute
  418. bottom 100%
  419. right 0
  420. margin-bottom 10px
  421.  
  422. &.error-on-focus
  423. border-color rgba(79,91,115,.2)
  424.  
  425. &.error
  426. &:focus
  427. border-color color-negative-new
  428.  
  429. &.success
  430. border-color color-positive-new
  431.  
  432. &:focus
  433. border-color rgba(79,91,115,.2)
  434.  
  435. &--dark
  436. placeholder-color(alpha(night-blue, .5))
  437. color night-blue
  438.  
  439. &--chat
  440. padding-left 15px
  441. padding-right 15px
  442. placeholder-color(alpha(night-blue,.4))
  443. color night-blue
  444. background transparent
  445. border 0
  446. min-height 40px
  447. height 40px
  448.  
  449. &--options
  450. border-radius 0
  451. padding 15px 13px
  452. line-height 1.5
  453.  
  454. &--no-style
  455. border none
  456. box-shadow none
  457. padding 0
  458. background transparent
  459.  
  460. &--reverse
  461. background transparent
  462. border 1px solid rgba(0,0,0,.1)
  463.  
  464. &--big
  465. height 50px
  466. font-size 16px
  467. line-height 19px
  468.  
  469. .input-wrap-search
  470. position relative
  471. width 100%
  472. max-width 470px
  473.  
  474. input[type=search]
  475. box-sizing border-box
  476.  
  477. button
  478. position absolute
  479. right 2px
  480. top 2px
  481.  
  482. .checkbox-label
  483. cursor pointer
  484.  
  485. &:hover
  486. span
  487. color night-blue
  488.  
  489. span
  490. font-family ProximaNova-Regular
  491. font-size 14px
  492. line-height 21px
  493. color alpha(night-blue, .8)
  494. padding-left 24px
  495. position relative
  496. transition all .2s
  497. display inline-block
  498.  
  499. &:before
  500. content ""
  501. position absolute
  502. left 0
  503. top 3px
  504. cursor pointer
  505. transition all .3s
  506. height 14px
  507. width 14px
  508. border-radius 2px
  509. border 1px solid #8091b4
  510. background-color rgba(128,145,180,.05)
  511.  
  512. &:after
  513. content ""
  514. border-bottom 2px solid #fff
  515. border-left 2px solid #fff
  516. transform rotate(-45deg)
  517. position absolute
  518. height 5px
  519. left 3px
  520. top 6px
  521. width 9px
  522. border-color #fff
  523. transition all .2s
  524. opacity 0
  525. visibility hidden
  526.  
  527. input
  528. display none
  529.  
  530. &:checked + span
  531. color night-blue
  532.  
  533. &:after
  534. opacity 1
  535. visibility visible
  536.  
  537. &:before
  538. border-color #8091b4
  539. background-color #8091b4
  540.  
  541. .input-error-out
  542. font-family ProximaNova-Regular
  543. font-size 10px
  544. line-height 12px
  545. color color-negative-new
  546.  
  547. &--big
  548. font-size 14px
  549. line-height 1.5
  550.  
  551. &--relative-center
  552. position relative
  553. margin-top 10px
  554. width 100%
  555. text-align center
  556.  
  557. .input-block
  558. display flex
  559. flex-direction column
  560. width 100%
  561.  
  562. &__label
  563. margin-bottom 15px
  564. <<<<<<< HEAD
  565.  
  566. &--mb-10
  567. margin-bottom 10px
  568.  
  569. &--checkbox
  570. flex-direction row
  571. align-items center
  572. justify-content space-between
  573.  
  574. & ^[0]__label
  575. font-family ProximaNova-Regular
  576. font-size 16px
  577. line-height 19px
  578. margin-bottom 0
  579.  
  580. & ^[0]__checkbox
  581. +below(mobile-breakpoint)
  582. .custom-radio
  583. label
  584. display flex
  585. align-items center
  586.  
  587. &__label
  588. padding-left 24px !important
  589. line-height 24px !important
  590. min-width 24px !important
  591. min-height 24px !important
  592.  
  593. &:before
  594. width 24px !important
  595. height 24px !important
  596.  
  597. &:after
  598. height 7px !important
  599. left 5px !important
  600. top 6px !important
  601. width 13px !important
  602. =======
  603. display flex
  604. align-items center
  605.  
  606. .tooltip-icon
  607. margin-left 8px
  608.  
  609. &--default
  610. font-family ProximaNova-Semibold
  611. font-size 14px
  612. line-height 17px
  613. color night-blue
  614.  
  615. &__value
  616. font-family ProximaNova-Semibold
  617. font-size 21px
  618. line-height 25px
  619. color night-blue
  620.  
  621. &__row
  622. width 100%
  623.  
  624. & + &
  625. margin-top 30px
  626.  
  627. &--center
  628. align-items center
  629. margin 0 auto
  630.  
  631. & ^[0]__label, & ^[0]__value
  632. text-align center
  633. justify-content center
  634.  
  635. &--sm
  636. max-width 224px
  637. >>>>>>> origin/dev
  638.  
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!