improve code block button styles

pull/498/head
Cory LaViska 2021-08-10 11:07:17 -04:00
rodzic 75f2da3547
commit a396c86e84
1 zmienionych plików z 10 dodań i 5 usunięć

Wyświetl plik

@ -98,7 +98,8 @@
border-radius: 0;
background: rgb(var(--sl-color-neutral-1000));
font: inherit;
font-size: 0.875rem;
font-size: 0.7rem;
font-weight: 500;
text-transform: uppercase;
color: rgb(var(--sl-color-neutral-600));
padding: 0 1rem;
@ -106,7 +107,13 @@
transition: none;
}
.code-block__button:not(:last-of-type) {
border-right: solid 1px rgb(var(--sl-color-neutral-200));
}
.code-block__button--codepen {
display: flex;
place-items: center;
width: 6rem;
}
@ -121,6 +128,7 @@
.code-block__button:hover,
.code-block__button:active {
box-shadow: 0 0 0 1px rgb(var(--sl-color-primary-400));
border-right-color: transparent;
background-color: rgb(var(--sl-color-primary-50));
color: rgb(var(--sl-color-primary-600));
z-index: 1;
@ -130,6 +138,7 @@
outline: none;
color: rgb(var(--sl-color-primary-600));
border-color: rgb(var(--sl-color-primary-400));
border-right-color: transparent;
background-color: rgb(var(--sl-color-primary-50));
box-shadow: 0 0 0 1px rgb(var(--sl-color-primary-400)),
0 0 0 var(--sl-focus-ring-width) rgb(var(--sl-focus-ring-color-primary) / var(--sl-focus-ring-alpha));
@ -144,10 +153,6 @@
align-items: center;
justify-content: center;
width: 100%;
height: 2.5rem;
font: inherit;
font-size: 0.7rem;
font-weight: 500;
color: rgb(var(--sl-color-neutral-600));
cursor: pointer;
transition: 250ms background-color;