@weavy/uikit-react 13.0.0 → 14.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (371) hide show
  1. package/changelog.md +30 -0
  2. package/dist/cjs/{types/client → client}/WeavyClient.d.ts +0 -0
  3. package/dist/cjs/{types/components → components}/Attachment.d.ts +0 -0
  4. package/dist/cjs/{types/components → components}/Avatar.d.ts +0 -0
  5. package/dist/{esm/types → cjs}/components/Chat.d.ts +1 -1
  6. package/dist/cjs/{types/components → components}/Conversation.d.ts +0 -0
  7. package/dist/cjs/{types/components → components}/ConversationBadge.d.ts +0 -0
  8. package/dist/cjs/{types/components → components}/ConversationForm.d.ts +0 -0
  9. package/dist/cjs/{types/components → components}/ConversationList.d.ts +0 -0
  10. package/dist/cjs/{types/components → components}/ConversationListItem.d.ts +0 -0
  11. package/dist/cjs/{types/components → components}/File.d.ts +0 -0
  12. package/dist/cjs/{types/components → components}/FileBrowser.d.ts +0 -0
  13. package/dist/cjs/{types/components → components}/Image.d.ts +0 -0
  14. package/dist/cjs/{types/components → components}/Meeting.d.ts +0 -0
  15. package/dist/cjs/{types/components → components}/MeetingCard.d.ts +0 -0
  16. package/dist/cjs/{types/components → components}/Meetings.d.ts +0 -0
  17. package/dist/cjs/{types/components → components}/Message.d.ts +0 -0
  18. package/dist/{esm/types → cjs}/components/Messages.d.ts +3 -1
  19. package/dist/cjs/{types/components → components}/Messenger.d.ts +0 -0
  20. package/dist/cjs/{types/components → components}/NewConversation.d.ts +0 -0
  21. package/dist/cjs/{types/components → components}/PdfViewer.d.ts +0 -0
  22. package/dist/cjs/{types/components → components}/Presence.d.ts +0 -0
  23. package/dist/cjs/{types/components → components}/Preview.d.ts +0 -0
  24. package/dist/cjs/{types/components → components}/Reactions.d.ts +0 -0
  25. package/dist/cjs/{types/components → components}/SearchUsers.d.ts +0 -0
  26. package/dist/cjs/{types/components → components}/SeenBy.d.ts +0 -0
  27. package/dist/cjs/{types/components → components}/Typing.d.ts +0 -0
  28. package/dist/cjs/{types/contexts → contexts}/MessengerContext.d.ts +0 -0
  29. package/dist/cjs/{types/contexts → contexts}/PreviewContext.d.ts +0 -0
  30. package/dist/cjs/{types/contexts → contexts}/UserContext.d.ts +0 -0
  31. package/dist/cjs/{types/contexts → contexts}/WeavyContext.d.ts +0 -0
  32. package/dist/cjs/{types/hooks → hooks}/useBadge.d.ts +0 -0
  33. package/dist/cjs/{types/hooks → hooks}/useChat.d.ts +0 -0
  34. package/dist/cjs/{types/hooks → hooks}/useConversation.d.ts +0 -0
  35. package/dist/cjs/hooks/useConversations.d.ts +1 -0
  36. package/dist/cjs/{types/hooks → hooks}/useDebounce.d.ts +0 -0
  37. package/dist/cjs/{types/hooks → hooks}/useEvents.d.ts +0 -0
  38. package/dist/cjs/{types/hooks → hooks}/useFileUploader.d.ts +0 -0
  39. package/dist/cjs/{types/hooks → hooks}/useMembers.d.ts +0 -0
  40. package/dist/cjs/{types/hooks → hooks}/useMessages.d.ts +0 -0
  41. package/dist/cjs/{types/hooks → hooks}/useMutateChat.d.ts +0 -0
  42. package/dist/cjs/{types/hooks → hooks}/useMutateConversation.d.ts +0 -0
  43. package/dist/cjs/{types/hooks → hooks}/useMutateConversationName.d.ts +0 -0
  44. package/dist/cjs/{types/hooks → hooks}/useMutateDeleteReaction.d.ts +0 -0
  45. package/dist/cjs/{types/hooks → hooks}/useMutateExternalBlobs.d.ts +0 -0
  46. package/dist/cjs/{types/hooks → hooks}/useMutateMeeting.d.ts +0 -0
  47. package/dist/cjs/{types/hooks → hooks}/useMutateMembers.d.ts +0 -0
  48. package/dist/{esm/types → cjs}/hooks/useMutateMessage.d.ts +1 -1
  49. package/dist/cjs/{types/hooks → hooks}/useMutatePinned.d.ts +0 -0
  50. package/dist/cjs/{types/hooks → hooks}/useMutateReaction.d.ts +0 -0
  51. package/dist/cjs/{types/hooks → hooks}/useMutateRead.d.ts +1 -0
  52. package/dist/cjs/{types/hooks → hooks}/useMutateRemoveMembers.d.ts +0 -0
  53. package/dist/cjs/{types/hooks → hooks}/useMutateTyping.d.ts +0 -0
  54. package/dist/cjs/{types/hooks → hooks}/usePresence.d.ts +0 -0
  55. package/dist/cjs/{types/hooks → hooks}/usePreview.d.ts +0 -0
  56. package/dist/cjs/{types/hooks → hooks}/useReactions.d.ts +0 -0
  57. package/dist/cjs/{types/hooks → hooks}/useSearchUsers.d.ts +0 -0
  58. package/dist/cjs/{types/hooks → hooks}/useThrottle.d.ts +0 -0
  59. package/dist/cjs/{types/hooks → hooks}/useUser.d.ts +0 -0
  60. package/dist/cjs/{types/index.d.ts → index.d.ts} +0 -0
  61. package/dist/cjs/index.js +6 -28
  62. package/dist/cjs/index.js.map +1 -1
  63. package/dist/cjs/types/{types/Chat.d.ts → Chat.d.ts} +1 -0
  64. package/dist/cjs/types/{types/Conversation.d.ts → Conversation.d.ts} +0 -0
  65. package/dist/cjs/types/{types/ConversationListItem.d.ts → ConversationListItem.d.ts} +0 -0
  66. package/dist/{esm/types → cjs}/types/Message.d.ts +2 -0
  67. package/dist/cjs/types/{types/Messenger.d.ts → Messenger.d.ts} +0 -0
  68. package/dist/cjs/types/{types/types.d.ts → types.d.ts} +47 -4
  69. package/dist/cjs/{types/ui → ui}/Button.d.ts +0 -0
  70. package/dist/cjs/{types/ui → ui}/Dropdown.d.ts +0 -0
  71. package/dist/cjs/{types/ui → ui}/Icon.d.ts +0 -0
  72. package/dist/cjs/{types/ui → ui}/Overlay.d.ts +0 -0
  73. package/dist/cjs/{types/ui → ui}/Spinner.d.ts +2 -1
  74. package/dist/cjs/{types/utils → utils}/fileUtilities.d.ts +0 -0
  75. package/dist/css/weavy-chat.css +1543 -959
  76. package/dist/css/weavy-messenger.css +1903 -1302
  77. package/dist/css/weavy.css +1703 -1102
  78. package/dist/esm/{types/client → client}/WeavyClient.d.ts +0 -0
  79. package/dist/esm/{types/components → components}/Attachment.d.ts +0 -0
  80. package/dist/esm/{types/components → components}/Avatar.d.ts +0 -0
  81. package/dist/{cjs/types → esm}/components/Chat.d.ts +1 -1
  82. package/dist/esm/{types/components → components}/Conversation.d.ts +0 -0
  83. package/dist/esm/{types/components → components}/ConversationBadge.d.ts +0 -0
  84. package/dist/esm/{types/components → components}/ConversationForm.d.ts +0 -0
  85. package/dist/esm/{types/components → components}/ConversationList.d.ts +0 -0
  86. package/dist/esm/{types/components → components}/ConversationListItem.d.ts +0 -0
  87. package/dist/esm/{types/components → components}/File.d.ts +0 -0
  88. package/dist/esm/{types/components → components}/FileBrowser.d.ts +0 -0
  89. package/dist/esm/{types/components → components}/Image.d.ts +0 -0
  90. package/dist/esm/{types/components → components}/Meeting.d.ts +0 -0
  91. package/dist/esm/{types/components → components}/MeetingCard.d.ts +0 -0
  92. package/dist/esm/{types/components → components}/Meetings.d.ts +0 -0
  93. package/dist/esm/{types/components → components}/Message.d.ts +0 -0
  94. package/dist/{cjs/types → esm}/components/Messages.d.ts +3 -1
  95. package/dist/esm/{types/components → components}/Messenger.d.ts +0 -0
  96. package/dist/esm/{types/components → components}/NewConversation.d.ts +0 -0
  97. package/dist/esm/{types/components → components}/PdfViewer.d.ts +0 -0
  98. package/dist/esm/{types/components → components}/Presence.d.ts +0 -0
  99. package/dist/esm/{types/components → components}/Preview.d.ts +0 -0
  100. package/dist/esm/{types/components → components}/Reactions.d.ts +0 -0
  101. package/dist/esm/{types/components → components}/SearchUsers.d.ts +0 -0
  102. package/dist/esm/{types/components → components}/SeenBy.d.ts +0 -0
  103. package/dist/esm/{types/components → components}/Typing.d.ts +0 -0
  104. package/dist/esm/{types/contexts → contexts}/MessengerContext.d.ts +0 -0
  105. package/dist/esm/{types/contexts → contexts}/PreviewContext.d.ts +0 -0
  106. package/dist/esm/{types/contexts → contexts}/UserContext.d.ts +0 -0
  107. package/dist/esm/{types/contexts → contexts}/WeavyContext.d.ts +0 -0
  108. package/dist/esm/{types/hooks → hooks}/useBadge.d.ts +0 -0
  109. package/dist/esm/{types/hooks → hooks}/useChat.d.ts +0 -0
  110. package/dist/esm/{types/hooks → hooks}/useConversation.d.ts +0 -0
  111. package/dist/esm/hooks/useConversations.d.ts +1 -0
  112. package/dist/esm/{types/hooks → hooks}/useDebounce.d.ts +0 -0
  113. package/dist/esm/{types/hooks → hooks}/useEvents.d.ts +0 -0
  114. package/dist/esm/{types/hooks → hooks}/useFileUploader.d.ts +0 -0
  115. package/dist/esm/{types/hooks → hooks}/useMembers.d.ts +0 -0
  116. package/dist/esm/{types/hooks → hooks}/useMessages.d.ts +0 -0
  117. package/dist/esm/{types/hooks → hooks}/useMutateChat.d.ts +0 -0
  118. package/dist/esm/{types/hooks → hooks}/useMutateConversation.d.ts +0 -0
  119. package/dist/esm/{types/hooks → hooks}/useMutateConversationName.d.ts +0 -0
  120. package/dist/esm/{types/hooks → hooks}/useMutateDeleteReaction.d.ts +0 -0
  121. package/dist/esm/{types/hooks → hooks}/useMutateExternalBlobs.d.ts +0 -0
  122. package/dist/esm/{types/hooks → hooks}/useMutateMeeting.d.ts +0 -0
  123. package/dist/esm/{types/hooks → hooks}/useMutateMembers.d.ts +0 -0
  124. package/dist/{cjs/types → esm}/hooks/useMutateMessage.d.ts +1 -1
  125. package/dist/esm/{types/hooks → hooks}/useMutatePinned.d.ts +0 -0
  126. package/dist/esm/{types/hooks → hooks}/useMutateReaction.d.ts +0 -0
  127. package/dist/esm/{types/hooks → hooks}/useMutateRead.d.ts +1 -0
  128. package/dist/esm/{types/hooks → hooks}/useMutateRemoveMembers.d.ts +0 -0
  129. package/dist/esm/{types/hooks → hooks}/useMutateTyping.d.ts +0 -0
  130. package/dist/esm/{types/hooks → hooks}/usePresence.d.ts +0 -0
  131. package/dist/esm/{types/hooks → hooks}/usePreview.d.ts +0 -0
  132. package/dist/esm/{types/hooks → hooks}/useReactions.d.ts +0 -0
  133. package/dist/esm/{types/hooks → hooks}/useSearchUsers.d.ts +0 -0
  134. package/dist/esm/{types/hooks → hooks}/useThrottle.d.ts +0 -0
  135. package/dist/esm/{types/hooks → hooks}/useUser.d.ts +0 -0
  136. package/dist/esm/{types/index.d.ts → index.d.ts} +0 -0
  137. package/dist/esm/index.js +6 -28
  138. package/dist/esm/index.js.map +1 -1
  139. package/dist/esm/types/{types/Chat.d.ts → Chat.d.ts} +1 -0
  140. package/dist/esm/types/{types/Conversation.d.ts → Conversation.d.ts} +0 -0
  141. package/dist/esm/types/{types/ConversationListItem.d.ts → ConversationListItem.d.ts} +0 -0
  142. package/dist/{cjs/types → esm}/types/Message.d.ts +2 -0
  143. package/dist/esm/types/{types/Messenger.d.ts → Messenger.d.ts} +0 -0
  144. package/dist/esm/types/{types/types.d.ts → types.d.ts} +47 -4
  145. package/dist/esm/{types/ui → ui}/Button.d.ts +0 -0
  146. package/dist/esm/{types/ui → ui}/Dropdown.d.ts +0 -0
  147. package/dist/esm/{types/ui → ui}/Icon.d.ts +0 -0
  148. package/dist/esm/{types/ui → ui}/Overlay.d.ts +0 -0
  149. package/dist/esm/{types/ui → ui}/Spinner.d.ts +2 -1
  150. package/dist/esm/{types/utils → utils}/fileUtilities.d.ts +0 -0
  151. package/dist/index.d.ts +2 -1
  152. package/package.json +18 -15
  153. package/{rollup.config.js → rollup.config.mjs} +10 -3
  154. package/src/client/WeavyClient.ts +12 -17
  155. package/src/components/Attachment.tsx +5 -5
  156. package/src/components/Chat.tsx +6 -5
  157. package/src/components/Conversation.tsx +26 -20
  158. package/src/components/ConversationBadge.tsx +7 -5
  159. package/src/components/ConversationForm.tsx +1 -1
  160. package/src/components/ConversationList.tsx +59 -11
  161. package/src/components/ConversationListItem.tsx +94 -58
  162. package/src/components/FileBrowser.tsx +53 -50
  163. package/src/components/Image.tsx +2 -1
  164. package/src/components/MeetingCard.tsx +35 -13
  165. package/src/components/Meetings.tsx +1 -1
  166. package/src/components/Message.tsx +41 -42
  167. package/src/components/Messages.tsx +61 -60
  168. package/src/components/Messenger.tsx +7 -2
  169. package/src/components/NewConversation.tsx +1 -1
  170. package/src/components/PdfViewer.tsx +5 -5
  171. package/src/components/Preview.tsx +2 -2
  172. package/src/components/Reactions.tsx +11 -5
  173. package/src/components/SearchUsers.tsx +19 -9
  174. package/src/components/SeenBy.tsx +13 -7
  175. package/src/components/Typing.tsx +11 -12
  176. package/src/contexts/UserContext.tsx +1 -1
  177. package/src/contexts/WeavyContext.tsx +3 -3
  178. package/src/hooks/useConversations.ts +15 -5
  179. package/src/hooks/useMutateMessage.ts +1 -5
  180. package/src/hooks/useMutateRead.ts +5 -3
  181. package/src/hooks/usePresence.ts +2 -3
  182. package/src/hooks/useReactions.ts +11 -12
  183. package/src/scss/theme/_alert.scss +61 -63
  184. package/src/scss/theme/_appbar.scss +105 -30
  185. package/src/scss/theme/_avatar.scss +23 -28
  186. package/src/scss/theme/_badge.scss +26 -18
  187. package/src/scss/theme/_buttons.scss +107 -52
  188. package/src/scss/theme/_card.scss +102 -4
  189. package/src/scss/theme/_checkbox.scss +16 -20
  190. package/src/scss/theme/_code-vscode-dark.scss +3 -3
  191. package/src/scss/theme/_code-vscode-light.scss +3 -3
  192. package/src/scss/theme/_code.scss +0 -2
  193. package/src/scss/theme/_comment-editor-cm.scss +97 -0
  194. package/src/scss/theme/_comment-editor.scss +129 -0
  195. package/src/scss/theme/_comments.scss +66 -0
  196. package/src/scss/theme/_content.scss +33 -5
  197. package/src/scss/theme/_conversations.scss +19 -78
  198. package/src/scss/theme/_dropdown.scss +102 -15
  199. package/src/scss/theme/_embed.scss +135 -0
  200. package/src/scss/theme/_facepile.scss +11 -0
  201. package/src/scss/theme/_filebrowser.scss +1 -1
  202. package/src/scss/theme/_files.scss +76 -47
  203. package/src/scss/theme/_grid.scss +8 -0
  204. package/src/scss/theme/_icons.scss +155 -19
  205. package/src/scss/theme/_image-grid.scss +7 -12
  206. package/src/scss/theme/_input.scss +160 -0
  207. package/src/scss/theme/_item.scss +169 -0
  208. package/src/scss/theme/_list.scss +57 -0
  209. package/src/scss/theme/_meeting.scss +11 -0
  210. package/src/scss/theme/_message-editor-cm.scss +95 -0
  211. package/src/scss/theme/_message-editor.scss +65 -19
  212. package/src/scss/theme/_messages.scss +51 -105
  213. package/src/scss/theme/_meta.scss +12 -0
  214. package/src/scss/theme/_overlays.scss +31 -76
  215. package/src/scss/theme/_pager.scss +5 -1
  216. package/src/scss/theme/_pane.scss +13 -2
  217. package/src/scss/theme/_panels.scss +33 -28
  218. package/src/scss/theme/_picker-list.scss +5 -3
  219. package/src/scss/theme/_placeholder.scss +19 -0
  220. package/src/scss/theme/_poll.scss +49 -0
  221. package/src/scss/theme/_post-editor-cm.scss +100 -0
  222. package/src/scss/theme/_post-editor.scss +127 -0
  223. package/src/scss/theme/_post.scss +83 -0
  224. package/src/scss/theme/_preview-code.scss +11 -2
  225. package/src/scss/theme/_preview-embed.scss +8 -2
  226. package/src/scss/theme/_preview-image.scss +8 -26
  227. package/src/scss/theme/_preview-media.scss +1 -0
  228. package/src/scss/theme/_preview-pdf.scss +10 -15
  229. package/src/scss/theme/_preview.scss +57 -79
  230. package/src/scss/theme/_reactions.scss +48 -17
  231. package/src/scss/theme/_sheet.scss +59 -0
  232. package/src/scss/theme/_sidebar.scss +86 -0
  233. package/src/scss/theme/_spinner.scss +11 -7
  234. package/src/scss/theme/_tab.scss +72 -0
  235. package/src/scss/theme/_tables.scss +70 -23
  236. package/src/scss/theme/_toasts.scss +56 -26
  237. package/src/scss/theme/_type.scss +41 -0
  238. package/src/scss/theme/{mixins → base}/_backdrop.scss +0 -0
  239. package/src/scss/theme/{bootstrap/mixins → base}/_breakpoints.scss +9 -0
  240. package/src/scss/theme/base/_colors.scss +315 -0
  241. package/src/scss/theme/base/_md.scss +19 -0
  242. package/src/scss/theme/base/_palette.scss +130 -0
  243. package/src/scss/theme/{mixins → base}/_position.scss +5 -5
  244. package/src/scss/theme/base/_reboot.scss +51 -0
  245. package/src/scss/theme/base/_scroll.scss +180 -0
  246. package/src/scss/theme/base/_svg.scss +49 -0
  247. package/src/scss/theme/base/_text.scss +23 -0
  248. package/src/scss/theme/base/_vars.scss +203 -0
  249. package/src/scss/theme/{fonts → base/fonts}/_fontmapping-roboto.scss +0 -0
  250. package/src/scss/theme/{fonts → base/fonts}/_fontmapping-segoe-ui.scss +0 -0
  251. package/src/scss/theme/base/fonts/_index.scss +2 -0
  252. package/src/scss/weavy-chat.scss +10 -4
  253. package/src/scss/weavy-messenger.scss +37 -21
  254. package/src/types/Chat.ts +2 -1
  255. package/src/types/Message.ts +3 -1
  256. package/src/types/types.ts +56 -5
  257. package/src/ui/Icon.tsx +1 -1
  258. package/src/ui/Spinner.tsx +3 -2
  259. package/src/utils/infiniteScroll.js +12 -3
  260. package/src/utils/postal-parent.js +398 -0
  261. package/src/utils/promise.js +187 -0
  262. package/src/utils/scrollbarDetection.js +71 -9
  263. package/src/utils/utils.js +547 -0
  264. package/dist/cjs/types/hooks/useConversations.d.ts +0 -1
  265. package/dist/esm/types/hooks/useConversations.d.ts +0 -1
  266. package/src/scss/theme/_attachments.scss +0 -74
  267. package/src/scss/theme/_cm-editor.scss +0 -42
  268. package/src/scss/theme/_colors.scss +0 -520
  269. package/src/scss/theme/_config.scss +0 -6
  270. package/src/scss/theme/_inputs.scss +0 -28
  271. package/src/scss/theme/_nav.scss +0 -52
  272. package/src/scss/theme/_palette.scss +0 -165
  273. package/src/scss/theme/_preview-icon.scss +0 -41
  274. package/src/scss/theme/_reboot.scss +0 -41
  275. package/src/scss/theme/_root.scss +0 -2
  276. package/src/scss/theme/_scroll.scss +0 -55
  277. package/src/scss/theme/_search.scss +0 -68
  278. package/src/scss/theme/_turbo.scss +0 -17
  279. package/src/scss/theme/_variables.scss +0 -139
  280. package/src/scss/theme/bootstrap/_accordion.scss +0 -146
  281. package/src/scss/theme/bootstrap/_alert.scss +0 -71
  282. package/src/scss/theme/bootstrap/_badge.scss +0 -38
  283. package/src/scss/theme/bootstrap/_breadcrumb.scss +0 -40
  284. package/src/scss/theme/bootstrap/_button-group.scss +0 -142
  285. package/src/scss/theme/bootstrap/_buttons.scss +0 -186
  286. package/src/scss/theme/bootstrap/_card.scss +0 -234
  287. package/src/scss/theme/bootstrap/_carousel.scss +0 -229
  288. package/src/scss/theme/bootstrap/_close.scss +0 -40
  289. package/src/scss/theme/bootstrap/_containers.scss +0 -41
  290. package/src/scss/theme/bootstrap/_dropdown.scss +0 -248
  291. package/src/scss/theme/bootstrap/_forms.scss +0 -9
  292. package/src/scss/theme/bootstrap/_functions.scss +0 -302
  293. package/src/scss/theme/bootstrap/_grid.scss +0 -33
  294. package/src/scss/theme/bootstrap/_helpers.scss +0 -10
  295. package/src/scss/theme/bootstrap/_images.scss +0 -42
  296. package/src/scss/theme/bootstrap/_list-group.scss +0 -191
  297. package/src/scss/theme/bootstrap/_maps.scss +0 -54
  298. package/src/scss/theme/bootstrap/_mixins.scss +0 -43
  299. package/src/scss/theme/bootstrap/_modal.scss +0 -237
  300. package/src/scss/theme/bootstrap/_nav.scss +0 -172
  301. package/src/scss/theme/bootstrap/_navbar.scss +0 -276
  302. package/src/scss/theme/bootstrap/_offcanvas.scss +0 -143
  303. package/src/scss/theme/bootstrap/_pagination.scss +0 -109
  304. package/src/scss/theme/bootstrap/_placeholders.scss +0 -51
  305. package/src/scss/theme/bootstrap/_popover.scss +0 -196
  306. package/src/scss/theme/bootstrap/_progress.scss +0 -59
  307. package/src/scss/theme/bootstrap/_reboot.scss +0 -610
  308. package/src/scss/theme/bootstrap/_root.scss +0 -73
  309. package/src/scss/theme/bootstrap/_spinners.scss +0 -85
  310. package/src/scss/theme/bootstrap/_tables.scss +0 -164
  311. package/src/scss/theme/bootstrap/_toasts.scss +0 -70
  312. package/src/scss/theme/bootstrap/_tooltip.scss +0 -120
  313. package/src/scss/theme/bootstrap/_transitions.scss +0 -27
  314. package/src/scss/theme/bootstrap/_type.scss +0 -106
  315. package/src/scss/theme/bootstrap/_utilities.scss +0 -647
  316. package/src/scss/theme/bootstrap/_variables.scss +0 -1633
  317. package/src/scss/theme/bootstrap/forms/_floating-labels.scss +0 -74
  318. package/src/scss/theme/bootstrap/forms/_form-check.scss +0 -175
  319. package/src/scss/theme/bootstrap/forms/_form-control.scss +0 -194
  320. package/src/scss/theme/bootstrap/forms/_form-range.scss +0 -91
  321. package/src/scss/theme/bootstrap/forms/_form-select.scss +0 -71
  322. package/src/scss/theme/bootstrap/forms/_form-text.scss +0 -11
  323. package/src/scss/theme/bootstrap/forms/_input-group.scss +0 -129
  324. package/src/scss/theme/bootstrap/forms/_labels.scss +0 -36
  325. package/src/scss/theme/bootstrap/forms/_validation.scss +0 -12
  326. package/src/scss/theme/bootstrap/helpers/_clearfix.scss +0 -3
  327. package/src/scss/theme/bootstrap/helpers/_color-bg.scss +0 -10
  328. package/src/scss/theme/bootstrap/helpers/_colored-links.scss +0 -12
  329. package/src/scss/theme/bootstrap/helpers/_position.scss +0 -36
  330. package/src/scss/theme/bootstrap/helpers/_ratio.scss +0 -26
  331. package/src/scss/theme/bootstrap/helpers/_stacks.scss +0 -15
  332. package/src/scss/theme/bootstrap/helpers/_stretched-link.scss +0 -15
  333. package/src/scss/theme/bootstrap/helpers/_text-truncation.scss +0 -7
  334. package/src/scss/theme/bootstrap/helpers/_visually-hidden.scss +0 -8
  335. package/src/scss/theme/bootstrap/helpers/_vr.scss +0 -8
  336. package/src/scss/theme/bootstrap/mixins/_alert.scss +0 -15
  337. package/src/scss/theme/bootstrap/mixins/_backdrop.scss +0 -14
  338. package/src/scss/theme/bootstrap/mixins/_banner.scss +0 -9
  339. package/src/scss/theme/bootstrap/mixins/_border-radius.scss +0 -78
  340. package/src/scss/theme/bootstrap/mixins/_box-shadow.scss +0 -18
  341. package/src/scss/theme/bootstrap/mixins/_buttons.scss +0 -70
  342. package/src/scss/theme/bootstrap/mixins/_caret.scss +0 -64
  343. package/src/scss/theme/bootstrap/mixins/_clearfix.scss +0 -9
  344. package/src/scss/theme/bootstrap/mixins/_color-scheme.scss +0 -7
  345. package/src/scss/theme/bootstrap/mixins/_container.scss +0 -11
  346. package/src/scss/theme/bootstrap/mixins/_deprecate.scss +0 -10
  347. package/src/scss/theme/bootstrap/mixins/_forms.scss +0 -152
  348. package/src/scss/theme/bootstrap/mixins/_gradients.scss +0 -47
  349. package/src/scss/theme/bootstrap/mixins/_grid.scss +0 -151
  350. package/src/scss/theme/bootstrap/mixins/_image.scss +0 -16
  351. package/src/scss/theme/bootstrap/mixins/_list-group.scss +0 -24
  352. package/src/scss/theme/bootstrap/mixins/_lists.scss +0 -7
  353. package/src/scss/theme/bootstrap/mixins/_pagination.scss +0 -10
  354. package/src/scss/theme/bootstrap/mixins/_reset-text.scss +0 -17
  355. package/src/scss/theme/bootstrap/mixins/_resize.scss +0 -6
  356. package/src/scss/theme/bootstrap/mixins/_table-variants.scss +0 -24
  357. package/src/scss/theme/bootstrap/mixins/_text-truncate.scss +0 -8
  358. package/src/scss/theme/bootstrap/mixins/_transition.scss +0 -26
  359. package/src/scss/theme/bootstrap/mixins/_utilities.scss +0 -97
  360. package/src/scss/theme/bootstrap/mixins/_visually-hidden.scss +0 -29
  361. package/src/scss/theme/bootstrap/utilities/_api.scss +0 -47
  362. package/src/scss/theme/bootstrap/vendor/_rfs.scss +0 -354
  363. package/src/scss/theme/bs/_badge.scss +0 -20
  364. package/src/scss/theme/bs/_buttons.scss +0 -185
  365. package/src/scss/theme/bs/_dropdown.scss +0 -86
  366. package/src/scss/theme/bs/_forms.scss +0 -161
  367. package/src/scss/theme/bs/_list-group.scss +0 -73
  368. package/src/scss/theme/bs/_tables.scss +0 -46
  369. package/src/scss/theme/fonts/_index.scss +0 -2
  370. package/src/scss/theme/mixins/_palette.scss +0 -165
  371. package/src/scss/theme/mixins/_scrollbar.scss +0 -110
@@ -1,71 +0,0 @@
1
- //
2
- // Base styles
3
- //
4
-
5
- .alert {
6
- // scss-docs-start alert-css-vars
7
- --#{$prefix}alert-bg: transparent;
8
- --#{$prefix}alert-padding-x: #{$alert-padding-x};
9
- --#{$prefix}alert-padding-y: #{$alert-padding-y};
10
- --#{$prefix}alert-margin-bottom: #{$alert-margin-bottom};
11
- --#{$prefix}alert-color: inherit;
12
- --#{$prefix}alert-border-color: transparent;
13
- --#{$prefix}alert-border: #{$alert-border-width} solid var(--#{$prefix}alert-border-color);
14
- --#{$prefix}alert-border-radius: #{$alert-border-radius};
15
- // scss-docs-end alert-css-vars
16
-
17
- position: relative;
18
- padding: var(--#{$prefix}alert-padding-y) var(--#{$prefix}alert-padding-x);
19
- margin-bottom: var(--#{$prefix}alert-margin-bottom);
20
- color: var(--#{$prefix}alert-color);
21
- background-color: var(--#{$prefix}alert-bg);
22
- border: var(--#{$prefix}alert-border);
23
- @include border-radius(var(--#{$prefix}alert-border-radius));
24
- }
25
-
26
- // Headings for larger alerts
27
- .alert-heading {
28
- // Specified to prevent conflicts of changing $headings-color
29
- color: inherit;
30
- }
31
-
32
- // Provide class for links that match alerts
33
- .alert-link {
34
- font-weight: $alert-link-font-weight;
35
- }
36
-
37
-
38
- // Dismissible alerts
39
- //
40
- // Expand the right padding and account for the close button's positioning.
41
-
42
- .alert-dismissible {
43
- padding-right: $alert-dismissible-padding-r;
44
-
45
- // Adjust close link position
46
- .btn-close {
47
- position: absolute;
48
- top: 0;
49
- right: 0;
50
- z-index: $stretched-link-z-index + 1;
51
- padding: $alert-padding-y * 1.25 $alert-padding-x;
52
- }
53
- }
54
-
55
-
56
- // scss-docs-start alert-modifiers
57
- // Generate contextual modifier classes for colorizing the alert.
58
-
59
- @each $state, $value in $theme-colors {
60
- $alert-background: shift-color($value, $alert-bg-scale);
61
- $alert-border: shift-color($value, $alert-border-scale);
62
- $alert-color: shift-color($value, $alert-color-scale);
63
-
64
- @if (contrast-ratio($alert-background, $alert-color) < $min-contrast-ratio) {
65
- $alert-color: mix($value, color-contrast($alert-background), abs($alert-color-scale));
66
- }
67
- .alert-#{$state} {
68
- @include alert-variant($alert-background, $alert-border, $alert-color);
69
- }
70
- }
71
- // scss-docs-end alert-modifiers
@@ -1,38 +0,0 @@
1
- // Base class
2
- //
3
- // Requires one of the contextual, color modifier classes for `color` and
4
- // `background-color`.
5
-
6
- .badge {
7
- // scss-docs-start badge-css-vars
8
- --#{$prefix}badge-padding-x: #{$badge-padding-x};
9
- --#{$prefix}badge-padding-y: #{$badge-padding-y};
10
- @include rfs($badge-font-size, --#{$prefix}badge-font-size);
11
- --#{$prefix}badge-font-weight: #{$badge-font-weight};
12
- --#{$prefix}badge-color: #{$badge-color};
13
- --#{$prefix}badge-border-radius: #{$badge-border-radius};
14
- // scss-docs-end badge-css-vars
15
-
16
- display: inline-block;
17
- padding: var(--#{$prefix}badge-padding-y) var(--#{$prefix}badge-padding-x);
18
- @include font-size(var(--#{$prefix}badge-font-size));
19
- font-weight: var(--#{$prefix}badge-font-weight);
20
- line-height: 1;
21
- color: var(--#{$prefix}badge-color);
22
- text-align: center;
23
- white-space: nowrap;
24
- vertical-align: baseline;
25
- @include border-radius(var(--#{$prefix}badge-border-radius));
26
- @include gradient-bg();
27
-
28
- // Empty badges collapse automatically
29
- &:empty {
30
- display: none;
31
- }
32
- }
33
-
34
- // Quick fix for badges in buttons
35
- .btn .badge {
36
- position: relative;
37
- top: -1px;
38
- }
@@ -1,40 +0,0 @@
1
- .breadcrumb {
2
- // scss-docs-start breadcrumb-css-vars
3
- --#{$prefix}breadcrumb-padding-x: #{$breadcrumb-padding-x};
4
- --#{$prefix}breadcrumb-padding-y: #{$breadcrumb-padding-y};
5
- --#{$prefix}breadcrumb-margin-bottom: #{$breadcrumb-margin-bottom};
6
- @include rfs($breadcrumb-font-size, --#{$prefix}breadcrumb-font-size);
7
- --#{$prefix}breadcrumb-bg: #{$breadcrumb-bg};
8
- --#{$prefix}breadcrumb-border-radius: #{$breadcrumb-border-radius};
9
- --#{$prefix}breadcrumb-divider-color: #{$breadcrumb-divider-color};
10
- --#{$prefix}breadcrumb-item-padding-x: #{$breadcrumb-item-padding-x};
11
- --#{$prefix}breadcrumb-item-active-color: #{$breadcrumb-active-color};
12
- // scss-docs-end breadcrumb-css-vars
13
-
14
- display: flex;
15
- flex-wrap: wrap;
16
- padding: var(--#{$prefix}breadcrumb-padding-y) var(--#{$prefix}breadcrumb-padding-x);
17
- margin-bottom: var(--#{$prefix}breadcrumb-margin-bottom);
18
- @include font-size(var(--#{$prefix}breadcrumb-font-size));
19
- list-style: none;
20
- background-color: var(--#{$prefix}breadcrumb-bg);
21
- @include border-radius(var(--#{$prefix}breadcrumb-border-radius));
22
- }
23
-
24
- .breadcrumb-item {
25
- // The separator between breadcrumbs (by default, a forward-slash: "/")
26
- + .breadcrumb-item {
27
- padding-left: var(--#{$prefix}breadcrumb-item-padding-x);
28
-
29
- &::before {
30
- float: left; // Suppress inline spacings and underlining of the separator
31
- padding-right: var(--#{$prefix}breadcrumb-item-padding-x);
32
- color: var(--#{$prefix}breadcrumb-divider-color);
33
- content: var(--#{$prefix}breadcrumb-divider, escape-svg($breadcrumb-divider)) #{"/* rtl:"} var(--#{$prefix}breadcrumb-divider, escape-svg($breadcrumb-divider-flipped)) #{"*/"};
34
- }
35
- }
36
-
37
- &.active {
38
- color: var(--#{$prefix}breadcrumb-item-active-color);
39
- }
40
- }
@@ -1,142 +0,0 @@
1
- // Make the div behave like a button
2
- .btn-group,
3
- .btn-group-vertical {
4
- position: relative;
5
- display: inline-flex;
6
- vertical-align: middle; // match .btn alignment given font-size hack above
7
-
8
- > .btn {
9
- position: relative;
10
- flex: 1 1 auto;
11
- }
12
-
13
- // Bring the hover, focused, and "active" buttons to the front to overlay
14
- // the borders properly
15
- > .btn-check:checked + .btn,
16
- > .btn-check:focus + .btn,
17
- > .btn:hover,
18
- > .btn:focus,
19
- > .btn:active,
20
- > .btn.active {
21
- z-index: 1;
22
- }
23
- }
24
-
25
- // Optional: Group multiple button groups together for a toolbar
26
- .btn-toolbar {
27
- display: flex;
28
- flex-wrap: wrap;
29
- justify-content: flex-start;
30
-
31
- .input-group {
32
- width: auto;
33
- }
34
- }
35
-
36
- .btn-group {
37
- @include border-radius($btn-border-radius);
38
-
39
- // Prevent double borders when buttons are next to each other
40
- > .btn:not(:first-child),
41
- > .btn-group:not(:first-child) {
42
- margin-left: -$btn-border-width;
43
- }
44
-
45
- // Reset rounded corners
46
- > .btn:not(:last-child):not(.dropdown-toggle),
47
- > .btn.dropdown-toggle-split:first-child,
48
- > .btn-group:not(:last-child) > .btn {
49
- @include border-end-radius(0);
50
- }
51
-
52
- // The left radius should be 0 if the button is:
53
- // - the "third or more" child
54
- // - the second child and the previous element isn't `.btn-check` (making it the first child visually)
55
- // - part of a btn-group which isn't the first child
56
- > .btn:nth-child(n + 3),
57
- > :not(.btn-check) + .btn,
58
- > .btn-group:not(:first-child) > .btn {
59
- @include border-start-radius(0);
60
- }
61
- }
62
-
63
- // Sizing
64
- //
65
- // Remix the default button sizing classes into new ones for easier manipulation.
66
-
67
- .btn-group-sm > .btn { @extend .btn-sm; }
68
- .btn-group-lg > .btn { @extend .btn-lg; }
69
-
70
-
71
- //
72
- // Split button dropdowns
73
- //
74
-
75
- .dropdown-toggle-split {
76
- padding-right: $btn-padding-x * .75;
77
- padding-left: $btn-padding-x * .75;
78
-
79
- &::after,
80
- .dropup &::after,
81
- .dropend &::after {
82
- margin-left: 0;
83
- }
84
-
85
- .dropstart &::before {
86
- margin-right: 0;
87
- }
88
- }
89
-
90
- .btn-sm + .dropdown-toggle-split {
91
- padding-right: $btn-padding-x-sm * .75;
92
- padding-left: $btn-padding-x-sm * .75;
93
- }
94
-
95
- .btn-lg + .dropdown-toggle-split {
96
- padding-right: $btn-padding-x-lg * .75;
97
- padding-left: $btn-padding-x-lg * .75;
98
- }
99
-
100
-
101
- // The clickable button for toggling the menu
102
- // Set the same inset shadow as the :active state
103
- .btn-group.show .dropdown-toggle {
104
- @include box-shadow($btn-active-box-shadow);
105
-
106
- // Show no shadow for `.btn-link` since it has no other button styles.
107
- &.btn-link {
108
- @include box-shadow(none);
109
- }
110
- }
111
-
112
-
113
- //
114
- // Vertical button groups
115
- //
116
-
117
- .btn-group-vertical {
118
- flex-direction: column;
119
- align-items: flex-start;
120
- justify-content: center;
121
-
122
- > .btn,
123
- > .btn-group {
124
- width: 100%;
125
- }
126
-
127
- > .btn:not(:first-child),
128
- > .btn-group:not(:first-child) {
129
- margin-top: -$btn-border-width;
130
- }
131
-
132
- // Reset rounded corners
133
- > .btn:not(:last-child):not(.dropdown-toggle),
134
- > .btn-group:not(:last-child) > .btn {
135
- @include border-bottom-radius(0);
136
- }
137
-
138
- > .btn ~ .btn,
139
- > .btn-group:not(:first-child) > .btn {
140
- @include border-top-radius(0);
141
- }
142
- }
@@ -1,186 +0,0 @@
1
- //
2
- // Base styles
3
- //
4
-
5
- .btn {
6
- // scss-docs-start btn-css-vars
7
- --#{$prefix}btn-padding-x: #{$btn-padding-x};
8
- --#{$prefix}btn-padding-y: #{$btn-padding-y};
9
- --#{$prefix}btn-font-family: #{$btn-font-family};
10
- @include rfs($btn-font-size, --#{$prefix}btn-font-size);
11
- --#{$prefix}btn-font-weight: #{$btn-font-weight};
12
- --#{$prefix}btn-line-height: #{$btn-line-height};
13
- --#{$prefix}btn-color: #{$body-color};
14
- --#{$prefix}btn-bg: transparent;
15
- --#{$prefix}btn-border-width: #{$btn-border-width};
16
- --#{$prefix}btn-border-color: transparent;
17
- --#{$prefix}btn-border-radius: #{$btn-border-radius};
18
- --#{$prefix}btn-box-shadow: #{$btn-box-shadow};
19
- --#{$prefix}btn-disabled-opacity: #{$btn-disabled-opacity};
20
- --#{$prefix}btn-focus-box-shadow: 0 0 0 #{$btn-focus-width} rgba(var(--#{$prefix}btn-focus-shadow-rgb), .5);
21
- // scss-docs-end btn-css-vars
22
-
23
- display: inline-block;
24
- padding: var(--#{$prefix}btn-padding-y) var(--#{$prefix}btn-padding-x);
25
- font-family: var(--#{$prefix}btn-font-family);
26
- @include font-size(var(--#{$prefix}btn-font-size));
27
- font-weight: var(--#{$prefix}btn-font-weight);
28
- line-height: var(--#{$prefix}btn-line-height);
29
- color: var(--#{$prefix}btn-color);
30
- text-align: center;
31
- text-decoration: if($link-decoration == none, null, none);
32
- white-space: $btn-white-space;
33
- vertical-align: middle;
34
- cursor: if($enable-button-pointers, pointer, null);
35
- user-select: none;
36
- border: var(--#{$prefix}btn-border-width) solid var(--#{$prefix}btn-border-color);
37
- @include border-radius(var(--#{$prefix}btn-border-radius));
38
- @include gradient-bg(var(--#{$prefix}btn-bg));
39
- @include box-shadow(var(--#{$prefix}btn-box-shadow));
40
- @include transition($btn-transition);
41
-
42
- &:hover {
43
- color: var(--#{$prefix}btn-hover-color);
44
- text-decoration: if($link-hover-decoration == underline, none, null);
45
- background-color: var(--#{$prefix}btn-hover-bg);
46
- border-color: var(--#{$prefix}btn-hover-border-color);
47
- }
48
-
49
- .btn-check:focus + &,
50
- &:focus {
51
- color: var(--#{$prefix}btn-hover-color);
52
- @include gradient-bg(var(--#{$prefix}btn-hover-bg));
53
- border-color: var(--#{$prefix}btn-hover-border-color);
54
- outline: 0;
55
- // Avoid using mixin so we can pass custom focus shadow properly
56
- @if $enable-shadows {
57
- box-shadow: var(--#{$prefix}btn-box-shadow), var(--#{$prefix}btn-focus-box-shadow);
58
- } @else {
59
- box-shadow: var(--#{$prefix}btn-focus-box-shadow);
60
- }
61
- }
62
-
63
- .btn-check:checked + &,
64
- .btn-check:active + &,
65
- &:active,
66
- &.active,
67
- &.show {
68
- color: var(--#{$prefix}btn-active-color);
69
- background-color: var(--#{$prefix}btn-active-bg);
70
- // Remove CSS gradients if they're enabled
71
- background-image: if($enable-gradients, none, null);
72
- border-color: var(--#{$prefix}btn-active-border-color);
73
- @include box-shadow(var(--#{$prefix}btn-active-shadow));
74
-
75
- &:focus {
76
- // Avoid using mixin so we can pass custom focus shadow properly
77
- @if $enable-shadows {
78
- box-shadow: var(--#{$prefix}btn-active-shadow), var(--#{$prefix}btn-focus-box-shadow);
79
- } @else {
80
- box-shadow: var(--#{$prefix}btn-focus-box-shadow);
81
- }
82
- }
83
- }
84
-
85
- &:disabled,
86
- &.disabled,
87
- fieldset:disabled & {
88
- color: var(--#{$prefix}btn-disabled-color);
89
- pointer-events: none;
90
- background-color: var(--#{$prefix}btn-disabled-bg);
91
- background-image: if($enable-gradients, none, null);
92
- border-color: var(--#{$prefix}btn-disabled-border-color);
93
- opacity: var(--#{$prefix}btn-disabled-opacity);
94
- @include box-shadow(none);
95
- }
96
- }
97
-
98
-
99
- //
100
- // Alternate buttons
101
- //
102
-
103
- // scss-docs-start btn-variant-loops
104
- @each $color, $value in $theme-colors {
105
- .btn-#{$color} {
106
- @if $color == "light" {
107
- @include button-variant(
108
- $value,
109
- $value,
110
- $hover-background: shade-color($value, $btn-hover-bg-shade-amount),
111
- $hover-border: shade-color($value, $btn-hover-border-shade-amount),
112
- $active-background: shade-color($value, $btn-active-bg-shade-amount),
113
- $active-border: shade-color($value, $btn-active-border-shade-amount)
114
- );
115
- } @else if $color == "dark" {
116
- @include button-variant(
117
- $value,
118
- $value,
119
- $hover-background: tint-color($value, $btn-hover-bg-tint-amount),
120
- $hover-border: tint-color($value, $btn-hover-border-tint-amount),
121
- $active-background: tint-color($value, $btn-active-bg-tint-amount),
122
- $active-border: tint-color($value, $btn-active-border-tint-amount)
123
- );
124
- } @else {
125
- @include button-variant($value, $value);
126
- }
127
- }
128
- }
129
-
130
- @each $color, $value in $theme-colors {
131
- .btn-outline-#{$color} {
132
- @include button-outline-variant($value);
133
- }
134
- }
135
- // scss-docs-end btn-variant-loops
136
-
137
-
138
- //
139
- // Link buttons
140
- //
141
-
142
- // Make a button look and behave like a link
143
- .btn-link {
144
- --#{$prefix}btn-font-weight: #{$font-weight-normal};
145
- --#{$prefix}btn-color: #{$btn-link-color};
146
- --#{$prefix}btn-bg: transparent;
147
- --#{$prefix}btn-border-color: transparent;
148
- --#{$prefix}btn-hover-color: #{$btn-link-hover-color};
149
- --#{$prefix}btn-hover-border-color: transparent;
150
- --#{$prefix}btn-active-color: #{$btn-link-hover-color};
151
- --#{$prefix}btn-active-border-color: transparent;
152
- --#{$prefix}btn-disabled-color: #{$btn-link-disabled-color};
153
- --#{$prefix}btn-disabled-border-color: transparent;
154
- --#{$prefix}btn-box-shadow: none;
155
- --#{$prefix}btn-focus-shadow-rgb: #{to-rgb(mix(color-contrast($primary), $primary, 15%))};
156
-
157
- text-decoration: $link-decoration;
158
-
159
- &:hover,
160
- &:focus {
161
- text-decoration: $link-hover-decoration;
162
- }
163
-
164
- &:focus {
165
- color: var(--#{$prefix}btn-color);
166
- }
167
-
168
- &:hover {
169
- color: var(--#{$prefix}btn-hover-color);
170
- }
171
-
172
- // No need for an active state here
173
- }
174
-
175
-
176
- //
177
- // Button Sizes
178
- //
179
-
180
- .btn-lg {
181
- @include button-size($btn-padding-y-lg, $btn-padding-x-lg, $btn-font-size-lg, $btn-border-radius-lg);
182
- }
183
-
184
- .btn-sm {
185
- @include button-size($btn-padding-y-sm, $btn-padding-x-sm, $btn-font-size-sm, $btn-border-radius-sm);
186
- }
@@ -1,234 +0,0 @@
1
- //
2
- // Base styles
3
- //
4
-
5
- .card {
6
- // scss-docs-start card-css-vars
7
- --#{$prefix}card-spacer-y: #{$card-spacer-y};
8
- --#{$prefix}card-spacer-x: #{$card-spacer-x};
9
- --#{$prefix}card-title-spacer-y: #{$card-title-spacer-y};
10
- --#{$prefix}card-border-width: #{$card-border-width};
11
- --#{$prefix}card-border-color: #{$card-border-color};
12
- --#{$prefix}card-border-radius: #{$card-border-radius};
13
- --#{$prefix}card-box-shadow: #{$card-box-shadow};
14
- --#{$prefix}card-inner-border-radius: #{$card-inner-border-radius};
15
- --#{$prefix}card-cap-padding-y: #{$card-cap-padding-y};
16
- --#{$prefix}card-cap-padding-x: #{$card-cap-padding-x};
17
- --#{$prefix}card-cap-bg: #{$card-cap-bg};
18
- --#{$prefix}card-cap-color: #{$card-cap-color};
19
- --#{$prefix}card-height: #{$card-height};
20
- --#{$prefix}card-color: #{$card-color};
21
- --#{$prefix}card-bg: #{$card-bg};
22
- --#{$prefix}card-img-overlay-padding: #{$card-img-overlay-padding};
23
- --#{$prefix}card-group-margin: #{$card-group-margin};
24
- // scss-docs-end card-css-vars
25
-
26
- position: relative;
27
- display: flex;
28
- flex-direction: column;
29
- min-width: 0; // See https://github.com/twbs/bootstrap/pull/22740#issuecomment-305868106
30
- height: var(--#{$prefix}card-height);
31
- word-wrap: break-word;
32
- background-color: var(--#{$prefix}card-bg);
33
- background-clip: border-box;
34
- border: var(--#{$prefix}card-border-width) solid var(--#{$prefix}card-border-color);
35
- @include border-radius(var(--#{$prefix}card-border-radius));
36
- @include box-shadow(var(--#{$prefix}card-box-shadow));
37
-
38
- > hr {
39
- margin-right: 0;
40
- margin-left: 0;
41
- }
42
-
43
- > .list-group {
44
- border-top: inherit;
45
- border-bottom: inherit;
46
-
47
- &:first-child {
48
- border-top-width: 0;
49
- @include border-top-radius(var(--#{$prefix}card-inner-border-radius));
50
- }
51
-
52
- &:last-child {
53
- border-bottom-width: 0;
54
- @include border-bottom-radius(var(--#{$prefix}card-inner-border-radius));
55
- }
56
- }
57
-
58
- // Due to specificity of the above selector (`.card > .list-group`), we must
59
- // use a child selector here to prevent double borders.
60
- > .card-header + .list-group,
61
- > .list-group + .card-footer {
62
- border-top: 0;
63
- }
64
- }
65
-
66
- .card-body {
67
- // Enable `flex-grow: 1` for decks and groups so that card blocks take up
68
- // as much space as possible, ensuring footers are aligned to the bottom.
69
- flex: 1 1 auto;
70
- padding: var(--#{$prefix}card-spacer-y) var(--#{$prefix}card-spacer-x);
71
- color: var(--#{$prefix}card-color);
72
- }
73
-
74
- .card-title {
75
- margin-bottom: var(--#{$prefix}card-title-spacer-y);
76
- }
77
-
78
- .card-subtitle {
79
- margin-top: calc(-.5 * var(--#{$prefix}card-title-spacer-y)); // stylelint-disable-line function-disallowed-list
80
- margin-bottom: 0;
81
- }
82
-
83
- .card-text:last-child {
84
- margin-bottom: 0;
85
- }
86
-
87
- .card-link {
88
- &:hover {
89
- text-decoration: if($link-hover-decoration == underline, none, null);
90
- }
91
-
92
- + .card-link {
93
- margin-left: var(--#{$prefix}card-spacer-x);
94
- }
95
- }
96
-
97
- //
98
- // Optional textual caps
99
- //
100
-
101
- .card-header {
102
- padding: var(--#{$prefix}card-cap-padding-y) var(--#{$prefix}card-cap-padding-x);
103
- margin-bottom: 0; // Removes the default margin-bottom of <hN>
104
- color: var(--#{$prefix}card-cap-color);
105
- background-color: var(--#{$prefix}card-cap-bg);
106
- border-bottom: var(--#{$prefix}card-border-width) solid var(--#{$prefix}card-border-color);
107
-
108
- &:first-child {
109
- @include border-radius(var(--#{$prefix}card-inner-border-radius) var(--#{$prefix}card-inner-border-radius) 0 0);
110
- }
111
- }
112
-
113
- .card-footer {
114
- padding: var(--#{$prefix}card-cap-padding-y) var(--#{$prefix}card-cap-padding-x);
115
- color: var(--#{$prefix}card-cap-color);
116
- background-color: var(--#{$prefix}card-cap-bg);
117
- border-top: var(--#{$prefix}card-border-width) solid var(--#{$prefix}card-border-color);
118
-
119
- &:last-child {
120
- @include border-radius(0 0 var(--#{$prefix}card-inner-border-radius) var(--#{$prefix}card-inner-border-radius));
121
- }
122
- }
123
-
124
-
125
- //
126
- // Header navs
127
- //
128
-
129
- .card-header-tabs {
130
- margin-right: calc(-.5 * var(--#{$prefix}card-cap-padding-x)); // stylelint-disable-line function-disallowed-list
131
- margin-bottom: calc(-1 * var(--#{$prefix}card-cap-padding-y)); // stylelint-disable-line function-disallowed-list
132
- margin-left: calc(-.5 * var(--#{$prefix}card-cap-padding-x)); // stylelint-disable-line function-disallowed-list
133
- border-bottom: 0;
134
-
135
- .nav-link.active {
136
- background-color: var(--#{$prefix}card-bg);
137
- border-bottom-color: var(--#{$prefix}card-bg);
138
- }
139
- }
140
-
141
- .card-header-pills {
142
- margin-right: calc(-.5 * var(--#{$prefix}card-cap-padding-x)); // stylelint-disable-line function-disallowed-list
143
- margin-left: calc(-.5 * var(--#{$prefix}card-cap-padding-x)); // stylelint-disable-line function-disallowed-list
144
- }
145
-
146
- // Card image
147
- .card-img-overlay {
148
- position: absolute;
149
- top: 0;
150
- right: 0;
151
- bottom: 0;
152
- left: 0;
153
- padding: var(--#{$prefix}card-img-overlay-padding);
154
- @include border-radius(var(--#{$prefix}card-inner-border-radius));
155
- }
156
-
157
- .card-img,
158
- .card-img-top,
159
- .card-img-bottom {
160
- width: 100%; // Required because we use flexbox and this inherently applies align-self: stretch
161
- }
162
-
163
- .card-img,
164
- .card-img-top {
165
- @include border-top-radius(var(--#{$prefix}card-inner-border-radius));
166
- }
167
-
168
- .card-img,
169
- .card-img-bottom {
170
- @include border-bottom-radius(var(--#{$prefix}card-inner-border-radius));
171
- }
172
-
173
-
174
- //
175
- // Card groups
176
- //
177
-
178
- .card-group {
179
- // The child selector allows nested `.card` within `.card-group`
180
- // to display properly.
181
- > .card {
182
- margin-bottom: var(--#{$prefix}card-group-margin);
183
- }
184
-
185
- @include media-breakpoint-up(sm) {
186
- display: flex;
187
- flex-flow: row wrap;
188
- // The child selector allows nested `.card` within `.card-group`
189
- // to display properly.
190
- > .card {
191
- // Flexbugs #4: https://github.com/philipwalton/flexbugs#flexbug-4
192
- flex: 1 0 0%;
193
- margin-bottom: 0;
194
-
195
- + .card {
196
- margin-left: 0;
197
- border-left: 0;
198
- }
199
-
200
- // Handle rounded corners
201
- @if $enable-rounded {
202
- &:not(:last-child) {
203
- @include border-end-radius(0);
204
-
205
- .card-img-top,
206
- .card-header {
207
- // stylelint-disable-next-line property-disallowed-list
208
- border-top-right-radius: 0;
209
- }
210
- .card-img-bottom,
211
- .card-footer {
212
- // stylelint-disable-next-line property-disallowed-list
213
- border-bottom-right-radius: 0;
214
- }
215
- }
216
-
217
- &:not(:first-child) {
218
- @include border-start-radius(0);
219
-
220
- .card-img-top,
221
- .card-header {
222
- // stylelint-disable-next-line property-disallowed-list
223
- border-top-left-radius: 0;
224
- }
225
- .card-img-bottom,
226
- .card-footer {
227
- // stylelint-disable-next-line property-disallowed-list
228
- border-bottom-left-radius: 0;
229
- }
230
- }
231
- }
232
- }
233
- }
234
- }