mirrors/phanpy
1
0
Fork 0
mirror of https://github.com/cheeaun/phanpy.git synced 2024-11-22 01:05:34 +03:00
Code Issues Projects Releases Packages Wiki Activity

Test a bunch of perf-related style changes

Browse source
This commit is contained in:
Lim Chee Aun 2024-01-02 12:27:22 +08:00
parent d8ceb03d74
commit d54511aa10
4 changed files with 17 additions and 11 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

16
src/app.css
View file

@ -144,9 +144,10 @@ a[href^='http'][rel*='nofollow']:visited:not(:has(div)) {
user-select: none;
}
.deck > header .header-grid {
background-color: var(--bg-blur-color);
background-color: var(--bg-color);
/* background-color: var(--bg-blur-color);
background-image: linear-gradient(to bottom, var(--bg-color), transparent);
backdrop-filter: saturate(180%) blur(20px);
backdrop-filter: saturate(180%) blur(20px); */
border-bottom: var(--hairline-width) solid var(--divider-color);
min-height: 3em;
display: grid;
@ -895,7 +896,7 @@ a[href^='http'][rel*='nofollow']:visited:not(:has(div)) {
.status-carousel > ul {
display: flex;
overflow-x: auto;
overflow-y: hidden;
overflow-y: clip;
scroll-snap-type: x mandatory;
scroll-behavior: smooth;
margin: 0;
@ -904,6 +905,8 @@ a[href^='http'][rel*='nofollow']:visited:not(:has(div)) {
align-items: flex-start;
counter-reset: index;
min-height: 160px;
max-height: 65vh;
max-height: 65dvh;
}
.status-carousel > ul > li {
scroll-snap-align: center;
@ -915,8 +918,8 @@ a[href^='http'][rel*='nofollow']:visited:not(:has(div)) {
list-style: none;
margin: 0;
padding: 0;
max-height: 65vh;
max-height: 65dvh;
/* max-height: 65vh;
max-height: 65dvh; */
counter-increment: index;
position: relative;
}
@ -1422,7 +1425,7 @@ body:has(.media-modal-container + .status-deck) .media-post-link {
right: max(16px, env(safe-area-inset-right));
padding: 16px;
background-color: var(--button-bg-blur-color);
backdrop-filter: blur(16px);
/* backdrop-filter: blur(16px); */
z-index: 10;
box-shadow: 0 3px 8px -1px var(--drop-shadow-color),
0 10px 36px -4px var(--button-bg-blur-color);
@ -2471,6 +2474,7 @@ ul.link-list li a .icon {
border-bottom: 0;
border-radius: 16px;
background-color: var(--bg-faded-blur-color);
backdrop-filter: blur(16px);
background-image: none;
border-radius: 16px;
min-height: 4em;

2
src/components/media-post.css
View file

@ -34,7 +34,7 @@
word-break: break-word;
word-wrap: break-word;
overflow-wrap: break-word;
mix-blend-mode: luminosity;
/* mix-blend-mode: luminosity; */
-webkit-line-clamp: 3;
line-clamp: 3;
-webkit-box-orient: vertical;

6
src/components/shortcuts.css
View file

@ -59,8 +59,9 @@
left: 0;
right: 0;
z-index: 100;
background-color: var(--bg-blur-color);
backdrop-filter: blur(16px) saturate(3);
background-color: var(--bg-color);
/* background-color: var(--bg-blur-color);
backdrop-filter: blur(16px) saturate(3); */
border-top: var(--hairline-width) solid var(--outline-color);
box-shadow: 0 -8px 16px -8px var(--drop-shadow-color);
overflow: auto;
@ -165,6 +166,7 @@ shortcuts .tab-bar[hidden] {
padding: env(safe-area-inset-top) env(safe-area-inset-right) 0
env(safe-area-inset-left);
background-color: var(--bg-faded-blur-color);
backdrop-filter: blur(16px);
border: 0;
box-shadow: none;
border-bottom: var(--hairline-width) solid var(--bg-faded-color);

4
src/components/status.css
View file

@ -206,7 +206,7 @@
.status-card:not(.status-carousel .status)
:is(.content, .poll, .media-container) {
max-height: 160px !important;
overflow: hidden;
overflow: clip;
}
.status.small:not(.status-carousel .status)
.status-card
@ -1957,7 +1957,7 @@ a.card:is(:hover, :focus):visited {
color: var(--media-fg-color);
background-color: var(--media-bg-color);
border: var(--hairline-width) solid var(--media-outline-color);
mix-blend-mode: luminosity;
/* mix-blend-mode: luminosity; */
border-radius: 4px;
padding: 4px;
opacity: 0.65;