@tailwind base; @tailwind components; @tailwind utilities; @layer components { .overlay { @apply fixed inset-0 bg-stone-800 opacity-75 z-50; } .pill { @apply bg-gray-200/50 rounded-full border border-gray-200 text-xs p-1 px-2 inline-block; } .nav { @apply p-[17px] bg-gray-100 flex justify-between border-b border-gray-200; } .card { @apply bg-white shadow rounded-md p-4; } .nav-indicator { @apply text-teal-800 inline-block font-bold bg-teal-100 py-1 px-3 rounded-full; } .tools-select { @apply rounded-md border-gray-400; } .tools-input { @apply rounded-md border-gray-400; } .tools-textarea { @apply rounded-md border-gray-400; } } /* Styles copied in from Forem Core for liquid styles — occasionally needs to be refreshed */ /* TODO: Better way to do this. */ :root { /* Base */ --base: #090909; --base-inverted: rgb(var(--white)); --base-100: var(--base); --base-90: #242424; --base-80: #3d3d3d; --base-70: #575757; --base-60: #717171; --base-50: #8a8a8a; --base-40: #a3a3a3; --base-30: #bdbdbd; --base-20: #d6d6d7; --base-10: #efefef; --base-0: #f9f9f9; /* Brand */ --accent-brand-lighter: rgb(var(--accent-brand-lighter-rgb)); --accent-brand: rgb(var(--accent-brand-rgb)); --accent-brand-darker: rgb(var(--accent-brand-darker-rgb)); /* Success */ --accent-success: rgb(var(--green-600)); --accent-success-darker: rgb(var(--green-700)); --accent-success-lighter: rgb(var(--green-500)); --accent-success-a10: rgba(var(--green-600), 0.1); /* Warning */ --accent-warning: rgb(var(--yellow-500)); --accent-warning-darker: rgb(var(--yellow-600)); --accent-warning-lighter: rgb(var(--yellow-400)); --accent-warning-a10: rgba(var(--yellow-500), 0.1); /* Danger */ --accent-danger: rgb(var(--red-600)); --accent-danger-darker: rgb(var(--red-700)); --accent-danger-lighter: rgb(var(--red-500)); --accent-danger-a10: rgba(var(--red-600), 0.1); /*********************************************** ** Functional color variables. ***************** ***********************************************/ /* Main colors */ --body-bg: rgb(var(--grey-100)); --body-color: rgb(var(--grey-900)); --body-color-inverted: rgb(var(--white)); /* Main content containers */ --card-bg: rgb(var(--white)); --card-color: rgb(var(--grey-900)); --card-color-secondary: rgb(var(--grey-700)); --card-color-tertiary: rgb(var(--grey-600)); --card-secondary-bg: rgb(var(--grey-50)); --card-tertiary-bg: rgb(var(--grey-100)); --card-tertiary-bg-hover: rgba(var(--grey-200), 0.55); --card-secondary-color: rgb(var(--grey-700)); --card-border: rgba(var(--grey-900), 0.1); --card-secondary-border: rgba(var(--grey-900), 0.05); /* Header */ --header-bg: rgb(var(--white)); --header-shadow: rgba(var(--black), 0.1); /* Footer */ --footer-bg: rgb(var(--grey-200)); --footer-color: rgb(var(--grey-700)); /* Links */ --link-bg-hover-alt: var(--base-inverted); --link-color-current: var(--base-100); --link-color-secondary: var(--base-60); --link-color-secondary-hover: var(--base-70); --link-bg-current: var(--base-inverted); /* Primary buttons */ --button-primary-bg: var(--accent-brand); --button-primary-bg-hover: var(--accent-brand-darker); --button-primary-color: var(--base-0); --button-primary-color-hover: var(--base-0); /* -- Inverted */ --button-primary-inverted-bg: var(--accent-brand); --button-primary-inverted-bg-hover: var(--accent-brand-darker); --button-primary-inverted-color: var(--base-0); --button-primary-inverted-color-hover: var(--base-0); /* Secondary buttons */ --button-secondary-bg: var(--base-20); --button-secondary-bg-hover: var(--base-30); --button-secondary-color: var(--base-80); --button-secondary-color-hover: var(--base-100); /* Outlined buttons */ --button-outlined-bg: transparent; --button-outlined-bg-hover: rgba(0, 0, 0, 0.035); --button-outlined-border: var(--base-20); --button-outlined-border-hover: var(--base-40); --button-outlined-color: var(--base-80); --button-outlined-color-hover: var(--base-100); /* Ghost buttons */ --button-ghost-bg: transparent; --button-ghost-bg-hover: rgba(0, 0, 0, 0.035); --button-ghost-color: var(--base-80); --button-ghost-color-hover: var(--base-100); --button-ghost-dimmed-color: var(--base-60); --button-ghost-dimmed-color-hover: var(--base-100); /* -- Inverted */ --button-ghost-inverted-bg: transparent; --button-ghost-inverted-bg-hover: rgba(255, 255, 255, 0.15); --button-ghost-inverted-color: var(--base-30); --button-ghost-inverted-color-hover: var(--base-10); --button-ghost-dimmed-inverted-color: var(--base-50); --button-ghost-dimmed-inverted-color-hover: var(--base-100); /* Forms */ --form-bg: rgb(var(--white)); --form-bg-focus: rgb(var(--white)); --form-border: rgb(var(--grey-300)); --form-border-hover: rgb(var(--grey-400)); --form-border-focus: var(--focus); --form-placeholder-color: rgb(var(--grey-600)); /* Form labels */ --label-primary: rgb(var(--grey-900)); --label-secondary: rgb(var(--grey-600)); /* Snackbars */ --snackbar-bg: rgb(var(--grey-900)); --snackbar-color: rgb(var(--white)); /* Tabs */ --tab-color: rgb(var(--grey-700)); --tab-color-hover: var(--accent-brand); --tab-color-current: rgb(var(--grey-900)); --tab-bg-hover: rgba(var(--accent-brand-rgb), 0.1); --tab-bg-current: rgb(var(--accent-brand)); /* Tags */ --tag-color: rgb(var(--grey-700)); --tag-color-hover: rgb(var(--grey-900)); --tag-bg: rgba(var(--grey-900), 0.05); --tag-bg-hover: rgba(var(--grey-900), 0.05); --tag-prefix: rgba(var(--grey-900), 0.6); --tag-prefix-hover: rgb(var(--grey-900)); /* Story */ --story-comments-bg: rgb(var(--grey-50)); --story-comments-bg-top: rgba(var(--grey-50), 0); --story-comments-bg-bottom: rgba(var(--grey-50), 1); /* Select icon */ --select-icon: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTEyIDE2TDYgMTBIMThMMTIgMTZaIiBmaWxsPSIjMDgwOTBBIi8+Cjwvc3ZnPg==); /* Icons */ --close-icon: rgb(var(--grey-400)); /* Reactions */ --reaction-like-color: rgb(var(--red-600)); --reaction-like-bg: rgba(var(--red-600), 0.1); --reaction-custom-color: rgb(var(--green-600)); --reaction-custom-bg: rgb(var(--green-600), 0.1); --reaction-save-color: rgb(var(--indigo-600)); --reaction-save-bg: rgba(var(--indigo-600), 0.1); --reaction-comment-color: rgb(var(--yellow-500)); --reaction-comment-bg: rgba(var(--yellow-500), 0.1); /* Code */ --code-inline-bg: rgb(var(--black), 0.1); /* Onboarding suggested people */ --content-row-hover-bg: rgb(var(--grey-100)); } :root { /* Separating some variables here as these are the results of broader Crayons refactoring (see #15311) and I did not want to mix everything together. */ /*********************************************** ** Buttons ************************************* ***********************************************/ /* Buttons: Default */ --btn-bg: transparent; --btn-bg-hover: rgba(var(--accent-brand-rgb), 0.1); --btn-color: rgb(var(--grey-800)); --btn-color-hover: var(--accent-brand-darker); --btn-current-bg: rgb(var(--grey-200)); --btn-current-color: rgb(var(--grey-900)); /* Buttons: Primary */ --btn-primary-bg: var(--accent-brand); --btn-primary-bg-hover: var(--accent-brand-darker); --btn-primary-color: rgb(var(--white)); --btn-primary-color-hover: rgb(var(--white)); /* Buttons: Secondary */ --btn-secondary-bg: rgba(var(--accent-brand-rgb), 0.1); --btn-secondary-bg-hover: var(--accent-brand); --btn-secondary-color: var(--accent-brand); --btn-secondary-color-hover: rgb(var(--white)); /* Buttons: Destructive Default */ --btn-destructive-bg: transparent; --btn-destructive-bg-hover: rgba(var(--red-600), 0.1); --btn-destructive-color: rgb(var(--red-700)); --btn-destructive-color-hover: rgb(var(--red-800)); /* Buttons: Destructive Primary */ --btn-primary-destructive-bg: rgb(var(--red-600)); --btn-primary-destructive-bg-hover: rgb(var(--red-700)); --btn-primary-destructive-color: rgb(var(--white)); --btn-primary-destructive-color-hover: rgb(var(--white)); /*********************************************** ** Links *************************************** ***********************************************/ /* Links: Default */ --link-bg: transparent; --link-bg-hover: rgba(var(--accent-brand-rgb), 0.1); --link-color: rgb(var(--grey-700)); --link-color-hover: var(--accent-brand-darker); --link-current-bg: rgb(var(--grey-200)); --link-current-color: rgb(var(--grey-900)); /* Links: Branded */ --link-branded-bg: transparent; --link-branded-bg-hover: rgba(var(--accent-brand-rgb), 0.1); --link-branded-color: var(--accent-brand); --link-branded-color-hover: var(--accent-brand-darker); /*********************************************** ** CTAs **************************************** ***********************************************/ /* CTAs: Default */ --cta-bg: transparent; --cta-bg-hover: rgba(var(--accent-brand-rgb), 0.1); --cta-color: rgb(var(--grey-800)); --cta-color-hover: var(--accent-brand-darker); --cta-border: rgb(var(--grey-600)); --cta-border-hover: var(--accent-brand-darker); /* CTAs: Branded */ --cta-branded-bg: transparent; --cta-branded-bg-hover: var(--accent-brand); --cta-branded-color: var(--accent-brand); --cta-branded-color-hover: rgb(var(--white)); --cta-branded-border: var(--accent-brand); --cta-branded-border-hover: var(--accent-brand-darker); /*********************************************** ** Tooltips ************************************ ***********************************************/ --tooltip-bg: rgba(var(--grey-900), 0.9); --tooltip-color: rgb(var(--white)); /*********************************************** ** Indicators ********************************** ***********************************************/ /* Indicators: Default */ --indicator-bg: rgb(var(--grey-300)); --indicator-color: rgb(var(--grey-700)); /* Indicators: Subtle */ --indicator-subtle-bg: rgb(var(--grey-200)); --indicator-subtle-color: rgb(var(--grey-600)); /* Indicators: Success */ --indicator-success-bg: rgb(var(--green-400)); --indicator-success-color: rgb(var(--green-900)); /* Indicators: Warning */ --indicator-warning-bg: rgb(var(--yellow-300)); --indicator-warning-color: rgb(var(--yellow-900)); /* Indicators: Danger */ --indicator-danger-bg: rgb(var(--red-600)); --indicator-danger-color: rgb(var(--white)); /* Indicators: Info */ --indicator-info-bg: var(--accent-brand); --indicator-info-color: rgb(var(--white)); /*********************************************** ** List items ********************************** ***********************************************/ --list-item-bg-hover: rgb(var(--grey-50)); /*********************************************** ** Modals ************************************** ***********************************************/ --modal-bg: rgb(var(--white)); --modal-backdrop: rgba(var(--black), 0.6); --modal-danger-border-color: rgb(var(--red-500)); /*********************************************** ** Colors ************************************** ***********************************************/ --color-primary: rgb(var(--grey-900)); --color-secondary: rgb(var(--grey-500)); /*********************************************** ** Pills *************************************** ***********************************************/ --pill-bg: transparent; --pill-bg-hover: rgb(var(--grey-50)); --pill-color: rgb(var(--grey-800)); --pill-color-hover: rgb(var(--grey-900)); --pill-border: rgb(var(--grey-200)); --pill-border-hover: rgb(var(--grey-600)); /*********************************************** ** ColorPicker ********************************* ***********************************************/ --swatch-border-color: rgb(var(--black), 0.2); /*********************************************** ** Toggles ************************************* ***********************************************/ --toggle-rail-bg: rgb(var(--grey-200)); --toggle-rail-checked-bg: rgb(var(--green-500)); --toggle-knob-bg: rgb(var(--white)); /*********************************************** ** Date Pickers ******************************** ***********************************************/ --date-border-color: var( --base-10); --hover-date-border-color: var(--accent-brand); --selected-date-bg: var(--accent-brand); --selected-range-bg: rgb(var(--indigo-50)); --selected-date-border: rgb(var(--indigo-100)); --selected-date-color: var(--base-0); --selected-range-color: var(--body-color); --current-date-color: var(--accent-brand); /*********************************************** ** Banners ************************************* ***********************************************/ --banner-bg: rgb(var(--grey-800)); --banner-color: var(--white); --banner-accent: var(--accent-brand); /*********************************************** ** Utilities *********************************** ***********************************************/ /* Focus */ --focus: var(--accent-brand); /* Divider */ --divider: rgb(var(--grey-200)); /* Shadows */ --shadow-1: 0 10px 15px -3px rgba(var(--black), 0.1), 0 4px 6px -2px rgba(var(--black), 0.05), 0 0 0 1px rgba(var(--black), 0.1); --shadow-2: 0 20px 25px -5px rgba(var(--black), 0.1), 0 10px 10px -5px rgba(var(--black), 0.05), 0 0 0 1px rgba(var(--black), 0.1); --shadow-smooth: 0px 8px 16px rgba(0, 0, 0, 0.06); } .ltag_cta { border: 1px solid #3a48de; padding: 8px 20px; display: inline-block; border-radius: 8px; font-weight:600; text-decoration: none !important; text-align: center; margin: 15px 0 !important; font-size: 1.1em; min-width: 200px; } /* line 3, app/assets/stylesheets/ltags/CommentTag.scss */ .liquid-comment { padding: 0px; background: inherit; font-family: var(--ff-sans-serif); margin: 0.95em 0 1.2em; position: relative; border: 1px solid var(--form-border); box-shadow: var(--shadow-smooth); border-radius: var(--radius-auto); width: auto; } @media screen and (min-width: 760px) { /* line 3, app/assets/stylesheets/ltags/CommentTag.scss */ .liquid-comment { margin: 0.95em auto; } } /* line 17, app/assets/stylesheets/ltags/CommentTag.scss */ .liquid-comment .details { padding: 0px; margin: 13px; height: 33px; border-top-left-radius: 3px; border-top-left-radius: 3px; display: flex; font-size: var(--fs-base); font-weight: 500; } /* line 26, app/assets/stylesheets/ltags/CommentTag.scss */ .liquid-comment .details img { left: inherit; } /* line 30, app/assets/stylesheets/ltags/CommentTag.scss */ .liquid-comment .details img.profile-pic { min-height: inherit; height: 33px; width: 33px; border-radius: 100px; margin: 0; } /* line 38, app/assets/stylesheets/ltags/CommentTag.scss */ .liquid-comment .details .icon-img { min-height: inherit; height: 16px; width: 16px; margin-right: 0px; opacity: 0.7; } /* line 45, app/assets/stylesheets/ltags/CommentTag.scss */ .liquid-comment .details .color-base-30 { display: none; } /* line 48, app/assets/stylesheets/ltags/CommentTag.scss */ .liquid-comment .details .comment-date { border: none; position: absolute; top: calc(28px - 0.25vw); right: calc(5px + 0.1vw) !important; font-size: 12px; text-align: right; display: block; width: 100px; } /* line 57, app/assets/stylesheets/ltags/CommentTag.scss */ .liquid-comment .details .comment-date :not(:first-child) { display: none; } /* line 60, app/assets/stylesheets/ltags/CommentTag.scss */ .liquid-comment .details .comment-date a { color: var(--card-color-tertiary); } /* line 65, app/assets/stylesheets/ltags/CommentTag.scss */ .liquid-comment .details a { color: var(--card-color-tertiary); line-height: initial; align-self: center; margin-right: 6px; text-decoration: none; } /* line 73, app/assets/stylesheets/ltags/CommentTag.scss */ .liquid-comment .details a:last-child { align-self: baseline; position: absolute; right: 5px; } /* line 80, app/assets/stylesheets/ltags/CommentTag.scss */ .liquid-comment .body { font-family: var(--ff-sans-serif); color: #0a0a0a; color: var(--body-color); font-size: 0.95em; line-height: 1.35em; overflow: hidden; margin: 13px; word-wrap: break-word; width: auto; padding: 0; margin-bottom: 10px !important; } /* line 93, app/assets/stylesheets/ltags/CommentTag.scss */ .liquid-comment .body pre { width: auto; margin-left: 0; padding: 10px; } /* line 99, app/assets/stylesheets/ltags/CommentTag.scss */ .liquid-comment .body h1, .liquid-comment .body h2, .liquid-comment .body h3, .liquid-comment .body h4, .liquid-comment .body h5, .liquid-comment .body h6 { padding: 0px; margin: 4px 0px calc(1.1vw + 10px); font-size: 1em; font-weight: 600; } /* line 111, app/assets/stylesheets/ltags/CommentTag.scss */ .liquid-comment .body h1 { font-size: 1.3em; } /* line 115, app/assets/stylesheets/ltags/CommentTag.scss */ .liquid-comment .body p { padding: 0px; font-size: 0.95em; margin: 0 0 15px 0; } /* line 121, app/assets/stylesheets/ltags/CommentTag.scss */ .liquid-comment .body br { line-height: 220%; } /* line 125, app/assets/stylesheets/ltags/CommentTag.scss */ .liquid-comment .body ul, .liquid-comment .body ol { padding-left: 6px; margin: 0.8em 0.7em 0.8em 1em; } /* line 131, app/assets/stylesheets/ltags/CommentTag.scss */ .liquid-comment .body ul { list-style-type: square; } /* line 135, app/assets/stylesheets/ltags/CommentTag.scss */ .liquid-comment .body li { margin: 3px 0px calc(0.5vw + 5px); } /* line 139, app/assets/stylesheets/ltags/CommentTag.scss */ .liquid-comment .body blockquote { border-left: calc(0.2vw + 2px) solid #333333; padding: 0.1% 3% 0.1% 2%; margin: 1.6em 1vw; font-size: 0.92em; line-height: 1.4em; } /* line 146, app/assets/stylesheets/ltags/CommentTag.scss */ .liquid-comment .body blockquote p { padding: 0; margin: 0.95em 0 0.95em; } /* line 151, app/assets/stylesheets/ltags/CommentTag.scss */ .liquid-comment .body blockquote.twitter-tweet { font-family: var(--ff-sans-serif); background: white; max-width: 480px; min-height: 135px; border: 1px solid #e9eef2; font-size: 17px; line-height: 20px; border-radius: 5px; margin-top: 10px; padding: 10px; } /* line 165, app/assets/stylesheets/ltags/CommentTag.scss */ .liquid-comment .body .edited-notification { color: #999999; font-size: 0.7em; padding: 3px 0px 0px; position: relative; z-index: 1; } /* line 173, app/assets/stylesheets/ltags/CommentTag.scss */ .liquid-comment .body code { margin: auto; white-space: nowrap; background: #f9fafa; background: var(--body-bg); padding: 1px 5px 0px; border-radius: 2px; color: #333842; font-size: 0.8em; display: inline-block; vertical-align: 0.1em; max-width: 100%; line-height: 1.4em; } /* line 188, app/assets/stylesheets/ltags/CommentTag.scss */ .liquid-comment .body img { max-width: 100%; } /* line 192, app/assets/stylesheets/ltags/CommentTag.scss */ .liquid-comment .body button { border: 0px; background: transparent; vertical-align: 2px; cursor: pointer; border-radius: 3px; display: block; padding: 0px; position: relative; z-index: 6; } /* line 202, app/assets/stylesheets/ltags/CommentTag.scss */ .liquid-comment .body button img { left: inherit; min-height: 0px; height: 16px; opacity: 0.62; } /* line 209, app/assets/stylesheets/ltags/CommentTag.scss */ .liquid-comment .body button:hover img { opacity: 1; } /* line 213, app/assets/stylesheets/ltags/CommentTag.scss */ .liquid-comment .body button .voted-heart { display: none; font-size: 22px; line-height: 21px; vertical-align: -2px; } @media screen and (min-width: 390px) { /* line 192, app/assets/stylesheets/ltags/CommentTag.scss */ .liquid-comment .body button { vertical-align: -7px; } } /* line 222, app/assets/stylesheets/ltags/CommentTag.scss */ .liquid-comment .body button.reacted { color: #66e2d5; } /* line 224, app/assets/stylesheets/ltags/CommentTag.scss */ .liquid-comment .body button.reacted img { display: none; } /* line 227, app/assets/stylesheets/ltags/CommentTag.scss */ .liquid-comment .body button.reacted .voted-heart { display: inline-block; } /* line 2, app/assets/stylesheets/ltags/GistTag.scss */ .ltag_gist-liquid-tag table { margin: 0 !important; } /* line 6, app/assets/stylesheets/ltags/GistTag.scss */ .ltag_gist-liquid-tag td { border: 0 !important; width: 500 !important; } /* line 11, app/assets/stylesheets/ltags/GistTag.scss */ .ltag_gist-liquid-tag .gist .markdown-body pre { margin-left: 0; width: 100%; box-sizing: border-box; color: #29292e; } /* line 18, app/assets/stylesheets/ltags/GistTag.scss */ .ltag_gist-liquid-tag .gist .markdown-body pre code { color: #29292e; } /* line 22, app/assets/stylesheets/ltags/GistTag.scss */ .ltag_gist-liquid-tag .gist .blob-wrapper table { text-size-adjust: none; tab-size: 2; } /* line 2, app/assets/stylesheets/ltags/GithubReadmeTag.scss */ .ltag-github-readme-tag { position: relative; border: 1px solid var(--form-border); box-shadow: var(--shadow-smooth); border-radius: var(--radius-auto); margin: 1.1em auto 1.3em; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol' !important; overflow: hidden; } /* line 11, app/assets/stylesheets/ltags/GithubReadmeTag.scss */ .ltag-github-readme-tag a { color: var(--link-branded-color) !important; } /* line 14, app/assets/stylesheets/ltags/GithubReadmeTag.scss */ .ltag-github-readme-tag .readme-overview { padding: 0.8em calc(0.5em + 0.25vw); border-bottom: 1px solid #dbdbdb; } /* line 17, app/assets/stylesheets/ltags/GithubReadmeTag.scss */ .ltag-github-readme-tag .readme-overview h2 { font-weight: 400 !important; font-size: 1.2em !important; line-height: 1.3em !important; margin: 0em 0px 0.5em !important; } /* line 22, app/assets/stylesheets/ltags/GithubReadmeTag.scss */ .ltag-github-readme-tag .readme-overview h2 img { width: 1.15em !important; max-width: 1.1em !important; display: inline-block; left: 0px; margin: 0; vertical-align: -0.18em; filter: invert(0); filter: var(--theme-social-icon-invert, invert(0)); } /* line 33, app/assets/stylesheets/ltags/GithubReadmeTag.scss */ .ltag-github-readme-tag .readme-overview h3 { font-weight: 400 !important; margin: 0; margin-left: 0.15em; font-size: 0.75em !important; line-height: 1.05em !important; } /* line 42, app/assets/stylesheets/ltags/GithubReadmeTag.scss */ .ltag-github-readme-tag .ltag-github-body { font-size: 0.72em; line-height: 1.12em; text-align: left; min-height: 100px; } /* line 49, app/assets/stylesheets/ltags/GithubReadmeTag.scss */ .ltag-github-readme-tag .gh-btn-container { padding: 0.1em 0 1.15em; } /* line 53, app/assets/stylesheets/ltags/GithubReadmeTag.scss */ .ltag-github-readme-tag .gh-btn { padding: 0.28em 1.2em; font-size: 0.75em; } /* line 58, app/assets/stylesheets/ltags/GithubReadmeTag.scss */ .ltag-github-readme-tag .markdown-body { padding: 0em calc(0.5em + 0.2vw); } /* line 60, app/assets/stylesheets/ltags/GithubReadmeTag.scss */ .ltag-github-readme-tag .markdown-body table { max-width: 80%; margin-left: 10%; } /* line 65, app/assets/stylesheets/ltags/GithubReadmeTag.scss */ .ltag-github-readme-tag .markdown-body img { display: inline-block; left: 0px; } /* line 69, app/assets/stylesheets/ltags/GithubReadmeTag.scss */ .ltag-github-readme-tag .markdown-body .highlight { background: white; } /* line 72, app/assets/stylesheets/ltags/GithubReadmeTag.scss */ .ltag-github-readme-tag .markdown-body pre { max-width: 100%; margin-left: 10%; } /* line 77, app/assets/stylesheets/ltags/GithubReadmeTag.scss */ .ltag-github-readme-tag .markdown-body .anchor { display: none; } /* line 3, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn, .ltag__wikipedia--container .ltag__wikipedia--btn, .ltag__stackexchange--container .ltag__stackexchange--btn, .ltag__reddit--container .ltag__reddit--btn, .gh-btn-container .gh-btn { --brand-apple-bg: #000; --brand-apple-color: #fff; --brand-apple-bg-hover: #1b1b1b; --brand-twitter-bg: #1da1f2; --brand-twitter-color: #fff; --brand-twitter-bg-hover: #0096f2; --brand-github-bg: #24292e; --brand-github-color: #fff; --brand-github-bg-hover: #000; --brand-facebook-bg: #4267b2; --brand-facebook-color: #fff; --brand-facebook-bg-hover: #476fbf; --brand-forem-bg: #0a3e4a; --brand-forem-color: #fff; --brand-forem-bg-hover: #05313b; --brand-email-bg: #24292e; --brand-email-color: #fff; --brand-email-bg-hover: #000; --brand-google_oauth2-bg: #1da1f2; --brand-google_oauth2-color: #fff; --brand-google_oauth2-bg-hover: #0096f2; } /* line 34, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn, .ltag__wikipedia--container .ltag__wikipedia--btn, .ltag__stackexchange--container .ltag__stackexchange--btn, .ltag__reddit--container .ltag__reddit--btn, .gh-btn-container .gh-btn { --border-width: 0px; --shadow-color: rgba(0, 0, 0, 0.05); --vertical-padding: var(--su-2); --horizontal-padding: var(--su-4); --font-size: var(--fs-base); --with-icon-padding: var(--su-3); --icon-margin: var(--su-2); position: relative; display: inline-block; padding: calc(var(--vertical-padding) - var(--border-width)) calc(var(--horizontal-padding) - var(--border-width)); border-radius: var(--radius); font-family: inherit; font-size: var(--font-size); line-height: var(--su-6); font-weight: var(--fw-medium); text-align: center; text-decoration: none; cursor: pointer; transition: all var(--transition-props); border: var(--border-width) solid; overflow-wrap: normal; --bg: var(--button-primary-bg); --bg-hover: var(--button-primary-bg-hover); --border: transparent; --border-hover: transparent; --color: var(--button-primary-color); --color-hover: var(--button-primary-color-hover); --shadow: 0 1px 3px var(--shadow-color); --shadow-hover: 0 2px 5px var(--shadow-color); --bg-inverted: var(--button-primary-inverted-bg); --bg-inverted-hover: var(--button-primary-inverted-bg-hover); --color-inverted: var(--button-primary-inverted-color); --color-inverted-hover: var(--button-primary-inverted-color-hover); background-color: var(--bg); border-color: var(--border); box-shadow: var(--shadow); color: var(--color); } /* line 79, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn[href]:hover, .ltag__wikipedia--container .ltag__wikipedia--btn[href]:hover, .ltag__stackexchange--container .ltag__stackexchange--btn[href]:hover, .ltag__reddit--container .ltag__reddit--btn[href]:hover, .gh-btn-container .gh-btn[href]:hover, .crayons-btn[href]:focus, .ltag__wikipedia--container .ltag__wikipedia--btn[href]:focus, .ltag__stackexchange--container .ltag__stackexchange--btn[href]:focus, .ltag__reddit--container .ltag__reddit--btn[href]:focus, .gh-btn-container .gh-btn[href]:focus, .crayons-btn:hover:enabled, .ltag__wikipedia--container .ltag__wikipedia--btn:hover:enabled, .ltag__stackexchange--container .ltag__stackexchange--btn:hover:enabled, .ltag__reddit--container .ltag__reddit--btn:hover:enabled, .gh-btn-container .gh-btn:hover:enabled, .crayons-btn:active:enabled, .ltag__wikipedia--container .ltag__wikipedia--btn:active:enabled, .ltag__stackexchange--container .ltag__stackexchange--btn:active:enabled, .ltag__reddit--container .ltag__reddit--btn:active:enabled, .gh-btn-container .gh-btn:active:enabled { background-color: var(--bg-hover); border-color: var(--border-hover); box-shadow: var(--shadow-hover); color: var(--color-hover); z-index: var(--z-elevate); } /* line 90, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn.crayons-btn--inverted, .ltag__wikipedia--container .crayons-btn--inverted.ltag__wikipedia--btn, .ltag__stackexchange--container .crayons-btn--inverted.ltag__stackexchange--btn, .ltag__reddit--container .crayons-btn--inverted.ltag__reddit--btn, .gh-btn-container .crayons-btn--inverted.gh-btn { --bg: var(--bg-inverted); --bg-hover: var(--bg-inverted-hover); --border: var(--border-inverted); --border-hover: var(--border-inverted-hover); --color: var(--color-inverted); --color-hover: var(--color-inverted-hover); } /* line 99, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn[disabled], .ltag__wikipedia--container .ltag__wikipedia--btn[disabled], .ltag__stackexchange--container .ltag__stackexchange--btn[disabled], .ltag__reddit--container .ltag__reddit--btn[disabled], .gh-btn-container .gh-btn[disabled] { opacity: 0.6; cursor: not-allowed; } /* line 104, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--s { --vertical-padding: var(--su-1); --horizontal-padding: var(--su-3); --font-size: var(--fs-s); --with-icon-padding: var(--su-2); --icon-margin: var(--su-1); font-weight: normal; } /* line 113, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--l { --vertical-padding: var(--su-3); --horizontal-padding: var(--su-5); --with-icon-padding: var(--su-3); --icon-margin: var(--su-2); } /* line 120, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--xl { --vertical-padding: var(--su-4); --horizontal-padding: var(--su-6); --font-size: var(--fs-l); --with-icon-padding: var(--su-5); --icon-margin: var(--su-3); } /* line 130, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn > *, .ltag__wikipedia--container .ltag__wikipedia--btn > *, .ltag__stackexchange--container .ltag__stackexchange--btn > *, .ltag__reddit--container .ltag__reddit--btn > *, .gh-btn-container .gh-btn > * { pointer-events: none; } /* line 132, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn > * + input, .ltag__wikipedia--container .ltag__wikipedia--btn > * + input, .ltag__stackexchange--container .ltag__stackexchange--btn > * + input, .ltag__reddit--container .ltag__reddit--btn > * + input, .gh-btn-container .gh-btn > * + input { pointer-events: revert; } /* line 138, app/assets/stylesheets/ltags/../components/buttons.scss */ .js-focus-visible .crayons-btn.focus-visible:focus, .js-focus-visible .ltag__wikipedia--container .focus-visible.ltag__wikipedia--btn:focus, .ltag__wikipedia--container .js-focus-visible .focus-visible.ltag__wikipedia--btn:focus, .js-focus-visible .ltag__stackexchange--container .focus-visible.ltag__stackexchange--btn:focus, .ltag__stackexchange--container .js-focus-visible .focus-visible.ltag__stackexchange--btn:focus, .js-focus-visible .ltag__reddit--container .focus-visible.ltag__reddit--btn:focus, .ltag__reddit--container .js-focus-visible .focus-visible.ltag__reddit--btn:focus, .js-focus-visible .gh-btn-container .focus-visible.gh-btn:focus, .gh-btn-container .js-focus-visible .focus-visible.gh-btn:focus, .js-focus-visible .crayons-btn.focus-visible:focus-within, .js-focus-visible .ltag__wikipedia--container .focus-visible.ltag__wikipedia--btn:focus-within, .ltag__wikipedia--container .js-focus-visible .focus-visible.ltag__wikipedia--btn:focus-within, .js-focus-visible .ltag__stackexchange--container .focus-visible.ltag__stackexchange--btn:focus-within, .ltag__stackexchange--container .js-focus-visible .focus-visible.ltag__stackexchange--btn:focus-within, .js-focus-visible .ltag__reddit--container .focus-visible.ltag__reddit--btn:focus-within, .ltag__reddit--container .js-focus-visible .focus-visible.ltag__reddit--btn:focus-within, .js-focus-visible .gh-btn-container .focus-visible.gh-btn:focus-within, .gh-btn-container .js-focus-visible .focus-visible.gh-btn:focus-within, label[class*='crayons-btn']:focus-within { background-color: var(--bg-hover); border-color: var(--border-hover); box-shadow: var(--shadow-hover); color: var(--color-hover); z-index: var(--z-elevate); } /* line 149, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--secondary, .ltag__wikipedia--container .ltag__wikipedia--btn, .ltag__stackexchange--container .ltag__stackexchange--btn, .ltag__reddit--container .ltag__reddit--btn, .gh-btn-container .gh-btn { --bg: var(--button-secondary-bg); --bg-hover: var(--button-secondary-bg-hover); --color: var(--button-secondary-color); --color-hover: var(--button-secondary-color-hover); } /* line 156, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--outlined { --bg: var(--button-outlined-bg); --bg-hover: var(--button-outlined-bg-hover); --border: var(--button-outlined-border); --border-hover: var(--button-outlined-border-hover); --color: var(--button-outlined-color); --color-hover: var(--button-outlined-color-hover); --border-width: 2px; } /* line 167, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--danger { --bg: var(--accent-danger); --bg-hover: var(--accent-danger-darker); --color: var(--base-inverted); --color-hover: var(--base-inverted); --bg-inverted: var(--accent-danger); --bg-inverted-hover: var(--accent-danger-darker); --color-inverted: var(--base-inverted); --color-inverted-hover: var(--base-inverted); } /* line 178, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--success { --bg: var(--accent-success); --bg-hover: var(--accent-success-darker); --color: var(--base-inverted); --color-hover: var(--base-inverted); --bg-inverted: var(--accent-success); --bg-inverted-hover: var(--accent-success-darker); --color-inverted: var(--base-inverted); --color-inverted-hover: var(--base-inverted); } /* line 189, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--warning { --bg: var(--accent-warning); --bg-hover: var(--accent-warning-darker); --color: var(--base-inverted); --color-hover: var(--base-inverted); --bg-inverted: var(--accent-warning); --bg-inverted-hover: var(--accent-warning-darker); --color-inverted: var(--base-inverted); --color-inverted-hover: var(--base-inverted); } /* line 200, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--ghost { --bg: var(--button-ghost-bg); --bg-hover: var(--button-ghost-bg-hover); --color: var(--button-ghost-color); --color-hover: var(--button-ghost-color-hover); --shadow: none; --shadow-hover: none; --bg-inverted: var(--button-ghost-inverted-bg); --bg-inverted-hover: var(--button-ghost-inverted-bg-hover); --color-inverted: var(--button-ghost-inverted-color); --color-inverted-hover: var(--button-ghost-inverted-color-hover); } /* line 212, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--ghost-brand { --bg: var(--button-ghost-bg); --bg-hover: var(--button-ghost-bg-hover); --color: var(--accent-brand); --color-hover: var(--accent-brand-darker); --shadow: none; --shadow-hover: none; } /* line 221, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--ghost-dimmed { --bg: var(--button-ghost-bg); --bg-hover: var(--button-ghost-bg-hover); --color: var(--button-ghost-dimmed-color); --color-hover: var(--button-ghost-dimmed-color-hover); --shadow: none; --shadow-hover: none; } /* line 230, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--ghost-success { --bg: var(--button-ghost-bg); --bg-hover: var(--button-ghost-bg-hover); --color: var(--accent-success); --color-hover: var(--accent-success-darker); --shadow: none; --shadow-hover: none; --bg-inverted: var(--button-ghost-inverted-bg); --bg-inverted-hover: var(--button-ghost-inverted-bg-hover); --color-inverted: var(--accent-success); --color-inverted-hover: var(--accent-success-darker); } /* line 243, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--ghost-danger { --bg: var(--button-ghost-bg); --bg-hover: var(--button-ghost-bg-hover); --color: var(--accent-danger); --color-hover: var(--accent-danger-darker); --shadow: none; --shadow-hover: none; } /* line 253, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--brand-apple { --bg: var(--brand-apple-bg); --bg-hover: var(--brand-apple-bg-hover); --color: var(--brand-apple-color); --color-hover: var(--brand-apple-color); --bg-inverted: var(--brand-apple-bg); --bg-inverted-hover: var(--brand-apple-bg-hover); --color-inverted: var(--brand-apple-color); --color-inverted-hover: var(--brand-apple-color); } /* line 264, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--brand-twitter { --bg: var(--brand-twitter-bg); --bg-hover: var(--brand-twitter-bg-hover); --color: var(--brand-twitter-color); --color-hover: var(--brand-twitter-color); --bg-inverted: var(--brand-twitter-bg); --bg-inverted-hover: var(--brand-twitter-bg-hover); --color-inverted: var(--brand-twitter-color); --color-inverted-hover: var(--brand-twitter-color); } /* line 275, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--brand-github { --bg: var(--brand-github-bg); --bg-hover: var(--brand-github-bg-hover); --color: var(--brand-github-color); --color-hover: var(--brand-github-color); --bg-inverted: var(--brand-github-bg); --bg-inverted-hover: var(--brand-github-bg-hover); --color-inverted: var(--brand-github-color); --color-inverted-hover: var(--brand-github-color); } /* line 286, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--brand-facebook { --bg: var(--brand-facebook-bg); --bg-hover: var(--brand-facebook-bg-hover); --color: var(--brand-facebook-color); --color-hover: var(--brand-facebook-color); --bg-inverted: var(--brand-facebook-bg); --bg-inverted-hover: var(--brand-facebook-bg-hover); --color-inverted: var(--brand-facebook-color); --color-inverted-hover: var(--brand-facebook-color); } /* line 297, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--brand-forem { --bg: var(--brand-forem-bg); --bg-hover: var(--brand-forem-bg-hover); --color: var(--brand-forem-color); --color-hover: var(--brand-forem-color); --bg-inverted: var(--brand-forem-bg); --bg-inverted-hover: var(--brand-forem-bg-hover); --color-inverted: var(--brand-forem-color); --color-inverted-hover: var(--brand-forem-color); } /* line 308, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--brand-email { --bg: var(--brand-email-bg); --bg-hover: var(--brand-email-bg-hover); --color: var(--brand-email-color); --color-hover: var(--brand-email-color); --bg-inverted: var(--brand-email-bg); --bg-inverted-hover: var(--brand-email-bg-hover); --color-inverted: var(--brand-email-color); --color-inverted-hover: var(--brand-email-color); } /* line 319, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--brand-google_oauth2 { --bg: var(--brand-google_oauth2-bg); --bg-hover: var(--brand-google_oauth2-bg-hover); --color: var(--brand-google_oauth2-color); --color-hover: var(--brand-google_oauth2-color); --bg-inverted: var(--brand-google_oauth2-bg); --bg-inverted-hover: var(--brand-google_oauth2-bg-hover); --color-inverted: var(--brand-google_oauth2-color); --color-inverted-hover: var(--brand-google_oauth2-color); } /* line 331, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--icon, .crayons-btn--icon-rounded { --horizontal-padding: var(--su-2); padding-left: calc(var(--horizontal-padding) - var(--border-width)); padding-right: calc(var(--horizontal-padding) - var(--border-width)); } /* line 336, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--icon.crayons-btn--s, .crayons-btn--icon-rounded.crayons-btn--s { --horizontal-padding: var(--su-1); } /* line 340, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--icon.crayons-btn--l, .crayons-btn--icon-rounded.crayons-btn--l { --horizontal-padding: var(--su-3); } /* line 344, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--icon.crayons-btn--xl, .crayons-btn--icon-rounded.crayons-btn--xl { --horizontal-padding: var(--su-4); } /* line 349, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--icon-rounded { border-radius: 1000px; } /* line 354, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--icon-left { padding-left: calc(var(--with-icon-padding) - var(--border-width)); } /* line 357, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--icon-left .crayons-icon { margin-right: var(--icon-margin); } /* line 363, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--icon-right { padding-right: calc(var(--with-icon-padding) - var(--border-width)); } /* line 366, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--icon-right .crayons-icon { margin-left: var(--icon-margin); } /* line 371, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn-actions { --btn-wrap-gap: var(--su-2); display: flex; flex-wrap: wrap; align-items: center; margin-bottom: calc(0rem - var(--btn-wrap-gap)); margin-left: calc(0rem - var(--btn-wrap-gap)); } /* line 380, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn-actions .crayons-btn, .crayons-btn-actions .ltag__wikipedia--container .ltag__wikipedia--btn, .ltag__wikipedia--container .crayons-btn-actions .ltag__wikipedia--btn, .crayons-btn-actions .ltag__stackexchange--container .ltag__stackexchange--btn, .ltag__stackexchange--container .crayons-btn-actions .ltag__stackexchange--btn, .crayons-btn-actions .ltag__reddit--container .ltag__reddit--btn, .ltag__reddit--container .crayons-btn-actions .ltag__reddit--btn, .crayons-btn-actions .gh-btn-container .gh-btn, .gh-btn-container .crayons-btn-actions .gh-btn { margin-left: var(--btn-wrap-gap); margin-bottom: var(--btn-wrap-gap); } /* line 387, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn-group { display: flex; } /* line 390, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn-group .crayons-btn, .crayons-btn-group .ltag__wikipedia--container .ltag__wikipedia--btn, .ltag__wikipedia--container .crayons-btn-group .ltag__wikipedia--btn, .crayons-btn-group .ltag__stackexchange--container .ltag__stackexchange--btn, .ltag__stackexchange--container .crayons-btn-group .ltag__stackexchange--btn, .crayons-btn-group .ltag__reddit--container .ltag__reddit--btn, .ltag__reddit--container .crayons-btn-group .ltag__reddit--btn, .crayons-btn-group .gh-btn-container .gh-btn, .gh-btn-container .crayons-btn-group .gh-btn { border-radius: 0; } /* line 393, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn-group .crayons-btn + .crayons-btn:not(.crayons-btn--outlined), .crayons-btn-group .ltag__wikipedia--container .ltag__wikipedia--btn + .crayons-btn:not(.crayons-btn--outlined), .ltag__wikipedia--container .crayons-btn-group .ltag__wikipedia--btn + .crayons-btn:not(.crayons-btn--outlined), .crayons-btn-group .ltag__wikipedia--container .crayons-btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined), .ltag__wikipedia--container .crayons-btn-group .crayons-btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined), .crayons-btn-group .ltag__wikipedia--container .ltag__wikipedia--btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined), .ltag__wikipedia--container .crayons-btn-group .ltag__wikipedia--btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined), .crayons-btn-group .ltag__stackexchange--container .ltag__stackexchange--btn + .crayons-btn:not(.crayons-btn--outlined), .crayons-btn-group .ltag__stackexchange--container .ltag__wikipedia--container .ltag__stackexchange--btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined), .ltag__wikipedia--container .crayons-btn-group .ltag__stackexchange--container .ltag__stackexchange--btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined), .ltag__stackexchange--container .crayons-btn-group .ltag__stackexchange--btn + .crayons-btn:not(.crayons-btn--outlined), .ltag__stackexchange--container .crayons-btn-group .ltag__wikipedia--container .ltag__stackexchange--btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined), .ltag__wikipedia--container .ltag__stackexchange--container .crayons-btn-group .ltag__stackexchange--btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined), .crayons-btn-group .ltag__stackexchange--container .crayons-btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined), .crayons-btn-group .ltag__stackexchange--container .ltag__wikipedia--container .ltag__wikipedia--btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined), .ltag__wikipedia--container .crayons-btn-group .ltag__stackexchange--container .ltag__wikipedia--btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined), .ltag__stackexchange--container .crayons-btn-group .crayons-btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined), .ltag__stackexchange--container .crayons-btn-group .ltag__wikipedia--container .ltag__wikipedia--btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined), .ltag__wikipedia--container .ltag__stackexchange--container .crayons-btn-group .ltag__wikipedia--btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined), .crayons-btn-group .ltag__stackexchange--container .ltag__stackexchange--btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined), .ltag__stackexchange--container .crayons-btn-group .ltag__stackexchange--btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined), .crayons-btn-group .ltag__reddit--container .ltag__reddit--btn + .crayons-btn:not(.crayons-btn--outlined), .crayons-btn-group .ltag__reddit--container .ltag__wikipedia--container .ltag__reddit--btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined), .ltag__wikipedia--container .crayons-btn-group .ltag__reddit--container .ltag__reddit--btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined), .crayons-btn-group .ltag__reddit--container .ltag__stackexchange--container .ltag__reddit--btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined), .ltag__stackexchange--container .crayons-btn-group .ltag__reddit--container .ltag__reddit--btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined), .ltag__reddit--container .crayons-btn-group .ltag__reddit--btn + .crayons-btn:not(.crayons-btn--outlined), .ltag__reddit--container .crayons-btn-group .ltag__wikipedia--container .ltag__reddit--btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined), .ltag__wikipedia--container .ltag__reddit--container .crayons-btn-group .ltag__reddit--btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined), .ltag__reddit--container .crayons-btn-group .ltag__stackexchange--container .ltag__reddit--btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined), .ltag__stackexchange--container .ltag__reddit--container .crayons-btn-group .ltag__reddit--btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined), .crayons-btn-group .ltag__reddit--container .crayons-btn + .ltag__reddit--btn:not(.crayons-btn--outlined), .crayons-btn-group .ltag__reddit--container .ltag__wikipedia--container .ltag__wikipedia--btn + .ltag__reddit--btn:not(.crayons-btn--outlined), .ltag__wikipedia--container .crayons-btn-group .ltag__reddit--container .ltag__wikipedia--btn + .ltag__reddit--btn:not(.crayons-btn--outlined), .crayons-btn-group .ltag__reddit--container .ltag__stackexchange--container .ltag__stackexchange--btn + .ltag__reddit--btn:not(.crayons-btn--outlined), .ltag__stackexchange--container .crayons-btn-group .ltag__reddit--container .ltag__stackexchange--btn + .ltag__reddit--btn:not(.crayons-btn--outlined), .ltag__reddit--container .crayons-btn-group .crayons-btn + .ltag__reddit--btn:not(.crayons-btn--outlined), .ltag__reddit--container .crayons-btn-group .ltag__wikipedia--container .ltag__wikipedia--btn + .ltag__reddit--btn:not(.crayons-btn--outlined), .ltag__wikipedia--container .ltag__reddit--container .crayons-btn-group .ltag__wikipedia--btn + .ltag__reddit--btn:not(.crayons-btn--outlined), .ltag__reddit--container .crayons-btn-group .ltag__stackexchange--container .ltag__stackexchange--btn + .ltag__reddit--btn:not(.crayons-btn--outlined), .ltag__stackexchange--container .ltag__reddit--container .crayons-btn-group .ltag__stackexchange--btn + .ltag__reddit--btn:not(.crayons-btn--outlined), .crayons-btn-group .ltag__reddit--container .ltag__reddit--btn + .ltag__reddit--btn:not(.crayons-btn--outlined), .ltag__reddit--container .crayons-btn-group .ltag__reddit--btn + .ltag__reddit--btn:not(.crayons-btn--outlined), .crayons-btn-group .gh-btn-container .gh-btn + .crayons-btn:not(.crayons-btn--outlined), .crayons-btn-group .gh-btn-container .ltag__wikipedia--container .gh-btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined), .ltag__wikipedia--container .crayons-btn-group .gh-btn-container .gh-btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined), .crayons-btn-group .gh-btn-container .ltag__stackexchange--container .gh-btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined), .ltag__stackexchange--container .crayons-btn-group .gh-btn-container .gh-btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined), .crayons-btn-group .gh-btn-container .ltag__reddit--container .gh-btn + .ltag__reddit--btn:not(.crayons-btn--outlined), .ltag__reddit--container .crayons-btn-group .gh-btn-container .gh-btn + .ltag__reddit--btn:not(.crayons-btn--outlined), .gh-btn-container .crayons-btn-group .gh-btn + .crayons-btn:not(.crayons-btn--outlined), .gh-btn-container .crayons-btn-group .ltag__wikipedia--container .gh-btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined), .ltag__wikipedia--container .gh-btn-container .crayons-btn-group .gh-btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined), .gh-btn-container .crayons-btn-group .ltag__stackexchange--container .gh-btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined), .ltag__stackexchange--container .gh-btn-container .crayons-btn-group .gh-btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined), .gh-btn-container .crayons-btn-group .ltag__reddit--container .gh-btn + .ltag__reddit--btn:not(.crayons-btn--outlined), .ltag__reddit--container .gh-btn-container .crayons-btn-group .gh-btn + .ltag__reddit--btn:not(.crayons-btn--outlined), .crayons-btn-group .gh-btn-container .crayons-btn + .gh-btn:not(.crayons-btn--outlined), .crayons-btn-group .gh-btn-container .ltag__wikipedia--container .ltag__wikipedia--btn + .gh-btn:not(.crayons-btn--outlined), .ltag__wikipedia--container .crayons-btn-group .gh-btn-container .ltag__wikipedia--btn + .gh-btn:not(.crayons-btn--outlined), .crayons-btn-group .gh-btn-container .ltag__stackexchange--container .ltag__stackexchange--btn + .gh-btn:not(.crayons-btn--outlined), .ltag__stackexchange--container .crayons-btn-group .gh-btn-container .ltag__stackexchange--btn + .gh-btn:not(.crayons-btn--outlined), .crayons-btn-group .gh-btn-container .ltag__reddit--container .ltag__reddit--btn + .gh-btn:not(.crayons-btn--outlined), .ltag__reddit--container .crayons-btn-group .gh-btn-container .ltag__reddit--btn + .gh-btn:not(.crayons-btn--outlined), .gh-btn-container .crayons-btn-group .crayons-btn + .gh-btn:not(.crayons-btn--outlined), .gh-btn-container .crayons-btn-group .ltag__wikipedia--container .ltag__wikipedia--btn + .gh-btn:not(.crayons-btn--outlined), .ltag__wikipedia--container .gh-btn-container .crayons-btn-group .ltag__wikipedia--btn + .gh-btn:not(.crayons-btn--outlined), .gh-btn-container .crayons-btn-group .ltag__stackexchange--container .ltag__stackexchange--btn + .gh-btn:not(.crayons-btn--outlined), .ltag__stackexchange--container .gh-btn-container .crayons-btn-group .ltag__stackexchange--btn + .gh-btn:not(.crayons-btn--outlined), .gh-btn-container .crayons-btn-group .ltag__reddit--container .ltag__reddit--btn + .gh-btn:not(.crayons-btn--outlined), .ltag__reddit--container .gh-btn-container .crayons-btn-group .ltag__reddit--btn + .gh-btn:not(.crayons-btn--outlined), .crayons-btn-group .gh-btn-container .gh-btn + .gh-btn:not(.crayons-btn--outlined), .gh-btn-container .crayons-btn-group .gh-btn + .gh-btn:not(.crayons-btn--outlined) { box-shadow: var(--shadow), inset 1px 0 0 rgba(0, 0, 0, 0.1); margin-left: -1px; } /* line 397, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn-group .crayons-btn + .crayons-btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .ltag__wikipedia--container .ltag__wikipedia--btn + .crayons-btn:not(.crayons-btn--outlined):hover, .ltag__wikipedia--container .crayons-btn-group .ltag__wikipedia--btn + .crayons-btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .ltag__wikipedia--container .crayons-btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined):hover, .ltag__wikipedia--container .crayons-btn-group .crayons-btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .ltag__wikipedia--container .ltag__wikipedia--btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined):hover, .ltag__wikipedia--container .crayons-btn-group .ltag__wikipedia--btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .ltag__stackexchange--container .ltag__stackexchange--btn + .crayons-btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .ltag__stackexchange--container .ltag__wikipedia--container .ltag__stackexchange--btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined):hover, .ltag__wikipedia--container .crayons-btn-group .ltag__stackexchange--container .ltag__stackexchange--btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined):hover, .ltag__stackexchange--container .crayons-btn-group .ltag__stackexchange--btn + .crayons-btn:not(.crayons-btn--outlined):hover, .ltag__stackexchange--container .crayons-btn-group .ltag__wikipedia--container .ltag__stackexchange--btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined):hover, .ltag__wikipedia--container .ltag__stackexchange--container .crayons-btn-group .ltag__stackexchange--btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .ltag__stackexchange--container .crayons-btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .ltag__stackexchange--container .ltag__wikipedia--container .ltag__wikipedia--btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined):hover, .ltag__wikipedia--container .crayons-btn-group .ltag__stackexchange--container .ltag__wikipedia--btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined):hover, .ltag__stackexchange--container .crayons-btn-group .crayons-btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined):hover, .ltag__stackexchange--container .crayons-btn-group .ltag__wikipedia--container .ltag__wikipedia--btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined):hover, .ltag__wikipedia--container .ltag__stackexchange--container .crayons-btn-group .ltag__wikipedia--btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .ltag__stackexchange--container .ltag__stackexchange--btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined):hover, .ltag__stackexchange--container .crayons-btn-group .ltag__stackexchange--btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .ltag__reddit--container .ltag__reddit--btn + .crayons-btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .ltag__reddit--container .ltag__wikipedia--container .ltag__reddit--btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined):hover, .ltag__wikipedia--container .crayons-btn-group .ltag__reddit--container .ltag__reddit--btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .ltag__reddit--container .ltag__stackexchange--container .ltag__reddit--btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined):hover, .ltag__stackexchange--container .crayons-btn-group .ltag__reddit--container .ltag__reddit--btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined):hover, .ltag__reddit--container .crayons-btn-group .ltag__reddit--btn + .crayons-btn:not(.crayons-btn--outlined):hover, .ltag__reddit--container .crayons-btn-group .ltag__wikipedia--container .ltag__reddit--btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined):hover, .ltag__wikipedia--container .ltag__reddit--container .crayons-btn-group .ltag__reddit--btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined):hover, .ltag__reddit--container .crayons-btn-group .ltag__stackexchange--container .ltag__reddit--btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined):hover, .ltag__stackexchange--container .ltag__reddit--container .crayons-btn-group .ltag__reddit--btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .ltag__reddit--container .crayons-btn + .ltag__reddit--btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .ltag__reddit--container .ltag__wikipedia--container .ltag__wikipedia--btn + .ltag__reddit--btn:not(.crayons-btn--outlined):hover, .ltag__wikipedia--container .crayons-btn-group .ltag__reddit--container .ltag__wikipedia--btn + .ltag__reddit--btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .ltag__reddit--container .ltag__stackexchange--container .ltag__stackexchange--btn + .ltag__reddit--btn:not(.crayons-btn--outlined):hover, .ltag__stackexchange--container .crayons-btn-group .ltag__reddit--container .ltag__stackexchange--btn + .ltag__reddit--btn:not(.crayons-btn--outlined):hover, .ltag__reddit--container .crayons-btn-group .crayons-btn + .ltag__reddit--btn:not(.crayons-btn--outlined):hover, .ltag__reddit--container .crayons-btn-group .ltag__wikipedia--container .ltag__wikipedia--btn + .ltag__reddit--btn:not(.crayons-btn--outlined):hover, .ltag__wikipedia--container .ltag__reddit--container .crayons-btn-group .ltag__wikipedia--btn + .ltag__reddit--btn:not(.crayons-btn--outlined):hover, .ltag__reddit--container .crayons-btn-group .ltag__stackexchange--container .ltag__stackexchange--btn + .ltag__reddit--btn:not(.crayons-btn--outlined):hover, .ltag__stackexchange--container .ltag__reddit--container .crayons-btn-group .ltag__stackexchange--btn + .ltag__reddit--btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .ltag__reddit--container .ltag__reddit--btn + .ltag__reddit--btn:not(.crayons-btn--outlined):hover, .ltag__reddit--container .crayons-btn-group .ltag__reddit--btn + .ltag__reddit--btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .gh-btn-container .gh-btn + .crayons-btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .gh-btn-container .ltag__wikipedia--container .gh-btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined):hover, .ltag__wikipedia--container .crayons-btn-group .gh-btn-container .gh-btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .gh-btn-container .ltag__stackexchange--container .gh-btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined):hover, .ltag__stackexchange--container .crayons-btn-group .gh-btn-container .gh-btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .gh-btn-container .ltag__reddit--container .gh-btn + .ltag__reddit--btn:not(.crayons-btn--outlined):hover, .ltag__reddit--container .crayons-btn-group .gh-btn-container .gh-btn + .ltag__reddit--btn:not(.crayons-btn--outlined):hover, .gh-btn-container .crayons-btn-group .gh-btn + .crayons-btn:not(.crayons-btn--outlined):hover, .gh-btn-container .crayons-btn-group .ltag__wikipedia--container .gh-btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined):hover, .ltag__wikipedia--container .gh-btn-container .crayons-btn-group .gh-btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined):hover, .gh-btn-container .crayons-btn-group .ltag__stackexchange--container .gh-btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined):hover, .ltag__stackexchange--container .gh-btn-container .crayons-btn-group .gh-btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined):hover, .gh-btn-container .crayons-btn-group .ltag__reddit--container .gh-btn + .ltag__reddit--btn:not(.crayons-btn--outlined):hover, .ltag__reddit--container .gh-btn-container .crayons-btn-group .gh-btn + .ltag__reddit--btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .gh-btn-container .crayons-btn + .gh-btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .gh-btn-container .ltag__wikipedia--container .ltag__wikipedia--btn + .gh-btn:not(.crayons-btn--outlined):hover, .ltag__wikipedia--container .crayons-btn-group .gh-btn-container .ltag__wikipedia--btn + .gh-btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .gh-btn-container .ltag__stackexchange--container .ltag__stackexchange--btn + .gh-btn:not(.crayons-btn--outlined):hover, .ltag__stackexchange--container .crayons-btn-group .gh-btn-container .ltag__stackexchange--btn + .gh-btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .gh-btn-container .ltag__reddit--container .ltag__reddit--btn + .gh-btn:not(.crayons-btn--outlined):hover, .ltag__reddit--container .crayons-btn-group .gh-btn-container .ltag__reddit--btn + .gh-btn:not(.crayons-btn--outlined):hover, .gh-btn-container .crayons-btn-group .crayons-btn + .gh-btn:not(.crayons-btn--outlined):hover, .gh-btn-container .crayons-btn-group .ltag__wikipedia--container .ltag__wikipedia--btn + .gh-btn:not(.crayons-btn--outlined):hover, .ltag__wikipedia--container .gh-btn-container .crayons-btn-group .ltag__wikipedia--btn + .gh-btn:not(.crayons-btn--outlined):hover, .gh-btn-container .crayons-btn-group .ltag__stackexchange--container .ltag__stackexchange--btn + .gh-btn:not(.crayons-btn--outlined):hover, .ltag__stackexchange--container .gh-btn-container .crayons-btn-group .ltag__stackexchange--btn + .gh-btn:not(.crayons-btn--outlined):hover, .gh-btn-container .crayons-btn-group .ltag__reddit--container .ltag__reddit--btn + .gh-btn:not(.crayons-btn--outlined):hover, .ltag__reddit--container .gh-btn-container .crayons-btn-group .ltag__reddit--btn + .gh-btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .gh-btn-container .gh-btn + .gh-btn:not(.crayons-btn--outlined):hover, .gh-btn-container .crayons-btn-group .gh-btn + .gh-btn:not(.crayons-btn--outlined):hover { box-shadow: var(--shadow-hover), inset 0 0 0 rgba(0, 0, 0, 0.1); } /* line 402, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn-group .crayons-btn + .crayons-btn--outlined, .crayons-btn-group .ltag__wikipedia--container .ltag__wikipedia--btn + .crayons-btn--outlined, .ltag__wikipedia--container .crayons-btn-group .ltag__wikipedia--btn + .crayons-btn--outlined, .crayons-btn-group .ltag__stackexchange--container .ltag__stackexchange--btn + .crayons-btn--outlined, .ltag__stackexchange--container .crayons-btn-group .ltag__stackexchange--btn + .crayons-btn--outlined, .crayons-btn-group .ltag__reddit--container .ltag__reddit--btn + .crayons-btn--outlined, .ltag__reddit--container .crayons-btn-group .ltag__reddit--btn + .crayons-btn--outlined, .crayons-btn-group .gh-btn-container .gh-btn + .crayons-btn--outlined, .gh-btn-container .crayons-btn-group .gh-btn + .crayons-btn--outlined { margin-left: calc(-1 * var(--border-width)); } /* line 406, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn-group .crayons-btn:first-child, .crayons-btn-group .ltag__wikipedia--container .ltag__wikipedia--btn:first-child, .ltag__wikipedia--container .crayons-btn-group .ltag__wikipedia--btn:first-child, .crayons-btn-group .ltag__stackexchange--container .ltag__stackexchange--btn:first-child, .ltag__stackexchange--container .crayons-btn-group .ltag__stackexchange--btn:first-child, .crayons-btn-group .ltag__reddit--container .ltag__reddit--btn:first-child, .ltag__reddit--container .crayons-btn-group .ltag__reddit--btn:first-child, .crayons-btn-group .gh-btn-container .gh-btn:first-child, .gh-btn-container .crayons-btn-group .gh-btn:first-child { border-top-left-radius: var(--radius); border-bottom-left-radius: var(--radius); } /* line 411, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn-group .crayons-btn:last-child, .crayons-btn-group .ltag__wikipedia--container .ltag__wikipedia--btn:last-child, .ltag__wikipedia--container .crayons-btn-group .ltag__wikipedia--btn:last-child, .crayons-btn-group .ltag__stackexchange--container .ltag__stackexchange--btn:last-child, .ltag__stackexchange--container .crayons-btn-group .ltag__stackexchange--btn:last-child, .crayons-btn-group .ltag__reddit--container .ltag__reddit--btn:last-child, .ltag__reddit--container .crayons-btn-group .ltag__reddit--btn:last-child, .crayons-btn-group .gh-btn-container .gh-btn:last-child, .gh-btn-container .crayons-btn-group .gh-btn:last-child { border-top-right-radius: var(--radius); border-bottom-right-radius: var(--radius); } /* line 424, app/assets/stylesheets/ltags/../components/buttons.scss */ .c-btn { position: relative; display: inline-block; padding: var(--su-2) var(--su-4); border-radius: var(--radius); font: inherit; text-align: center; cursor: pointer; border: none; overflow-wrap: normal; background-color: var(--bg); color: var(--color); } /* line 437, app/assets/stylesheets/ltags/../components/buttons.scss */ .c-btn:hover:enabled, .js-focus-visible .c-btn.focus-visible:focus, .c-btn:is(label):focus-within { background-color: var(--bg-hover); color: var(--color-hover); z-index: var(--z-elevate); } /* line 445, app/assets/stylesheets/ltags/../components/buttons.scss */ .js-focus-visible .c-btn.focus-visible:focus, .c-btn:is(label):focus-within { box-shadow: var(--focus-ring); outline: 0; } /* line 451, app/assets/stylesheets/ltags/../components/buttons.scss */ .c-btn[aria-expanded='true'], .c-btn[aria-pressed='true'] { --bg: var(--btn-current-bg); --color: var(--btn-current-color); font-weight: var(--fw-bold); } /* line 458, app/assets/stylesheets/ltags/../components/buttons.scss */ .c-btn[disabled] { opacity: 0.6; cursor: not-allowed; } /* line 465, app/assets/stylesheets/ltags/../components/buttons.scss */ .c-btn > * { pointer-events: none; } /* line 467, app/assets/stylesheets/ltags/../components/buttons.scss */ .c-btn > * + input { pointer-events: revert; } /* line 473, app/assets/stylesheets/ltags/../components/buttons.scss */ .c-btn { --bg: var(--btn-bg); --bg-hover: var(--btn-bg-hover); --color: var(--btn-color); --color-hover: var(--btn-color-hover); } /* line 479, app/assets/stylesheets/ltags/../components/buttons.scss */ .c-btn.c-btn--destructive { --bg: var(--btn-destructive-bg); --bg-hover: var(--btn-destructive-bg-hover); --color: var(--btn-destructive-color); --color-hover: var(--btn-destructive-color-hover); } /* line 487, app/assets/stylesheets/ltags/../components/buttons.scss */ .c-btn--primary { --bg: var(--btn-primary-bg); --bg-hover: var(--btn-primary-bg-hover); --color: var(--btn-primary-color); --color-hover: var(--btn-primary-color-hover); font-weight: var(--fw-medium); } /* line 495, app/assets/stylesheets/ltags/../components/buttons.scss */ .c-btn--primary.c-btn--destructive { --bg: var(--btn-primary-destructive-bg); --bg-hover: var(--btn-primary-destructive-bg-hover); --color: var(--btn-primary-destructive-color); --color-hover: var(--btn-primary-destructive-color-hover); } /* line 503, app/assets/stylesheets/ltags/../components/buttons.scss */ .c-btn--secondary { --bg: var(--btn-secondary-bg); --bg-hover: var(--btn-secondary-bg-hover); --color: var(--btn-secondary-color); --color-hover: var(--btn-secondary-color-hover); } /* line 510, app/assets/stylesheets/ltags/../components/buttons.scss */ .c-btn--icon-alone { padding: var(--su-2); } /* line 515, app/assets/stylesheets/ltags/../components/buttons.scss */ .c-btn--icon-left .c-btn__icon { margin-right: var(--su-2); margin-left: calc(var(--su-1) * -1); } /* line 4, app/assets/stylesheets/ltags/GithubTag.scss */ .ltag_github-liquid-tag { margin: 1.1em auto 1.3em; position: relative; } /* line 8, app/assets/stylesheets/ltags/GithubTag.scss */ .ltag_github-liquid-tag h1 { font-size: var(--fs-xl) !important; line-height: var(--lh-base) !important; margin: 0 0 0.7em !important; } @media screen and (min-width: 500px) { /* line 8, app/assets/stylesheets/ltags/GithubTag.scss */ .ltag_github-liquid-tag h1 { margin-bottom: 10px; word-wrap: break-word; } } /* line 18, app/assets/stylesheets/ltags/GithubTag.scss */ .ltag_github-liquid-tag h1 a { color: var(--body-color); } /* line 22, app/assets/stylesheets/ltags/GithubTag.scss */ .ltag_github-liquid-tag h1 .issue-title { font-weight: var(--fw-normal); } /* line 26, app/assets/stylesheets/ltags/GithubTag.scss */ .ltag_github-liquid-tag h1 .issue-number { color: var(--base-60); font-weight: var(--fw-normal); letter-spacing: -1px; } /* line 32, app/assets/stylesheets/ltags/GithubTag.scss */ .ltag_github-liquid-tag h1 .github-logo { display: inline-block; max-width: 1.1em; width: 1.15em; vertical-align: middle; margin: 0; margin-right: 0.3em; left: 0; filter: invert(0); filter: var(--theme-social-icon-invert, invert(0)); } /* line 46, app/assets/stylesheets/ltags/GithubTag.scss */ .github-thread { font-family: var(--ff-sans-serif); background-color: var(--card-bg); border: 1px solid var(--form-border); box-shadow: var(--shadow-smooth); border-radius: var(--radius-auto); font-size: 0.77em; line-height: 1.15em; margin: 0; overflow: hidden; } /* line 57, app/assets/stylesheets/ltags/GithubTag.scss */ .github-thread .timeline-comment-header { display: flex; align-items: center; background: var(--card-bg); border-bottom: 1px solid var(--form-border); padding: 0.5em 1.5em; } @media screen and (min-width: 500px) { /* line 57, app/assets/stylesheets/ltags/GithubTag.scss */ .github-thread .timeline-comment-header { align-items: center; } } /* line 68, app/assets/stylesheets/ltags/GithubTag.scss */ .github-thread .timeline-comment-header .github-liquid-tag-img { margin: 10px 10px 10px 0; width: 38px; height: 38px; padding: 0; } /* line 76, app/assets/stylesheets/ltags/GithubTag.scss */ .github-thread .timeline-comment-header-text { padding: 10px 0; } /* line 79, app/assets/stylesheets/ltags/GithubTag.scss */ .github-thread .timeline-comment-header-text a { color: var(--base-60); } /* line 82, app/assets/stylesheets/ltags/GithubTag.scss */ .github-thread .timeline-comment-header-text a:hover { color: var(--base-60); text-decoration: underline; } /* line 90, app/assets/stylesheets/ltags/GithubTag.scss */ .ltag-github-body { padding: 1em 1.5em; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'; max-height: calc(21vw + 165px); overflow: hidden; } @media screen and (min-width: 430px) { /* line 90, app/assets/stylesheets/ltags/GithubTag.scss */ .ltag-github-body { max-height: calc(20vw + 153px); } } @media screen and (min-width: 800px) { /* line 90, app/assets/stylesheets/ltags/GithubTag.scss */ .ltag-github-body { max-height: 310px; } } /* line 102, app/assets/stylesheets/ltags/GithubTag.scss */ .ltag-github-body h1, .ltag-github-body h2, .ltag-github-body h3, .ltag-github-body h4, .ltag-github-body h5, .ltag-github-body h6 { font-weight: 500 !important; } /* line 110, app/assets/stylesheets/ltags/GithubTag.scss */ .ltag-github-body h1 { margin-left: 0; font-size: 1.9em; padding-bottom: 0.3em; border-bottom: 1px solid #eaecef; margin-top: 1em !important; margin-bottom: 0.9em !important; } /* line 119, app/assets/stylesheets/ltags/GithubTag.scss */ .ltag-github-body h3 { margin-top: 1em !important; margin-bottom: 0.9em !important; padding: 0; font-size: 1.2em; font-weight: 600; line-height: 1.25; } /* line 128, app/assets/stylesheets/ltags/GithubTag.scss */ .ltag-github-body h4 { padding: 0; } /* line 132, app/assets/stylesheets/ltags/GithubTag.scss */ .ltag-github-body *:first-child { margin-top: 0 !important; } /* line 135, app/assets/stylesheets/ltags/GithubTag.scss */ .ltag-github-body *:last-child { margin-bottom: 0 !important; } /* line 139, app/assets/stylesheets/ltags/GithubTag.scss */ .ltag-github-body img { left: inherit; } /* line 143, app/assets/stylesheets/ltags/GithubTag.scss */ .ltag-github-body blockquote { color: #6a737d; padding: 0px 1em; border-left: 0.25em solid #dfe2e5; margin: 16px 0px; } /* line 150, app/assets/stylesheets/ltags/GithubTag.scss */ .ltag-github-body kbd { display: inline-block; padding: 3px 5px; font-size: 11px; line-height: 10px; color: #444d56; vertical-align: middle; background-color: #fafbfc; background-color: var(--card-bg); border: solid 1px #c6cbd1; border-bottom-color: #959da5; border-radius: 3px; box-shadow: inset 0 -1px 0 #959da5; } /* line 165, app/assets/stylesheets/ltags/GithubTag.scss */ .ltag-github-body p { margin-top: 0px; padding: 0px; margin-bottom: 15px; } /* line 169, app/assets/stylesheets/ltags/GithubTag.scss */ .ltag-github-body p a.github-user-link { color: var(--card-color-secondary); font-weight: 600; white-space: nowrap; } /* line 175, app/assets/stylesheets/ltags/GithubTag.scss */ .ltag-github-body p a.github-user-link:hover { color: #24292e; text-decoration: underline; } /* line 180, app/assets/stylesheets/ltags/GithubTag.scss */ .ltag-github-body code { border-radius: 3px; padding: 0.2em 5px 0px; margin: 0px; font-family: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, Courier, monospace; } /* line 188, app/assets/stylesheets/ltags/GithubTag.scss */ .ltag-github-body pre { width: 100% !important; margin: 0px; color: black; background-color: #f6f8fa; padding: 0; } /* line 194, app/assets/stylesheets/ltags/GithubTag.scss */ .ltag-github-body pre code { background-color: #f6f8fa; color: black; padding: 0em 0px 0px !important; line-height: 2em !important; } /* line 202, app/assets/stylesheets/ltags/GithubTag.scss */ .ltag-github-body .highlight pre, .ltag-github-body pre, .ltag-github-body pre code { padding: 16px !important; overflow: auto !important; font-size: 14px !important; margin-bottom: 16px !important; background-color: #f7f7f7 !important; border-radius: 3px !important; box-sizing: border-box !important; color: black !important; border-radius: 3px !important; margin: 0.95em 0 1.2em !important; } /* line 217, app/assets/stylesheets/ltags/GithubTag.scss */ .ltag-github-body .highlight { font-size: 14px !important; margin-bottom: 16px !important; border-radius: 3px !important; } /* line 223, app/assets/stylesheets/ltags/GithubTag.scss */ .ltag-github-body b, .ltag-github-body strong { font-weight: 600; } /* line 228, app/assets/stylesheets/ltags/GithubTag.scss */ .ltag-github-body .pl-c { color: #969896; } /* line 232, app/assets/stylesheets/ltags/GithubTag.scss */ .ltag-github-body .pl-c1, .ltag-github-body .pl-s .pl-v { color: #0086b3; } /* line 237, app/assets/stylesheets/ltags/GithubTag.scss */ .ltag-github-body .pl-e, .ltag-github-body .pl-en { color: #795da3; } /* line 242, app/assets/stylesheets/ltags/GithubTag.scss */ .ltag-github-body .pl-s .pl-s1, .ltag-github-body .pl-smi { color: #333; } /* line 247, app/assets/stylesheets/ltags/GithubTag.scss */ .ltag-github-body .pl-ent { color: #63a35c; } /* line 251, app/assets/stylesheets/ltags/GithubTag.scss */ .ltag-github-body .pl-k { color: #a71d5d; } /* line 255, app/assets/stylesheets/ltags/GithubTag.scss */ .ltag-github-body .pl-pds, .ltag-github-body .pl-s, .ltag-github-body .pl-s .pl-pse .pl-s1, .ltag-github-body .pl-sr, .ltag-github-body .pl-sr .pl-cce, .ltag-github-body .pl-sr .pl-sra, .ltag-github-body .pl-sr .pl-sre { color: #183691; } /* line 265, app/assets/stylesheets/ltags/GithubTag.scss */ .ltag-github-body .pl-v { color: #ed6a43; } /* line 269, app/assets/stylesheets/ltags/GithubTag.scss */ .ltag-github-body .pl-id { color: #b52a1d; } /* line 273, app/assets/stylesheets/ltags/GithubTag.scss */ .ltag-github-body .pl-ii { background-color: #b52a1d; color: #f8f8f8; } /* line 278, app/assets/stylesheets/ltags/GithubTag.scss */ .ltag-github-body .pl-sr .pl-cce { color: #63a35c; font-weight: bold; } /* line 283, app/assets/stylesheets/ltags/GithubTag.scss */ .ltag-github-body .pl-ml { color: #693a17; } /* line 287, app/assets/stylesheets/ltags/GithubTag.scss */ .ltag-github-body .pl-mh, .ltag-github-body .pl-mh .pl-en, .ltag-github-body .pl-ms { color: #1d3e81; font-weight: bold; } /* line 294, app/assets/stylesheets/ltags/GithubTag.scss */ .ltag-github-body .pl-mq { color: #008080; } /* line 298, app/assets/stylesheets/ltags/GithubTag.scss */ .ltag-github-body .pl-mi { color: #333; font-style: italic; } /* line 303, app/assets/stylesheets/ltags/GithubTag.scss */ .ltag-github-body .pl-mb { color: #333; font-weight: bold; } /* line 308, app/assets/stylesheets/ltags/GithubTag.scss */ .ltag-github-body .pl-md { background-color: #ffecec; color: #bd2c00; } /* line 313, app/assets/stylesheets/ltags/GithubTag.scss */ .ltag-github-body .pl-mi1 { background-color: #eaffea; color: #55a532; } /* line 318, app/assets/stylesheets/ltags/GithubTag.scss */ .ltag-github-body .pl-mdr { color: #795da3; font-weight: bold; } /* line 323, app/assets/stylesheets/ltags/GithubTag.scss */ .ltag-github-body .pl-mo { color: #1d3e81; } /* line 328, app/assets/stylesheets/ltags/GithubTag.scss */ .gh-btn-container { text-align: center; padding: 0.35em 0 1.35em; box-shadow: 0 0 60px 42px var(--card-bg); position: relative; z-index: var(--z-elevate); } /* line 1, app/assets/stylesheets/ltags/InstagramTag.scss */ #instagram-liquid-tag { background: white; border: 1px solid #dbdbdb; margin: 1px 1px 12px; min-width: 326px; max-width: 540px; width: calc(100% - 2px); height: 559px; border-radius: 3px; box-shadow: none; display: block; padding: 0px; } /* line 15, app/assets/stylesheets/ltags/InstagramTag.scss */ .instagram-position { position: relative; max-width: 540px; margin: 0 auto; } /* line 1, app/assets/stylesheets/ltags/KatexTag.scss */ .katex-element { overflow-x: auto; } /* line 3, app/assets/stylesheets/ltags/LinkTag.scss */ .ltag__link__link { color: var(--body-color) !important; } /* line 5, app/assets/stylesheets/ltags/LinkTag.scss */ .ltag__link__link:active { opacity: 0.7; } /* line 9, app/assets/stylesheets/ltags/LinkTag.scss */ .ltag__link { font-family: var(--ff-sans-serif); border: 1px solid var(--form-border); box-shadow: var(--shadow-smooth); border-radius: var(--radius-auto); display: block; margin: 0.95em 0 1.2em; max-width: 100%; } /* line 17, app/assets/stylesheets/ltags/LinkTag.scss */ .ltag__link .video-image { position: relative; padding-top: 56%; border-top-left-radius: 3px; border-top-right-radius: 3px; background: #0a0a0a no-repeat center center; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; display: block; } /* line 29, app/assets/stylesheets/ltags/LinkTag.scss */ .ltag__link .video-timestamp { position: absolute; font-size: 12px; bottom: 6px; right: 5px; background-color: rgba(0, 0, 0, 0.8); color: #ffffff; padding: 0px 5px 0px; font-weight: 500; border-radius: 3px; display: block; line-height: 20px; } /* line 41, app/assets/stylesheets/ltags/LinkTag.scss */ .ltag__link .video-timestamp img { height: 14px; width: 14px; display: inline-block; vertical-align: -2px; padding-left: 5px; } /* line 49, app/assets/stylesheets/ltags/LinkTag.scss */ .ltag__link .ltag__link__pic { display: inline-block; padding: calc(0.6vw + 8px) calc(0.8vw + 8px); padding-right: 8px; box-sizing: border-box; border-radius: var(--radius); } /* line 55, app/assets/stylesheets/ltags/LinkTag.scss */ .ltag__link .ltag__link__pic img { width: calc(1.2vw + 40px); height: calc(1.2vw + 40px); margin: auto auto !important; border-radius: 150px; box-sizing: border-box; max-width: 60px; max-height: 60px; } /* line 65, app/assets/stylesheets/ltags/LinkTag.scss */ .ltag__link .ltag__link__org__pic { border-radius: var(--radius); position: relative; display: inline-block; padding: calc(0.4vw + 8px) calc(0.8vw + 8px); padding-right: 10px; box-sizing: border-box; } /* line 72, app/assets/stylesheets/ltags/LinkTag.scss */ .ltag__link .ltag__link__org__pic::after { content: ''; opacity: 0.15; width: 100%; height: 100%; position: absolute; left: 0; top: 0; border-radius: var(--radius); pointer-events: none; box-sizing: border-box; } /* line 85, app/assets/stylesheets/ltags/LinkTag.scss */ .ltag__link .ltag__link__org__pic > img { display: inline-block; width: calc(2.2vw + 45px); height: calc(2.5vw + 40px); margin: auto auto !important; border-radius: var(--radius); box-sizing: border-box; max-width: 55px; max-height: 55px; } /* line 95, app/assets/stylesheets/ltags/LinkTag.scss */ .ltag__link .ltag__link__user__pic { display: inline-block; position: absolute; right: 3px; bottom: calc(1vw); border: 2px solid var(--base-inverted); border-radius: 100%; background-color: var(--card-color-tertiary); box-sizing: border-box; width: calc(2vw + 28px); height: calc(2vw + 28px); max-width: 38px; max-height: 38px; } /* line 108, app/assets/stylesheets/ltags/LinkTag.scss */ .ltag__link .ltag__link__user__pic img { display: inline-block; width: 100%; height: 100%; border-radius: 100%; margin: 0; } /* line 116, app/assets/stylesheets/ltags/LinkTag.scss */ .ltag__link .ltag__link__content { display: inline-block; vertical-align: top; padding: calc(0.7vw + 6px); padding-left: 0; width: calc(100% - 2.5vw - 70px); } /* line 122, app/assets/stylesheets/ltags/LinkTag.scss */ .ltag__link .ltag__link__content h2 { margin: 0; padding: 0; font-weight: var(--fw-bold); font-size: calc(1.45em + 0.2vw); line-height: var(--lh-tight); } /* line 129, app/assets/stylesheets/ltags/LinkTag.scss */ .ltag__link .ltag__link__content h3 { margin: calc(0.3vw + 1px) 0; padding: 0; font-size: var(--fs-s); font-weight: var(--fw-medium); color: var(--color); color: var(--card-color-tertiary); } /* line 136, app/assets/stylesheets/ltags/LinkTag.scss */ .ltag__link .ltag__link__content h3 a { color: var(--card-color-tertiary); } /* line 140, app/assets/stylesheets/ltags/LinkTag.scss */ .ltag__link .ltag__link__content .missing { padding: 0 10px !important; } /* line 143, app/assets/stylesheets/ltags/LinkTag.scss */ .ltag__link .ltag__link__content .ltag__link__taglist { margin: 0; padding: 0; line-height: 1; font-size: 0.88em; margin-bottom: 5px; color: var(--tag-color); } /* line 151, app/assets/stylesheets/ltags/LinkTag.scss */ .ltag__link .ltag__link__content .ltag__link__tag { margin-right: calc(0.4vw + 4px); font-size: 0.8em; margin-left: 1px; } /* line 156, app/assets/stylesheets/ltags/LinkTag.scss */ .ltag__link .ltag__link__content .ltag__link__servicename { color: var(--card-color-tertiary); font-size: 0.7em; } /* line 159, app/assets/stylesheets/ltags/LinkTag.scss */ .ltag__link .ltag__link__content .ltag__link__servicename img { vertical-align: -5px; height: 1.5em; width: 1.5em; display: inline-block; margin-left: 2px; } /* line 172, app/assets/stylesheets/ltags/LinkTag.scss */ .crayons-article-sticky .ltag__link .ltag__link__org__pic { width: 60px; height: 60px; } /* line 175, app/assets/stylesheets/ltags/LinkTag.scss */ .crayons-article-sticky .ltag__link .ltag__link__org__pic img { width: 33px; height: 33px; } /* line 180, app/assets/stylesheets/ltags/LinkTag.scss */ .crayons-article-sticky .ltag__link .ltag__link__user__pic { width: 19px; height: 19px; padding: 0 !important; } /* line 184, app/assets/stylesheets/ltags/LinkTag.scss */ .crayons-article-sticky .ltag__link .ltag__link__user__pic img { width: 15px; height: 15px; top: 0; position: absolute; } /* line 191, app/assets/stylesheets/ltags/LinkTag.scss */ .crayons-article-sticky .ltag__link .ltag__link__pic { width: 60px; height: 60px; } /* line 194, app/assets/stylesheets/ltags/LinkTag.scss */ .crayons-article-sticky .ltag__link .ltag__link__pic img { width: 33px; height: 33px; } /* line 199, app/assets/stylesheets/ltags/LinkTag.scss */ .crayons-article-sticky .ltag__link .ltag__link__content { width: calc(100% - 65px); } /* line 201, app/assets/stylesheets/ltags/LinkTag.scss */ .crayons-article-sticky .ltag__link .ltag__link__content h2 { font-size: 1.25em; line-height: 1.28em; } /* line 205, app/assets/stylesheets/ltags/LinkTag.scss */ .crayons-article-sticky .ltag__link .ltag__link__content h3 { margin-top: 4px !important; } /** * * Makes working with themeable CSS variables easier. * * $property: the CSS property to theme. * $cssVariable: The CSS variable that will store the themed value. * $fallback: The value to use as a fallback but as well for the CSS variable default value. */ /* Mixin for a load more wrapper, made by a container div and child button */ /** * * Generates the src property for @font-face. The mixin is required * so that webpack for Storybook and the application can both * generate the font URL correctly. * * $font: the font file name, e.g. 'OpenDyslexic-Regular.otf' */ /* line 4, app/assets/stylesheets/ltags/ListingTag.scss */ .ltag__listing { font-family: var(--ff-sans-serif); border: 1px solid #dbdbdb; box-shadow: 1px 2px 4px 0 rgba(0, 0, 0, 0.18); border-radius: 3px; display: block; margin: 0.95em 0 1.2em; max-width: 100%; } @media screen and (min-width: 760px) { /* line 4, app/assets/stylesheets/ltags/ListingTag.scss */ .ltag__listing { margin: 0.95em auto; width: 620px; } } /* line 17, app/assets/stylesheets/ltags/ListingTag.scss */ .ltag__listing .ltag__listing-content { padding: calc(0.5vw + 6px); } /* line 19, app/assets/stylesheets/ltags/ListingTag.scss */ .ltag__listing .ltag__listing-content h3 { margin: 0; padding: 0; font-weight: 500; font-size: 1.5em; } /* line 24, app/assets/stylesheets/ltags/ListingTag.scss */ .ltag__listing .ltag__listing-content h3 a { color: var(--body-color); } /* line 29, app/assets/stylesheets/ltags/ListingTag.scss */ .ltag__listing .ltag__listing-content .ltag__listing-body { max-width: 100%; margin: 5px 0 15px 0; font-size: 0.9em; } /* line 33, app/assets/stylesheets/ltags/ListingTag.scss */ .ltag__listing .ltag__listing-content .ltag__listing-body a { color: var(--body-color); } /* line 38, app/assets/stylesheets/ltags/ListingTag.scss */ .ltag__listing .ltag__listing-content .ltag__listing-tags { font-size: 0.7em; line-height: 1.3em; } /* line 42, app/assets/stylesheets/ltags/ListingTag.scss */ .ltag__listing .ltag__listing-content .ltag__listing-tags .ltag__listing-tag { margin-right: calc(0.4vw + 4px); margin-left: 1px; } /* line 46, app/assets/stylesheets/ltags/ListingTag.scss */ .ltag__listing .ltag__listing-content .ltag__listing-tags .ltag__listing-tag a { color: var(--card-color-secondary); display: inline-block; margin: 2px; padding: 2px 7px; border-radius: 3px; font-weight: bold; } /* line 57, app/assets/stylesheets/ltags/ListingTag.scss */ .ltag__listing .ltag__listing-content .ltag__listing-author-info { color: var(--card-color-tertiary); line-height: 1.3em; } /* line 60, app/assets/stylesheets/ltags/ListingTag.scss */ .ltag__listing .ltag__listing-content .ltag__listing-author-info a { margin: 0.1vw 0; padding: 0; font-size: 0.7em; margin-bottom: 0; font-weight: bold; color: var(--card-color-tertiary); } /* line 3, app/assets/stylesheets/ltags/PodcastTag.scss */ .podcastliquidtag { padding: 0px; margin-bottom: 20px; margin-top: 90px; border-radius: 3px; font-family: var(--ff-sans-serif); position: relative; display: flex; flex-direction: column-reverse; justify-content: flex-end; box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.5); } @media screen and (min-width: 830px) { /* line 3, app/assets/stylesheets/ltags/PodcastTag.scss */ .podcastliquidtag { flex-direction: row-reverse; margin: 20px 0; } } /* line 20, app/assets/stylesheets/ltags/PodcastTag.scss */ .podcastliquidtag .podcastliquidtag__info { color: white; font-weight: 500; margin: -5px 15px 10px; } @media screen and (min-width: 830px) { /* line 20, app/assets/stylesheets/ltags/PodcastTag.scss */ .podcastliquidtag .podcastliquidtag__info { margin: 20px 15px; width: 77%; } } /* line 30, app/assets/stylesheets/ltags/PodcastTag.scss */ .podcastliquidtag .podcastliquidtag__info a { color: white; text-decoration: none; } /* line 34, app/assets/stylesheets/ltags/PodcastTag.scss */ .podcastliquidtag .podcastliquidtag__info a .tinyimage { width: 22px; height: 22px; border-radius: 100%; margin-right: 10px; left: 0; float: left; } /* line 44, app/assets/stylesheets/ltags/PodcastTag.scss */ .podcastliquidtag .podcastliquidtag__info a:hover { color: white; } /* line 48, app/assets/stylesheets/ltags/PodcastTag.scss */ .podcastliquidtag .podcastliquidtag__info h1 { margin: 0px 0px 0.5em 0px; font-weight: 700; padding: 0; } /* line 54, app/assets/stylesheets/ltags/PodcastTag.scss */ .podcastliquidtag .podcastliquidtag__info .podcastliquidtag__info__episodetitle { font-size: calc(1.8vw + 19px); } /* line 57, app/assets/stylesheets/ltags/PodcastTag.scss */ .podcastliquidtag .podcastliquidtag__info .podcastliquidtag__info__podcasttitle { font-size: calc(1.2vw + 14px); padding: 0px 0px; font-weight: 500; margin-top: -5px; } /* line 62, app/assets/stylesheets/ltags/PodcastTag.scss */ .podcastliquidtag .podcastliquidtag__info .podcastliquidtag__info__podcasttitle button { font-size: 25px; border-radius: 3px; border: 0px; width: 100%; margin-top: 15px; padding: 20px 0px; } @media screen and (min-width: 950px) { /* line 62, app/assets/stylesheets/ltags/PodcastTag.scss */ .podcastliquidtag .podcastliquidtag__info .podcastliquidtag__info__podcasttitle button { font-size: calc(1.2vw + 16px); margin-left: 5px; display: inline-block; width: 220px; padding: 5px 0px; } } @media screen and (min-width: 950px) { /* line 80, app/assets/stylesheets/ltags/PodcastTag.scss */ .podcastliquidtag .podcastliquidtag__info .podcastliquidtag__info__episodetitle { font-size: 38px; } /* line 83, app/assets/stylesheets/ltags/PodcastTag.scss */ .podcastliquidtag .podcastliquidtag__info .podcastliquidtag__info__podcasttitle { font-size: 24px; } /* line 85, app/assets/stylesheets/ltags/PodcastTag.scss */ .podcastliquidtag .podcastliquidtag__info .podcastliquidtag__info__podcasttitle button { font-size: 22px; width: 165px; } } /* line 92, app/assets/stylesheets/ltags/PodcastTag.scss */ .podcastliquidtag .podcastliquidtag__info .podcastliquidtag__links { display: flex; flex-direction: row; font-size: 14px; } /* line 96, app/assets/stylesheets/ltags/PodcastTag.scss */ .podcastliquidtag .podcastliquidtag__info .podcastliquidtag__links a { margin-right: 10px; background-color: #292e34; color: white; border-radius: 3px; font-size: 13px; font-weight: 400; width: 100px; border: 1px solid #3c5163; box-shadow: inset 1px 1px 0 #485f74; transition: background-color 250ms ease; text-align: center; } /* line 109, app/assets/stylesheets/ltags/PodcastTag.scss */ .podcastliquidtag .podcastliquidtag__info .podcastliquidtag__links a:hover { background-color: #202429; } /* line 113, app/assets/stylesheets/ltags/PodcastTag.scss */ .podcastliquidtag .podcastliquidtag__info .podcastliquidtag__links a img { display: inline; width: 16px; height: 16px; left: 0; margin-right: 5px; vertical-align: middle; } /* line 121, app/assets/stylesheets/ltags/PodcastTag.scss */ .podcastliquidtag .podcastliquidtag__info .podcastliquidtag__links a .service-name { display: none; } @media screen and (min-width: 630px) { /* line 125, app/assets/stylesheets/ltags/PodcastTag.scss */ .podcastliquidtag .podcastliquidtag__info .podcastliquidtag__links a .service-name { display: inline-block; } } /* line 133, app/assets/stylesheets/ltags/PodcastTag.scss */ .podcastliquidtag .podcastliquidtag__record { position: relative; margin: 20px 20px; height: 70px; transform: translateY(-33px); } @media screen and (min-width: 830px) { /* line 133, app/assets/stylesheets/ltags/PodcastTag.scss */ .podcastliquidtag .podcastliquidtag__record { width: 15%; height: inherit; transform: none; } } /* line 145, app/assets/stylesheets/ltags/PodcastTag.scss */ .podcastliquidtag .podcastliquidtag__record:hover { cursor: pointer; } /* line 149, app/assets/stylesheets/ltags/PodcastTag.scss */ .podcastliquidtag .podcastliquidtag__record img { max-width: 100%; } /* line 153, app/assets/stylesheets/ltags/PodcastTag.scss */ .podcastliquidtag .podcastliquidtag__record .pause-butt { display: none; } /* line 157, app/assets/stylesheets/ltags/PodcastTag.scss */ .podcastliquidtag .podcastliquidtag__record .podcastliquidtag__podcastimage { border-radius: 100%; position: absolute; z-index: 1; top: 0; bottom: 0; left: 0; right: 0; box-shadow: 0px 0px 40px rgba(0, 0, 0, 0.5); height: 130px; background: #0a0a0a; margin: auto; animation: var(--podcast-spinning-animation); -webkit-backface-visibility: hidden; animation-play-state: paused; } @media screen and (min-width: 830px) { /* line 157, app/assets/stylesheets/ltags/PodcastTag.scss */ .podcastliquidtag .podcastliquidtag__record .podcastliquidtag__podcastimage { height: inherit; } } /* line 178, app/assets/stylesheets/ltags/PodcastTag.scss */ .podcastliquidtag .podcastliquidtag__record .button { position: absolute; height: 115px; z-index: 2; top: 0; bottom: 0; left: 0; right: 0; margin: auto; } @media screen and (min-width: 830px) { /* line 178, app/assets/stylesheets/ltags/PodcastTag.scss */ .podcastliquidtag .podcastliquidtag__record .button { height: 75px; } } /* line 195, app/assets/stylesheets/ltags/PodcastTag.scss */ .podcastliquidtag .playing .podcastliquidtag__podcastimage { animation-play-state: running; } /* line 199, app/assets/stylesheets/ltags/PodcastTag.scss */ .podcastliquidtag .playing .play-butt { display: none; } /* line 203, app/assets/stylesheets/ltags/PodcastTag.scss */ .podcastliquidtag .playing .pause-butt { display: block; } @keyframes spin { 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } /** * * Makes working with themeable CSS variables easier. * * $property: the CSS property to theme. * $cssVariable: The CSS variable that will store the themed value. * $fallback: The value to use as a fallback but as well for the CSS variable default value. */ /* Mixin for a load more wrapper, made by a container div and child button */ /** * * Generates the src property for @font-face. The mixin is required * so that webpack for Storybook and the application can both * generate the font URL correctly. * * $font: the font file name, e.g. 'OpenDyslexic-Regular.otf' */ /* line 4, app/assets/stylesheets/ltags/PollTag.scss */ .ltag-poll { width: 600px; max-width: 96%; margin: auto; border-radius: 3px; border: 1px solid #dbdbdb !important; box-shadow: 1px 2px 4px 0 rgba(0, 0, 0, 0.18); box-sizing: border-box; padding: 2px 15px 18px; font-family: var(--ff-sans-serif); margin: 1.6em auto !important; } /* line 15, app/assets/stylesheets/ltags/PollTag.scss */ .ltag-poll h3 { margin: 15px 0px; } /* line 18, app/assets/stylesheets/ltags/PollTag.scss */ .ltag-poll .ltag-pollanswers { list-style-type: none !important; margin: 0 !important; /* To remove default bottom margin */ padding: 0 !important; padding-bottom: 8px !important; font-size: 0.9em !important; } /* line 24, app/assets/stylesheets/ltags/PollTag.scss */ .ltag-poll .ltag-pollanswers li { padding-left: 8px; border-radius: 3px; width: 95%; position: relative; } /* line 29, app/assets/stylesheets/ltags/PollTag.scss */ .ltag-poll .ltag-pollanswers li:hover { background: #f5f6f7; background: var(--theme-container-background-hover, #f5f6f7); } /* line 36, app/assets/stylesheets/ltags/PollTag.scss */ .ltag-poll .ltag-pollanswers li.ltag-polloption-justshowmetheresults:hover { background: transparent; } /* line 39, app/assets/stylesheets/ltags/PollTag.scss */ .ltag-poll .ltag-pollanswers li.already-voted { background: transparent; } /* line 43, app/assets/stylesheets/ltags/PollTag.scss */ .ltag-poll .ltag-pollanswers input { vertical-align: top; margin-top: 1.05em; } /* line 47, app/assets/stylesheets/ltags/PollTag.scss */ .ltag-poll .ltag-pollanswers label { width: calc(100% - 40px); padding: 2px 6px; cursor: pointer; vertical-align: -3px; display: inline-block; line-height: 1.25em; } /* line 55, app/assets/stylesheets/ltags/PollTag.scss */ .ltag-poll .ltag-pollanswers .ltag-voting-results-count { font-size: 0.7em; color: #666666; text-align: left; } /* line 60, app/assets/stylesheets/ltags/PollTag.scss */ .ltag-poll .ltag-pollanswers button { width: 100%; background: transparent; border: 0px; font-size: 0.7em; color: #666666; text-align: left; padding-left: 20px; } /* line 69, app/assets/stylesheets/ltags/PollTag.scss */ .ltag-poll .ltag-pollanswers .ltag-votepercent { display: inline-block; position: absolute; top: 0; left: 0; bottom: 0; z-index: 3; border-radius: 3px; } /* line 77, app/assets/stylesheets/ltags/PollTag.scss */ .ltag-poll .ltag-pollanswers .ltag-votepercent.ltag-optionvotedfor { background: #66e2d5; font-weight: bold; } /* line 81, app/assets/stylesheets/ltags/PollTag.scss */ .ltag-poll .ltag-pollanswers .ltag-votepercent.ltag-optionnotvotedfor { background: #dbdbdb; background: var(--theme-container-accent-background, #dbdbdb); } /* line 89, app/assets/stylesheets/ltags/PollTag.scss */ .ltag-poll .ltag-pollanswers .ltag-votepercenttext { position: relative; z-index: 5; } /* line 3, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn, .ltag__wikipedia--container .ltag__wikipedia--btn, .ltag__stackexchange--container .ltag__stackexchange--btn, .ltag__reddit--container .ltag__reddit--btn, .gh-btn-container .gh-btn { --brand-apple-bg: #000; --brand-apple-color: #fff; --brand-apple-bg-hover: #1b1b1b; --brand-twitter-bg: #1da1f2; --brand-twitter-color: #fff; --brand-twitter-bg-hover: #0096f2; --brand-github-bg: #24292e; --brand-github-color: #fff; --brand-github-bg-hover: #000; --brand-facebook-bg: #4267b2; --brand-facebook-color: #fff; --brand-facebook-bg-hover: #476fbf; --brand-forem-bg: #0a3e4a; --brand-forem-color: #fff; --brand-forem-bg-hover: #05313b; --brand-email-bg: #24292e; --brand-email-color: #fff; --brand-email-bg-hover: #000; --brand-google_oauth2-bg: #1da1f2; --brand-google_oauth2-color: #fff; --brand-google_oauth2-bg-hover: #0096f2; } /* line 34, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn, .ltag__wikipedia--container .ltag__wikipedia--btn, .ltag__stackexchange--container .ltag__stackexchange--btn, .ltag__reddit--container .ltag__reddit--btn, .gh-btn-container .gh-btn { --border-width: 0px; --shadow-color: rgba(0, 0, 0, 0.05); --vertical-padding: var(--su-2); --horizontal-padding: var(--su-4); --font-size: var(--fs-base); --with-icon-padding: var(--su-3); --icon-margin: var(--su-2); position: relative; display: inline-block; padding: calc(var(--vertical-padding) - var(--border-width)) calc(var(--horizontal-padding) - var(--border-width)); border-radius: var(--radius); font-family: inherit; font-size: var(--font-size); line-height: var(--su-6); font-weight: var(--fw-medium); text-align: center; text-decoration: none; cursor: pointer; transition: all var(--transition-props); border: var(--border-width) solid; overflow-wrap: normal; --bg: var(--button-primary-bg); --bg-hover: var(--button-primary-bg-hover); --border: transparent; --border-hover: transparent; --color: var(--button-primary-color); --color-hover: var(--button-primary-color-hover); --shadow: 0 1px 3px var(--shadow-color); --shadow-hover: 0 2px 5px var(--shadow-color); --bg-inverted: var(--button-primary-inverted-bg); --bg-inverted-hover: var(--button-primary-inverted-bg-hover); --color-inverted: var(--button-primary-inverted-color); --color-inverted-hover: var(--button-primary-inverted-color-hover); background-color: var(--bg); border-color: var(--border); box-shadow: var(--shadow); color: var(--color); } /* line 79, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn[href]:hover, .ltag__wikipedia--container .ltag__wikipedia--btn[href]:hover, .ltag__stackexchange--container .ltag__stackexchange--btn[href]:hover, .ltag__reddit--container .ltag__reddit--btn[href]:hover, .gh-btn-container .gh-btn[href]:hover, .crayons-btn[href]:focus, .ltag__wikipedia--container .ltag__wikipedia--btn[href]:focus, .ltag__stackexchange--container .ltag__stackexchange--btn[href]:focus, .ltag__reddit--container .ltag__reddit--btn[href]:focus, .gh-btn-container .gh-btn[href]:focus, .crayons-btn:hover:enabled, .ltag__wikipedia--container .ltag__wikipedia--btn:hover:enabled, .ltag__stackexchange--container .ltag__stackexchange--btn:hover:enabled, .ltag__reddit--container .ltag__reddit--btn:hover:enabled, .gh-btn-container .gh-btn:hover:enabled, .crayons-btn:active:enabled, .ltag__wikipedia--container .ltag__wikipedia--btn:active:enabled, .ltag__stackexchange--container .ltag__stackexchange--btn:active:enabled, .ltag__reddit--container .ltag__reddit--btn:active:enabled, .gh-btn-container .gh-btn:active:enabled { background-color: var(--bg-hover); border-color: var(--border-hover); box-shadow: var(--shadow-hover); color: var(--color-hover); z-index: var(--z-elevate); } /* line 90, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn.crayons-btn--inverted, .ltag__wikipedia--container .crayons-btn--inverted.ltag__wikipedia--btn, .ltag__stackexchange--container .crayons-btn--inverted.ltag__stackexchange--btn, .ltag__reddit--container .crayons-btn--inverted.ltag__reddit--btn, .gh-btn-container .crayons-btn--inverted.gh-btn { --bg: var(--bg-inverted); --bg-hover: var(--bg-inverted-hover); --border: var(--border-inverted); --border-hover: var(--border-inverted-hover); --color: var(--color-inverted); --color-hover: var(--color-inverted-hover); } /* line 99, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn[disabled], .ltag__wikipedia--container .ltag__wikipedia--btn[disabled], .ltag__stackexchange--container .ltag__stackexchange--btn[disabled], .ltag__reddit--container .ltag__reddit--btn[disabled], .gh-btn-container .gh-btn[disabled] { opacity: 0.6; cursor: not-allowed; } /* line 104, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--s { --vertical-padding: var(--su-1); --horizontal-padding: var(--su-3); --font-size: var(--fs-s); --with-icon-padding: var(--su-2); --icon-margin: var(--su-1); font-weight: normal; } /* line 113, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--l { --vertical-padding: var(--su-3); --horizontal-padding: var(--su-5); --with-icon-padding: var(--su-3); --icon-margin: var(--su-2); } /* line 120, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--xl { --vertical-padding: var(--su-4); --horizontal-padding: var(--su-6); --font-size: var(--fs-l); --with-icon-padding: var(--su-5); --icon-margin: var(--su-3); } /* line 130, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn > *, .ltag__wikipedia--container .ltag__wikipedia--btn > *, .ltag__stackexchange--container .ltag__stackexchange--btn > *, .ltag__reddit--container .ltag__reddit--btn > *, .gh-btn-container .gh-btn > * { pointer-events: none; } /* line 132, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn > * + input, .ltag__wikipedia--container .ltag__wikipedia--btn > * + input, .ltag__stackexchange--container .ltag__stackexchange--btn > * + input, .ltag__reddit--container .ltag__reddit--btn > * + input, .gh-btn-container .gh-btn > * + input { pointer-events: revert; } /* line 138, app/assets/stylesheets/ltags/../components/buttons.scss */ .js-focus-visible .crayons-btn.focus-visible:focus, .js-focus-visible .ltag__wikipedia--container .focus-visible.ltag__wikipedia--btn:focus, .ltag__wikipedia--container .js-focus-visible .focus-visible.ltag__wikipedia--btn:focus, .js-focus-visible .ltag__stackexchange--container .focus-visible.ltag__stackexchange--btn:focus, .ltag__stackexchange--container .js-focus-visible .focus-visible.ltag__stackexchange--btn:focus, .js-focus-visible .ltag__reddit--container .focus-visible.ltag__reddit--btn:focus, .ltag__reddit--container .js-focus-visible .focus-visible.ltag__reddit--btn:focus, .js-focus-visible .gh-btn-container .focus-visible.gh-btn:focus, .gh-btn-container .js-focus-visible .focus-visible.gh-btn:focus, .js-focus-visible .crayons-btn.focus-visible:focus-within, .js-focus-visible .ltag__wikipedia--container .focus-visible.ltag__wikipedia--btn:focus-within, .ltag__wikipedia--container .js-focus-visible .focus-visible.ltag__wikipedia--btn:focus-within, .js-focus-visible .ltag__stackexchange--container .focus-visible.ltag__stackexchange--btn:focus-within, .ltag__stackexchange--container .js-focus-visible .focus-visible.ltag__stackexchange--btn:focus-within, .js-focus-visible .ltag__reddit--container .focus-visible.ltag__reddit--btn:focus-within, .ltag__reddit--container .js-focus-visible .focus-visible.ltag__reddit--btn:focus-within, .js-focus-visible .gh-btn-container .focus-visible.gh-btn:focus-within, .gh-btn-container .js-focus-visible .focus-visible.gh-btn:focus-within, label[class*='crayons-btn']:focus-within { background-color: var(--bg-hover); border-color: var(--border-hover); box-shadow: var(--shadow-hover); color: var(--color-hover); z-index: var(--z-elevate); } /* line 149, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--secondary, .ltag__wikipedia--container .ltag__wikipedia--btn, .ltag__stackexchange--container .ltag__stackexchange--btn, .ltag__reddit--container .ltag__reddit--btn, .gh-btn-container .gh-btn { --bg: var(--button-secondary-bg); --bg-hover: var(--button-secondary-bg-hover); --color: var(--button-secondary-color); --color-hover: var(--button-secondary-color-hover); } /* line 156, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--outlined { --bg: var(--button-outlined-bg); --bg-hover: var(--button-outlined-bg-hover); --border: var(--button-outlined-border); --border-hover: var(--button-outlined-border-hover); --color: var(--button-outlined-color); --color-hover: var(--button-outlined-color-hover); --border-width: 2px; } /* line 167, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--danger { --bg: var(--accent-danger); --bg-hover: var(--accent-danger-darker); --color: var(--base-inverted); --color-hover: var(--base-inverted); --bg-inverted: var(--accent-danger); --bg-inverted-hover: var(--accent-danger-darker); --color-inverted: var(--base-inverted); --color-inverted-hover: var(--base-inverted); } /* line 178, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--success { --bg: var(--accent-success); --bg-hover: var(--accent-success-darker); --color: var(--base-inverted); --color-hover: var(--base-inverted); --bg-inverted: var(--accent-success); --bg-inverted-hover: var(--accent-success-darker); --color-inverted: var(--base-inverted); --color-inverted-hover: var(--base-inverted); } /* line 189, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--warning { --bg: var(--accent-warning); --bg-hover: var(--accent-warning-darker); --color: var(--base-inverted); --color-hover: var(--base-inverted); --bg-inverted: var(--accent-warning); --bg-inverted-hover: var(--accent-warning-darker); --color-inverted: var(--base-inverted); --color-inverted-hover: var(--base-inverted); } /* line 200, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--ghost { --bg: var(--button-ghost-bg); --bg-hover: var(--button-ghost-bg-hover); --color: var(--button-ghost-color); --color-hover: var(--button-ghost-color-hover); --shadow: none; --shadow-hover: none; --bg-inverted: var(--button-ghost-inverted-bg); --bg-inverted-hover: var(--button-ghost-inverted-bg-hover); --color-inverted: var(--button-ghost-inverted-color); --color-inverted-hover: var(--button-ghost-inverted-color-hover); } /* line 212, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--ghost-brand { --bg: var(--button-ghost-bg); --bg-hover: var(--button-ghost-bg-hover); --color: var(--accent-brand); --color-hover: var(--accent-brand-darker); --shadow: none; --shadow-hover: none; } /* line 221, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--ghost-dimmed { --bg: var(--button-ghost-bg); --bg-hover: var(--button-ghost-bg-hover); --color: var(--button-ghost-dimmed-color); --color-hover: var(--button-ghost-dimmed-color-hover); --shadow: none; --shadow-hover: none; } /* line 230, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--ghost-success { --bg: var(--button-ghost-bg); --bg-hover: var(--button-ghost-bg-hover); --color: var(--accent-success); --color-hover: var(--accent-success-darker); --shadow: none; --shadow-hover: none; --bg-inverted: var(--button-ghost-inverted-bg); --bg-inverted-hover: var(--button-ghost-inverted-bg-hover); --color-inverted: var(--accent-success); --color-inverted-hover: var(--accent-success-darker); } /* line 243, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--ghost-danger { --bg: var(--button-ghost-bg); --bg-hover: var(--button-ghost-bg-hover); --color: var(--accent-danger); --color-hover: var(--accent-danger-darker); --shadow: none; --shadow-hover: none; } /* line 253, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--brand-apple { --bg: var(--brand-apple-bg); --bg-hover: var(--brand-apple-bg-hover); --color: var(--brand-apple-color); --color-hover: var(--brand-apple-color); --bg-inverted: var(--brand-apple-bg); --bg-inverted-hover: var(--brand-apple-bg-hover); --color-inverted: var(--brand-apple-color); --color-inverted-hover: var(--brand-apple-color); } /* line 264, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--brand-twitter { --bg: var(--brand-twitter-bg); --bg-hover: var(--brand-twitter-bg-hover); --color: var(--brand-twitter-color); --color-hover: var(--brand-twitter-color); --bg-inverted: var(--brand-twitter-bg); --bg-inverted-hover: var(--brand-twitter-bg-hover); --color-inverted: var(--brand-twitter-color); --color-inverted-hover: var(--brand-twitter-color); } /* line 275, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--brand-github { --bg: var(--brand-github-bg); --bg-hover: var(--brand-github-bg-hover); --color: var(--brand-github-color); --color-hover: var(--brand-github-color); --bg-inverted: var(--brand-github-bg); --bg-inverted-hover: var(--brand-github-bg-hover); --color-inverted: var(--brand-github-color); --color-inverted-hover: var(--brand-github-color); } /* line 286, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--brand-facebook { --bg: var(--brand-facebook-bg); --bg-hover: var(--brand-facebook-bg-hover); --color: var(--brand-facebook-color); --color-hover: var(--brand-facebook-color); --bg-inverted: var(--brand-facebook-bg); --bg-inverted-hover: var(--brand-facebook-bg-hover); --color-inverted: var(--brand-facebook-color); --color-inverted-hover: var(--brand-facebook-color); } /* line 297, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--brand-forem { --bg: var(--brand-forem-bg); --bg-hover: var(--brand-forem-bg-hover); --color: var(--brand-forem-color); --color-hover: var(--brand-forem-color); --bg-inverted: var(--brand-forem-bg); --bg-inverted-hover: var(--brand-forem-bg-hover); --color-inverted: var(--brand-forem-color); --color-inverted-hover: var(--brand-forem-color); } /* line 308, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--brand-email { --bg: var(--brand-email-bg); --bg-hover: var(--brand-email-bg-hover); --color: var(--brand-email-color); --color-hover: var(--brand-email-color); --bg-inverted: var(--brand-email-bg); --bg-inverted-hover: var(--brand-email-bg-hover); --color-inverted: var(--brand-email-color); --color-inverted-hover: var(--brand-email-color); } /* line 319, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--brand-google_oauth2 { --bg: var(--brand-google_oauth2-bg); --bg-hover: var(--brand-google_oauth2-bg-hover); --color: var(--brand-google_oauth2-color); --color-hover: var(--brand-google_oauth2-color); --bg-inverted: var(--brand-google_oauth2-bg); --bg-inverted-hover: var(--brand-google_oauth2-bg-hover); --color-inverted: var(--brand-google_oauth2-color); --color-inverted-hover: var(--brand-google_oauth2-color); } /* line 331, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--icon, .crayons-btn--icon-rounded { --horizontal-padding: var(--su-2); padding-left: calc(var(--horizontal-padding) - var(--border-width)); padding-right: calc(var(--horizontal-padding) - var(--border-width)); } /* line 336, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--icon.crayons-btn--s, .crayons-btn--icon-rounded.crayons-btn--s { --horizontal-padding: var(--su-1); } /* line 340, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--icon.crayons-btn--l, .crayons-btn--icon-rounded.crayons-btn--l { --horizontal-padding: var(--su-3); } /* line 344, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--icon.crayons-btn--xl, .crayons-btn--icon-rounded.crayons-btn--xl { --horizontal-padding: var(--su-4); } /* line 349, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--icon-rounded { border-radius: 1000px; } /* line 354, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--icon-left { padding-left: calc(var(--with-icon-padding) - var(--border-width)); } /* line 357, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--icon-left .crayons-icon { margin-right: var(--icon-margin); } /* line 363, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--icon-right { padding-right: calc(var(--with-icon-padding) - var(--border-width)); } /* line 366, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--icon-right .crayons-icon { margin-left: var(--icon-margin); } /* line 371, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn-actions { --btn-wrap-gap: var(--su-2); display: flex; flex-wrap: wrap; align-items: center; margin-bottom: calc(0rem - var(--btn-wrap-gap)); margin-left: calc(0rem - var(--btn-wrap-gap)); } /* line 380, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn-actions .crayons-btn, .crayons-btn-actions .ltag__wikipedia--container .ltag__wikipedia--btn, .ltag__wikipedia--container .crayons-btn-actions .ltag__wikipedia--btn, .crayons-btn-actions .ltag__stackexchange--container .ltag__stackexchange--btn, .ltag__stackexchange--container .crayons-btn-actions .ltag__stackexchange--btn, .crayons-btn-actions .ltag__reddit--container .ltag__reddit--btn, .ltag__reddit--container .crayons-btn-actions .ltag__reddit--btn, .crayons-btn-actions .gh-btn-container .gh-btn, .gh-btn-container .crayons-btn-actions .gh-btn { margin-left: var(--btn-wrap-gap); margin-bottom: var(--btn-wrap-gap); } /* line 387, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn-group { display: flex; } /* line 390, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn-group .crayons-btn, .crayons-btn-group .ltag__wikipedia--container .ltag__wikipedia--btn, .ltag__wikipedia--container .crayons-btn-group .ltag__wikipedia--btn, .crayons-btn-group .ltag__stackexchange--container .ltag__stackexchange--btn, .ltag__stackexchange--container .crayons-btn-group .ltag__stackexchange--btn, .crayons-btn-group .ltag__reddit--container .ltag__reddit--btn, .ltag__reddit--container .crayons-btn-group .ltag__reddit--btn, .crayons-btn-group .gh-btn-container .gh-btn, .gh-btn-container .crayons-btn-group .gh-btn { border-radius: 0; } /* line 393, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn-group .crayons-btn + .crayons-btn:not(.crayons-btn--outlined), .crayons-btn-group .ltag__wikipedia--container .ltag__wikipedia--btn + .crayons-btn:not(.crayons-btn--outlined), .ltag__wikipedia--container .crayons-btn-group .ltag__wikipedia--btn + .crayons-btn:not(.crayons-btn--outlined), .crayons-btn-group .ltag__wikipedia--container .crayons-btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined), .ltag__wikipedia--container .crayons-btn-group .crayons-btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined), .crayons-btn-group .ltag__wikipedia--container .ltag__wikipedia--btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined), .ltag__wikipedia--container .crayons-btn-group .ltag__wikipedia--btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined), .crayons-btn-group .ltag__stackexchange--container .ltag__stackexchange--btn + .crayons-btn:not(.crayons-btn--outlined), .crayons-btn-group .ltag__stackexchange--container .ltag__wikipedia--container .ltag__stackexchange--btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined), .ltag__wikipedia--container .crayons-btn-group .ltag__stackexchange--container .ltag__stackexchange--btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined), .ltag__stackexchange--container .crayons-btn-group .ltag__stackexchange--btn + .crayons-btn:not(.crayons-btn--outlined), .ltag__stackexchange--container .crayons-btn-group .ltag__wikipedia--container .ltag__stackexchange--btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined), .ltag__wikipedia--container .ltag__stackexchange--container .crayons-btn-group .ltag__stackexchange--btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined), .crayons-btn-group .ltag__stackexchange--container .crayons-btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined), .crayons-btn-group .ltag__stackexchange--container .ltag__wikipedia--container .ltag__wikipedia--btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined), .ltag__wikipedia--container .crayons-btn-group .ltag__stackexchange--container .ltag__wikipedia--btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined), .ltag__stackexchange--container .crayons-btn-group .crayons-btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined), .ltag__stackexchange--container .crayons-btn-group .ltag__wikipedia--container .ltag__wikipedia--btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined), .ltag__wikipedia--container .ltag__stackexchange--container .crayons-btn-group .ltag__wikipedia--btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined), .crayons-btn-group .ltag__stackexchange--container .ltag__stackexchange--btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined), .ltag__stackexchange--container .crayons-btn-group .ltag__stackexchange--btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined), .crayons-btn-group .ltag__reddit--container .ltag__reddit--btn + .crayons-btn:not(.crayons-btn--outlined), .crayons-btn-group .ltag__reddit--container .ltag__wikipedia--container .ltag__reddit--btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined), .ltag__wikipedia--container .crayons-btn-group .ltag__reddit--container .ltag__reddit--btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined), .crayons-btn-group .ltag__reddit--container .ltag__stackexchange--container .ltag__reddit--btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined), .ltag__stackexchange--container .crayons-btn-group .ltag__reddit--container .ltag__reddit--btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined), .ltag__reddit--container .crayons-btn-group .ltag__reddit--btn + .crayons-btn:not(.crayons-btn--outlined), .ltag__reddit--container .crayons-btn-group .ltag__wikipedia--container .ltag__reddit--btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined), .ltag__wikipedia--container .ltag__reddit--container .crayons-btn-group .ltag__reddit--btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined), .ltag__reddit--container .crayons-btn-group .ltag__stackexchange--container .ltag__reddit--btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined), .ltag__stackexchange--container .ltag__reddit--container .crayons-btn-group .ltag__reddit--btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined), .crayons-btn-group .ltag__reddit--container .crayons-btn + .ltag__reddit--btn:not(.crayons-btn--outlined), .crayons-btn-group .ltag__reddit--container .ltag__wikipedia--container .ltag__wikipedia--btn + .ltag__reddit--btn:not(.crayons-btn--outlined), .ltag__wikipedia--container .crayons-btn-group .ltag__reddit--container .ltag__wikipedia--btn + .ltag__reddit--btn:not(.crayons-btn--outlined), .crayons-btn-group .ltag__reddit--container .ltag__stackexchange--container .ltag__stackexchange--btn + .ltag__reddit--btn:not(.crayons-btn--outlined), .ltag__stackexchange--container .crayons-btn-group .ltag__reddit--container .ltag__stackexchange--btn + .ltag__reddit--btn:not(.crayons-btn--outlined), .ltag__reddit--container .crayons-btn-group .crayons-btn + .ltag__reddit--btn:not(.crayons-btn--outlined), .ltag__reddit--container .crayons-btn-group .ltag__wikipedia--container .ltag__wikipedia--btn + .ltag__reddit--btn:not(.crayons-btn--outlined), .ltag__wikipedia--container .ltag__reddit--container .crayons-btn-group .ltag__wikipedia--btn + .ltag__reddit--btn:not(.crayons-btn--outlined), .ltag__reddit--container .crayons-btn-group .ltag__stackexchange--container .ltag__stackexchange--btn + .ltag__reddit--btn:not(.crayons-btn--outlined), .ltag__stackexchange--container .ltag__reddit--container .crayons-btn-group .ltag__stackexchange--btn + .ltag__reddit--btn:not(.crayons-btn--outlined), .crayons-btn-group .ltag__reddit--container .ltag__reddit--btn + .ltag__reddit--btn:not(.crayons-btn--outlined), .ltag__reddit--container .crayons-btn-group .ltag__reddit--btn + .ltag__reddit--btn:not(.crayons-btn--outlined), .crayons-btn-group .gh-btn-container .gh-btn + .crayons-btn:not(.crayons-btn--outlined), .crayons-btn-group .gh-btn-container .ltag__wikipedia--container .gh-btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined), .ltag__wikipedia--container .crayons-btn-group .gh-btn-container .gh-btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined), .crayons-btn-group .gh-btn-container .ltag__stackexchange--container .gh-btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined), .ltag__stackexchange--container .crayons-btn-group .gh-btn-container .gh-btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined), .crayons-btn-group .gh-btn-container .ltag__reddit--container .gh-btn + .ltag__reddit--btn:not(.crayons-btn--outlined), .ltag__reddit--container .crayons-btn-group .gh-btn-container .gh-btn + .ltag__reddit--btn:not(.crayons-btn--outlined), .gh-btn-container .crayons-btn-group .gh-btn + .crayons-btn:not(.crayons-btn--outlined), .gh-btn-container .crayons-btn-group .ltag__wikipedia--container .gh-btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined), .ltag__wikipedia--container .gh-btn-container .crayons-btn-group .gh-btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined), .gh-btn-container .crayons-btn-group .ltag__stackexchange--container .gh-btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined), .ltag__stackexchange--container .gh-btn-container .crayons-btn-group .gh-btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined), .gh-btn-container .crayons-btn-group .ltag__reddit--container .gh-btn + .ltag__reddit--btn:not(.crayons-btn--outlined), .ltag__reddit--container .gh-btn-container .crayons-btn-group .gh-btn + .ltag__reddit--btn:not(.crayons-btn--outlined), .crayons-btn-group .gh-btn-container .crayons-btn + .gh-btn:not(.crayons-btn--outlined), .crayons-btn-group .gh-btn-container .ltag__wikipedia--container .ltag__wikipedia--btn + .gh-btn:not(.crayons-btn--outlined), .ltag__wikipedia--container .crayons-btn-group .gh-btn-container .ltag__wikipedia--btn + .gh-btn:not(.crayons-btn--outlined), .crayons-btn-group .gh-btn-container .ltag__stackexchange--container .ltag__stackexchange--btn + .gh-btn:not(.crayons-btn--outlined), .ltag__stackexchange--container .crayons-btn-group .gh-btn-container .ltag__stackexchange--btn + .gh-btn:not(.crayons-btn--outlined), .crayons-btn-group .gh-btn-container .ltag__reddit--container .ltag__reddit--btn + .gh-btn:not(.crayons-btn--outlined), .ltag__reddit--container .crayons-btn-group .gh-btn-container .ltag__reddit--btn + .gh-btn:not(.crayons-btn--outlined), .gh-btn-container .crayons-btn-group .crayons-btn + .gh-btn:not(.crayons-btn--outlined), .gh-btn-container .crayons-btn-group .ltag__wikipedia--container .ltag__wikipedia--btn + .gh-btn:not(.crayons-btn--outlined), .ltag__wikipedia--container .gh-btn-container .crayons-btn-group .ltag__wikipedia--btn + .gh-btn:not(.crayons-btn--outlined), .gh-btn-container .crayons-btn-group .ltag__stackexchange--container .ltag__stackexchange--btn + .gh-btn:not(.crayons-btn--outlined), .ltag__stackexchange--container .gh-btn-container .crayons-btn-group .ltag__stackexchange--btn + .gh-btn:not(.crayons-btn--outlined), .gh-btn-container .crayons-btn-group .ltag__reddit--container .ltag__reddit--btn + .gh-btn:not(.crayons-btn--outlined), .ltag__reddit--container .gh-btn-container .crayons-btn-group .ltag__reddit--btn + .gh-btn:not(.crayons-btn--outlined), .crayons-btn-group .gh-btn-container .gh-btn + .gh-btn:not(.crayons-btn--outlined), .gh-btn-container .crayons-btn-group .gh-btn + .gh-btn:not(.crayons-btn--outlined) { box-shadow: var(--shadow), inset 1px 0 0 rgba(0, 0, 0, 0.1); margin-left: -1px; } /* line 397, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn-group .crayons-btn + .crayons-btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .ltag__wikipedia--container .ltag__wikipedia--btn + .crayons-btn:not(.crayons-btn--outlined):hover, .ltag__wikipedia--container .crayons-btn-group .ltag__wikipedia--btn + .crayons-btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .ltag__wikipedia--container .crayons-btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined):hover, .ltag__wikipedia--container .crayons-btn-group .crayons-btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .ltag__wikipedia--container .ltag__wikipedia--btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined):hover, .ltag__wikipedia--container .crayons-btn-group .ltag__wikipedia--btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .ltag__stackexchange--container .ltag__stackexchange--btn + .crayons-btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .ltag__stackexchange--container .ltag__wikipedia--container .ltag__stackexchange--btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined):hover, .ltag__wikipedia--container .crayons-btn-group .ltag__stackexchange--container .ltag__stackexchange--btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined):hover, .ltag__stackexchange--container .crayons-btn-group .ltag__stackexchange--btn + .crayons-btn:not(.crayons-btn--outlined):hover, .ltag__stackexchange--container .crayons-btn-group .ltag__wikipedia--container .ltag__stackexchange--btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined):hover, .ltag__wikipedia--container .ltag__stackexchange--container .crayons-btn-group .ltag__stackexchange--btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .ltag__stackexchange--container .crayons-btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .ltag__stackexchange--container .ltag__wikipedia--container .ltag__wikipedia--btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined):hover, .ltag__wikipedia--container .crayons-btn-group .ltag__stackexchange--container .ltag__wikipedia--btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined):hover, .ltag__stackexchange--container .crayons-btn-group .crayons-btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined):hover, .ltag__stackexchange--container .crayons-btn-group .ltag__wikipedia--container .ltag__wikipedia--btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined):hover, .ltag__wikipedia--container .ltag__stackexchange--container .crayons-btn-group .ltag__wikipedia--btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .ltag__stackexchange--container .ltag__stackexchange--btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined):hover, .ltag__stackexchange--container .crayons-btn-group .ltag__stackexchange--btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .ltag__reddit--container .ltag__reddit--btn + .crayons-btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .ltag__reddit--container .ltag__wikipedia--container .ltag__reddit--btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined):hover, .ltag__wikipedia--container .crayons-btn-group .ltag__reddit--container .ltag__reddit--btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .ltag__reddit--container .ltag__stackexchange--container .ltag__reddit--btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined):hover, .ltag__stackexchange--container .crayons-btn-group .ltag__reddit--container .ltag__reddit--btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined):hover, .ltag__reddit--container .crayons-btn-group .ltag__reddit--btn + .crayons-btn:not(.crayons-btn--outlined):hover, .ltag__reddit--container .crayons-btn-group .ltag__wikipedia--container .ltag__reddit--btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined):hover, .ltag__wikipedia--container .ltag__reddit--container .crayons-btn-group .ltag__reddit--btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined):hover, .ltag__reddit--container .crayons-btn-group .ltag__stackexchange--container .ltag__reddit--btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined):hover, .ltag__stackexchange--container .ltag__reddit--container .crayons-btn-group .ltag__reddit--btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .ltag__reddit--container .crayons-btn + .ltag__reddit--btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .ltag__reddit--container .ltag__wikipedia--container .ltag__wikipedia--btn + .ltag__reddit--btn:not(.crayons-btn--outlined):hover, .ltag__wikipedia--container .crayons-btn-group .ltag__reddit--container .ltag__wikipedia--btn + .ltag__reddit--btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .ltag__reddit--container .ltag__stackexchange--container .ltag__stackexchange--btn + .ltag__reddit--btn:not(.crayons-btn--outlined):hover, .ltag__stackexchange--container .crayons-btn-group .ltag__reddit--container .ltag__stackexchange--btn + .ltag__reddit--btn:not(.crayons-btn--outlined):hover, .ltag__reddit--container .crayons-btn-group .crayons-btn + .ltag__reddit--btn:not(.crayons-btn--outlined):hover, .ltag__reddit--container .crayons-btn-group .ltag__wikipedia--container .ltag__wikipedia--btn + .ltag__reddit--btn:not(.crayons-btn--outlined):hover, .ltag__wikipedia--container .ltag__reddit--container .crayons-btn-group .ltag__wikipedia--btn + .ltag__reddit--btn:not(.crayons-btn--outlined):hover, .ltag__reddit--container .crayons-btn-group .ltag__stackexchange--container .ltag__stackexchange--btn + .ltag__reddit--btn:not(.crayons-btn--outlined):hover, .ltag__stackexchange--container .ltag__reddit--container .crayons-btn-group .ltag__stackexchange--btn + .ltag__reddit--btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .ltag__reddit--container .ltag__reddit--btn + .ltag__reddit--btn:not(.crayons-btn--outlined):hover, .ltag__reddit--container .crayons-btn-group .ltag__reddit--btn + .ltag__reddit--btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .gh-btn-container .gh-btn + .crayons-btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .gh-btn-container .ltag__wikipedia--container .gh-btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined):hover, .ltag__wikipedia--container .crayons-btn-group .gh-btn-container .gh-btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .gh-btn-container .ltag__stackexchange--container .gh-btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined):hover, .ltag__stackexchange--container .crayons-btn-group .gh-btn-container .gh-btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .gh-btn-container .ltag__reddit--container .gh-btn + .ltag__reddit--btn:not(.crayons-btn--outlined):hover, .ltag__reddit--container .crayons-btn-group .gh-btn-container .gh-btn + .ltag__reddit--btn:not(.crayons-btn--outlined):hover, .gh-btn-container .crayons-btn-group .gh-btn + .crayons-btn:not(.crayons-btn--outlined):hover, .gh-btn-container .crayons-btn-group .ltag__wikipedia--container .gh-btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined):hover, .ltag__wikipedia--container .gh-btn-container .crayons-btn-group .gh-btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined):hover, .gh-btn-container .crayons-btn-group .ltag__stackexchange--container .gh-btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined):hover, .ltag__stackexchange--container .gh-btn-container .crayons-btn-group .gh-btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined):hover, .gh-btn-container .crayons-btn-group .ltag__reddit--container .gh-btn + .ltag__reddit--btn:not(.crayons-btn--outlined):hover, .ltag__reddit--container .gh-btn-container .crayons-btn-group .gh-btn + .ltag__reddit--btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .gh-btn-container .crayons-btn + .gh-btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .gh-btn-container .ltag__wikipedia--container .ltag__wikipedia--btn + .gh-btn:not(.crayons-btn--outlined):hover, .ltag__wikipedia--container .crayons-btn-group .gh-btn-container .ltag__wikipedia--btn + .gh-btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .gh-btn-container .ltag__stackexchange--container .ltag__stackexchange--btn + .gh-btn:not(.crayons-btn--outlined):hover, .ltag__stackexchange--container .crayons-btn-group .gh-btn-container .ltag__stackexchange--btn + .gh-btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .gh-btn-container .ltag__reddit--container .ltag__reddit--btn + .gh-btn:not(.crayons-btn--outlined):hover, .ltag__reddit--container .crayons-btn-group .gh-btn-container .ltag__reddit--btn + .gh-btn:not(.crayons-btn--outlined):hover, .gh-btn-container .crayons-btn-group .crayons-btn + .gh-btn:not(.crayons-btn--outlined):hover, .gh-btn-container .crayons-btn-group .ltag__wikipedia--container .ltag__wikipedia--btn + .gh-btn:not(.crayons-btn--outlined):hover, .ltag__wikipedia--container .gh-btn-container .crayons-btn-group .ltag__wikipedia--btn + .gh-btn:not(.crayons-btn--outlined):hover, .gh-btn-container .crayons-btn-group .ltag__stackexchange--container .ltag__stackexchange--btn + .gh-btn:not(.crayons-btn--outlined):hover, .ltag__stackexchange--container .gh-btn-container .crayons-btn-group .ltag__stackexchange--btn + .gh-btn:not(.crayons-btn--outlined):hover, .gh-btn-container .crayons-btn-group .ltag__reddit--container .ltag__reddit--btn + .gh-btn:not(.crayons-btn--outlined):hover, .ltag__reddit--container .gh-btn-container .crayons-btn-group .ltag__reddit--btn + .gh-btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .gh-btn-container .gh-btn + .gh-btn:not(.crayons-btn--outlined):hover, .gh-btn-container .crayons-btn-group .gh-btn + .gh-btn:not(.crayons-btn--outlined):hover { box-shadow: var(--shadow-hover), inset 0 0 0 rgba(0, 0, 0, 0.1); } /* line 402, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn-group .crayons-btn + .crayons-btn--outlined, .crayons-btn-group .ltag__wikipedia--container .ltag__wikipedia--btn + .crayons-btn--outlined, .ltag__wikipedia--container .crayons-btn-group .ltag__wikipedia--btn + .crayons-btn--outlined, .crayons-btn-group .ltag__stackexchange--container .ltag__stackexchange--btn + .crayons-btn--outlined, .ltag__stackexchange--container .crayons-btn-group .ltag__stackexchange--btn + .crayons-btn--outlined, .crayons-btn-group .ltag__reddit--container .ltag__reddit--btn + .crayons-btn--outlined, .ltag__reddit--container .crayons-btn-group .ltag__reddit--btn + .crayons-btn--outlined, .crayons-btn-group .gh-btn-container .gh-btn + .crayons-btn--outlined, .gh-btn-container .crayons-btn-group .gh-btn + .crayons-btn--outlined { margin-left: calc(-1 * var(--border-width)); } /* line 406, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn-group .crayons-btn:first-child, .crayons-btn-group .ltag__wikipedia--container .ltag__wikipedia--btn:first-child, .ltag__wikipedia--container .crayons-btn-group .ltag__wikipedia--btn:first-child, .crayons-btn-group .ltag__stackexchange--container .ltag__stackexchange--btn:first-child, .ltag__stackexchange--container .crayons-btn-group .ltag__stackexchange--btn:first-child, .crayons-btn-group .ltag__reddit--container .ltag__reddit--btn:first-child, .ltag__reddit--container .crayons-btn-group .ltag__reddit--btn:first-child, .crayons-btn-group .gh-btn-container .gh-btn:first-child, .gh-btn-container .crayons-btn-group .gh-btn:first-child { border-top-left-radius: var(--radius); border-bottom-left-radius: var(--radius); } /* line 411, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn-group .crayons-btn:last-child, .crayons-btn-group .ltag__wikipedia--container .ltag__wikipedia--btn:last-child, .ltag__wikipedia--container .crayons-btn-group .ltag__wikipedia--btn:last-child, .crayons-btn-group .ltag__stackexchange--container .ltag__stackexchange--btn:last-child, .ltag__stackexchange--container .crayons-btn-group .ltag__stackexchange--btn:last-child, .crayons-btn-group .ltag__reddit--container .ltag__reddit--btn:last-child, .ltag__reddit--container .crayons-btn-group .ltag__reddit--btn:last-child, .crayons-btn-group .gh-btn-container .gh-btn:last-child, .gh-btn-container .crayons-btn-group .gh-btn:last-child { border-top-right-radius: var(--radius); border-bottom-right-radius: var(--radius); } /* line 424, app/assets/stylesheets/ltags/../components/buttons.scss */ .c-btn { position: relative; display: inline-block; padding: var(--su-2) var(--su-4); border-radius: var(--radius); font: inherit; text-align: center; cursor: pointer; border: none; overflow-wrap: normal; background-color: var(--bg); color: var(--color); } /* line 437, app/assets/stylesheets/ltags/../components/buttons.scss */ .c-btn:hover:enabled, .js-focus-visible .c-btn.focus-visible:focus, .c-btn:is(label):focus-within { background-color: var(--bg-hover); color: var(--color-hover); z-index: var(--z-elevate); } /* line 445, app/assets/stylesheets/ltags/../components/buttons.scss */ .js-focus-visible .c-btn.focus-visible:focus, .c-btn:is(label):focus-within { box-shadow: var(--focus-ring); outline: 0; } /* line 451, app/assets/stylesheets/ltags/../components/buttons.scss */ .c-btn[aria-expanded='true'], .c-btn[aria-pressed='true'] { --bg: var(--btn-current-bg); --color: var(--btn-current-color); font-weight: var(--fw-bold); } /* line 458, app/assets/stylesheets/ltags/../components/buttons.scss */ .c-btn[disabled] { opacity: 0.6; cursor: not-allowed; } /* line 465, app/assets/stylesheets/ltags/../components/buttons.scss */ .c-btn > * { pointer-events: none; } /* line 467, app/assets/stylesheets/ltags/../components/buttons.scss */ .c-btn > * + input { pointer-events: revert; } /* line 473, app/assets/stylesheets/ltags/../components/buttons.scss */ .c-btn { --bg: var(--btn-bg); --bg-hover: var(--btn-bg-hover); --color: var(--btn-color); --color-hover: var(--btn-color-hover); } /* line 479, app/assets/stylesheets/ltags/../components/buttons.scss */ .c-btn.c-btn--destructive { --bg: var(--btn-destructive-bg); --bg-hover: var(--btn-destructive-bg-hover); --color: var(--btn-destructive-color); --color-hover: var(--btn-destructive-color-hover); } /* line 487, app/assets/stylesheets/ltags/../components/buttons.scss */ .c-btn--primary { --bg: var(--btn-primary-bg); --bg-hover: var(--btn-primary-bg-hover); --color: var(--btn-primary-color); --color-hover: var(--btn-primary-color-hover); font-weight: var(--fw-medium); } /* line 495, app/assets/stylesheets/ltags/../components/buttons.scss */ .c-btn--primary.c-btn--destructive { --bg: var(--btn-primary-destructive-bg); --bg-hover: var(--btn-primary-destructive-bg-hover); --color: var(--btn-primary-destructive-color); --color-hover: var(--btn-primary-destructive-color-hover); } /* line 503, app/assets/stylesheets/ltags/../components/buttons.scss */ .c-btn--secondary { --bg: var(--btn-secondary-bg); --bg-hover: var(--btn-secondary-bg-hover); --color: var(--btn-secondary-color); --color-hover: var(--btn-secondary-color-hover); } /* line 510, app/assets/stylesheets/ltags/../components/buttons.scss */ .c-btn--icon-alone { padding: var(--su-2); } /* line 515, app/assets/stylesheets/ltags/../components/buttons.scss */ .c-btn--icon-left .c-btn__icon { margin-right: var(--su-2); margin-left: calc(var(--su-1) * -1); } /* line 4, app/assets/stylesheets/ltags/RedditTag.scss */ .ltag__reddit--container { max-width: 620px; border: 1px solid #dbdbdb; border-radius: 3px; box-shadow: 1px 2px 4px 0 rgba(0, 0, 0, 0.18); margin: 1.1em auto 1.3em; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'; overflow: hidden; } /* line 14, app/assets/stylesheets/ltags/RedditTag.scss */ .ltag__reddit--container .ltag__reddit--title-container { border-bottom: 1px solid var(--base-60); display: flex; flex-direction: column; padding: 0 var(--su-3); } /* line 20, app/assets/stylesheets/ltags/RedditTag.scss */ .ltag__reddit--container .ltag__reddit--title-container header { display: flex; justify-content: space-between; } /* line 25, app/assets/stylesheets/ltags/RedditTag.scss */ .ltag__reddit--container .ltag__reddit--title-container header .ltag__reddit--title h1 { margin: var(--su-2) 0 0 var(--su-1); font-size: var(--fs-xl); padding-bottom: 0; display: flex; align-items: center; } /* line 32, app/assets/stylesheets/ltags/RedditTag.scss */ .ltag__reddit--container .ltag__reddit--title-container header .ltag__reddit--title h1 > a { color: var(--link-branded-color); display: inline-block; } /* line 37, app/assets/stylesheets/ltags/RedditTag.scss */ .ltag__reddit--container .ltag__reddit--title-container header .ltag__reddit--title h1 img { height: 40px; width: 40px; display: inline-block; vertical-align: middle; margin: 0 var(--su-3) 0 0; } /* line 47, app/assets/stylesheets/ltags/RedditTag.scss */ .ltag__reddit--container .ltag__reddit--title-container header .ltag__reddit--post-metadata { font-size: var(--fs-s); margin-left: 40px; } /* line 51, app/assets/stylesheets/ltags/RedditTag.scss */ .ltag__reddit--container .ltag__reddit--title-container header .ltag__reddit--post-metadata span { display: inline-block; padding: var(--su-2); margin-left: 6px; color: var(--base-60); } /* line 61, app/assets/stylesheets/ltags/RedditTag.scss */ .ltag__reddit--container .ltag__reddit--body { padding: 0 var(--su-3); max-height: calc(21vw + 165px); overflow: hidden; } @media screen and (min-width: 430px) { /* line 61, app/assets/stylesheets/ltags/RedditTag.scss */ .ltag__reddit--container .ltag__reddit--body { max-height: calc(20vw + 153px); } } @media screen and (min-width: 800px) { /* line 61, app/assets/stylesheets/ltags/RedditTag.scss */ .ltag__reddit--container .ltag__reddit--body { max-height: 310px; } } /* line 73, app/assets/stylesheets/ltags/RedditTag.scss */ .ltag__reddit--container .ltag__reddit--body h1, .ltag__reddit--container .ltag__reddit--body h2, .ltag__reddit--container .ltag__reddit--body h3, .ltag__reddit--container .ltag__reddit--body h4, .ltag__reddit--container .ltag__reddit--body h5, .ltag__reddit--container .ltag__reddit--body h6 { font-weight: var(--fw-medium); } /* line 82, app/assets/stylesheets/ltags/RedditTag.scss */ .ltag__reddit--container .ltag__reddit--body p { margin-top: 0; padding: 0; margin-bottom: 15px; font-size: var(--fs-l); line-height: var(--lh-base); } /* line 91, app/assets/stylesheets/ltags/RedditTag.scss */ .ltag__reddit--container .ltag__reddit--btn--container { padding: 1rem; z-index: var(--z-elevate); text-align: center; position: relative; box-shadow: 0 0 60px 42px var(--theme-container-background, #fff); } /* line 103, app/assets/stylesheets/ltags/RedditTag.scss */ .ltag__reddit--container .ltag__reddit--btn > a, .ltag__reddit--container .ltag__reddit--btn > a:hover { color: var(--button-secondary-color); } /* line 2, app/assets/stylesheets/ltags/ReplitTag.scss */ .ltag__replit br { line-height: 0 !important; display: none !important; } /* line 6, app/assets/stylesheets/ltags/ReplitTag.scss */ .ltag__replit iframe { margin: 0 !important; } /* line 3, app/assets/stylesheets/ltags/StackexchangeTag.scss */ .ltag__stackexchange--container { max-width: 620px; border: 1px solid var(--base-60); border-radius: 3px; box-shadow: 1px 2px 4px 0 rgba(0, 0, 0, 0.18); margin: 1.1em auto 1.3em; font-family: var(--ff-sans-serif); overflow: hidden; padding-top: 1rem; } /* line 13, app/assets/stylesheets/ltags/StackexchangeTag.scss */ .ltag__stackexchange--container .ltag__stackexchange--title-container { border-bottom: 1px solid #eaecef; display: flex; flex-direction: column; } /* line 18, app/assets/stylesheets/ltags/StackexchangeTag.scss */ .ltag__stackexchange--container .ltag__stackexchange--title-container header { display: flex; justify-content: space-between; } /* line 22, app/assets/stylesheets/ltags/StackexchangeTag.scss */ .ltag__stackexchange--container .ltag__stackexchange--title-container header .ltag__stackexchange--title h1, .ltag__stackexchange--container .ltag__stackexchange--title-container header .ltag__stackexchange--title .ltag__stackexchange--header { font-size: var(--fs-l); font-weight: var(--fw-normal); line-height: var(--lh-base); margin: 0em 0 0.5em; padding: 0 var(--su-3); } /* line 30, app/assets/stylesheets/ltags/StackexchangeTag.scss */ .ltag__stackexchange--container .ltag__stackexchange--title-container header .ltag__stackexchange--title h1 .title-flare, .ltag__stackexchange--container .ltag__stackexchange--title-container header .ltag__stackexchange--title .ltag__stackexchange--header .title-flare { background: #557de8; color: white; padding: 0px 7px; border-radius: 3px; } /* line 37, app/assets/stylesheets/ltags/StackexchangeTag.scss */ .ltag__stackexchange--container .ltag__stackexchange--title-container header .ltag__stackexchange--title h1 img, .ltag__stackexchange--container .ltag__stackexchange--title-container header .ltag__stackexchange--title .ltag__stackexchange--header img { width: var(--su-7); display: inline-block; margin: 0 var(--su-2) 0 0; vertical-align: middle; } /* line 45, app/assets/stylesheets/ltags/StackexchangeTag.scss */ .ltag__stackexchange--container .ltag__stackexchange--title-container header .ltag__stackexchange--post-metadata { font-size: 0.6em; } /* line 47, app/assets/stylesheets/ltags/StackexchangeTag.scss */ .ltag__stackexchange--container .ltag__stackexchange--title-container header .ltag__stackexchange--post-metadata span { display: inline-block; padding: 7px 6px; margin-left: 6px; } /* line 53, app/assets/stylesheets/ltags/StackexchangeTag.scss */ .ltag__stackexchange--container .ltag__stackexchange--title-container header .ltag__stackexchange--score-container { margin-right: 15px; display: flex; width: 50px; flex-direction: column; flex-wrap: nowrap; color: gray; font-size: 0.85em; align-self: center; } /* line 62, app/assets/stylesheets/ltags/StackexchangeTag.scss */ .ltag__stackexchange--container .ltag__stackexchange--title-container header .ltag__stackexchange--score-container img { position: initial; width: 16px; height: 16px; margin: var(--su-2) auto; } /* line 68, app/assets/stylesheets/ltags/StackexchangeTag.scss */ .ltag__stackexchange--container .ltag__stackexchange--title-container header .ltag__stackexchange--score-container .ltag__stackexchange--score-number { width: 100%; height: 20px; text-align: center; padding-bottom: 10px; font-size: 0.8em; } /* line 79, app/assets/stylesheets/ltags/StackexchangeTag.scss */ .ltag__stackexchange--container .ltag__stackexchange--body { padding: 1em 0.5em; max-height: calc(21vw + 165px); overflow: hidden; } @media screen and (min-width: 430px) { /* line 79, app/assets/stylesheets/ltags/StackexchangeTag.scss */ .ltag__stackexchange--container .ltag__stackexchange--body { max-height: calc(20vw + 153px); } } @media screen and (min-width: 800px) { /* line 79, app/assets/stylesheets/ltags/StackexchangeTag.scss */ .ltag__stackexchange--container .ltag__stackexchange--body { max-height: 310px; } } /* line 90, app/assets/stylesheets/ltags/StackexchangeTag.scss */ .ltag__stackexchange--container .ltag__stackexchange--body h1, .ltag__stackexchange--container .ltag__stackexchange--body h2, .ltag__stackexchange--container .ltag__stackexchange--body h3, .ltag__stackexchange--container .ltag__stackexchange--body h4, .ltag__stackexchange--container .ltag__stackexchange--body h5, .ltag__stackexchange--container .ltag__stackexchange--body h6 { font-weight: 500 !important; } /* line 99, app/assets/stylesheets/ltags/StackexchangeTag.scss */ .ltag__stackexchange--container .ltag__stackexchange--body p { margin-top: 0px; padding: 0px; margin-bottom: 15px; font-size: 1.1rem; } /* line 106, app/assets/stylesheets/ltags/StackexchangeTag.scss */ .ltag__stackexchange--container .ltag__stackexchange--body code { border-radius: 3px; padding: 0.2em 5px 0px; margin: 0px; font-family: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, Courier, monospace; } /* line 114, app/assets/stylesheets/ltags/StackexchangeTag.scss */ .ltag__stackexchange--container .ltag__stackexchange--body pre { width: 100%; margin: 0px; padding: 0.2em 0.6em; } /* line 118, app/assets/stylesheets/ltags/StackexchangeTag.scss */ .ltag__stackexchange--container .ltag__stackexchange--body pre code { background-color: #f6f8fa; color: black; padding: 0em 0px 0px !important; line-height: 2em !important; } /* line 126, app/assets/stylesheets/ltags/StackexchangeTag.scss */ .ltag__stackexchange--container .ltag__stackexchange--body .highlight pre, .ltag__stackexchange--container .ltag__stackexchange--body pre, .ltag__stackexchange--container .ltag__stackexchange--body pre code { overflow: auto; background-color: #f7f7f7; border-radius: 3px; box-sizing: border-box; color: black; } /* line 136, app/assets/stylesheets/ltags/StackexchangeTag.scss */ .ltag__stackexchange--container .ltag__stackexchange--body .highlight { font-size: 14px; margin-bottom: 16px; border-radius: 3px; } /* line 143, app/assets/stylesheets/ltags/StackexchangeTag.scss */ .ltag__stackexchange--container .ltag__stackexchange--btn--container { padding: 0.1em 0 1.15em; z-index: var(--z-elevate); text-align: center; position: relative; box-shadow: 0 0 60px 42px var(--card-bg); } /* line 157, app/assets/stylesheets/ltags/StackexchangeTag.scss */ .ltag__stackexchange--container .ltag__stackexchange--btn a { pointer-events: revert; } /* line 1, app/assets/stylesheets/ltags/SpeakerdeckTag.scss */ .ltag_speakerdeck { border: 0px; background: padding-box padding-box rgba(0, 0, 0, 0.1); margin: 0px; padding: 0px; border-radius: 6px; box-shadow: rgba(0, 0, 0, 0.2) 0px 5px 40px; width: 560px; height: 420px; } /** * * Makes working with themeable CSS variables easier. * * $property: the CSS property to theme. * $cssVariable: The CSS variable that will store the themed value. * $fallback: The value to use as a fallback but as well for the CSS variable default value. */ /* Mixin for a load more wrapper, made by a container div and child button */ /** * * Generates the src property for @font-face. The mixin is required * so that webpack for Storybook and the application can both * generate the font URL correctly. * * $font: the font file name, e.g. 'OpenDyslexic-Regular.otf' */ /* line 4, app/assets/stylesheets/ltags/TagTag.scss */ .ltag__tag { font-family: var(--ff-sans-serif); border-left: 1px solid var(--form-border) !important; border-right: 1px solid var(--form-border) !important; border-bottom: 1px solid var(--form-border) !important; border-top: 30px solid var(--form-border); box-shadow: var(--shadow-smooth) !important; border-radius: var(--radius-auto) !important; display: block; margin: 0.95em 0 1.2em; position: relative; overflow: hidden; width: auto; } @media screen and (min-width: 760px) { /* line 4, app/assets/stylesheets/ltags/TagTag.scss */ .ltag__tag { margin: 0.95em auto; } } /* line 20, app/assets/stylesheets/ltags/TagTag.scss */ .ltag__tag .ltag__tag__content { width: 90%; width: calc(100% - 36px); padding: calc(0.5vw + 6px) 0px; padding-left: 24px; } /* line 21, app/assets/stylesheets/ltags/TagTag.scss */ .ltag__tag .ltag__tag__content a { color: var(--card-color); } /* line 28, app/assets/stylesheets/ltags/TagTag.scss */ .ltag__tag .ltag__tag__content h2 { margin: 0; padding: 0; font-weight: var(--fw-bold); display: flex; align-items: center; } /* line 34, app/assets/stylesheets/ltags/TagTag.scss */ .ltag__tag .ltag__tag__content h2 .follow-action-button { visibility: hidden; margin: 0.2em 0.5em; } /* line 37, app/assets/stylesheets/ltags/TagTag.scss */ .ltag__tag .ltag__tag__content h2 .follow-action-button.showing { visibility: visible; } /* line 42, app/assets/stylesheets/ltags/TagTag.scss */ .ltag__tag .ltag__tag__content .ltag__tag__summary { padding-top: calc(0.5vw + 6px); padding-bottom: calc(0.5vw + 6px); font-size: 0.77em; line-height: 1.1em; } /* line 2, app/assets/stylesheets/ltags/TweetTag.scss */ blockquote.ltag__twitter-tweet { font-family: var(--ff-sans-serif); background: white; max-width: 500px; font-size: 0.75em; line-height: 1.35em; border: 1px solid var(--form-border); box-shadow: var(--shadow-smooth); border-radius: var(--radius-auto); margin: 1.6em auto !important; min-height: 60px; cursor: pointer; padding: 0px !important; } /* line 15, app/assets/stylesheets/ltags/TweetTag.scss */ blockquote.ltag__twitter-tweet a { color: #55acee; } @media screen and (min-width: 360px) { /* line 2, app/assets/stylesheets/ltags/TweetTag.scss */ blockquote.ltag__twitter-tweet { min-height: 105px; } } /* line 22, app/assets/stylesheets/ltags/TweetTag.scss */ blockquote.ltag__twitter-tweet .ltag__twitter-tweet__media { position: relative; overflow: hidden; } /* line 25, app/assets/stylesheets/ltags/TweetTag.scss */ blockquote.ltag__twitter-tweet .ltag__twitter-tweet__media img { width: 100%; left: 0; right: 0; margin: auto; border-top-left-radius: 3px; border-top-right-radius: 3px; } /* line 33, app/assets/stylesheets/ltags/TweetTag.scss */ blockquote.ltag__twitter-tweet .ltag__twitter-tweet__media img.ltag__twitter-tweet__play-butt { width: 70px; height: 70px; margin: auto; position: absolute; top: 0; left: 0; bottom: 0; right: 0; } /* line 44, app/assets/stylesheets/ltags/TweetTag.scss */ blockquote.ltag__twitter-tweet .ltag__twitter-tweet__video { display: none; } /* line 46, app/assets/stylesheets/ltags/TweetTag.scss */ blockquote.ltag__twitter-tweet .ltag__twitter-tweet__video video { width: 100%; } /* line 50, app/assets/stylesheets/ltags/TweetTag.scss */ blockquote.ltag__twitter-tweet .ltag__twitter-tweet__header { position: relative; height: 45px; } @media screen and (min-width: 360px) { /* line 50, app/assets/stylesheets/ltags/TweetTag.scss */ blockquote.ltag__twitter-tweet .ltag__twitter-tweet__header { height: 52px; } } /* line 56, app/assets/stylesheets/ltags/TweetTag.scss */ blockquote.ltag__twitter-tweet .ltag__twitter-tweet__header .ltag__twitter-tweet__profile-image { height: 36px; min-height: 36px; width: 36px; border-radius: 50px; position: absolute; left: calc(0.3vw + 13px); top: calc(0.3vw + 13px); background-color: #ececec; margin: 0; } /* line 67, app/assets/stylesheets/ltags/TweetTag.scss */ blockquote.ltag__twitter-tweet .ltag__twitter-tweet__header .ltag__twitter-tweet__twitter-logo { position: absolute; right: calc(0.3vw + 8px); top: 20px; left: auto; } /* line 72, app/assets/stylesheets/ltags/TweetTag.scss */ blockquote.ltag__twitter-tweet .ltag__twitter-tweet__header .ltag__twitter-tweet__twitter-logo img { height: 24px; min-height: 24px; max-width: 24px; display: inline-block; width: 36px; margin: auto; } /* line 81, app/assets/stylesheets/ltags/TweetTag.scss */ blockquote.ltag__twitter-tweet .ltag__twitter-tweet__header .ltag__twitter-tweet__full-name { color: #1c2022; position: absolute; left: calc(0.3vw + 57px); top: calc(0.3vw + 13px); font-weight: bold; font-size: 16px; } /* line 89, app/assets/stylesheets/ltags/TweetTag.scss */ blockquote.ltag__twitter-tweet .ltag__twitter-tweet__header .ltag__twitter-tweet__username { position: absolute; left: calc(0.3vw + 57px); top: calc(0.3vw + 33px); color: #697882; font-size: 14px; } /* line 97, app/assets/stylesheets/ltags/TweetTag.scss */ blockquote.ltag__twitter-tweet .ltag__twitter-tweet__body { color: #1c2022; font-size: 16px; line-height: 22px; padding: calc(0.3vw + 13px) calc(0.3vw + 13px) 0px; } /* line 102, app/assets/stylesheets/ltags/TweetTag.scss */ blockquote.ltag__twitter-tweet .ltag__twitter-tweet__body br { line-height: 0 !important; } /* line 106, app/assets/stylesheets/ltags/TweetTag.scss */ blockquote.ltag__twitter-tweet .ltag__twitter-tweet__date { font-size: 14px; color: #697882; margin-top: 3px; padding: 0px calc(0.3vw + 13px); } /* line 112, app/assets/stylesheets/ltags/TweetTag.scss */ blockquote.ltag__twitter-tweet .ltag__twitter-tweet__quote { color: #1c2022; margin: calc(0.3vw + 13px) calc(0.3vw + 13px) 0px; padding: calc(0.2vw + 8px) calc(0.2vw + 8px); border: 1px solid #dce3e8; border-radius: 4px; font-size: 15px; line-height: 1.1em; } /* line 120, app/assets/stylesheets/ltags/TweetTag.scss */ blockquote.ltag__twitter-tweet .ltag__twitter-tweet__quote:hover { border: 1px solid #a09dad; } /* line 123, app/assets/stylesheets/ltags/TweetTag.scss */ blockquote.ltag__twitter-tweet .ltag__twitter-tweet__quote .ltag__twitter-tweet__quote__header { padding: 0 0 calc(0.05vw + 3px); font-size: 0.9em; } /* line 126, app/assets/stylesheets/ltags/TweetTag.scss */ blockquote.ltag__twitter-tweet .ltag__twitter-tweet__quote .ltag__twitter-tweet__quote__header .ltag__twitter-tweet__quote__header__name { font-weight: bold; font-size: 1.1em; } /* line 132, app/assets/stylesheets/ltags/TweetTag.scss */ blockquote.ltag__twitter-tweet .ltag__twitter-tweet__actions { margin: 6px auto 0px; padding: 0px calc(0.3vw + 13px) 5px; color: #aab8c2; font-size: 14px; } /* line 137, app/assets/stylesheets/ltags/TweetTag.scss */ blockquote.ltag__twitter-tweet .ltag__twitter-tweet__actions .ltag__twitter-tweet__actions__button { width: 18px; height: 22px; display: inline-block; margin-left: 20px; margin-right: 2px; vertical-align: -7px; } /* line 144, app/assets/stylesheets/ltags/TweetTag.scss */ blockquote.ltag__twitter-tweet .ltag__twitter-tweet__actions .ltag__twitter-tweet__actions__button:first-child { margin-left: 8px; } /* line 148, app/assets/stylesheets/ltags/TweetTag.scss */ blockquote.ltag__twitter-tweet .ltag__twitter-tweet__actions img { height: 20px; min-height: 20px; margin: 0; } /* line 3, app/assets/stylesheets/ltags/TwitterTimelineTag.scss */ .ltag_twitter-timeline-liquid-tag { margin: 1.1em auto 1.3em; max-width: 580px; position: relative; } /* line 9, app/assets/stylesheets/ltags/TwitterTimelineTag.scss */ .twitter-timeline-thread { background-color: #fff; background-color: var(--card-bg); border: 1px solid #d1d5da; box-shadow: 1px 2px 4px 0 rgba(0, 0, 0, 0.18); border-radius: 3px; font-size: 0.77em; line-height: 1.15em; margin: 0; width: 98%; overflow: hidden; } /* line 22, app/assets/stylesheets/ltags/TwitterTimelineTag.scss */ .ltag-twitter-timeline-body { padding: 1em 0.5em; max-height: calc(21vw + 165px); overflow: hidden; } /* line 28, app/assets/stylesheets/ltags/TwitterTimelineTag.scss */ .tt-btn-container { text-align: center; padding: 0.35em 0 1.35em; box-shadow: -0px -0px 60px 42px #fff; box-shadow: 0px 0px 60px 42px var(--card-bg); position: relative; z-index: var(--z-elevate); } /* line 37, app/assets/stylesheets/ltags/TwitterTimelineTag.scss */ .tt-btn { color: #0366d6; background-color: #f1f8ff; border-radius: 3px; line-height: 20px; padding: 0.25em 1.2em; opacity: 0.9; font-size: 0.94em; font-weight: bold; border: 1px solid #0366d6; } /* line 47, app/assets/stylesheets/ltags/TwitterTimelineTag.scss */ .tt-btn:hover { opacity: 1; } /* line 4, app/assets/stylesheets/ltags/UserSubscriptionTag.scss */ .ltag__user-subscription-tag__container { background: var(--card-bg); color: var(--card-color); border-radius: var(--radius); border: 1px solid var(--card-color); box-sizing: border-box; display: flex; justify-content: center; padding: var(--su-4); } @media screen and (min-width: 768px) { /* line 4, app/assets/stylesheets/ltags/UserSubscriptionTag.scss */ .ltag__user-subscription-tag__container { padding: var(--su-6); } } /* line 20, app/assets/stylesheets/ltags/UserSubscriptionTag.scss */ .ltag__user-subscription-tag__signed-in { color: var(--base-70); } /* line 25, app/assets/stylesheets/ltags/UserSubscriptionTag.scss */ .ltag__user-subscription-tag__profile-images.signed-in { margin: 0 auto var(--su-4); position: relative; height: 80px; width: 80px; } /* line 31, app/assets/stylesheets/ltags/UserSubscriptionTag.scss */ .ltag__user-subscription-tag__profile-images.signed-in .ltag__user-subscription-tag__author-profile-image, .ltag__user-subscription-tag__profile-images.signed-in .ltag__user-subscription-tag__subscriber-profile-image { display: block; } /* line 37, app/assets/stylesheets/ltags/UserSubscriptionTag.scss */ .ltag__user-subscription-tag__profile-images.signed-out { height: auto; width: auto; text-align: center; margin: 0 auto; } /* line 43, app/assets/stylesheets/ltags/UserSubscriptionTag.scss */ .ltag__user-subscription-tag__profile-images.signed-out .ltag__user-subscription-tag__author-profile-image { margin: 0 auto var(--su-4); } /* line 47, app/assets/stylesheets/ltags/UserSubscriptionTag.scss */ .ltag__user-subscription-tag__profile-images.signed-out .ltag__user-subscription-tag__subscriber-profile-image { display: none; } /* line 52, app/assets/stylesheets/ltags/UserSubscriptionTag.scss */ .ltag__user-subscription-tag__profile-images img { border-radius: 100%; } /* line 57, app/assets/stylesheets/ltags/UserSubscriptionTag.scss */ .ltag__user-subscription-tag__subscriber-profile-image { position: absolute; bottom: 0; right: 0; box-shadow: 0 0 0 4px var(--body-color-inverted); } /** * * Makes working with themeable CSS variables easier. * * $property: the CSS property to theme. * $cssVariable: The CSS variable that will store the themed value. * $fallback: The value to use as a fallback but as well for the CSS variable default value. */ /* Mixin for a load more wrapper, made by a container div and child button */ /** * * Generates the src property for @font-face. The mixin is required * so that webpack for Storybook and the application can both * generate the font URL correctly. * * $font: the font file name, e.g. 'OpenDyslexic-Regular.otf' */ /* line 3, app/assets/stylesheets/ltags/UserTag.scss */ .ltag__user__link { color: var(--body-color) !important; } /* line 5, app/assets/stylesheets/ltags/UserTag.scss */ .ltag__user__link:active { opacity: 0.7; } /* line 9, app/assets/stylesheets/ltags/UserTag.scss */ .ltag__user__link.profile-image-link:hover { opacity: 1; } /* line 12, app/assets/stylesheets/ltags/UserTag.scss */ .ltag__user__link.profile-image-link:active { opacity: 1; } /* line 17, app/assets/stylesheets/ltags/UserTag.scss */ .ltag__user { font-family: var(--ff-sans-serif); border-left: 1px solid var(--form-border) !important; border-right: 1px solid var(--form-border) !important; border-bottom: 1px solid var(--form-border) !important; border-top: 30px solid var(--form-border); box-shadow: var(--shadow-smooth) !important; border-radius: var(--radius-auto) !important; display: block; margin: 0.95em 0 1.2em; position: relative; overflow: hidden; width: auto; } /* line 30, app/assets/stylesheets/ltags/UserTag.scss */ .ltag__user .ltag__user__pic { display: inline-block; padding: calc(0.6vw + 8px); padding-right: 8px; } /* line 34, app/assets/stylesheets/ltags/UserTag.scss */ .ltag__user .ltag__user__pic img { width: calc(5vw + 30px); height: calc(5vw + 30px); margin: auto auto !important; border-radius: 50%; max-width: 100px; max-height: 100px; } /* line 43, app/assets/stylesheets/ltags/UserTag.scss */ .ltag__user .ltag__user__content { display: inline-block; vertical-align: top; padding: calc(0.9vw + 6px); padding-left: 2px; width: calc(100% - 8vw - 60px); } /* line 49, app/assets/stylesheets/ltags/UserTag.scss */ .ltag__user .ltag__user__content h2 { margin: 0; padding: 0; font-weight: var(--fw-bold); display: flex; align-items: center; } /* line 55, app/assets/stylesheets/ltags/UserTag.scss */ .ltag__user .ltag__user__content h2 .follow-action-button { visibility: hidden; margin: 0.2em 0.5em; } /* line 58, app/assets/stylesheets/ltags/UserTag.scss */ .ltag__user .ltag__user__content h2 .follow-action-button.showing { visibility: visible; } /* line 63, app/assets/stylesheets/ltags/UserTag.scss */ .ltag__user .ltag__user__content .ltag__user__summary { margin: 0.3em 0; padding: 0; font-size: 0.87em; margin-bottom: 0; line-height: 1.2em; opacity: 0.85; } /* line 71, app/assets/stylesheets/ltags/UserTag.scss */ .ltag__user .ltag__user__content .ltag__user__taglist { margin: 1em 0px; padding: 0px; line-height: 1; font-size: 0.8em; opacity: 0.7; } /* line 77, app/assets/stylesheets/ltags/UserTag.scss */ .ltag__user .ltag__user__content .ltag__user__taglist a { color: #0a0a0a; margin-right: 1em; display: inline-block; height: 30px; } /* line 83, app/assets/stylesheets/ltags/UserTag.scss */ .ltag__user .ltag__user__content .ltag__user__taglist img { display: inline-block !important; width: 1em !important; height: 1em !important; margin-right: 2px; vertical-align: -0.1em; left: 0px; } /* line 97, app/assets/stylesheets/ltags/UserTag.scss */ .crayons-article-sticky .ltag__user .ltag__user__pic { width: 60px; height: 60px; } /* line 100, app/assets/stylesheets/ltags/UserTag.scss */ .crayons-article-sticky .ltag__user .ltag__user__pic img { width: 40px; height: 40px; } /* line 105, app/assets/stylesheets/ltags/UserTag.scss */ .crayons-article-sticky .ltag__user .ltag__user__content { width: calc(100% - 65px); } /* line 107, app/assets/stylesheets/ltags/UserTag.scss */ .crayons-article-sticky .ltag__user .ltag__user__content h2 { font-size: 1.4em; line-height: 1.42em; display: block; } /* line 111, app/assets/stylesheets/ltags/UserTag.scss */ .crayons-article-sticky .ltag__user .ltag__user__content h2 .ltag__user__link { width: 100%; display: block; } /* line 115, app/assets/stylesheets/ltags/UserTag.scss */ .crayons-article-sticky .ltag__user .ltag__user__content h2 .follow-action-button { display: block; margin: 10px 0; } /* line 120, app/assets/stylesheets/ltags/UserTag.scss */ .crayons-article-sticky .ltag__user .ltag__user__content h3 { margin-top: 4px !important; } /* line 3, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn, .ltag__wikipedia--container .ltag__wikipedia--btn, .gh-btn-container .gh-btn, .ltag__reddit--container .ltag__reddit--btn, .ltag__stackexchange--container .ltag__stackexchange--btn { --brand-apple-bg: #000; --brand-apple-color: #fff; --brand-apple-bg-hover: #1b1b1b; --brand-twitter-bg: #1da1f2; --brand-twitter-color: #fff; --brand-twitter-bg-hover: #0096f2; --brand-github-bg: #24292e; --brand-github-color: #fff; --brand-github-bg-hover: #000; --brand-facebook-bg: #4267b2; --brand-facebook-color: #fff; --brand-facebook-bg-hover: #476fbf; --brand-forem-bg: #0a3e4a; --brand-forem-color: #fff; --brand-forem-bg-hover: #05313b; --brand-email-bg: #24292e; --brand-email-color: #fff; --brand-email-bg-hover: #000; --brand-google_oauth2-bg: #1da1f2; --brand-google_oauth2-color: #fff; --brand-google_oauth2-bg-hover: #0096f2; } /* line 34, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn, .ltag__wikipedia--container .ltag__wikipedia--btn, .gh-btn-container .gh-btn, .ltag__reddit--container .ltag__reddit--btn, .ltag__stackexchange--container .ltag__stackexchange--btn { --border-width: 0px; --shadow-color: rgba(0, 0, 0, 0.05); --vertical-padding: var(--su-2); --horizontal-padding: var(--su-4); --font-size: var(--fs-base); --with-icon-padding: var(--su-3); --icon-margin: var(--su-2); position: relative; display: inline-block; padding: calc(var(--vertical-padding) - var(--border-width)) calc(var(--horizontal-padding) - var(--border-width)); border-radius: var(--radius); font-family: inherit; font-size: var(--font-size); line-height: var(--su-6); font-weight: var(--fw-medium); text-align: center; text-decoration: none; cursor: pointer; transition: all var(--transition-props); border: var(--border-width) solid; overflow-wrap: normal; --bg: var(--button-primary-bg); --bg-hover: var(--button-primary-bg-hover); --border: transparent; --border-hover: transparent; --color: var(--button-primary-color); --color-hover: var(--button-primary-color-hover); --shadow: 0 1px 3px var(--shadow-color); --shadow-hover: 0 2px 5px var(--shadow-color); --bg-inverted: var(--button-primary-inverted-bg); --bg-inverted-hover: var(--button-primary-inverted-bg-hover); --color-inverted: var(--button-primary-inverted-color); --color-inverted-hover: var(--button-primary-inverted-color-hover); background-color: var(--bg); border-color: var(--border); box-shadow: var(--shadow); color: var(--color); } /* line 79, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn[href]:hover, .ltag__wikipedia--container .ltag__wikipedia--btn[href]:hover, .gh-btn-container .gh-btn[href]:hover, .ltag__reddit--container .ltag__reddit--btn[href]:hover, .ltag__stackexchange--container .ltag__stackexchange--btn[href]:hover, .crayons-btn[href]:focus, .ltag__wikipedia--container .ltag__wikipedia--btn[href]:focus, .gh-btn-container .gh-btn[href]:focus, .ltag__reddit--container .ltag__reddit--btn[href]:focus, .ltag__stackexchange--container .ltag__stackexchange--btn[href]:focus, .crayons-btn:hover:enabled, .ltag__wikipedia--container .ltag__wikipedia--btn:hover:enabled, .gh-btn-container .gh-btn:hover:enabled, .ltag__reddit--container .ltag__reddit--btn:hover:enabled, .ltag__stackexchange--container .ltag__stackexchange--btn:hover:enabled, .crayons-btn:active:enabled, .ltag__wikipedia--container .ltag__wikipedia--btn:active:enabled, .gh-btn-container .gh-btn:active:enabled, .ltag__reddit--container .ltag__reddit--btn:active:enabled, .ltag__stackexchange--container .ltag__stackexchange--btn:active:enabled { background-color: var(--bg-hover); border-color: var(--border-hover); box-shadow: var(--shadow-hover); color: var(--color-hover); z-index: var(--z-elevate); } /* line 90, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn.crayons-btn--inverted, .ltag__wikipedia--container .crayons-btn--inverted.ltag__wikipedia--btn, .gh-btn-container .crayons-btn--inverted.gh-btn, .ltag__reddit--container .crayons-btn--inverted.ltag__reddit--btn, .ltag__stackexchange--container .crayons-btn--inverted.ltag__stackexchange--btn { --bg: var(--bg-inverted); --bg-hover: var(--bg-inverted-hover); --border: var(--border-inverted); --border-hover: var(--border-inverted-hover); --color: var(--color-inverted); --color-hover: var(--color-inverted-hover); } /* line 99, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn[disabled], .ltag__wikipedia--container .ltag__wikipedia--btn[disabled], .gh-btn-container .gh-btn[disabled], .ltag__reddit--container .ltag__reddit--btn[disabled], .ltag__stackexchange--container .ltag__stackexchange--btn[disabled] { opacity: 0.6; cursor: not-allowed; } /* line 104, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--s { --vertical-padding: var(--su-1); --horizontal-padding: var(--su-3); --font-size: var(--fs-s); --with-icon-padding: var(--su-2); --icon-margin: var(--su-1); font-weight: normal; } /* line 113, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--l { --vertical-padding: var(--su-3); --horizontal-padding: var(--su-5); --with-icon-padding: var(--su-3); --icon-margin: var(--su-2); } /* line 120, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--xl { --vertical-padding: var(--su-4); --horizontal-padding: var(--su-6); --font-size: var(--fs-l); --with-icon-padding: var(--su-5); --icon-margin: var(--su-3); } /* line 130, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn > *, .ltag__wikipedia--container .ltag__wikipedia--btn > *, .gh-btn-container .gh-btn > *, .ltag__reddit--container .ltag__reddit--btn > *, .ltag__stackexchange--container .ltag__stackexchange--btn > * { pointer-events: none; } /* line 132, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn > * + input, .ltag__wikipedia--container .ltag__wikipedia--btn > * + input, .gh-btn-container .gh-btn > * + input, .ltag__reddit--container .ltag__reddit--btn > * + input, .ltag__stackexchange--container .ltag__stackexchange--btn > * + input { pointer-events: revert; } /* line 138, app/assets/stylesheets/ltags/../components/buttons.scss */ .js-focus-visible .crayons-btn.focus-visible:focus, .js-focus-visible .ltag__wikipedia--container .focus-visible.ltag__wikipedia--btn:focus, .ltag__wikipedia--container .js-focus-visible .focus-visible.ltag__wikipedia--btn:focus, .js-focus-visible .gh-btn-container .focus-visible.gh-btn:focus, .gh-btn-container .js-focus-visible .focus-visible.gh-btn:focus, .js-focus-visible .ltag__reddit--container .focus-visible.ltag__reddit--btn:focus, .ltag__reddit--container .js-focus-visible .focus-visible.ltag__reddit--btn:focus, .js-focus-visible .ltag__stackexchange--container .focus-visible.ltag__stackexchange--btn:focus, .ltag__stackexchange--container .js-focus-visible .focus-visible.ltag__stackexchange--btn:focus, .js-focus-visible .crayons-btn.focus-visible:focus-within, .js-focus-visible .ltag__wikipedia--container .focus-visible.ltag__wikipedia--btn:focus-within, .ltag__wikipedia--container .js-focus-visible .focus-visible.ltag__wikipedia--btn:focus-within, .js-focus-visible .gh-btn-container .focus-visible.gh-btn:focus-within, .gh-btn-container .js-focus-visible .focus-visible.gh-btn:focus-within, .js-focus-visible .ltag__reddit--container .focus-visible.ltag__reddit--btn:focus-within, .ltag__reddit--container .js-focus-visible .focus-visible.ltag__reddit--btn:focus-within, .js-focus-visible .ltag__stackexchange--container .focus-visible.ltag__stackexchange--btn:focus-within, .ltag__stackexchange--container .js-focus-visible .focus-visible.ltag__stackexchange--btn:focus-within, label[class*='crayons-btn']:focus-within { background-color: var(--bg-hover); border-color: var(--border-hover); box-shadow: var(--shadow-hover); color: var(--color-hover); z-index: var(--z-elevate); } /* line 149, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--secondary, .ltag__wikipedia--container .ltag__wikipedia--btn, .gh-btn-container .gh-btn, .ltag__reddit--container .ltag__reddit--btn, .ltag__stackexchange--container .ltag__stackexchange--btn { --bg: var(--button-secondary-bg); --bg-hover: var(--button-secondary-bg-hover); --color: var(--button-secondary-color); --color-hover: var(--button-secondary-color-hover); } /* line 156, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--outlined { --bg: var(--button-outlined-bg); --bg-hover: var(--button-outlined-bg-hover); --border: var(--button-outlined-border); --border-hover: var(--button-outlined-border-hover); --color: var(--button-outlined-color); --color-hover: var(--button-outlined-color-hover); --border-width: 2px; } /* line 167, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--danger { --bg: var(--accent-danger); --bg-hover: var(--accent-danger-darker); --color: var(--base-inverted); --color-hover: var(--base-inverted); --bg-inverted: var(--accent-danger); --bg-inverted-hover: var(--accent-danger-darker); --color-inverted: var(--base-inverted); --color-inverted-hover: var(--base-inverted); } /* line 178, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--success { --bg: var(--accent-success); --bg-hover: var(--accent-success-darker); --color: var(--base-inverted); --color-hover: var(--base-inverted); --bg-inverted: var(--accent-success); --bg-inverted-hover: var(--accent-success-darker); --color-inverted: var(--base-inverted); --color-inverted-hover: var(--base-inverted); } /* line 189, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--warning { --bg: var(--accent-warning); --bg-hover: var(--accent-warning-darker); --color: var(--base-inverted); --color-hover: var(--base-inverted); --bg-inverted: var(--accent-warning); --bg-inverted-hover: var(--accent-warning-darker); --color-inverted: var(--base-inverted); --color-inverted-hover: var(--base-inverted); } /* line 200, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--ghost { --bg: var(--button-ghost-bg); --bg-hover: var(--button-ghost-bg-hover); --color: var(--button-ghost-color); --color-hover: var(--button-ghost-color-hover); --shadow: none; --shadow-hover: none; --bg-inverted: var(--button-ghost-inverted-bg); --bg-inverted-hover: var(--button-ghost-inverted-bg-hover); --color-inverted: var(--button-ghost-inverted-color); --color-inverted-hover: var(--button-ghost-inverted-color-hover); } /* line 212, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--ghost-brand { --bg: var(--button-ghost-bg); --bg-hover: var(--button-ghost-bg-hover); --color: var(--accent-brand); --color-hover: var(--accent-brand-darker); --shadow: none; --shadow-hover: none; } /* line 221, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--ghost-dimmed { --bg: var(--button-ghost-bg); --bg-hover: var(--button-ghost-bg-hover); --color: var(--button-ghost-dimmed-color); --color-hover: var(--button-ghost-dimmed-color-hover); --shadow: none; --shadow-hover: none; } /* line 230, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--ghost-success { --bg: var(--button-ghost-bg); --bg-hover: var(--button-ghost-bg-hover); --color: var(--accent-success); --color-hover: var(--accent-success-darker); --shadow: none; --shadow-hover: none; --bg-inverted: var(--button-ghost-inverted-bg); --bg-inverted-hover: var(--button-ghost-inverted-bg-hover); --color-inverted: var(--accent-success); --color-inverted-hover: var(--accent-success-darker); } /* line 243, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--ghost-danger { --bg: var(--button-ghost-bg); --bg-hover: var(--button-ghost-bg-hover); --color: var(--accent-danger); --color-hover: var(--accent-danger-darker); --shadow: none; --shadow-hover: none; } /* line 253, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--brand-apple { --bg: var(--brand-apple-bg); --bg-hover: var(--brand-apple-bg-hover); --color: var(--brand-apple-color); --color-hover: var(--brand-apple-color); --bg-inverted: var(--brand-apple-bg); --bg-inverted-hover: var(--brand-apple-bg-hover); --color-inverted: var(--brand-apple-color); --color-inverted-hover: var(--brand-apple-color); } /* line 264, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--brand-twitter { --bg: var(--brand-twitter-bg); --bg-hover: var(--brand-twitter-bg-hover); --color: var(--brand-twitter-color); --color-hover: var(--brand-twitter-color); --bg-inverted: var(--brand-twitter-bg); --bg-inverted-hover: var(--brand-twitter-bg-hover); --color-inverted: var(--brand-twitter-color); --color-inverted-hover: var(--brand-twitter-color); } /* line 275, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--brand-github { --bg: var(--brand-github-bg); --bg-hover: var(--brand-github-bg-hover); --color: var(--brand-github-color); --color-hover: var(--brand-github-color); --bg-inverted: var(--brand-github-bg); --bg-inverted-hover: var(--brand-github-bg-hover); --color-inverted: var(--brand-github-color); --color-inverted-hover: var(--brand-github-color); } /* line 286, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--brand-facebook { --bg: var(--brand-facebook-bg); --bg-hover: var(--brand-facebook-bg-hover); --color: var(--brand-facebook-color); --color-hover: var(--brand-facebook-color); --bg-inverted: var(--brand-facebook-bg); --bg-inverted-hover: var(--brand-facebook-bg-hover); --color-inverted: var(--brand-facebook-color); --color-inverted-hover: var(--brand-facebook-color); } /* line 297, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--brand-forem { --bg: var(--brand-forem-bg); --bg-hover: var(--brand-forem-bg-hover); --color: var(--brand-forem-color); --color-hover: var(--brand-forem-color); --bg-inverted: var(--brand-forem-bg); --bg-inverted-hover: var(--brand-forem-bg-hover); --color-inverted: var(--brand-forem-color); --color-inverted-hover: var(--brand-forem-color); } /* line 308, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--brand-email { --bg: var(--brand-email-bg); --bg-hover: var(--brand-email-bg-hover); --color: var(--brand-email-color); --color-hover: var(--brand-email-color); --bg-inverted: var(--brand-email-bg); --bg-inverted-hover: var(--brand-email-bg-hover); --color-inverted: var(--brand-email-color); --color-inverted-hover: var(--brand-email-color); } /* line 319, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--brand-google_oauth2 { --bg: var(--brand-google_oauth2-bg); --bg-hover: var(--brand-google_oauth2-bg-hover); --color: var(--brand-google_oauth2-color); --color-hover: var(--brand-google_oauth2-color); --bg-inverted: var(--brand-google_oauth2-bg); --bg-inverted-hover: var(--brand-google_oauth2-bg-hover); --color-inverted: var(--brand-google_oauth2-color); --color-inverted-hover: var(--brand-google_oauth2-color); } /* line 331, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--icon, .crayons-btn--icon-rounded { --horizontal-padding: var(--su-2); padding-left: calc(var(--horizontal-padding) - var(--border-width)); padding-right: calc(var(--horizontal-padding) - var(--border-width)); } /* line 336, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--icon.crayons-btn--s, .crayons-btn--icon-rounded.crayons-btn--s { --horizontal-padding: var(--su-1); } /* line 340, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--icon.crayons-btn--l, .crayons-btn--icon-rounded.crayons-btn--l { --horizontal-padding: var(--su-3); } /* line 344, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--icon.crayons-btn--xl, .crayons-btn--icon-rounded.crayons-btn--xl { --horizontal-padding: var(--su-4); } /* line 349, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--icon-rounded { border-radius: 1000px; } /* line 354, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--icon-left { padding-left: calc(var(--with-icon-padding) - var(--border-width)); } /* line 357, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--icon-left .crayons-icon { margin-right: var(--icon-margin); } /* line 363, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--icon-right { padding-right: calc(var(--with-icon-padding) - var(--border-width)); } /* line 366, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn--icon-right .crayons-icon { margin-left: var(--icon-margin); } /* line 371, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn-actions { --btn-wrap-gap: var(--su-2); display: flex; flex-wrap: wrap; align-items: center; margin-bottom: calc(0rem - var(--btn-wrap-gap)); margin-left: calc(0rem - var(--btn-wrap-gap)); } /* line 380, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn-actions .crayons-btn, .crayons-btn-actions .ltag__wikipedia--container .ltag__wikipedia--btn, .ltag__wikipedia--container .crayons-btn-actions .ltag__wikipedia--btn, .crayons-btn-actions .gh-btn-container .gh-btn, .gh-btn-container .crayons-btn-actions .gh-btn, .crayons-btn-actions .ltag__reddit--container .ltag__reddit--btn, .ltag__reddit--container .crayons-btn-actions .ltag__reddit--btn, .crayons-btn-actions .ltag__stackexchange--container .ltag__stackexchange--btn, .ltag__stackexchange--container .crayons-btn-actions .ltag__stackexchange--btn { margin-left: var(--btn-wrap-gap); margin-bottom: var(--btn-wrap-gap); } /* line 387, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn-group { display: flex; } /* line 390, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn-group .crayons-btn, .crayons-btn-group .ltag__wikipedia--container .ltag__wikipedia--btn, .ltag__wikipedia--container .crayons-btn-group .ltag__wikipedia--btn, .crayons-btn-group .gh-btn-container .gh-btn, .gh-btn-container .crayons-btn-group .gh-btn, .crayons-btn-group .ltag__reddit--container .ltag__reddit--btn, .ltag__reddit--container .crayons-btn-group .ltag__reddit--btn, .crayons-btn-group .ltag__stackexchange--container .ltag__stackexchange--btn, .ltag__stackexchange--container .crayons-btn-group .ltag__stackexchange--btn { border-radius: 0; } /* line 393, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn-group .crayons-btn + .crayons-btn:not(.crayons-btn--outlined), .crayons-btn-group .ltag__wikipedia--container .ltag__wikipedia--btn + .crayons-btn:not(.crayons-btn--outlined), .ltag__wikipedia--container .crayons-btn-group .ltag__wikipedia--btn + .crayons-btn:not(.crayons-btn--outlined), .crayons-btn-group .ltag__wikipedia--container .crayons-btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined), .ltag__wikipedia--container .crayons-btn-group .crayons-btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined), .crayons-btn-group .ltag__wikipedia--container .ltag__wikipedia--btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined), .ltag__wikipedia--container .crayons-btn-group .ltag__wikipedia--btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined), .crayons-btn-group .gh-btn-container .gh-btn + .crayons-btn:not(.crayons-btn--outlined), .crayons-btn-group .gh-btn-container .ltag__wikipedia--container .gh-btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined), .ltag__wikipedia--container .crayons-btn-group .gh-btn-container .gh-btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined), .gh-btn-container .crayons-btn-group .gh-btn + .crayons-btn:not(.crayons-btn--outlined), .gh-btn-container .crayons-btn-group .ltag__wikipedia--container .gh-btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined), .ltag__wikipedia--container .gh-btn-container .crayons-btn-group .gh-btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined), .crayons-btn-group .ltag__reddit--container .ltag__reddit--btn + .crayons-btn:not(.crayons-btn--outlined), .crayons-btn-group .ltag__reddit--container .ltag__wikipedia--container .ltag__reddit--btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined), .ltag__wikipedia--container .crayons-btn-group .ltag__reddit--container .ltag__reddit--btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined), .ltag__reddit--container .crayons-btn-group .ltag__reddit--btn + .crayons-btn:not(.crayons-btn--outlined), .ltag__reddit--container .crayons-btn-group .ltag__wikipedia--container .ltag__reddit--btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined), .ltag__wikipedia--container .ltag__reddit--container .crayons-btn-group .ltag__reddit--btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined), .crayons-btn-group .ltag__stackexchange--container .ltag__stackexchange--btn + .crayons-btn:not(.crayons-btn--outlined), .crayons-btn-group .ltag__stackexchange--container .ltag__wikipedia--container .ltag__stackexchange--btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined), .ltag__wikipedia--container .crayons-btn-group .ltag__stackexchange--container .ltag__stackexchange--btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined), .ltag__stackexchange--container .crayons-btn-group .ltag__stackexchange--btn + .crayons-btn:not(.crayons-btn--outlined), .ltag__stackexchange--container .crayons-btn-group .ltag__wikipedia--container .ltag__stackexchange--btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined), .ltag__wikipedia--container .ltag__stackexchange--container .crayons-btn-group .ltag__stackexchange--btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined), .crayons-btn-group .gh-btn-container .crayons-btn + .gh-btn:not(.crayons-btn--outlined), .crayons-btn-group .gh-btn-container .ltag__wikipedia--container .ltag__wikipedia--btn + .gh-btn:not(.crayons-btn--outlined), .ltag__wikipedia--container .crayons-btn-group .gh-btn-container .ltag__wikipedia--btn + .gh-btn:not(.crayons-btn--outlined), .gh-btn-container .crayons-btn-group .crayons-btn + .gh-btn:not(.crayons-btn--outlined), .gh-btn-container .crayons-btn-group .ltag__wikipedia--container .ltag__wikipedia--btn + .gh-btn:not(.crayons-btn--outlined), .ltag__wikipedia--container .gh-btn-container .crayons-btn-group .ltag__wikipedia--btn + .gh-btn:not(.crayons-btn--outlined), .crayons-btn-group .gh-btn-container .gh-btn + .gh-btn:not(.crayons-btn--outlined), .gh-btn-container .crayons-btn-group .gh-btn + .gh-btn:not(.crayons-btn--outlined), .crayons-btn-group .ltag__reddit--container .gh-btn-container .ltag__reddit--btn + .gh-btn:not(.crayons-btn--outlined), .gh-btn-container .crayons-btn-group .ltag__reddit--container .ltag__reddit--btn + .gh-btn:not(.crayons-btn--outlined), .ltag__reddit--container .crayons-btn-group .gh-btn-container .ltag__reddit--btn + .gh-btn:not(.crayons-btn--outlined), .gh-btn-container .ltag__reddit--container .crayons-btn-group .ltag__reddit--btn + .gh-btn:not(.crayons-btn--outlined), .crayons-btn-group .ltag__stackexchange--container .gh-btn-container .ltag__stackexchange--btn + .gh-btn:not(.crayons-btn--outlined), .gh-btn-container .crayons-btn-group .ltag__stackexchange--container .ltag__stackexchange--btn + .gh-btn:not(.crayons-btn--outlined), .ltag__stackexchange--container .crayons-btn-group .gh-btn-container .ltag__stackexchange--btn + .gh-btn:not(.crayons-btn--outlined), .gh-btn-container .ltag__stackexchange--container .crayons-btn-group .ltag__stackexchange--btn + .gh-btn:not(.crayons-btn--outlined), .crayons-btn-group .ltag__reddit--container .crayons-btn + .ltag__reddit--btn:not(.crayons-btn--outlined), .crayons-btn-group .ltag__reddit--container .ltag__wikipedia--container .ltag__wikipedia--btn + .ltag__reddit--btn:not(.crayons-btn--outlined), .ltag__wikipedia--container .crayons-btn-group .ltag__reddit--container .ltag__wikipedia--btn + .ltag__reddit--btn:not(.crayons-btn--outlined), .ltag__reddit--container .crayons-btn-group .crayons-btn + .ltag__reddit--btn:not(.crayons-btn--outlined), .ltag__reddit--container .crayons-btn-group .ltag__wikipedia--container .ltag__wikipedia--btn + .ltag__reddit--btn:not(.crayons-btn--outlined), .ltag__wikipedia--container .ltag__reddit--container .crayons-btn-group .ltag__wikipedia--btn + .ltag__reddit--btn:not(.crayons-btn--outlined), .crayons-btn-group .gh-btn-container .ltag__reddit--container .gh-btn + .ltag__reddit--btn:not(.crayons-btn--outlined), .ltag__reddit--container .crayons-btn-group .gh-btn-container .gh-btn + .ltag__reddit--btn:not(.crayons-btn--outlined), .gh-btn-container .crayons-btn-group .ltag__reddit--container .gh-btn + .ltag__reddit--btn:not(.crayons-btn--outlined), .ltag__reddit--container .gh-btn-container .crayons-btn-group .gh-btn + .ltag__reddit--btn:not(.crayons-btn--outlined), .crayons-btn-group .ltag__reddit--container .ltag__reddit--btn + .ltag__reddit--btn:not(.crayons-btn--outlined), .ltag__reddit--container .crayons-btn-group .ltag__reddit--btn + .ltag__reddit--btn:not(.crayons-btn--outlined), .crayons-btn-group .ltag__stackexchange--container .ltag__reddit--container .ltag__stackexchange--btn + .ltag__reddit--btn:not(.crayons-btn--outlined), .ltag__reddit--container .crayons-btn-group .ltag__stackexchange--container .ltag__stackexchange--btn + .ltag__reddit--btn:not(.crayons-btn--outlined), .ltag__stackexchange--container .crayons-btn-group .ltag__reddit--container .ltag__stackexchange--btn + .ltag__reddit--btn:not(.crayons-btn--outlined), .ltag__reddit--container .ltag__stackexchange--container .crayons-btn-group .ltag__stackexchange--btn + .ltag__reddit--btn:not(.crayons-btn--outlined), .crayons-btn-group .ltag__stackexchange--container .crayons-btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined), .crayons-btn-group .ltag__stackexchange--container .ltag__wikipedia--container .ltag__wikipedia--btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined), .ltag__wikipedia--container .crayons-btn-group .ltag__stackexchange--container .ltag__wikipedia--btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined), .ltag__stackexchange--container .crayons-btn-group .crayons-btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined), .ltag__stackexchange--container .crayons-btn-group .ltag__wikipedia--container .ltag__wikipedia--btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined), .ltag__wikipedia--container .ltag__stackexchange--container .crayons-btn-group .ltag__wikipedia--btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined), .crayons-btn-group .gh-btn-container .ltag__stackexchange--container .gh-btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined), .ltag__stackexchange--container .crayons-btn-group .gh-btn-container .gh-btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined), .gh-btn-container .crayons-btn-group .ltag__stackexchange--container .gh-btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined), .ltag__stackexchange--container .gh-btn-container .crayons-btn-group .gh-btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined), .crayons-btn-group .ltag__reddit--container .ltag__stackexchange--container .ltag__reddit--btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined), .ltag__stackexchange--container .crayons-btn-group .ltag__reddit--container .ltag__reddit--btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined), .ltag__reddit--container .crayons-btn-group .ltag__stackexchange--container .ltag__reddit--btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined), .ltag__stackexchange--container .ltag__reddit--container .crayons-btn-group .ltag__reddit--btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined), .crayons-btn-group .ltag__stackexchange--container .ltag__stackexchange--btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined), .ltag__stackexchange--container .crayons-btn-group .ltag__stackexchange--btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined) { box-shadow: var(--shadow), inset 1px 0 0 rgba(0, 0, 0, 0.1); margin-left: -1px; } /* line 397, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn-group .crayons-btn + .crayons-btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .ltag__wikipedia--container .ltag__wikipedia--btn + .crayons-btn:not(.crayons-btn--outlined):hover, .ltag__wikipedia--container .crayons-btn-group .ltag__wikipedia--btn + .crayons-btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .ltag__wikipedia--container .crayons-btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined):hover, .ltag__wikipedia--container .crayons-btn-group .crayons-btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .ltag__wikipedia--container .ltag__wikipedia--btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined):hover, .ltag__wikipedia--container .crayons-btn-group .ltag__wikipedia--btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .gh-btn-container .gh-btn + .crayons-btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .gh-btn-container .ltag__wikipedia--container .gh-btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined):hover, .ltag__wikipedia--container .crayons-btn-group .gh-btn-container .gh-btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined):hover, .gh-btn-container .crayons-btn-group .gh-btn + .crayons-btn:not(.crayons-btn--outlined):hover, .gh-btn-container .crayons-btn-group .ltag__wikipedia--container .gh-btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined):hover, .ltag__wikipedia--container .gh-btn-container .crayons-btn-group .gh-btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .ltag__reddit--container .ltag__reddit--btn + .crayons-btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .ltag__reddit--container .ltag__wikipedia--container .ltag__reddit--btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined):hover, .ltag__wikipedia--container .crayons-btn-group .ltag__reddit--container .ltag__reddit--btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined):hover, .ltag__reddit--container .crayons-btn-group .ltag__reddit--btn + .crayons-btn:not(.crayons-btn--outlined):hover, .ltag__reddit--container .crayons-btn-group .ltag__wikipedia--container .ltag__reddit--btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined):hover, .ltag__wikipedia--container .ltag__reddit--container .crayons-btn-group .ltag__reddit--btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .ltag__stackexchange--container .ltag__stackexchange--btn + .crayons-btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .ltag__stackexchange--container .ltag__wikipedia--container .ltag__stackexchange--btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined):hover, .ltag__wikipedia--container .crayons-btn-group .ltag__stackexchange--container .ltag__stackexchange--btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined):hover, .ltag__stackexchange--container .crayons-btn-group .ltag__stackexchange--btn + .crayons-btn:not(.crayons-btn--outlined):hover, .ltag__stackexchange--container .crayons-btn-group .ltag__wikipedia--container .ltag__stackexchange--btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined):hover, .ltag__wikipedia--container .ltag__stackexchange--container .crayons-btn-group .ltag__stackexchange--btn + .ltag__wikipedia--btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .gh-btn-container .crayons-btn + .gh-btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .gh-btn-container .ltag__wikipedia--container .ltag__wikipedia--btn + .gh-btn:not(.crayons-btn--outlined):hover, .ltag__wikipedia--container .crayons-btn-group .gh-btn-container .ltag__wikipedia--btn + .gh-btn:not(.crayons-btn--outlined):hover, .gh-btn-container .crayons-btn-group .crayons-btn + .gh-btn:not(.crayons-btn--outlined):hover, .gh-btn-container .crayons-btn-group .ltag__wikipedia--container .ltag__wikipedia--btn + .gh-btn:not(.crayons-btn--outlined):hover, .ltag__wikipedia--container .gh-btn-container .crayons-btn-group .ltag__wikipedia--btn + .gh-btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .gh-btn-container .gh-btn + .gh-btn:not(.crayons-btn--outlined):hover, .gh-btn-container .crayons-btn-group .gh-btn + .gh-btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .ltag__reddit--container .gh-btn-container .ltag__reddit--btn + .gh-btn:not(.crayons-btn--outlined):hover, .gh-btn-container .crayons-btn-group .ltag__reddit--container .ltag__reddit--btn + .gh-btn:not(.crayons-btn--outlined):hover, .ltag__reddit--container .crayons-btn-group .gh-btn-container .ltag__reddit--btn + .gh-btn:not(.crayons-btn--outlined):hover, .gh-btn-container .ltag__reddit--container .crayons-btn-group .ltag__reddit--btn + .gh-btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .ltag__stackexchange--container .gh-btn-container .ltag__stackexchange--btn + .gh-btn:not(.crayons-btn--outlined):hover, .gh-btn-container .crayons-btn-group .ltag__stackexchange--container .ltag__stackexchange--btn + .gh-btn:not(.crayons-btn--outlined):hover, .ltag__stackexchange--container .crayons-btn-group .gh-btn-container .ltag__stackexchange--btn + .gh-btn:not(.crayons-btn--outlined):hover, .gh-btn-container .ltag__stackexchange--container .crayons-btn-group .ltag__stackexchange--btn + .gh-btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .ltag__reddit--container .crayons-btn + .ltag__reddit--btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .ltag__reddit--container .ltag__wikipedia--container .ltag__wikipedia--btn + .ltag__reddit--btn:not(.crayons-btn--outlined):hover, .ltag__wikipedia--container .crayons-btn-group .ltag__reddit--container .ltag__wikipedia--btn + .ltag__reddit--btn:not(.crayons-btn--outlined):hover, .ltag__reddit--container .crayons-btn-group .crayons-btn + .ltag__reddit--btn:not(.crayons-btn--outlined):hover, .ltag__reddit--container .crayons-btn-group .ltag__wikipedia--container .ltag__wikipedia--btn + .ltag__reddit--btn:not(.crayons-btn--outlined):hover, .ltag__wikipedia--container .ltag__reddit--container .crayons-btn-group .ltag__wikipedia--btn + .ltag__reddit--btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .gh-btn-container .ltag__reddit--container .gh-btn + .ltag__reddit--btn:not(.crayons-btn--outlined):hover, .ltag__reddit--container .crayons-btn-group .gh-btn-container .gh-btn + .ltag__reddit--btn:not(.crayons-btn--outlined):hover, .gh-btn-container .crayons-btn-group .ltag__reddit--container .gh-btn + .ltag__reddit--btn:not(.crayons-btn--outlined):hover, .ltag__reddit--container .gh-btn-container .crayons-btn-group .gh-btn + .ltag__reddit--btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .ltag__reddit--container .ltag__reddit--btn + .ltag__reddit--btn:not(.crayons-btn--outlined):hover, .ltag__reddit--container .crayons-btn-group .ltag__reddit--btn + .ltag__reddit--btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .ltag__stackexchange--container .ltag__reddit--container .ltag__stackexchange--btn + .ltag__reddit--btn:not(.crayons-btn--outlined):hover, .ltag__reddit--container .crayons-btn-group .ltag__stackexchange--container .ltag__stackexchange--btn + .ltag__reddit--btn:not(.crayons-btn--outlined):hover, .ltag__stackexchange--container .crayons-btn-group .ltag__reddit--container .ltag__stackexchange--btn + .ltag__reddit--btn:not(.crayons-btn--outlined):hover, .ltag__reddit--container .ltag__stackexchange--container .crayons-btn-group .ltag__stackexchange--btn + .ltag__reddit--btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .ltag__stackexchange--container .crayons-btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .ltag__stackexchange--container .ltag__wikipedia--container .ltag__wikipedia--btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined):hover, .ltag__wikipedia--container .crayons-btn-group .ltag__stackexchange--container .ltag__wikipedia--btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined):hover, .ltag__stackexchange--container .crayons-btn-group .crayons-btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined):hover, .ltag__stackexchange--container .crayons-btn-group .ltag__wikipedia--container .ltag__wikipedia--btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined):hover, .ltag__wikipedia--container .ltag__stackexchange--container .crayons-btn-group .ltag__wikipedia--btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .gh-btn-container .ltag__stackexchange--container .gh-btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined):hover, .ltag__stackexchange--container .crayons-btn-group .gh-btn-container .gh-btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined):hover, .gh-btn-container .crayons-btn-group .ltag__stackexchange--container .gh-btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined):hover, .ltag__stackexchange--container .gh-btn-container .crayons-btn-group .gh-btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .ltag__reddit--container .ltag__stackexchange--container .ltag__reddit--btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined):hover, .ltag__stackexchange--container .crayons-btn-group .ltag__reddit--container .ltag__reddit--btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined):hover, .ltag__reddit--container .crayons-btn-group .ltag__stackexchange--container .ltag__reddit--btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined):hover, .ltag__stackexchange--container .ltag__reddit--container .crayons-btn-group .ltag__reddit--btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined):hover, .crayons-btn-group .ltag__stackexchange--container .ltag__stackexchange--btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined):hover, .ltag__stackexchange--container .crayons-btn-group .ltag__stackexchange--btn + .ltag__stackexchange--btn:not(.crayons-btn--outlined):hover { box-shadow: var(--shadow-hover), inset 0 0 0 rgba(0, 0, 0, 0.1); } /* line 402, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn-group .crayons-btn + .crayons-btn--outlined, .crayons-btn-group .ltag__wikipedia--container .ltag__wikipedia--btn + .crayons-btn--outlined, .ltag__wikipedia--container .crayons-btn-group .ltag__wikipedia--btn + .crayons-btn--outlined, .crayons-btn-group .gh-btn-container .gh-btn + .crayons-btn--outlined, .gh-btn-container .crayons-btn-group .gh-btn + .crayons-btn--outlined, .crayons-btn-group .ltag__reddit--container .ltag__reddit--btn + .crayons-btn--outlined, .ltag__reddit--container .crayons-btn-group .ltag__reddit--btn + .crayons-btn--outlined, .crayons-btn-group .ltag__stackexchange--container .ltag__stackexchange--btn + .crayons-btn--outlined, .ltag__stackexchange--container .crayons-btn-group .ltag__stackexchange--btn + .crayons-btn--outlined { margin-left: calc(-1 * var(--border-width)); } /* line 406, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn-group .crayons-btn:first-child, .crayons-btn-group .ltag__wikipedia--container .ltag__wikipedia--btn:first-child, .ltag__wikipedia--container .crayons-btn-group .ltag__wikipedia--btn:first-child, .crayons-btn-group .gh-btn-container .gh-btn:first-child, .gh-btn-container .crayons-btn-group .gh-btn:first-child, .crayons-btn-group .ltag__reddit--container .ltag__reddit--btn:first-child, .ltag__reddit--container .crayons-btn-group .ltag__reddit--btn:first-child, .crayons-btn-group .ltag__stackexchange--container .ltag__stackexchange--btn:first-child, .ltag__stackexchange--container .crayons-btn-group .ltag__stackexchange--btn:first-child { border-top-left-radius: var(--radius); border-bottom-left-radius: var(--radius); } /* line 411, app/assets/stylesheets/ltags/../components/buttons.scss */ .crayons-btn-group .crayons-btn:last-child, .crayons-btn-group .ltag__wikipedia--container .ltag__wikipedia--btn:last-child, .ltag__wikipedia--container .crayons-btn-group .ltag__wikipedia--btn:last-child, .crayons-btn-group .gh-btn-container .gh-btn:last-child, .gh-btn-container .crayons-btn-group .gh-btn:last-child, .crayons-btn-group .ltag__reddit--container .ltag__reddit--btn:last-child, .ltag__reddit--container .crayons-btn-group .ltag__reddit--btn:last-child, .crayons-btn-group .ltag__stackexchange--container .ltag__stackexchange--btn:last-child, .ltag__stackexchange--container .crayons-btn-group .ltag__stackexchange--btn:last-child { border-top-right-radius: var(--radius); border-bottom-right-radius: var(--radius); } /* line 424, app/assets/stylesheets/ltags/../components/buttons.scss */ .c-btn { position: relative; display: inline-block; padding: var(--su-2) var(--su-4); border-radius: var(--radius); font: inherit; text-align: center; cursor: pointer; border: none; overflow-wrap: normal; background-color: var(--bg); color: var(--color); } /* line 437, app/assets/stylesheets/ltags/../components/buttons.scss */ .c-btn:hover:enabled, .js-focus-visible .c-btn.focus-visible:focus, .c-btn:is(label):focus-within { background-color: var(--bg-hover); color: var(--color-hover); z-index: var(--z-elevate); } /* line 445, app/assets/stylesheets/ltags/../components/buttons.scss */ .js-focus-visible .c-btn.focus-visible:focus, .c-btn:is(label):focus-within { box-shadow: var(--focus-ring); outline: 0; } /* line 451, app/assets/stylesheets/ltags/../components/buttons.scss */ .c-btn[aria-expanded='true'], .c-btn[aria-pressed='true'] { --bg: var(--btn-current-bg); --color: var(--btn-current-color); font-weight: var(--fw-bold); } /* line 458, app/assets/stylesheets/ltags/../components/buttons.scss */ .c-btn[disabled] { opacity: 0.6; cursor: not-allowed; } /* line 465, app/assets/stylesheets/ltags/../components/buttons.scss */ .c-btn > * { pointer-events: none; } /* line 467, app/assets/stylesheets/ltags/../components/buttons.scss */ .c-btn > * + input { pointer-events: revert; } /* line 473, app/assets/stylesheets/ltags/../components/buttons.scss */ .c-btn { --bg: var(--btn-bg); --bg-hover: var(--btn-bg-hover); --color: var(--btn-color); --color-hover: var(--btn-color-hover); } /* line 479, app/assets/stylesheets/ltags/../components/buttons.scss */ .c-btn.c-btn--destructive { --bg: var(--btn-destructive-bg); --bg-hover: var(--btn-destructive-bg-hover); --color: var(--btn-destructive-color); --color-hover: var(--btn-destructive-color-hover); } /* line 487, app/assets/stylesheets/ltags/../components/buttons.scss */ .c-btn--primary { --bg: var(--btn-primary-bg); --bg-hover: var(--btn-primary-bg-hover); --color: var(--btn-primary-color); --color-hover: var(--btn-primary-color-hover); font-weight: var(--fw-medium); } /* line 495, app/assets/stylesheets/ltags/../components/buttons.scss */ .c-btn--primary.c-btn--destructive { --bg: var(--btn-primary-destructive-bg); --bg-hover: var(--btn-primary-destructive-bg-hover); --color: var(--btn-primary-destructive-color); --color-hover: var(--btn-primary-destructive-color-hover); } /* line 503, app/assets/stylesheets/ltags/../components/buttons.scss */ .c-btn--secondary { --bg: var(--btn-secondary-bg); --bg-hover: var(--btn-secondary-bg-hover); --color: var(--btn-secondary-color); --color-hover: var(--btn-secondary-color-hover); } /* line 510, app/assets/stylesheets/ltags/../components/buttons.scss */ .c-btn--icon-alone { padding: var(--su-2); } /* line 515, app/assets/stylesheets/ltags/../components/buttons.scss */ .c-btn--icon-left .c-btn__icon { margin-right: var(--su-2); margin-left: calc(var(--su-1) * -1); } /* line 4, app/assets/stylesheets/ltags/WikipediaTag.scss */ .ltag__wikipedia--container { border: 1px solid var(--form-border); box-shadow: var(--shadow-smooth); border-radius: var(--radius-auto); margin: 1.1em auto 1.3em; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'; overflow: hidden; padding-top: 1rem; } /* line 14, app/assets/stylesheets/ltags/WikipediaTag.scss */ .ltag__wikipedia--container .ltag__wikipedia--header { font-weight: var(--fw-normal); font-size: var(--fs-xl); line-height: var(--lh-base); margin: 0em 0 0.5em; padding: 0 var(--su-5); } /* line 21, app/assets/stylesheets/ltags/WikipediaTag.scss */ .ltag__wikipedia--container .ltag__wikipedia--header > a { color: var(--link-branded-color); } /* line 25, app/assets/stylesheets/ltags/WikipediaTag.scss */ .ltag__wikipedia--container .ltag__wikipedia--header .ltag__wikipedia--logo { width: 1.15em; max-width: 1.1em; display: inline-block; left: 0; margin: 0 var(--su-2) 0 0; vertical-align: middle; filter: invert(0); filter: var(--theme-social-icon-invert, invert(0)); } /* line 37, app/assets/stylesheets/ltags/WikipediaTag.scss */ .ltag__wikipedia--container .ltag__wikipedia--extract { font-weight: var(--fw-normal); margin: 0; margin-left: 0.15em; font-size: var(--fs-s); line-height: var(--lh-base); padding: 0 var(--su-5); } /* line 46, app/assets/stylesheets/ltags/WikipediaTag.scss */ .ltag__wikipedia--container .ltag__wikipedia--btn--container { padding: 1rem; z-index: var(--z-elevate); text-align: center; position: relative; box-shadow: 0px 0px 60px 42px #fff; box-shadow: 0px 0px 60px 42px var(--theme-container-background, #fff); } /* line 59, app/assets/stylesheets/ltags/WikipediaTag.scss */ .ltag__wikipedia--container .ltag__wikipedia--btn > a, .ltag__wikipedia--container .ltag__wikipedia--btn > a:hover { color: var(--button-secondary-color); } /* * This is a manifest file that'll be compiled into application.css, which will include all the files * listed below. * * Any CSS (and SCSS, if configured) file within this directory, lib/assets/stylesheets, or any plugin's * vendor/assets/stylesheets directory can be referenced here using a relative path. * * You're free to add application-wide styles to this file and they'll appear at the bottom of the * compiled file so the styles you add here take precedence over styles defined in any other CSS * files in this directory. Styles in this file should be added after the last require_* statement. * It is generally better to create a new file per style scope. * */ /* line 30, app/assets/stylesheets/application.scss */ body.modal-open { height: 100vh; overflow: hidden; } /* line 35, app/assets/stylesheets/application.scss */ .pagination a { color: #0272E2; } /* line 39, app/assets/stylesheets/application.scss */ .content-body { line-height: 1.3em; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'; } /* line 42, app/assets/stylesheets/application.scss */ .content-body.content-bodybig { font-size: 40px; font-size: calc(22px + 1vw); } /* line 47, app/assets/stylesheets/application.scss */ .content-body.content-bodybillboard h1 { font-size: 2.2em; } /* line 50, app/assets/stylesheets/application.scss */ .content-body.content-bodybillboard h2 { font-size: 1.5em; } /* line 53, app/assets/stylesheets/application.scss */ .content-body.content-bodybillboard h3 { font-size: 1.25em; } /* line 56, app/assets/stylesheets/application.scss */ .content-body.content-bodybillboard h4 { font-size: 1em; } /* line 59, app/assets/stylesheets/application.scss */ .content-body.content-bodybillboard p, .content-body.content-bodybillboard h1, .content-body.content-bodybillboard h2, .content-body.content-bodybillboard h3, .content-body.content-bodybillboard h4 { margin-top: 0; } /* line 62, app/assets/stylesheets/application.scss */ .content-body.content-bodybillboard p { line-height: 1.4em; } /* line 67, app/assets/stylesheets/application.scss */ .content-body :first-child { margin-top: 5px; } /* line 71, app/assets/stylesheets/application.scss */ .content-body h1, .content-body h2, .content-body h3, .content-body h4 { font-weight: bold; margin: 25px 0; line-height: 1.35em; } /* line 76, app/assets/stylesheets/application.scss */ .content-body h1 { font-size: 2.6em; } /* line 79, app/assets/stylesheets/application.scss */ .content-body h2 { font-size: 1.8em; } /* line 82, app/assets/stylesheets/application.scss */ .content-body h3 { font-size: 1.4em; } /* line 85, app/assets/stylesheets/application.scss */ .content-body h4 { font-size: 1.1em; } /* line 88, app/assets/stylesheets/application.scss */ .content-body p, .content-body table, .content-body pre, .content-body ul, .content-body ol, .content-body .custom-block { margin: 1.8em 0; } /* line 91, app/assets/stylesheets/application.scss */ .content-body table { border-collapse: collapse; } /* line 94, app/assets/stylesheets/application.scss */ .content-body ul { all: revert; } /* line 97, app/assets/stylesheets/application.scss */ .content-body th { background: #f5f5f4; } /* line 101, app/assets/stylesheets/application.scss */ .content-body hr { border-top: 4px solid #e9e9e7; } /* line 105, app/assets/stylesheets/application.scss */ .content-body a { text-decoration: underline; color: #3b49df; } /* line 110, app/assets/stylesheets/application.scss */ .content-body mark { background: #f1dbff; padding: 2px 4px; } /* line 115, app/assets/stylesheets/application.scss */ .content-body th, .content-body td { text-align: left; padding: 6px; border: 1px solid #425461; font-size: 0.9em; } /* line 121, app/assets/stylesheets/application.scss */ .content-body pre { background: #f5f5f4; padding: 10px 18px; border-radius: 5px; margin-left: -5px; } /* line 126, app/assets/stylesheets/application.scss */ .content-body pre code { font-size: calc(0.75em - 0.1vw); padding: 3px; } /* line 131, app/assets/stylesheets/application.scss */ .content-body code { font-family: "SF Mono", SFMono-Regular, Consolas, "Liberation Mono", Menlo, Courier, monospace; background: #f5f5f4; border-radius: 3px; padding: 3px; font-size: 0.9em; } /* line 138, app/assets/stylesheets/application.scss */ .content-body img, .content-body video { border-radius: 5px; height: auto; width: 100%; max-width: 650px; } /* line 145, app/assets/stylesheets/application.scss */ .content-body blockquote { border-left: 5px solid #425461; padding: 5px 10px; background: #f5f5f4; max-width: 800px; border-radius: 5px; } /* line 151, app/assets/stylesheets/application.scss */ .content-body blockquote p { margin: 10px 0px; } /* line 156, app/assets/stylesheets/application.scss */ .content-body .highlight__panel { display: none; } /* line 161, app/assets/stylesheets/application.scss */ .content-body .ltag__link__link:active { opacity: 0.7; } /* line 165, app/assets/stylesheets/application.scss */ .content-body .ltag__link { border: 1px solid #425461; border-radius: 3px; display: block; margin: 0.95em 0 1.2em; max-width: 100%; } @media screen and (min-width: 760px) { /* line 165, app/assets/stylesheets/application.scss */ .content-body .ltag__link { width: 620px; } } /* line 174, app/assets/stylesheets/application.scss */ .content-body .ltag__link .video-image { position: relative; padding-top: 56%; border-top-left-radius: 3px; border-top-right-radius: 3px; background: black no-repeat center center; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; display: block; } /* line 186, app/assets/stylesheets/application.scss */ .content-body .ltag__link .video-timestamp { position: absolute; font-size: 12px; bottom: 6px; right: 5px; background-color: rgba(0, 0, 0, 0.8); padding: 0px 5px 0px; font-weight: 500; border-radius: 3px; display: block; line-height: 20px; } /* line 197, app/assets/stylesheets/application.scss */ .content-body .ltag__link .video-timestamp img { height: 14px; width: 14px; display: inline-block; vertical-align: -2px; padding-left: 5px; } /* line 205, app/assets/stylesheets/application.scss */ .content-body .ltag__link .ltag__link__pic { display: inline-block; padding: calc(0.4vw + 8px) calc(0.8vw + 8px); padding-right: 8px; box-sizing: border-box; } /* line 210, app/assets/stylesheets/application.scss */ .content-body .ltag__link .ltag__link__pic img { width: calc(2.2vw + 45px); height: calc(2.2vw + 45px); margin: auto auto !important; border-radius: 150px; box-sizing: border-box; } /* line 218, app/assets/stylesheets/application.scss */ .content-body .ltag__link .ltag__link__org__pic { position: relative; display: inline-block; padding: calc(0.4vw + 8px) calc(0.8vw + 8px); padding-top: calc(0.5vw + 12px); padding-right: 8px; margin-right: 2px; box-sizing: border-box; } /* line 226, app/assets/stylesheets/application.scss */ .content-body .ltag__link .ltag__link__org__pic::after { content: ''; opacity: 0.15; width: 100%; height: 100%; position: absolute; left: 0; top: 0; pointer-events: none; box-sizing: border-box; } /* line 238, app/assets/stylesheets/application.scss */ .content-body .ltag__link .ltag__link__org__pic > img { display: inline-block; width: calc(2.5vw + 40px); height: calc(2.5vw + 40px); margin: auto auto !important; box-sizing: border-box; } /* line 245, app/assets/stylesheets/application.scss */ .content-body .ltag__link .ltag__link__user__pic { display: inline-block; position: absolute; right: calc(0.5vw * -1); bottom: calc(1vw); border: 2px solid #425461; border-radius: 100%; background-color: #425461; box-sizing: border-box; width: calc(2vw + 25px); height: calc(2vw + 25px); } /* line 256, app/assets/stylesheets/application.scss */ .content-body .ltag__link .ltag__link__user__pic img { display: inline-block; width: 100%; height: 100%; border-radius: 100%; margin: 0; } /* line 264, app/assets/stylesheets/application.scss */ .content-body .ltag__link .ltag__link__content { display: inline-block; vertical-align: top; padding: calc(0.5vw + 6px); padding-left: 0; width: calc(100% - 5vw - 70px); } /* line 270, app/assets/stylesheets/application.scss */ .content-body .ltag__link .ltag__link__content h2 { margin: 0; padding: 0; font-weight: 500; font-size: 1.5em; } /* line 276, app/assets/stylesheets/application.scss */ .content-body .ltag__link .ltag__link__content h3 { margin: 0.1vw 0; padding: 0; font-size: 0.7em; margin-bottom: 0; font-weight: bold; } /* line 283, app/assets/stylesheets/application.scss */ .content-body .ltag__link .ltag__link__content .missing { padding: 0 10px !important; } /* line 286, app/assets/stylesheets/application.scss */ .content-body .ltag__link .ltag__link__content .ltag__link__taglist { margin: 0; padding: 0; line-height: 1; font-size: 0.88em; margin-bottom: 5px; } /* line 293, app/assets/stylesheets/application.scss */ .content-body .ltag__link .ltag__link__content .ltag__link__tag { margin-right: calc(0.4vw + 4px); font-size: 0.8em; margin-left: 1px; } /* line 298, app/assets/stylesheets/application.scss */ .content-body .ltag__link .ltag__link__content .ltag__link__servicename { font-size: 0.7em; } /* line 300, app/assets/stylesheets/application.scss */ .content-body .ltag__link .ltag__link__content .ltag__link__servicename img { vertical-align: -5px; height: 1.5em; width: 1.5em; display: inline-block; margin-left: 2px; } /* line 318, app/assets/stylesheets/application.scss */ .overlay-fade-in { animation: fadeIn 0.25s; } /* line 322, app/assets/stylesheets/application.scss */ .overlay-fade-out { animation: fadeOut 0.2s; } /* line 326, app/assets/stylesheets/application.scss */ .modal-slide-in { animation: slideIn 0.15s; } /* line 330, app/assets/stylesheets/application.scss */ .modal-slide-out { animation: slideOut 0.15s; } @keyframes fadeIn { 0% { opacity: 0.1; } 100% { opacity: 0.75; } } @keyframes fadeOut { 0% { opacity: 0.75; } 100% { opacity: 0.05; } } @keyframes slideIn { 0% { right: -1050px; } 100% { right: 0; } } @keyframes slideOut { 0% { right: 0; } 100% { right: -1050px; } }