diff options
Diffstat (limited to 'assets/sass/@primer/css/forms')
-rw-r--r-- | assets/sass/@primer/css/forms/README.md | 25 | ||||
-rw-r--r-- | assets/sass/@primer/css/forms/form-control.scss | 259 | ||||
-rw-r--r-- | assets/sass/@primer/css/forms/form-group.scss | 265 | ||||
-rw-r--r-- | assets/sass/@primer/css/forms/form-select.scss | 39 | ||||
-rw-r--r-- | assets/sass/@primer/css/forms/form-validation.scss | 365 | ||||
-rw-r--r-- | assets/sass/@primer/css/forms/index.scss | 7 | ||||
-rw-r--r-- | assets/sass/@primer/css/forms/input-group.scss | 53 | ||||
-rw-r--r-- | assets/sass/@primer/css/forms/radio-group.scss | 43 |
8 files changed, 0 insertions, 1056 deletions
diff --git a/assets/sass/@primer/css/forms/README.md b/assets/sass/@primer/css/forms/README.md deleted file mode 100644 index e092504..0000000 --- a/assets/sass/@primer/css/forms/README.md +++ /dev/null @@ -1,25 +0,0 @@ ---- -bundle: "forms" -generated: true ---- - -# Primer CSS: `forms` bundle - -## Usage - -Primer CSS source files are written in [SCSS]. To include this Primer CSS module in your own build, ensure that your `node_modules` directory is listed in your Sass include paths, then import it with: - -```scss -@import "@primer/css/forms/index.scss"; -``` - -## Build - -The `@primer/css` npm package includes a standalone CSS build of this module in `dist/forms.css`. - -## License - -[MIT](https://github.com/primer/css/blob/master/LICENSE) © [GitHub](https://github.com/) - - -[scss]: https://sass-lang.com/documentation/syntax#scss diff --git a/assets/sass/@primer/css/forms/form-control.scss b/assets/sass/@primer/css/forms/form-control.scss deleted file mode 100644 index 778f320..0000000 --- a/assets/sass/@primer/css/forms/form-control.scss +++ /dev/null @@ -1,259 +0,0 @@ -// Needs refactoring -// stylelint-disable selector-no-qualifying-type, selector-max-compound-selectors -// stylelint-disable selector-max-type -// Base form controls -// -// Overrides for common inputs for easier styling. - -fieldset { - padding: 0; - margin: 0; - border: 0; -} - -label { - font-weight: $font-weight-bold; -} - -.form-control, -.form-select { - min-height: 34px; - // stylelint-disable-next-line primer/spacing - padding: 6px $spacer-2; - font-size: $h4-size; - // stylelint-disable-next-line primer/typography - line-height: 20px; - color: $text-gray-dark; - vertical-align: middle; - background-color: $bg-white; - background-repeat: no-repeat; // Repeat and position set for form states (success, error, etc) - background-position: right 8px center; // For form validation. This keeps images 8px from right and centered vertically. - border: $border-width $border-style $border-gray-dark; - border-radius: $border-radius; - outline: none; - box-shadow: $form-control-shadow; - - &.focus, - &:focus { - // stylelint-disable-next-line primer/borders - border-color: $blue-400; - outline: none; - box-shadow: $form-control-shadow, $btn-input-focus-shadow; - } - - // Ensures inputs don't zoom on mobile but are body-font size on desktop - @include breakpoint(md) { - font-size: $body-font-size; - } -} - -// Inputs with contrast for easy light gray backgrounds against white. -.input-contrast { - background-color: $bg-gray-light; - - &:focus { background-color: $bg-white; } -} - -// Inputs to be used against dark backgrounds. -.input-dark { - color: $text-white; - // stylelint-disable-next-line primer/colors - background-color: $white-fade-15; - border-color: transparent; - - &::placeholder { - color: inherit; - opacity: 0.6; // inceases contrast ratio to 4.52 - } - - &.focus, - &:focus { - // stylelint-disable-next-line primer/borders - border-color: $black-fade-30; - // stylelint-disable-next-line primer/box-shadow - box-shadow: 0 0 0 0.2em rgba($blue-300, 0.4); - } -} - -// Custom styling for HTML5 validation bubbles (WebKit only) -::placeholder { - color: $text-gray-light; -} - -// Mini inputs, to match .minibutton -.input-sm { - min-height: 28px; - // stylelint-disable-next-line primer/spacing - padding-top: 3px; - // stylelint-disable-next-line primer/spacing - padding-bottom: 3px; - font-size: $font-size-small; - // stylelint-disable-next-line primer/typography - line-height: 20px; -} - -// Large inputs -.input-lg { - padding: $spacer-1 10px; - font-size: $h4-size; -} - -// Full-width inputs -.input-block { - display: block; - width: 100%; -} - -// Inputs with monospace text -.input-monospace { - font-family: $mono-font; -} - -// Hide the icon that tries to autofill contact info in webkit -.input-hide-webkit-autofill { - &::-webkit-contacts-auto-fill-button { - position: absolute; - right: 0; - display: none !important; - pointer-events: none; - visibility: hidden; - } -} - -// Checkboxes and Radiobuttons -// -// For checkboxes and radio button selections. -.form-checkbox { - // stylelint-disable-next-line primer/spacing - padding-left: 20px; - // stylelint-disable-next-line primer/spacing - margin: 15px 0; - vertical-align: middle; - - label { - em.highlight { - position: relative; - left: -$spacer-1; - // stylelint-disable-next-line primer/spacing - padding: 2px $spacer-1; - font-style: normal; - // stylelint-disable-next-line primer/colors - background: $yellow-100; - border-radius: $border-radius; - } - } - - input[type=checkbox], - input[type=radio] { - float: left; - // stylelint-disable-next-line primer/spacing - margin: 5px 0 0 -20px; - vertical-align: middle; - } - - .note { - display: block; - margin: 0; - font-size: $font-size-small; - font-weight: $font-weight-normal; - color: $text-gray; - } -} - -.form-checkbox-details { - display: none; -} - -.form-checkbox-details-trigger { - &:checked { - // child of sibling or sibling - ~ * .form-checkbox-details, - ~ .form-checkbox-details { // eslint-disable selector-combinator-space-before - display: block; - } - } -} - -// Field groups -// -// Wrap field groups in `<div.hfields>` to lay them out horizontally - great for -// the top of pages with autosave. -.hfields { - // stylelint-disable-next-line primer/spacing - margin: 15px 0; - @include clearfix; - - .form-group { - float: left; - // stylelint-disable-next-line primer/spacing - margin: 0 30px 0 0; - - dt, // TODO: Deprecate - .form-group-header { - label { - display: inline-block; - // stylelint-disable-next-line primer/spacing - margin: 5px 0 0; - color: $text-gray; - } - - img { - position: relative; - top: -2px; - } - } - } - - .btn { - float: left; - // stylelint-disable-next-line primer/spacing - margin: 28px 25px 0 -20px; - } - - // stylelint-disable-next-line primer/spacing - .form-select { margin-top: 5px; } -} - -// Hide the up/down buttons in <input type="number"> in the login form, the -// input is used for two-factor auth codes, type="number" makes it more usable -// on phones -input::-webkit-outer-spin-button, -input::-webkit-inner-spin-button { - margin: 0; - appearance: none; -} - -// Input groups - -.form-actions { - @include clearfix; - - .btn { - float: right; - - + .btn { - // stylelint-disable-next-line primer/spacing - margin-right: 5px; - } - } -} - -.form-warning { - padding: $spacer-2 10px; - // stylelint-disable-next-line primer/spacing - margin: 10px 0; - font-size: $h5-size; - // stylelint-disable-next-line primer/colors - color: $yellow-900; - // stylelint-disable-next-line primer/colors - background: $yellow-100; - border: $border-width $border-style $border-yellow; - border-radius: $border-radius; - - p { - margin: 0; - line-height: $lh-default; - } - - a { font-weight: $font-weight-bold; } -} diff --git a/assets/sass/@primer/css/forms/form-group.scss b/assets/sass/@primer/css/forms/form-group.scss deleted file mode 100644 index c8db050..0000000 --- a/assets/sass/@primer/css/forms/form-group.scss +++ /dev/null @@ -1,265 +0,0 @@ -// stylelint-disable selector-max-compound-selectors -// stylelint-disable selector-max-type - -// Form groups -// -// Usage: -// -// <div class="form-group"> -// <div class="form-group-header"> containing the label -// <div class="form-group-body"> containing the form elements -// </div> - -.form-group { - // stylelint-disable-next-line primer/spacing - margin: 15px 0; - - // Text fields - .form-control { - width: 440px; - max-width: 100%; - // stylelint-disable-next-line primer/spacing - margin-right: 5px; - background-color: $bg-gray-light; - - &:focus { - background-color: $bg-white; - } - - &.shorter { width: 130px; } - - &.short { width: 250px; } - - &.long { width: 100%; } - } - - // Textarea - // stylelint-disable selector-no-qualifying-type - textarea.form-control { - width: 100%; - height: 200px; - min-height: 200px; - - &.short { - height: 50px; - min-height: 50px; - } - } - // stylelint-enable selector-no-qualifying-type - - // The Label - dt, // TODO: Deprecate - .form-group-header { - // stylelint-disable-next-line primer/spacing - margin: 0 0 6px; - } - - label { - position: relative; - } - - &.flattened dt, // TODO: Deprecate - &.flattened .form-group-header { - float: left; - margin: 0; - // stylelint-disable-next-line primer/typography - line-height: 32px; - } - - &.flattened dd, // TODO: Deprecate - &.flattened .form-group-body { - // stylelint-disable-next-line primer/typography - line-height: 32px; - } - - // - // Form Elements - // - // stylelint-disable selector-no-qualifying-type - dd, // TODO: Deprecate - .form-group-body { - h4 { - margin: $spacer-1 0 0; - - &.is-error { color: $text-red; } - - &.is-success { color: $text-green; } - - + .note { - margin-top: 0; - } - } - } - // stylelint-enable selector-no-qualifying-type - - // - // Variants - // - - &.required { - dt label::after, // TODO: Deprecate - .form-group-header label::after { - // stylelint-disable-next-line primer/spacing - padding-left: 5px; - color: $text-red; - content: "*"; - } - } - - // Form AJAX states - // - // Form fields that need feedback for AJAX loading, success - // states and errored states. - .success, - .error, - .indicator { - display: none; - font-size: $font-size-small; - font-weight: $font-weight-bold; - } - - &.loading { - opacity: 0.5; - - .indicator { - display: inline; - } - - .spinner { - display: inline-block; - vertical-align: middle; - } - } - - &.successful { - .success { - display: inline; - color: $text-green; - } - } - - // Form validation - // - // Our inline errors - - &.successed, - &.warn, - &.errored { - .success, - .warning, - .error { - position: absolute; - z-index: 10; - display: block; // Show up in errored/warn state - max-width: 450px; // Keep our long errors readable - // stylelint-disable-next-line primer/spacing - padding: 5px $spacer-2; - margin: $spacer-1 0 0; - // stylelint-disable-next-line primer/typography - font-size: 13px; - font-weight: $font-weight-normal; - border-style: $border-style; - border-width: $border-width; - border-radius: $border-radius; - - &::after, - &::before { - position: absolute; - bottom: 100%; - left: 10px; - z-index: 15; - width: 0; - height: 0; - pointer-events: none; - content: " "; - // stylelint-disable-next-line primer/borders - border: $border-style transparent; - } - - &::after { - // stylelint-disable-next-line primer/borders - border-width: 5px; - } - - &::before { - // stylelint-disable-next-line primer/spacing - margin-left: -1px; - // stylelint-disable-next-line primer/borders - border-width: 6px; - } - } - } - - &.successed { - .success { - // stylelint-disable-next-line primer/colors - color: $green-900; - // stylelint-disable-next-line primer/colors - background-color: $green-100; - border-color: $border-green; - - &::after { - // stylelint-disable-next-line primer/borders - border-bottom-color: $green-100; - } - - &::before { - border-bottom-color: $border-green; - } - } - } - - &.warn { - .warning { - // stylelint-disable-next-line primer/colors - color: $yellow-900; - // stylelint-disable-next-line primer/colors - background-color: $yellow-100; - border-color: $border-yellow; - - &::after { - // stylelint-disable-next-line primer/borders - border-bottom-color: $yellow-100; - } - - &::before { - border-bottom-color: $border-yellow; - } - } - } - - &.errored { - label { - color: $text-red; - } - - .error { - // stylelint-disable-next-line primer/colors - color: $red-900; - background-color: $bg-red-light; - border-color: $border-red-light; - - &::after { - // stylelint-disable-next-line primer/borders - border-bottom-color: $bg-red-light; - } - - &::before { - border-bottom-color: $border-red-light; - } - } - } -} - -.note { - min-height: 17px; - margin: $spacer-1 0 2px; - font-size: $font-size-small; - color: $text-gray; - - .spinner { - // stylelint-disable-next-line primer/spacing - margin-right: 3px; - vertical-align: middle; - } -} diff --git a/assets/sass/@primer/css/forms/form-select.scss b/assets/sass/@primer/css/forms/form-select.scss deleted file mode 100644 index ac98967..0000000 --- a/assets/sass/@primer/css/forms/form-select.scss +++ /dev/null @@ -1,39 +0,0 @@ -// Custom select -// -// Apply `.select` to any `<select>` element for custom styles. -.form-select { - display: inline-block; - max-width: 100%; - height: 34px; - padding-right: $spacer-4; - background-color: $bg-white; - background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAUCAMAAACzvE1FAAAADFBMVEUzMzMzMzMzMzMzMzMKAG/3AAAAA3RSTlMAf4C/aSLHAAAAPElEQVR42q3NMQ4AIAgEQTn//2cLdRKppSGzBYwzVXvznNWs8C58CiussPJj8h6NwgorrKRdTvuV9v16Afn0AYFOB7aYAAAAAElFTkSuQmCC"); - background-repeat: no-repeat; - background-position: right 8px center; - background-size: 8px 10px; - appearance: none; - - // Hides the default caret in IE11 - &::-ms-expand { - opacity: 0; - } - - &[multiple] { - height: auto; - } -} - -.select-sm { - height: 28px; - min-height: 28px; - // stylelint-disable-next-line primer/spacing - padding-top: 3px; - // stylelint-disable-next-line primer/spacing - padding-bottom: 3px; - font-size: $font-size-small; - - &[multiple] { - height: auto; - min-height: 0; - } -} diff --git a/assets/sass/@primer/css/forms/form-validation.scss b/assets/sass/@primer/css/forms/form-validation.scss deleted file mode 100644 index a6b49c8..0000000 --- a/assets/sass/@primer/css/forms/form-validation.scss +++ /dev/null @@ -1,365 +0,0 @@ -// Needs refactoring -// stylelint-disable selector-no-qualifying-type, selector-max-type -dl.form-group > dd, // TODO: Deprecate -.form-group > .form-group-body { - .form-control { - &.is-autocheck-loading, - &.is-autocheck-successful, - &.is-autocheck-errored { - // stylelint-disable-next-line primer/spacing - padding-right: 30px; // Leave some space for our validation icons - } - - &.is-autocheck-loading { - background-image: url("/images/spinners/octocat-spinner-16px.gif"); - } - - &.is-autocheck-successful { - background-image: url("/images/modules/ajax/success.png"); - } - - &.is-autocheck-errored { - background-image: url("/images/modules/ajax/error.png"); - } - } -} - -// Retinization of form validation icons that aren't octicons yet -@include retina-media-query { - dl.form-group > dd, // TODO: Deprecate - .form-group > .form-group-body { - .form-control { - &.is-autocheck-loading, - &.is-autocheck-successful, - &.is-autocheck-errored { - background-size: 16px 16px; - } - - &.is-autocheck-loading { - background-image: url("/images/spinners/octocat-spinner-32.gif"); - } - - &.is-autocheck-successful { - background-image: url("/images/modules/ajax/success@2x.png"); - } - - &.is-autocheck-errored { - background-image: url("/images/modules/ajax/error@2x.png"); - } - } - } -} - -// Inline verification -// This overrides primer's inline form stuff -.status-indicator { - display: inline-block; - width: 16px; - height: 16px; - // stylelint-disable-next-line primer/spacing - margin-left: 5px; - - .octicon { - display: none; - } -} - -.status-indicator-success { - // Override primer - &::before { - content: ""; - } - - .octicon-check { - display: inline-block; - // stylelint-disable-next-line primer/colors - color: $green; - fill: $green; - } - - .octicon-x { - display: none; - } -} - -.status-indicator-failed { - // Override primer - &::before { - content: ""; - } - - .octicon-check { - display: none; - } - - .octicon-x { - display: inline-block; - color: $text-red; - fill: $red; - } -} - -.status-indicator-loading { - width: 16px; - background-image: url("/images/spinners/octocat-spinner-32-EAF2F5.gif"); - background-repeat: no-repeat; - background-position: 0 0; - background-size: 16px; -} - -.inline-form { - display: inline-block; - - .btn-plain { - background-color: transparent; - border: 0; - } -} - -// Drag and drop -// -// Previously part of `_forms.scss` in Primer. Needs accounting for. - -.drag-and-drop { - // stylelint-disable-next-line primer/spacing - padding: 7px 10px; - margin: 0; - // stylelint-disable-next-line primer/typography - font-size: 13px; - // stylelint-disable-next-line primer/typography - line-height: 16px; - color: $text-gray; - background-color: $bg-gray-light; - // stylelint-disable-next-line primer/borders - border: $border-width $border-style darken($gray-300, 5%); - border-top: 0; - border-bottom-right-radius: $border-radius; - border-bottom-left-radius: $border-radius; - - .default, - .loading, - .error { - display: none; - } - - .error { - color: $text-red; - } - - // Spinner - img { - vertical-align: top; - } -} - -.is-default .drag-and-drop .default { - display: inline-block; -} - -.is-uploading .drag-and-drop .loading { - display: inline-block; -} - -.is-bad-file .drag-and-drop .bad-file { - display: inline-block; -} - -.is-duplicate-filename .drag-and-drop .duplicate-filename { - display: inline-block; -} - -.is-too-big .drag-and-drop .too-big { - display: inline-block; -} - -.is-hidden-file .drag-and-drop .hidden-file { - display: inline-block; -} - -.is-empty .drag-and-drop .empty { - display: inline-block; -} - -.is-bad-permissions .drag-and-drop .bad-permissions { - display: inline-block; -} - -.is-repository-required .drag-and-drop .repository-required { - display: inline-block; -} - -.drag-and-drop-error-info { - font-weight: $font-weight-normal; - color: $text-gray; - - a { - color: $text-blue; - } -} - -.is-failed .drag-and-drop .failed-request { - display: inline-block; -} - -.manual-file-chooser { - position: absolute; - width: 240px; - // stylelint-disable-next-line primer/spacing - padding: 5px; - // stylelint-disable-next-line primer/spacing - margin-left: -80px; - cursor: pointer; - opacity: 0.0001; -} - -.manual-file-chooser:hover + .manual-file-chooser-text { - text-decoration: underline; -} - -.btn { - // align manual-file-chooser inside a button - .manual-file-chooser { - top: 0; - padding: 0; - // stylelint-disable-next-line primer/typography - line-height: 34px; - } -} - -// Focused Textarea styles -.upload-enabled { - textarea { - display: block; - // stylelint-disable-next-line primer/borders - border-bottom: $border-width dashed lighten($gray-300, 5%); - border-bottom-right-radius: 0; - border-bottom-left-radius: 0; - } - - &.focused { - border-radius: $border-radius; - box-shadow: $form-control-shadow, $btn-input-focus-shadow; - - .form-control { - box-shadow: none; - } - - .drag-and-drop { - // stylelint-disable-next-line primer/borders - border-color: lighten($blue-400, 8%); - } - } -} - -// Dropping a file on top -.dragover textarea, -.dragover .drag-and-drop { - // stylelint-disable-next-line primer/box-shadow - box-shadow: rgba(#c9ff00, 1) 0 0 3px; -} - -.write-content { - position: relative; -} - -// Form style with a write and a preview tab -.previewable-comment-form { - position: relative; - - .tabnav { - position: relative; - padding: $spacer-2 $spacer-2 0; - } - - .comment { - // stylelint-disable-next-line primer/borders - border: $border-width $border-style darken($gray-300, 5%); - } - - .comment-form-error { margin-bottom: $spacer-2; } - - .write-content, - .preview-content { - display: none; - margin: 0 $spacer-2 $spacer-2; - } - - &.write-selected .write-content, - &.preview-selected .preview-content { - display: block; - } - - textarea { - display: block; - width: 100%; - min-height: 100px; - max-height: 500px; - padding: $spacer-2; - resize: vertical; - } -} - -// Used in our boxed-group-less form styles. Give the sumbit button enough space -// to breathe without the need for the extra hr. -.form-action-spacious { - // stylelint-disable-next-line primer/spacing - margin-top: 10px; -} - -// A two column form, with a .main and a .sidebar column -// -// Override some `.timeline-comment-wrapper` defaults. -// The `div` is needed to be more specific than the other class. -div.composer { - margin-top: 0; - border: 0; -} - -// Override the previewable comment form defaults -.composer .comment-form-textarea { - height: 200px; - min-height: 200px; -} - -// stylelint-disable-next-line primer/spacing -.composer .tabnav { margin: 0 0 10px; } - -// Misc CSS -// -// Previously part of `_forms.scss` in Primer. Needs accounting for. - -h2.account { - // stylelint-disable-next-line primer/spacing - margin: 15px 0 0; - // stylelint-disable-next-line primer/typography - font-size: 18px; - font-weight: $font-weight-normal; - color: $text-gray; -} - -p.explain { - position: relative; - font-size: $font-size-small; - color: $text-gray; - - strong { - color: $text-gray-dark; - } - - .octicon { - // stylelint-disable-next-line primer/spacing - margin-right: 5px; - // stylelint-disable-next-line primer/colors - color: $gray-400; - } - - .minibutton { - top: -4px; - float: right; - } -} - -// fix for chrome bug, see https://github.com/github/github/issues/53931 -.form-group label { - position: static; -} diff --git a/assets/sass/@primer/css/forms/index.scss b/assets/sass/@primer/css/forms/index.scss deleted file mode 100644 index aab50b7..0000000 --- a/assets/sass/@primer/css/forms/index.scss +++ /dev/null @@ -1,7 +0,0 @@ -@import "../support/index.scss"; -@import "./form-control.scss"; -@import "./form-select.scss"; -@import "./form-group.scss"; -@import "./form-validation.scss"; -@import "./input-group.scss"; -@import "./radio-group.scss"; diff --git a/assets/sass/@primer/css/forms/input-group.scss b/assets/sass/@primer/css/forms/input-group.scss deleted file mode 100644 index 7cae4ee..0000000 --- a/assets/sass/@primer/css/forms/input-group.scss +++ /dev/null @@ -1,53 +0,0 @@ -.input-group { - display: table; - - .form-control { - position: relative; - width: 100%; - - &:focus { - z-index: 2; - } - - + .btn { - margin-left: 0; - } - } - - // For when you want the input group to behave like inline-block. - &.inline { - display: inline-table; - } -} - -.input-group .form-control, -.input-group-button { - display: table-cell; -} - -.input-group-button { - width: 1%; - vertical-align: middle; // Match the inputs -} - -.input-group .form-control:first-child, -.input-group-button:first-child .btn { - border-top-right-radius: 0; - border-bottom-right-radius: 0; -} - -.input-group-button:first-child .btn { - // stylelint-disable-next-line primer/spacing - margin-right: -1px; -} - -.input-group .form-control:last-child, -.input-group-button:last-child .btn { - border-top-left-radius: 0; - border-bottom-left-radius: 0; -} - -.input-group-button:last-child .btn { - // stylelint-disable-next-line primer/spacing - margin-left: -1px; -} diff --git a/assets/sass/@primer/css/forms/radio-group.scss b/assets/sass/@primer/css/forms/radio-group.scss deleted file mode 100644 index fb6c0cd..0000000 --- a/assets/sass/@primer/css/forms/radio-group.scss +++ /dev/null @@ -1,43 +0,0 @@ -// Tab like radio group - -.radio-group { - @include clearfix; -} - -.radio-label { - float: left; - // stylelint-disable-next-line primer/spacing - padding: 6px $spacer-3 6px ($spacer-3 + 12px + $spacer-2); // 12px is the size of the radio-input - // stylelint-disable-next-line primer/spacing - margin-left: -1px; - font-size: $body-font-size; - // stylelint-disable-next-line primer/typography - line-height: 20px; // Specifically not inherit our `<body>` default - color: $text-gray-dark; - cursor: pointer; - border: $border-width $border-style $border-gray-dark; - - :checked + & { - position: relative; - z-index: 1; - border-color: $border-blue; - } - - &:first-of-type { - margin-left: 0; - border-top-left-radius: $border-radius; - border-bottom-left-radius: $border-radius; - } - - &:last-of-type { - border-top-right-radius: $border-radius; - border-bottom-right-radius: $border-radius; - } -} - -.radio-input { - z-index: 3; - float: left; - // stylelint-disable-next-line primer/spacing - margin: 10px (-$spacer-5) 0 $spacer-3; -} |