app/assets/stylesheets/sass-zero/breadboard.scss in sass-zero-0.0.46 vs app/assets/stylesheets/sass-zero/breadboard.scss in sass-zero-0.0.47

- old
+ new

@@ -8,21 +8,21 @@ :root { --color-bg--main: #{$white}; --color-bg--surface: #{$gray-100}; --color-primary: #{$gray-900}; - --color-txt: #{$gray-900}; + --color-text: #{$gray-900}; --color-focus-ring: #{rgba($gray-900, $opacity-50)}; --image-bg-select: url('data:image/svg+xml,<svg viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"><path stroke="black" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M6 8l4 4 4-4"/></svg>'); --image-checked-checkbox: url('data:image/svg+xml,<svg viewBox="0 0 16 16" fill="white" xmlns="http://www.w3.org/2000/svg"><path d="M12.207 4.793a1 1 0 010 1.414l-5 5a1 1 0 01-1.414 0l-2-2a1 1 0 011.414-1.414L6.5 9.086l4.293-4.293a1 1 0 011.414 0z"/></svg>'); --image-checked-radio: url('data:image/svg+xml,<svg viewBox="0 0 16 16" fill="white" xmlns="http://www.w3.org/2000/svg"><circle cx="8" cy="8" r="3"/></svg>'); } html { background: var(--color-bg--main); - color: var(--color-txt); + color: var(--color-text); font-family: $font-family; font-size: 16px; } .btn { @@ -31,15 +31,10 @@ display: inline-block; font-weight: $font-bold; padding: $size-2 $size-4; cursor: pointer; - &:focus { - outline: 2px dotted var(--color-primary); - outline-offset: 2px; - } - &:disabled { pointer-events: none; opacity: $opacity-50; } @@ -50,19 +45,21 @@ } &--secondary { background-color: var(--color-bg--main); border-color: var(--color-primary); + color: var(--color-primary); } &--tertiary { background-color: $transparent; border-color: $transparent; } } .input { + resize: none; appearance: none; background-color: $transparent; border-radius: $radius-input; border-width: $border; padding: $size-2 $size-3; @@ -126,12 +123,14 @@ white-space: nowrap; } pre { background-color: var(--color-bg--surface); + border-left-width: $border-4; overflow-y: hidden; & > code { + border-radius: $rounded-none; display: block; padding: $size-2 $size-3; white-space: pre; } }