mirrors/phanpy
1
0
Fork 0
mirror of https://github.com/cheeaun/phanpy.git synced 2024-11-23 09:45:46 +03:00
Code Issues Projects Releases Packages Wiki Activity

Desperate attempt to make the text and buttons flows nicely in the header

Browse source 
This code will probably haunt me in the future
This commit is contained in:
Lim Chee Aun 2023-02-11 23:35:03 +08:00
parent 61edcb2115
commit 6c43ced27c
3 changed files with 17 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

18
src/app.css
View file

@ -127,10 +127,24 @@ a[href^='http'][rel*='nofollow']:visited:not(:has(div)) {
font-size: 1.2em;
text-align: center;
}
.deck > header .header-grid h1:first-child {
.deck > header .header-grid.header-grid-2 {
grid-template-columns: 1fr max-content;
}
.deck > header .header-grid-2 h1 {
text-align: left;
padding-left: 8px;
width: max-content;
}
.deck > header .header-grid h1:has(.ancestors-indicator) {
display: flex;
gap: 8px;
align-items: center;
max-width: fit-content;
}
.deck > header .header-grid h1:has(.ancestors-indicator) .hero-heading {
flex: 1;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.deck h2 {
font-size: 1.45em;

1
src/pages/status.css
View file

@ -19,7 +19,6 @@
.hero-heading {
font-size: 16px;
display: inline-block;
margin-bottom: 0.25em;
}
.hero-heading .icon {
vertical-align: middle;

2
src/pages/status.jsx
View file

@ -475,7 +475,7 @@ function StatusPage() {
<Icon icon="chevron-left" size="xl" />
</Link>
</div> */}
<div class="header-grid">
<div class="header-grid header-grid-2">
<h1>
{!heroInView && heroStatus && uiState !== 'loading' ? (
<>