Skip to content

chore: Format css files #1956

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
marcustyphoon wants to merge 10 commits into
base: master
Choose a base branch
from
Open

chore: Format css files #1956

Show file tree
Hide file tree
Changes from 4 commits
Commits
Show all changes
10 commits
Select commit Hold shift + click to select a range
d336785
format css
marcustyphoon Oct 30, 2025
91b113b
Update backup.css
marcustyphoon Oct 30, 2025
12f2f08
Update index.js
marcustyphoon Oct 30, 2025
5baf704
Update hide_recommended_posts.js
marcustyphoon Oct 30, 2025
a504185
revert pr
marcustyphoon Feb 16, 2026
1d0fafc
Merge remote-tracking branch 'upstream/master' into format-css
marcustyphoon Feb 16, 2026
d30f833
format css
marcustyphoon Feb 16, 2026
3fa235f
Update backup.css
marcustyphoon Feb 16, 2026
a0e3be8
Revert "Update backup.css"
marcustyphoon Feb 18, 2026
c4e75a7
Merge remote-tracking branch 'upstream/master' into format-css
marcustyphoon Feb 28, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion src/action/backup.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -43,7 +43,7 @@

background-color: rgb(var(--passive-grey));
color: rgb(var(--black));
font-family: monospace, monospace;
font-family: monospace;
font-size: smaller;
white-space: pre;
}
Expand Down
4 changes: 2 additions & 2 deletions src/action/components/xkit-feature/index.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,7 @@ summary:focus {
}

.disabled summary {
color: rgba(var(--black), .8);
color: rgba(var(--black), 0.8);
}

.icon {
Expand Down Expand Up @@ -80,7 +80,7 @@ summary:focus {

background-color: orange;
color: rgb(var(--white));
content: 'New!';
content: "New!";
line-height: 1.5;
}

Expand Down
10 changes: 6 additions & 4 deletions src/action/popup.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -46,7 +46,8 @@ html {
scrollbar-color: rgb(var(--active-grey)) rgb(var(--white));
}

html, main {
html,
main {
width: 375px;
min-width: 100%;
max-width: 100%;
Expand Down Expand Up @@ -81,7 +82,7 @@ body {
border-radius: 0.5ch;
margin: 8px auto 0;

font-family: 'Courier New', Courier, monospace;
font-family: "Courier New", Courier, monospace;
line-height: 1;
}

Expand Down Expand Up @@ -119,7 +120,8 @@ nav a:hover {
background-color: rgb(var(--passive-grey));
}

nav a:active, nav a.selected {
nav a:active,
nav a.selected {
background-color: rgb(var(--active-grey));
}

Expand Down Expand Up @@ -155,7 +157,7 @@ textarea {

::placeholder {
color: inherit;
opacity: .55;
opacity: 0.55;
}

input[type="text"] {
Expand Down
8 changes: 2 additions & 6 deletions src/content_scripts/control_buttons.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -37,7 +37,6 @@
fill: var(--content-fg-secondary);
}


.xkit-control-button-container.in-legacy-footer .xkit-control-button-inner svg {
fill: rgba(var(--black), 0.65);
}
Expand All @@ -61,7 +60,6 @@
}
}


.xkit-control-button-container:is(.in-new-footer, .in-community) {
margin-left: 0;
}
Expand All @@ -75,7 +73,6 @@
padding: 8px;
}


.xkit-control-button-container.in-community {
align-self: center;
}
Expand Down Expand Up @@ -106,7 +103,6 @@
fill: var(--content-fg-tertiary);
}


.xkit-controls-row {
position: relative;

Expand All @@ -122,8 +118,8 @@
left: 12px;
right: 12px;

border-bottom: 1px solid rgba(var(--black), .13);
content: '';
border-bottom: 1px solid rgba(var(--black), 0.13);
content: "";
}

@media (max-width: 540px) {
Expand Down
20 changes: 12 additions & 8 deletions src/content_scripts/modals.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -62,7 +62,7 @@
border-radius: 8px;

background-color: rgb(var(--navy));
box-shadow: 0 0 1px rgba(var(--white-on-dark), .13);
box-shadow: 0 0 1px rgba(var(--white-on-dark), 0.13);
font-size: 1rem;
line-height: 1.5;
}
Expand All @@ -88,7 +88,7 @@
box-sizing: border-box;
width: 220px;

font-size: .875rem;
font-size: 0.875rem;
}

#xkit-modal .message table {
Expand Down Expand Up @@ -123,10 +123,10 @@
background-color: rgba(var(--white-on-dark), 0.65);
color: rgb(var(--navy));
cursor: pointer;
font-family: var(--font-family);
font-size: 1rem;
font-weight: 700;
line-height: 1.5;
font-family: var(--font-family);
font-size: 1rem;
font-weight: 700;
line-height: 1.5;
text-decoration: none;
}

Expand Down Expand Up @@ -164,5 +164,9 @@
font-weight: 700;
}

.xkit-modal-tag::before { content: '#'; }
.xkit-modal-blog::before { content: '@'; }
.xkit-modal-tag::before {
content: "#";
}
.xkit-modal-blog::before {
content: "@";
}
9 changes: 6 additions & 3 deletions src/content_scripts/notifications.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,10 +12,13 @@

#xkit-toasts div {
padding: 10px;
border-top: 1px solid rgba(var(--white-on-dark), .13);
border-top: 1px solid rgba(var(--white-on-dark), 0.13);

background-color: rgb(var(--navy));
background-image: linear-gradient(rgba(var(--white-on-dark), .07), rgba(var(--white-on-dark), .07));
background-image: linear-gradient(
rgba(var(--white-on-dark), 0.07),
rgba(var(--white-on-dark), 0.07)
);
color: rgb(var(--white-on-dark));
font-family: var(--font-family);
line-height: 1.5;
Expand All @@ -39,7 +42,7 @@
}

#xkit-toasts[data-in-sidebar="true"] div:not(:last-child) {
border-bottom: 1px solid rgba(var(--white-on-dark), .13);
border-bottom: 1px solid rgba(var(--white-on-dark), 0.13);
}

[role="dialog"] #xkit-toasts[data-in-sidebar="false"] {
Expand Down
2 changes: 1 addition & 1 deletion src/content_scripts/sidebar.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -81,7 +81,7 @@
}

nav .xkit-sidebar-item {
margin-bottom: .75em;
margin-bottom: 0.75em;
}

nav .xkit-sidebar-item > h1 {
Expand Down
4 changes: 2 additions & 2 deletions src/features/accesskit/index.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,9 +16,9 @@ figure.accesskit-visible-alt-text figcaption {
padding: var(--post-header-vertical-padding) var(--post-padding);
overflow: hidden;

background-color: rgba(var(--black),.07);
background-color: rgba(var(--black), 0.07);
color: rgb(var(--black));
font-size: .875rem;
font-size: 0.875rem;
line-height: 1.5;
text-align: center;
overflow-wrap: break-word;
Expand Down
2 changes: 1 addition & 1 deletion src/features/classic_footer/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -34,7 +34,7 @@ export const styleElement = buildStyle(`
right: 16px;

border-bottom: 1px solid var(--content-tint-strong);
content: '';
content: "";
}

${footerContentSelector} {
Expand Down
4 changes: 3 additions & 1 deletion src/features/collapsed_queue/index.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,9 @@
}
.xkit-collapsed-queue-container::before {
content: "";
box-shadow: inset 0 -18px 18px -24px black, inset 0 18px 18px -24px black;
box-shadow:
inset 0 -18px 18px -24px black,
inset 0 18px 18px -24px black;
position: absolute;
width: 100%;
height: 100%;
Expand Down
2 changes: 1 addition & 1 deletion src/features/no_recommended/hide_recommended_posts.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@ export const styleElement = buildStyle(`
}

:not([${unHiddenAttribute}]) + [${unHiddenAttribute}]::before {
content: 'Too many recommended posts to hide!';
content: "Too many recommended posts to hide!";

display: block;
padding: 25px 20px;
Expand Down
86 changes: 67 additions & 19 deletions src/features/quick_reblog/index.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,12 +1,12 @@
#quick-reblog {
position: absolute;
z-index: 97;
box-shadow: 0 0 15px 0 rgba(0,0,0,.5);
box-shadow: 0 0 15px 0 rgba(0, 0, 0, 0.5);
padding: 2px;
border-radius: 3px;
overflow: hidden;
color: rgb(var(--black));
font-size: .875rem;
font-size: 0.875rem;
font-weight: normal;
background-color: rgb(var(--white));
background-image: linear-gradient(rgba(var(--black), 0.13), rgba(var(--black), 0.13));
Expand Down Expand Up @@ -36,7 +36,10 @@
}
#quick-reblog[data-position="above"] {
inset: auto 50% 100% auto;
transform: translate(calc(50% + var(--horizontal-offset, 0%)), calc(0px - var(--icon-spacing)));
transform: translate(
calc(50% + var(--horizontal-offset, 0%)),
calc(0px - var(--icon-spacing))
);
}

#quick-reblog select,
Expand Down Expand Up @@ -81,7 +84,7 @@
}

#quick-reblog .quick-tags {
font-size: .875rem;
font-size: 0.875rem;
line-height: 1.125;
--button-height: calc(1.125em + (0.75ch * 2) + 2px);
}
Expand Down Expand Up @@ -179,24 +182,49 @@
background-image: linear-gradient(rgba(var(--black), 0.13), rgba(var(--black), 0.13));
}

#quick-reblog button[data-state="published"] { color: rgb(var(--blue)); }
#quick-reblog button[data-state="queue"] { color: rgb(var(--pink)); }
#quick-reblog button[data-state="draft"] { color: rgb(var(--orange)); }
#quick-reblog button[data-state="published"] {
color: rgb(var(--blue));
}
#quick-reblog button[data-state="queue"] {
color: rgb(var(--pink));
}
#quick-reblog button[data-state="draft"] {
color: rgb(var(--orange));
}

#quick-reblog .action-buttons.community-selected button:not([data-state="published"]) { display: none; }
#quick-reblog .action-buttons.community-selected button:not([data-state="published"]) {
display: none;
}

/* === AlreadyReblogged === */

footer.published :is(button:not([role]), a[href^="/reblog/"]) use:is([href="#managed-icon__ds-reblog-24"], [href="#managed-icon__reblog"]) { --icon-color-primary: rgb(var(--green)); }
footer.queue :is(button:not([role]), a[href^="/reblog/"]) use:is([href="#managed-icon__ds-reblog-24"], [href="#managed-icon__reblog"]) { --icon-color-primary: rgb(var(--purple)); }
footer.draft :is(button:not([role]), a[href^="/reblog/"]) use:is([href="#managed-icon__ds-reblog-24"], [href="#managed-icon__reblog"]) { --icon-color-primary: rgb(var(--red)); }
footer.published
:is(button:not([role]), a[href^="/reblog/"])
use:is([href="#managed-icon__ds-reblog-24"], [href="#managed-icon__reblog"]) {
--icon-color-primary: rgb(var(--green));
}
footer.queue
:is(button:not([role]), a[href^="/reblog/"])
use:is([href="#managed-icon__ds-reblog-24"], [href="#managed-icon__reblog"]) {
--icon-color-primary: rgb(var(--purple));
}
footer.draft
:is(button:not([role]), a[href^="/reblog/"])
use:is([href="#managed-icon__ds-reblog-24"], [href="#managed-icon__reblog"]) {
--icon-color-primary: rgb(var(--red));
}

footer:is(.published, .queue, .draft) :is(button:not([role]), a[href^="/reblog/"]):has(use:is([href="#managed-icon__ds-reblog-24"], [href="#managed-icon__reblog"])) {
footer:is(.published, .queue, .draft)
:is(button:not([role]), a[href^="/reblog/"]):has(
use:is([href="#managed-icon__ds-reblog-24"], [href="#managed-icon__reblog"])
) {
position: relative;
}

/* Cut-out for tick in 2025 post footer */
footer:is(.published, .queue, .draft) :is(a[href^="/reblog/"], button) svg:has(use[href="#managed-icon__ds-reblog-24"]) {
footer:is(.published, .queue, .draft)
:is(a[href^="/reblog/"], button)
svg:has(use[href="#managed-icon__ds-reblog-24"]) {
-webkit-mask-image: radial-gradient(
calc(14.7px / 2) calc(18px / 2) at bottom 4px left 21px,
transparent 99%,
Expand All @@ -210,7 +238,10 @@ footer:is(.published, .queue, .draft) :is(a[href^="/reblog/"], button) svg:has(u
}

/* Styles for tick pseudo-element */
footer:is(.published, .queue, .draft) :is(button:not([role]), a[href^="/reblog/"]):has(use:is([href="#managed-icon__ds-reblog-24"], [href="#managed-icon__reblog"]))::after {
footer:is(.published, .queue, .draft)
:is(button:not([role]), a[href^="/reblog/"]):has(
use:is([href="#managed-icon__ds-reblog-24"], [href="#managed-icon__reblog"])
)::after {
position: absolute;

display: inline-block;
Expand All @@ -226,21 +257,38 @@ footer:is(.published, .queue, .draft) :is(button:not([role]), a[href^="/reblog/"
}

/* Pre-2025 post footer */
footer:is(.published, .queue, .draft) a[href^="/reblog/"]:has(use[href="#managed-icon__reblog"])::after {
footer:is(.published, .queue, .draft)
a[href^="/reblog/"]:has(use[href="#managed-icon__reblog"])::after {
background-color: var(--content-panel);
bottom: -5px;
right: -5px;
}

/* 2025 post footer */
footer:is(.published, .queue, .draft) :is(a[href^="/reblog/"], button):has(use[href="#managed-icon__ds-reblog-24"])::after {
footer:is(.published, .queue, .draft)
:is(a[href^="/reblog/"], button):has(use[href="#managed-icon__ds-reblog-24"])::after {
bottom: 4px;
left: 21px;
}

footer.published :is(button:not([role]), a[href^="/reblog/"]):has(use:is([href="#managed-icon__ds-reblog-24"], [href="#managed-icon__reblog"]))::after { color: rgb(var(--green)); }
footer.queue :is(button:not([role]), a[href^="/reblog/"]):has(use:is([href="#managed-icon__ds-reblog-24"], [href="#managed-icon__reblog"]))::after { color: rgb(var(--purple)); }
footer.draft :is(button:not([role]), a[href^="/reblog/"]):has(use:is([href="#managed-icon__ds-reblog-24"], [href="#managed-icon__reblog"]))::after { color: rgb(var(--red)); }
footer.published
:is(button:not([role]), a[href^="/reblog/"]):has(
use:is([href="#managed-icon__ds-reblog-24"], [href="#managed-icon__reblog"])
)::after {
color: rgb(var(--green));
}
footer.queue
:is(button:not([role]), a[href^="/reblog/"]):has(
use:is([href="#managed-icon__ds-reblog-24"], [href="#managed-icon__reblog"])
)::after {
color: rgb(var(--purple));
}
footer.draft
:is(button:not([role]), a[href^="/reblog/"]):has(
use:is([href="#managed-icon__ds-reblog-24"], [href="#managed-icon__reblog"])
)::after {
color: rgb(var(--red));
}

/* === XKit 7 override === */

Expand Down
Loading