Format CSS with prettier

This commit is contained in:
Sascha Ißbrücker 2024-09-23 11:04:36 +02:00
parent ed57da3c99
commit 95f489ea48
32 changed files with 2116 additions and 2044 deletions

View file

@ -13,3 +13,4 @@ format:
black bookmarks
black siteroot
npx prettier bookmarks/frontend --write
npx prettier bookmarks/styles --write

View file

@ -12,7 +12,8 @@
gap: var(--unit-2);
}
& a.weblink img, & a.weblink svg {
& a.weblink img,
& a.weblink svg {
flex: 0 0 auto;
width: 16px;
height: 16px;
@ -110,7 +111,8 @@
gap: var(--unit-2);
}
& .status .form-group, .status .form-switch {
& .status .form-group,
.status .form-switch {
margin: 0;
}

View file

@ -6,7 +6,8 @@
}
.bookmarks-form {
& .has-icon-right > input, & .has-icon-right > textarea {
& .has-icon-right > input,
& .has-icon-right > textarea {
padding-right: 30px;
}

View file

@ -32,7 +32,7 @@
/* Regular input */
& input[type='search'] {
& input[type="search"] {
height: var(--control-size);
-webkit-appearance: none;
}
@ -47,7 +47,7 @@
width: 100%;
height: var(--control-size);
& input[type='search'] {
& input[type="search"] {
width: 100%;
height: 100%;
margin: 0;
@ -61,7 +61,8 @@
border-radius: var(--border-radius);
box-shadow: var(--box-shadow-xs);
& input, & .form-autocomplete-input {
& input,
& .form-autocomplete-input {
border-top-right-radius: 0;
border-bottom-right-radius: 0;
box-shadow: none;
@ -211,7 +212,8 @@ li[ld-bookmark-item] {
text-overflow: ellipsis;
}
& .title a[data-tooltip]:hover::after, & .title a[data-tooltip]:focus::after {
& .title a[data-tooltip]:hover::after,
& .title a[data-tooltip]:focus::after {
content: attr(data-tooltip);
position: absolute;
z-index: 10;
@ -243,7 +245,8 @@ li[ld-bookmark-item] {
font-style: italic;
}
& .url-path, & .url-display {
& .url-path,
& .url-display {
font-size: var(--font-size-sm);
color: var(--secondary-link-color);
}
@ -261,12 +264,14 @@ li[ld-bookmark-item] {
}
& .tags {
& a, & a:visited:hover {
& a,
& a:visited:hover {
color: var(--alternative-color);
}
}
& .actions, & .extra-actions {
& .actions,
& .extra-actions {
display: flex;
align-items: baseline;
flex-wrap: wrap;
@ -284,7 +289,8 @@ li[ld-bookmark-item] {
color: var(--bookmark-actions-color);
font-size: var(--font-size-sm);
& a, & button.btn-link {
& a,
& button.btn-link {
color: var(--bookmark-actions-color);
--btn-icon-color: var(--bookmark-actions-color);
font-weight: var(--bookmark-actions-weight);
@ -324,12 +330,16 @@ li[ld-bookmark-item] {
padding-bottom: var(--unit-h);
&:before {
content: '';
content: "";
position: absolute;
top: 0;
bottom: 0;
left: calc(-1 * calc(var(--bulk-edit-toggle-width) + var(--bulk-edit-toggle-offset)));
width: calc(var(--bulk-edit-toggle-width) + var(--bulk-edit-toggle-offset));
left: calc(
-1 * calc(var(--bulk-edit-toggle-width) + var(--bulk-edit-toggle-offset))
);
width: calc(
var(--bulk-edit-toggle-width) + var(--bulk-edit-toggle-offset)
);
background: var(--body-color);
}
}
@ -395,7 +405,9 @@ ul.bookmark-list {
:root {
--bulk-edit-toggle-width: 16px;
--bulk-edit-toggle-offset: 8px;
--bulk-edit-bar-offset: calc(var(--bulk-edit-toggle-width) + (2 * var(--bulk-edit-toggle-offset)));
--bulk-edit-bar-offset: calc(
var(--bulk-edit-toggle-width) + (2 * var(--bulk-edit-toggle-offset))
);
--bulk-edit-transition-duration: 400ms;
}
@ -430,11 +442,13 @@ ul.bookmark-list {
/* make sticky pagination expand to cover checkboxes to the left */
&.active .bookmark-pagination.sticky:before {
content: '';
content: "";
position: absolute;
top: -1px;
bottom: 0;
left: calc(-1 * calc(var(--bulk-edit-toggle-width) + var(--bulk-edit-toggle-offset)));
left: calc(
-1 * calc(var(--bulk-edit-toggle-width) + var(--bulk-edit-toggle-offset))
);
width: calc(var(--bulk-edit-toggle-width) + var(--bulk-edit-toggle-offset));
background: var(--body-color);
border-top: solid 1px var(--secondary-border-color);
@ -456,7 +470,9 @@ ul.bookmark-list {
position: absolute;
width: var(--bulk-edit-toggle-width);
min-height: var(--bulk-edit-toggle-width);
left: calc(-1 * var(--bulk-edit-toggle-width) - var(--bulk-edit-toggle-offset));
left: calc(
-1 * var(--bulk-edit-toggle-width) - var(--bulk-edit-toggle-offset)
);
top: 50%;
transform: translateY(-50%);
padding: 0;

View file

@ -1,5 +1,9 @@
.markdown {
& p, & ul, & ol, & pre, & blockquote {
& p,
& ul,
& ol,
& pre,
& blockquote {
margin: 0 0 var(--unit-2) 0;
}
@ -11,11 +15,13 @@
margin-bottom: 0;
}
& ul, & ol {
& ul,
& ol {
margin-left: var(--unit-4);
}
& ul li, & ol li {
& ul li,
& ol li {
margin-top: var(--unit-1);
}

View file

@ -24,4 +24,3 @@ html.reader-mode {
height: auto;
}
}

View file

@ -12,7 +12,7 @@
box-sizing: border-box;
}
.input-group > input[type=submit] {
.input-group > input[type="submit"] {
height: auto;
}

View file

@ -61,7 +61,8 @@ h1 {
figcaption,
figure,
main { /* 1 */
main {
/* 1 */
display: block;
}
@ -256,7 +257,8 @@ textarea {
*/
button,
input { /* 1 */
input {
/* 1 */
overflow: visible;
}
@ -266,7 +268,8 @@ input { /* 1 */
*/
button,
select { /* 1 */
select {
/* 1 */
text-transform: none;
}
@ -299,7 +302,6 @@ button::-moz-focus-inner,
* Restore the focus styles unset by the previous rule (removed).
*/
/**
* Change the border, margin, and padding in all browsers (opinionated) (changed).
*/

View file

@ -38,6 +38,6 @@ html:lang(ko),
& s + s,
& u + ins,
& u + u {
margin-left: .125em;
margin-left: 0.125em;
}
}

View file

@ -39,12 +39,14 @@
top: 100%;
width: 100%;
& .menu-item.selected > a, & .menu-item > a:hover {
& .menu-item.selected > a,
& .menu-item > a:hover {
background: var(--menu-item-hover-bg-color);
color: var(--menu-item-hover-color);
}
& .group-item, & .group-item:hover {
& .group-item,
& .group-item:hover {
color: var(--tertiary-text-color);
text-transform: uppercase;
background: none;

View file

@ -8,22 +8,22 @@
&::after {
background: var(--primary-color);
background-clip: padding-box;
border-radius: .5rem;
border-radius: 0.5rem;
box-shadow: 0 0 0 1px var(--body-color);
color: var(--contrast-text-color);
content: attr(data-badge);
display: inline-block;
transform: translate(-.05rem, -.5rem);
transform: translate(-0.05rem, -0.5rem);
}
}
&[data-badge] {
&::after {
font-size: var(--font-size-sm);
height: .9rem;
height: 0.9rem;
line-height: 1;
min-width: .9rem;
padding: .1rem .2rem;
min-width: 0.9rem;
padding: 0.1rem 0.2rem;
text-align: center;
white-space: nowrap;
}

View file

@ -43,7 +43,11 @@
box-shadow: var(--btn-box-shadow);
text-align: center;
text-decoration: none;
transition: background 0.2s, border 0.2s, box-shadow 0.2s, color 0.2s;
transition:
background 0.2s,
border 0.2s,
box-shadow 0.2s,
color 0.2s;
user-select: none;
vertical-align: middle;
white-space: nowrap;

View file

@ -7,7 +7,7 @@
code {
border-radius: var(--border-radius);
line-height: 1.25;
padding: .1rem .2rem;
padding: 0.1rem 0.2rem;
background: var(--code-bg-color);
color: var(--code-color);
font-size: 85%;

View file

@ -4,7 +4,7 @@
position: relative;
.menu {
animation: fade-in .15s ease 1;
animation: fade-in 0.15s ease 1;
display: none;
left: 0;
max-height: 50vh;

View file

@ -71,7 +71,10 @@ details[open] summary .form-label {
outline: none;
padding: var(--control-padding-y) var(--control-padding-x);
position: relative;
transition: background 0.2s, border 0.2s, color 0.2s;
transition:
background 0.2s,
border 0.2s,
color 0.2s;
width: 100%;
&:focus {
@ -163,13 +166,17 @@ textarea.form-input {
&.select-sm {
font-size: var(--font-size-sm);
height: var(--control-size-sm);
padding: var(--control-padding-y-sm) calc(var(--control-icon-size) + var(--control-padding-x-sm)) var(--control-padding-y-sm) var(--control-padding-x-sm);
padding: var(--control-padding-y-sm)
calc(var(--control-icon-size) + var(--control-padding-x-sm))
var(--control-padding-y-sm) var(--control-padding-x-sm);
}
&.select-lg {
font-size: var(--font-size-lg);
height: var(--control-size-lg);
padding: var(--control-padding-y-lg) calc(var(--control-icon-size) + var(--control-padding-x-lg)) var(--control-padding-y-lg) var(--control-padding-x-lg);
padding: var(--control-padding-y-lg)
calc(var(--control-icon-size) + var(--control-padding-x-lg))
var(--control-padding-y-lg) var(--control-padding-x-lg);
}
/* Multiple select */
@ -185,7 +192,9 @@ textarea.form-input {
}
&:not([multiple]):not([size]) {
background: var(--input-bg-color) url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%204%205'%3E%3Cpath%20fill='%23667189'%20d='M2%200L0%202h4zm0%205L0%203h4z'/%3E%3C/svg%3E") no-repeat right .35rem center / .4rem .5rem;
background: var(--input-bg-color)
url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%204%205'%3E%3Cpath%20fill='%23667189'%20d='M2%200L0%202h4zm0%205L0%203h4z'/%3E%3C/svg%3E")
no-repeat right 0.35rem center / 0.4rem 0.5rem;
padding-right: calc(var(--control-icon-size) + var(--control-padding-x));
}
}
@ -198,7 +207,10 @@ textarea.form-input {
line-height: var(--line-height);
margin: calc((var(--control-size) - var(--control-size-sm)) / 2) 0;
min-height: var(--control-size-sm);
padding: calc((var(--control-size-sm) - var(--line-height)) / 2) var(--control-padding-x) calc((var(--control-size-sm) - var(--line-height)) / 2) calc(var(--control-icon-size) + var(--control-padding-x));
padding: calc((var(--control-size-sm) - var(--line-height)) / 2)
var(--control-padding-x)
calc((var(--control-size-sm) - var(--line-height)) / 2)
calc(var(--control-icon-size) + var(--control-padding-x));
position: relative;
input {
@ -226,7 +238,10 @@ textarea.form-input {
cursor: pointer;
display: inline-block;
position: absolute;
transition: background .2s, border .2s, color .2s;
transition:
background 0.2s,
border 0.2s,
color 0.2s;
}
/* Input checkbox, radio, and switch sizes */
@ -331,7 +346,9 @@ textarea.form-input {
border-radius: calc(var(--unit-2) + var(--border-width));
height: calc(var(--unit-4) + var(--border-width) * 2);
left: 0;
top: calc((var(--control-size-sm) - var(--unit-4)) / 2 - var(--border-width));
top: calc(
(var(--control-size-sm) - var(--unit-4)) / 2 - var(--border-width)
);
width: var(--unit-8);
&::before {
@ -343,7 +360,11 @@ textarea.form-input {
left: 0;
position: absolute;
top: 0;
transition: background .2s, border .2s, color .2s, left .2s;
transition:
background 0.2s,
border 0.2s,
color 0.2s,
left 0.2s;
width: var(--unit-4);
}
}
@ -389,11 +410,12 @@ textarea.form-input {
}
& .form-input {
padding-right: calc(var(--control-icon-size) + var(--control-padding-y) * 2);
padding-right: calc(
var(--control-icon-size) + var(--control-padding-y) * 2
);
}
}
/* Form element: Input groups */
.input-group {
display: flex;

View file

@ -40,7 +40,8 @@
padding-bottom: var(--unit-2);
}
& > a, .btn.btn-link {
& > a,
.btn.btn-link {
border-radius: var(--menu-border-radius);
color: var(--menu-item-color);
background: var(--menu-item-bg-color);

View file

@ -27,7 +27,7 @@
z-index: var(--zindex-4);
& .modal-overlay {
animation: fade-in .15s ease 1;
animation: fade-in 0.15s ease 1;
background: var(--modal-overlay-bg-color);
bottom: 0;
cursor: default;
@ -39,14 +39,15 @@
}
& .modal-container {
animation: fade-in .15s ease 1;
animation: fade-in 0.15s ease 1;
z-index: var(--zindex-0);
}
}
&.active.closing {
& .modal-overlay, & .modal-container {
animation: fade-out .15s ease 1;
& .modal-overlay,
& .modal-container {
animation: fade-out 0.15s ease 1;
}
}
}
@ -83,7 +84,7 @@
padding: 0;
line-height: 0;
cursor: pointer;
opacity: .85;
opacity: 0.85;
color: var(--secondary-text-color);
&:hover {

View file

@ -28,7 +28,7 @@
&.disabled {
& a {
cursor: default;
opacity: .5;
opacity: 0.5;
pointer-events: none;
}
}
@ -55,7 +55,7 @@
& .page-item-subtitle {
margin: 0;
opacity: .5;
opacity: 0.5;
}
}
}

View file

@ -22,7 +22,8 @@
color: var(--tab-color);
display: block;
margin: 0 var(--unit-2) 0 0;
padding: var(--unit-2) var(--unit-1) calc(var(--unit-2) - var(--border-width-lg)) var(--unit-1);
padding: var(--unit-2) var(--unit-1)
calc(var(--unit-2) - var(--border-width-lg)) var(--unit-1);
text-decoration: none;
&:focus,

View file

@ -265,15 +265,15 @@
}
.text-small {
font-size: .9em;
font-size: 0.9em;
}
.text-tiny {
font-size: .8em;
font-size: 0.8em;
}
.text-muted {
opacity: .8;
opacity: 0.8;
}
.truncate {

View file

@ -49,13 +49,20 @@
--body-color-contrast: var(--gray-100);
/* Fonts */
--base-font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto;
--mono-font-family: "SF Mono", "Segoe UI Mono", "Roboto Mono", Menlo, Courier, monospace;
--base-font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI",
Roboto;
--mono-font-family: "SF Mono", "Segoe UI Mono", "Roboto Mono", Menlo, Courier,
monospace;
--fallback-font-family: "Helvetica Neue", sans-serif;
--cjk-zh-hans-font-family: var(--base-font-family), "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", var(--fallback-font-family);
--cjk-zh-hant-font-family: var(--base-font-family), "PingFang TC", "Hiragino Sans CNS", "Microsoft JhengHei", var(--fallback-font-family);
--cjk-jp-font-family: var(--base-font-family), "Hiragino Sans", "Hiragino Kaku Gothic Pro", "Yu Gothic", YuGothic, Meiryo, var(--fallback-font-family);
--cjk-ko-font-family: var(--base-font-family), "Malgun Gothic", var(--fallback-font-family);
--cjk-zh-hans-font-family: var(--base-font-family), "PingFang SC",
"Hiragino Sans GB", "Microsoft YaHei", var(--fallback-font-family);
--cjk-zh-hant-font-family: var(--base-font-family), "PingFang TC",
"Hiragino Sans CNS", "Microsoft JhengHei", var(--fallback-font-family);
--cjk-jp-font-family: var(--base-font-family), "Hiragino Sans",
"Hiragino Kaku Gothic Pro", "Yu Gothic", YuGothic, Meiryo,
var(--fallback-font-family);
--cjk-ko-font-family: var(--base-font-family), "Malgun Gothic",
var(--fallback-font-family);
--body-font-family: var(--base-font-family), var(--fallback-font-family);
/* Unit sizes */
@ -96,9 +103,15 @@
--control-padding-x: var(--unit-2);
--control-padding-x-sm: calc(var(--unit-2) * 0.75);
--control-padding-x-lg: calc(var(--unit-2) * 1.5);
--control-padding-y: calc((var(--control-size) - var(--line-height)) / 2 - var(--border-width));
--control-padding-y-sm: calc((var(--control-size-sm) - var(--line-height)) / 2 - var(--border-width));
--control-padding-y-lg: calc((var(--control-size-lg) - var(--line-height)) / 2 - var(--border-width));
--control-padding-y: calc(
(var(--control-size) - var(--line-height)) / 2 - var(--border-width)
);
--control-padding-y-sm: calc(
(var(--control-size-sm) - var(--line-height)) / 2 - var(--border-width)
);
--control-padding-y-lg: calc(
(var(--control-size-lg) - var(--line-height)) / 2 - var(--border-width)
);
--control-icon-size: 0.8rem;
--control-width-xs: 180px;
@ -131,5 +144,6 @@
/* Shadows */
--box-shadow-xs: rgba(0, 0, 0, 0.05) 0px 1px 2px 0px;
--box-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
--box-shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
--box-shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1),
0 4px 6px -4px rgb(0 0 0 / 0.1);
}

12
package-lock.json generated
View file

@ -1,12 +1,12 @@
{
"name": "linkding",
"version": "1.33.0",
"version": "1.34.0",
"lockfileVersion": 3,
"requires": true,
"packages": {
"": {
"name": "linkding",
"version": "1.33.0",
"version": "1.34.0",
"license": "MIT",
"dependencies": {
"@hotwired/turbo": "^8.0.6",
@ -22,7 +22,7 @@
"svelte": "^4.0.0"
},
"devDependencies": {
"prettier": "^3.0.2"
"prettier": "^3.3.3"
}
},
"node_modules/@ampproject/remapping": {
@ -1931,9 +1931,9 @@
"integrity": "sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ=="
},
"node_modules/prettier": {
"version": "3.2.5",
"resolved": "https://registry.npmjs.org/prettier/-/prettier-3.2.5.tgz",
"integrity": "sha512-3/GWa9aOC0YeD7LUfvOG2NiDyhOWRvt1k+rcKhOuYnMY24iiCphgneUfJDyFXd6rZCAnuLBv6UeAULtrhT/F4A==",
"version": "3.3.3",
"resolved": "https://registry.npmjs.org/prettier/-/prettier-3.3.3.tgz",
"integrity": "sha512-i2tDNA0O5IrMO757lfrdQZCc2jPNDVntV0m/+4whiDfWaTKfMNgR7Qz0NAeGz/nRqF4m5/6CLzbP4/liHt12Ew==",
"dev": true,
"bin": {
"prettier": "bin/prettier.cjs"

View file

@ -35,7 +35,7 @@
"svelte": "^4.0.0"
},
"devDependencies": {
"prettier": "^3.0.2"
"prettier": "^3.3.3"
},
"web-types": "./web-types.json"
}