public/lookbook-assets/css/lookbook.css in lookbook-2.1.1 vs public/lookbook-assets/css/lookbook.css in lookbook-2.2.0
- old
+ new
@@ -54,13 +54,13 @@
line-height: inherit;
margin: 0;
}
hr {
- height: 0;
color: inherit;
border-top-width: 1px;
+ height: 0;
}
abbr:where([title]) {
-webkit-text-decoration: underline dotted;
text-decoration: underline dotted;
@@ -143,14 +143,18 @@
progress {
vertical-align: baseline;
}
-::-webkit-inner-spin-button, ::-webkit-outer-spin-button {
+::-webkit-inner-spin-button {
height: auto;
}
+::-webkit-outer-spin-button {
+ height: auto;
+}
+
[type="search"] {
-webkit-appearance: textfield;
outline-offset: -2px;
}
@@ -254,23 +258,63 @@
::-webkit-datetime-edit-fields-wrapper {
padding: 0;
}
::-webkit-date-and-time-value {
- min-height: 1.5em;
text-align: inherit;
+ min-height: 1.5em;
}
::-webkit-datetime-edit {
display: inline-flex;
}
-::-webkit-datetime-edit, ::-webkit-datetime-edit-year-field, ::-webkit-datetime-edit-month-field, ::-webkit-datetime-edit-day-field, ::-webkit-datetime-edit-hour-field, ::-webkit-datetime-edit-minute-field, ::-webkit-datetime-edit-second-field, ::-webkit-datetime-edit-millisecond-field, ::-webkit-datetime-edit-meridiem-field {
+::-webkit-datetime-edit {
padding-top: 0;
padding-bottom: 0;
}
+::-webkit-datetime-edit-year-field {
+ padding-top: 0;
+ padding-bottom: 0;
+}
+
+::-webkit-datetime-edit-month-field {
+ padding-top: 0;
+ padding-bottom: 0;
+}
+
+::-webkit-datetime-edit-day-field {
+ padding-top: 0;
+ padding-bottom: 0;
+}
+
+::-webkit-datetime-edit-hour-field {
+ padding-top: 0;
+ padding-bottom: 0;
+}
+
+::-webkit-datetime-edit-minute-field {
+ padding-top: 0;
+ padding-bottom: 0;
+}
+
+::-webkit-datetime-edit-second-field {
+ padding-top: 0;
+ padding-bottom: 0;
+}
+
+::-webkit-datetime-edit-millisecond-field {
+ padding-top: 0;
+ padding-bottom: 0;
+}
+
+::-webkit-datetime-edit-meridiem-field {
+ padding-top: 0;
+ padding-bottom: 0;
+}
+
select {
print-color-adjust: exact;
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e");
background-position: right .5rem center;
background-repeat: no-repeat;
@@ -291,19 +335,19 @@
appearance: none;
print-color-adjust: exact;
vertical-align: middle;
-webkit-user-select: none;
user-select: none;
- height: 1rem;
- width: 1rem;
color: #2563eb;
--tw-shadow: 0 0 #0000;
background-color: #fff;
background-origin: border-box;
border-width: 1px;
border-color: #6b7280;
flex-shrink: 0;
+ width: 1rem;
+ height: 1rem;
padding: 0;
display: inline-block;
}
[type="checkbox"] {
@@ -375,24 +419,24 @@
outline: 1px solid ButtonText;
outline: 1px auto -webkit-focus-ring-color;
}
html {
- height: 100vh;
- width: 100vw;
scroll-behavior: smooth;
+ width: 100vw;
+ height: 100vh;
}
@media screen and (prefers-reduced-motion: reduce) {
html {
scroll-behavior: auto;
}
}
body {
- width: 100vw;
color: var(--lookbook-text);
+ width: 100vw;
font-family: Inter var, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;
font-size: .875rem;
line-height: 1.25rem;
overflow: hidden;
}
@@ -405,12 +449,12 @@
margin: 0 !important;
padding: 0 !important;
}
::-webkit-scrollbar {
- height: .25rem;
width: .25rem;
+ height: .25rem;
}
::-webkit-scrollbar-track {
background-color: #0000;
}
@@ -511,23 +555,63 @@
.form-input::-webkit-datetime-edit-fields-wrapper {
padding: 0;
}
.form-input::-webkit-date-and-time-value {
- min-height: 1.5em;
text-align: inherit;
+ min-height: 1.5em;
}
.form-input::-webkit-datetime-edit {
display: inline-flex;
}
-.form-input::-webkit-datetime-edit, .form-input::-webkit-datetime-edit-year-field, .form-input::-webkit-datetime-edit-month-field, .form-input::-webkit-datetime-edit-day-field, .form-input::-webkit-datetime-edit-hour-field, .form-input::-webkit-datetime-edit-minute-field, .form-input::-webkit-datetime-edit-second-field, .form-input::-webkit-datetime-edit-millisecond-field, .form-input::-webkit-datetime-edit-meridiem-field {
+.form-input::-webkit-datetime-edit {
padding-top: 0;
padding-bottom: 0;
}
+.form-input::-webkit-datetime-edit-year-field {
+ padding-top: 0;
+ padding-bottom: 0;
+}
+
+.form-input::-webkit-datetime-edit-month-field {
+ padding-top: 0;
+ padding-bottom: 0;
+}
+
+.form-input::-webkit-datetime-edit-day-field {
+ padding-top: 0;
+ padding-bottom: 0;
+}
+
+.form-input::-webkit-datetime-edit-hour-field {
+ padding-top: 0;
+ padding-bottom: 0;
+}
+
+.form-input::-webkit-datetime-edit-minute-field {
+ padding-top: 0;
+ padding-bottom: 0;
+}
+
+.form-input::-webkit-datetime-edit-second-field {
+ padding-top: 0;
+ padding-bottom: 0;
+}
+
+.form-input::-webkit-datetime-edit-millisecond-field {
+ padding-top: 0;
+ padding-bottom: 0;
+}
+
+.form-input::-webkit-datetime-edit-meridiem-field {
+ padding-top: 0;
+ padding-bottom: 0;
+}
+
.prose {
color: var(--tw-prose-body);
max-width: 65ch;
}
@@ -553,22 +637,14 @@
.prose :where(strong):not(:where([class~="not-prose"] *)) {
color: var(--tw-prose-bold);
font-weight: 600;
}
-.prose :where(a strong):not(:where([class~="not-prose"] *)) {
+.prose :where(a strong):not(:where([class~="not-prose"] *)), .prose :where(blockquote strong):not(:where([class~="not-prose"] *)), .prose :where(thead th strong):not(:where([class~="not-prose"] *)) {
color: inherit;
}
-.prose :where(blockquote strong):not(:where([class~="not-prose"] *)) {
- color: inherit;
-}
-
-.prose :where(thead th strong):not(:where([class~="not-prose"] *)) {
- color: inherit;
-}
-
.prose :where(ol):not(:where([class~="not-prose"] *)) {
margin-top: 1.25em;
margin-bottom: 1.25em;
padding-left: 1.625em;
list-style-type: decimal;
@@ -733,40 +809,28 @@
.prose :where(code):not(:where([class~="not-prose"] *)):before, .prose :where(code):not(:where([class~="not-prose"] *)):after {
content: "`";
}
-.prose :where(a code):not(:where([class~="not-prose"] *)) {
+.prose :where(a code):not(:where([class~="not-prose"] *)), .prose :where(h1 code):not(:where([class~="not-prose"] *)) {
color: inherit;
}
-.prose :where(h1 code):not(:where([class~="not-prose"] *)) {
- color: inherit;
-}
-
.prose :where(h2 code):not(:where([class~="not-prose"] *)) {
color: inherit;
font-size: .875em;
}
.prose :where(h3 code):not(:where([class~="not-prose"] *)) {
color: inherit;
font-size: .9em;
}
-.prose :where(h4 code):not(:where([class~="not-prose"] *)) {
+.prose :where(h4 code):not(:where([class~="not-prose"] *)), .prose :where(blockquote code):not(:where([class~="not-prose"] *)), .prose :where(thead th code):not(:where([class~="not-prose"] *)) {
color: inherit;
}
-.prose :where(blockquote code):not(:where([class~="not-prose"] *)) {
- color: inherit;
-}
-
-.prose :where(thead th code):not(:where([class~="not-prose"] *)) {
- color: inherit;
-}
-
.prose :where(pre):not(:where([class~="not-prose"] *)) {
color: var(--tw-prose-pre-code);
background-color: var(--tw-prose-pre-bg);
border-radius: .375rem;
margin-top: 1.71429em;
@@ -793,13 +857,13 @@
.prose :where(pre code):not(:where([class~="not-prose"] *)):before, .prose :where(pre code):not(:where([class~="not-prose"] *)):after {
content: none;
}
.prose :where(table):not(:where([class~="not-prose"] *)) {
- width: 100%;
table-layout: auto;
text-align: left;
+ width: 100%;
margin-top: 2em;
margin-bottom: 2em;
font-size: .875em;
line-height: 1.71429;
}
@@ -875,33 +939,24 @@
--tw-prose-invert-td-borders: #374151;
font-size: 1rem;
line-height: 1.75;
}
-.prose :where(video):not(:where([class~="not-prose"] *)) {
+.prose :where(video):not(:where([class~="not-prose"] *)), .prose :where(figure):not(:where([class~="not-prose"] *)) {
margin-top: 2em;
margin-bottom: 2em;
}
-.prose :where(figure):not(:where([class~="not-prose"] *)) {
- margin-top: 2em;
- margin-bottom: 2em;
-}
-
.prose :where(li):not(:where([class~="not-prose"] *)) {
margin-top: .5em;
margin-bottom: .5em;
}
-.prose :where(ol > li):not(:where([class~="not-prose"] *)) {
+.prose :where(ol > li):not(:where([class~="not-prose"] *)), .prose :where(ul > li):not(:where([class~="not-prose"] *)) {
padding-left: .375em;
}
-.prose :where(ul > li):not(:where([class~="not-prose"] *)) {
- padding-left: .375em;
-}
-
.prose :where(.prose > ul > li p):not(:where([class~="not-prose"] *)) {
margin-top: .75em;
margin-bottom: .75em;
}
@@ -924,26 +979,14 @@
.prose :where(ul ul, ul ol, ol ul, ol ol):not(:where([class~="not-prose"] *)) {
margin-top: .75em;
margin-bottom: .75em;
}
-.prose :where(hr + *):not(:where([class~="not-prose"] *)) {
+.prose :where(hr + *):not(:where([class~="not-prose"] *)), .prose :where(h2 + *):not(:where([class~="not-prose"] *)), .prose :where(h3 + *):not(:where([class~="not-prose"] *)), .prose :where(h4 + *):not(:where([class~="not-prose"] *)) {
margin-top: 0;
}
-.prose :where(h2 + *):not(:where([class~="not-prose"] *)) {
- margin-top: 0;
-}
-
-.prose :where(h3 + *):not(:where([class~="not-prose"] *)) {
- margin-top: 0;
-}
-
-.prose :where(h4 + *):not(:where([class~="not-prose"] *)) {
- margin-top: 0;
-}
-
.prose :where(thead th:first-child):not(:where([class~="not-prose"] *)) {
padding-left: 0;
}
.prose :where(thead th:last-child):not(:where([class~="not-prose"] *)) {
@@ -1018,25 +1061,15 @@
margin-top: 1.42857em;
margin-bottom: .571429em;
line-height: 1.42857;
}
-.prose-sm :where(img):not(:where([class~="not-prose"] *)) {
+.prose-sm :where(img):not(:where([class~="not-prose"] *)), .prose-sm :where(video):not(:where([class~="not-prose"] *)), .prose-sm :where(figure):not(:where([class~="not-prose"] *)) {
margin-top: 1.71429em;
margin-bottom: 1.71429em;
}
-.prose-sm :where(video):not(:where([class~="not-prose"] *)) {
- margin-top: 1.71429em;
- margin-bottom: 1.71429em;
-}
-
-.prose-sm :where(figure):not(:where([class~="not-prose"] *)) {
- margin-top: 1.71429em;
- margin-bottom: 1.71429em;
-}
-
.prose-sm :where(figure > *):not(:where([class~="not-prose"] *)) {
margin-top: 0;
margin-bottom: 0;
}
@@ -1065,35 +1098,25 @@
padding: .666667em 1em;
font-size: .857143em;
line-height: 1.66667;
}
-.prose-sm :where(ol):not(:where([class~="not-prose"] *)) {
+.prose-sm :where(ol):not(:where([class~="not-prose"] *)), .prose-sm :where(ul):not(:where([class~="not-prose"] *)) {
margin-top: 1.14286em;
margin-bottom: 1.14286em;
padding-left: 1.57143em;
}
-.prose-sm :where(ul):not(:where([class~="not-prose"] *)) {
- margin-top: 1.14286em;
- margin-bottom: 1.14286em;
- padding-left: 1.57143em;
-}
-
.prose-sm :where(li):not(:where([class~="not-prose"] *)) {
margin-top: .285714em;
margin-bottom: .285714em;
}
-.prose-sm :where(ol > li):not(:where([class~="not-prose"] *)) {
+.prose-sm :where(ol > li):not(:where([class~="not-prose"] *)), .prose-sm :where(ul > li):not(:where([class~="not-prose"] *)) {
padding-left: .428571em;
}
-.prose-sm :where(ul > li):not(:where([class~="not-prose"] *)) {
- padding-left: .428571em;
-}
-
.prose-sm :where(.prose-sm > ul > li p):not(:where([class~="not-prose"] *)) {
margin-top: .571429em;
margin-bottom: .571429em;
}
@@ -1121,26 +1144,14 @@
.prose-sm :where(hr):not(:where([class~="not-prose"] *)) {
margin-top: 2.85714em;
margin-bottom: 2.85714em;
}
-.prose-sm :where(hr + *):not(:where([class~="not-prose"] *)) {
+.prose-sm :where(hr + *):not(:where([class~="not-prose"] *)), .prose-sm :where(h2 + *):not(:where([class~="not-prose"] *)), .prose-sm :where(h3 + *):not(:where([class~="not-prose"] *)), .prose-sm :where(h4 + *):not(:where([class~="not-prose"] *)) {
margin-top: 0;
}
-.prose-sm :where(h2 + *):not(:where([class~="not-prose"] *)) {
- margin-top: 0;
-}
-
-.prose-sm :where(h3 + *):not(:where([class~="not-prose"] *)) {
- margin-top: 0;
-}
-
-.prose-sm :where(h4 + *):not(:where([class~="not-prose"] *)) {
- margin-top: 0;
-}
-
.prose-sm :where(table):not(:where([class~="not-prose"] *)) {
font-size: .857143em;
line-height: 1.5;
}
@@ -1226,25 +1237,15 @@
margin-top: 1.77778em;
margin-bottom: .444444em;
line-height: 1.55556;
}
-.prose-lg :where(img):not(:where([class~="not-prose"] *)) {
+.prose-lg :where(img):not(:where([class~="not-prose"] *)), .prose-lg :where(video):not(:where([class~="not-prose"] *)), .prose-lg :where(figure):not(:where([class~="not-prose"] *)) {
margin-top: 1.77778em;
margin-bottom: 1.77778em;
}
-.prose-lg :where(video):not(:where([class~="not-prose"] *)) {
- margin-top: 1.77778em;
- margin-bottom: 1.77778em;
-}
-
-.prose-lg :where(figure):not(:where([class~="not-prose"] *)) {
- margin-top: 1.77778em;
- margin-bottom: 1.77778em;
-}
-
.prose-lg :where(figure > *):not(:where([class~="not-prose"] *)) {
margin-top: 0;
margin-bottom: 0;
}
@@ -1273,35 +1274,25 @@
padding: 1em 1.5em;
font-size: .888889em;
line-height: 1.75;
}
-.prose-lg :where(ol):not(:where([class~="not-prose"] *)) {
+.prose-lg :where(ol):not(:where([class~="not-prose"] *)), .prose-lg :where(ul):not(:where([class~="not-prose"] *)) {
margin-top: 1.33333em;
margin-bottom: 1.33333em;
padding-left: 1.55556em;
}
-.prose-lg :where(ul):not(:where([class~="not-prose"] *)) {
- margin-top: 1.33333em;
- margin-bottom: 1.33333em;
- padding-left: 1.55556em;
-}
-
.prose-lg :where(li):not(:where([class~="not-prose"] *)) {
margin-top: .666667em;
margin-bottom: .666667em;
}
-.prose-lg :where(ol > li):not(:where([class~="not-prose"] *)) {
+.prose-lg :where(ol > li):not(:where([class~="not-prose"] *)), .prose-lg :where(ul > li):not(:where([class~="not-prose"] *)) {
padding-left: .444444em;
}
-.prose-lg :where(ul > li):not(:where([class~="not-prose"] *)) {
- padding-left: .444444em;
-}
-
.prose-lg :where(.prose-lg > ul > li p):not(:where([class~="not-prose"] *)) {
margin-top: .888889em;
margin-bottom: .888889em;
}
@@ -1329,26 +1320,14 @@
.prose-lg :where(hr):not(:where([class~="not-prose"] *)) {
margin-top: 3.11111em;
margin-bottom: 3.11111em;
}
-.prose-lg :where(hr + *):not(:where([class~="not-prose"] *)) {
+.prose-lg :where(hr + *):not(:where([class~="not-prose"] *)), .prose-lg :where(h2 + *):not(:where([class~="not-prose"] *)), .prose-lg :where(h3 + *):not(:where([class~="not-prose"] *)), .prose-lg :where(h4 + *):not(:where([class~="not-prose"] *)) {
margin-top: 0;
}
-.prose-lg :where(h2 + *):not(:where([class~="not-prose"] *)) {
- margin-top: 0;
-}
-
-.prose-lg :where(h3 + *):not(:where([class~="not-prose"] *)) {
- margin-top: 0;
-}
-
-.prose-lg :where(h4 + *):not(:where([class~="not-prose"] *)) {
- margin-top: 0;
-}
-
.prose-lg :where(table):not(:where([class~="not-prose"] *)) {
font-size: .888889em;
line-height: 1.5;
}
@@ -1400,35 +1379,34 @@
}
[data-component="code"] .code {
padding-top: 1rem;
padding-bottom: 1rem;
- overflow-x: auto;
- overflow-y: hidden;
+ overflow: auto hidden;
}
[data-component="code"].numbered {
padding: 0;
}
[data-component="code"].numbered .wrapper {
- height: 100%;
- width: 100%;
grid-template-columns: min-content 1fr;
+ width: 100%;
+ height: 100%;
display: grid;
position: relative;
}
[data-component="code"].numbered .line-numbers {
- width: min-content;
z-index: 10;
- height: 100%;
-webkit-user-select: none;
user-select: none;
text-align: right;
border-style: dashed;
border-right-width: 1px;
+ width: min-content;
+ height: 100%;
padding: .75rem;
}
[data-component="code"].numbered .line-number {
min-width: 1.4em;
@@ -1484,19 +1462,19 @@
display: -webkit-box;
overflow: hidden;
}
[data-component="header"] .header-project-icon {
- height: 1.25rem;
- width: min-content;
flex: none;
+ width: min-content;
+ height: 1.25rem;
display: inline-block;
}
[data-component="header"] .header-project-icon svg {
- height: 100%;
width: auto;
+ height: 100%;
}
[data-component="icon"] {
flex: none;
line-height: 1;
@@ -1505,16 +1483,16 @@
transition-timing-function: cubic-bezier(.4, 0, .2, 1);
display: block;
}
[data-component="icon"] svg {
- height: 100%;
- width: 100%;
fill: #0000;
stroke: currentColor;
stroke-linecap: round;
stroke-linejoin: round;
+ width: 100%;
+ height: 100%;
}
[data-component="icon"].icon-stroke-2 svg {
stroke-width: 2px;
}
@@ -1527,19 +1505,19 @@
min-height: 100%;
padding: 1rem;
}
[data-component="message"] {
- width: 100%;
border-width: 1px;
border-color: var(--lookbook-divider);
background-color: var(--lookbook-message-bg);
--tw-shadow: 0 1px 3px 0 #0000001a, 0 1px 2px -1px #0000001a;
--tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
border-radius: .25rem;
gap: 1.5rem;
+ width: 100%;
padding: 1rem;
display: flex;
}
@media (width >= 480px) {
@@ -1595,16 +1573,16 @@
color: rgb(220 38 38 / var(--tw-text-opacity));
opacity: .5;
}
[data-component="nav"] .nav-action {
- width: 100%;
cursor: pointer;
-webkit-user-select: none;
user-select: none;
color: var(--lookbook-nav-text);
align-items: center;
+ width: 100%;
padding-top: .25rem;
padding-bottom: .25rem;
transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter, backdrop-filter;
transition-duration: .15s;
transition-timing-function: cubic-bezier(.4, 0, .2, 1);
@@ -1614,12 +1592,12 @@
[data-component="nav"] .nav-action:hover {
background-color: var(--lookbook-nav-item-hover);
}
[data-component="nav"] .nav-action-inner {
- width: 100%;
align-items: center;
+ width: 100%;
display: flex;
position: relative;
}
[data-component="nav"] .nav-toggle-icon {
@@ -1738,14 +1716,14 @@
[data-component="tabs-dropdown-tab"]:not(.hidden):last-child {
border-bottom-width: 0;
}
[data-component="toolbar"] .toolbar-sections > * {
- height: 2.5rem;
white-space: nowrap;
border-color: var(--lookbook-toolbar-divider);
align-items: center;
+ height: 2.5rem;
display: flex;
}
[data-component="toolbar"] [data-component="button-group"] {
padding-left: .45rem;
@@ -1763,16 +1741,16 @@
background-color: #fff;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 8 8'%3E%3Cg fill='%23f3f3f3' fill-opacity='1'%3E%3Cpath fill-rule='evenodd' d='M0 0h4v4H0V0zm4 4h4v4H4V4z'/%3E%3C/g%3E%3C/svg%3E");
}
[data-component="viewport"] .resize-handle {
- height: 100%;
- width: 100%;
border-color: var(--lookbook-divider);
background-color: var(--lookbook-viewport-handle);
justify-content: center;
align-items: center;
+ width: 100%;
+ height: 100%;
display: flex;
}
[data-component="viewport"] .resize-handle:hover {
background-color: var(--lookbook-viewport-handle-hover);
@@ -1810,71 +1788,77 @@
border-color: var(--lookbook-input-border-focus);
--tw-ring-color: var(--lookbook-input-border-focus);
}
[type="text"], [type="email"], [type="url"], [type="password"], [type="number"], [type="date"], [type="datetime-local"], [type="month"], [type="search"], [type="tel"], [type="time"], [type="week"], textarea, select {
- width: 100%;
background-color: var(--lookbook-input-bg);
border-radius: .375rem;
+ width: 100%;
font-size: .875rem;
line-height: 1.25rem;
display: block;
}
input[type="range"] {
appearance: none;
cursor: pointer;
- width: 100%;
background: none;
+ width: 100%;
}
input[type="range"]:focus {
outline: none;
}
input[type="range"]::-webkit-slider-runnable-track {
background-color: var(--lookbook-input-toggle);
- height: .5rem;
border-radius: .5rem;
+ height: .5rem;
}
input[type="range"]::-webkit-slider-thumb {
appearance: none;
background-color: var(--lookbook-input-toggle-active);
- height: 1rem;
- width: 1rem;
border-radius: .5rem;
+ width: 1rem;
+ height: 1rem;
margin-top: -4px;
}
input[type="range"]::-moz-range-track {
background-color: var(--lookbook-input-toggle);
- height: .5rem;
border-radius: .5rem;
+ height: .5rem;
}
input[type="range"]::-moz-range-thumb {
background-color: var(--lookbook-input-toggle-active);
- height: 1rem;
- width: 1rem;
border: none;
border-radius: .5rem;
+ width: 1rem;
+ height: 1rem;
}
-input[type="range"]:focus::-webkit-slider-thumb, input[type="range"]:focus::-moz-range-thumb {
+input[type="range"]:focus::-webkit-slider-thumb {
outline-offset: 2px;
outline-width: 1px;
outline-color: var(--lookbook-input-toggle-active);
}
+input[type="range"]:focus::-moz-range-thumb {
+ outline-offset: 2px;
+ outline-width: 1px;
+ outline-color: var(--lookbook-input-toggle-active);
+}
+
input[type="color"] {
-webkit-appearance: none;
- width: 46px;
cursor: pointer;
border-width: 1px;
border-color: var(--lookbook-input-border);
border-radius: .5rem;
+ width: 46px;
}
input[type="color"]::-webkit-color-swatch-wrapper {
padding: 0;
}
@@ -3328,13 +3312,13 @@
.tippy-box[data-inertia][data-state="visible"] {
transition-timing-function: cubic-bezier(.54, 1.5, .38, 1.11);
}
.tippy-arrow {
+ color: #333;
width: 16px;
height: 16px;
- color: #333;
}
.tippy-arrow:before {
content: "";
border-style: solid;
@@ -3907,25 +3891,15 @@
margin-top: 1.5em;
margin-bottom: .5em;
line-height: 1.5;
}
- .lg\:prose-base :where(img):not(:where([class~="not-prose"] *)) {
+ .lg\:prose-base :where(img):not(:where([class~="not-prose"] *)), .lg\:prose-base :where(video):not(:where([class~="not-prose"] *)), .lg\:prose-base :where(figure):not(:where([class~="not-prose"] *)) {
margin-top: 2em;
margin-bottom: 2em;
}
- .lg\:prose-base :where(video):not(:where([class~="not-prose"] *)) {
- margin-top: 2em;
- margin-bottom: 2em;
- }
-
- .lg\:prose-base :where(figure):not(:where([class~="not-prose"] *)) {
- margin-top: 2em;
- margin-bottom: 2em;
- }
-
.lg\:prose-base :where(figure > *):not(:where([class~="not-prose"] *)) {
margin-top: 0;
margin-bottom: 0;
}
@@ -3933,18 +3907,14 @@
margin-top: .857143em;
font-size: .875em;
line-height: 1.42857;
}
- .lg\:prose-base :where(code):not(:where([class~="not-prose"] *)) {
+ .lg\:prose-base :where(code):not(:where([class~="not-prose"] *)), .lg\:prose-base :where(h2 code):not(:where([class~="not-prose"] *)) {
font-size: .875em;
}
- .lg\:prose-base :where(h2 code):not(:where([class~="not-prose"] *)) {
- font-size: .875em;
- }
-
.lg\:prose-base :where(h3 code):not(:where([class~="not-prose"] *)) {
font-size: .9em;
}
.lg\:prose-base :where(pre):not(:where([class~="not-prose"] *)) {
@@ -3954,35 +3924,25 @@
padding: .857143em 1.14286em;
font-size: .875em;
line-height: 1.71429;
}
- .lg\:prose-base :where(ol):not(:where([class~="not-prose"] *)) {
+ .lg\:prose-base :where(ol):not(:where([class~="not-prose"] *)), .lg\:prose-base :where(ul):not(:where([class~="not-prose"] *)) {
margin-top: 1.25em;
margin-bottom: 1.25em;
padding-left: 1.625em;
}
- .lg\:prose-base :where(ul):not(:where([class~="not-prose"] *)) {
- margin-top: 1.25em;
- margin-bottom: 1.25em;
- padding-left: 1.625em;
- }
-
.lg\:prose-base :where(li):not(:where([class~="not-prose"] *)) {
margin-top: .5em;
margin-bottom: .5em;
}
- .lg\:prose-base :where(ol > li):not(:where([class~="not-prose"] *)) {
+ .lg\:prose-base :where(ol > li):not(:where([class~="not-prose"] *)), .lg\:prose-base :where(ul > li):not(:where([class~="not-prose"] *)) {
padding-left: .375em;
}
- .lg\:prose-base :where(ul > li):not(:where([class~="not-prose"] *)) {
- padding-left: .375em;
- }
-
.lg\:prose-base :where(.lg\:prose-base > ul > li p):not(:where([class~="not-prose"] *)) {
margin-top: .75em;
margin-bottom: .75em;
}
@@ -4010,22 +3970,10 @@
.lg\:prose-base :where(hr):not(:where([class~="not-prose"] *)) {
margin-top: 3em;
margin-bottom: 3em;
}
- .lg\:prose-base :where(hr + *):not(:where([class~="not-prose"] *)) {
- margin-top: 0;
- }
-
- .lg\:prose-base :where(h2 + *):not(:where([class~="not-prose"] *)) {
- margin-top: 0;
- }
-
- .lg\:prose-base :where(h3 + *):not(:where([class~="not-prose"] *)) {
- margin-top: 0;
- }
-
- .lg\:prose-base :where(h4 + *):not(:where([class~="not-prose"] *)) {
+ .lg\:prose-base :where(hr + *):not(:where([class~="not-prose"] *)), .lg\:prose-base :where(h2 + *):not(:where([class~="not-prose"] *)), .lg\:prose-base :where(h3 + *):not(:where([class~="not-prose"] *)), .lg\:prose-base :where(h4 + *):not(:where([class~="not-prose"] *)) {
margin-top: 0;
}
.lg\:prose-base :where(table):not(:where([class~="not-prose"] *)) {
font-size: .875em;