Skip to content

Commit 4580ba7

Browse files
ryanphuangryanphuang
committed
tweak recent project style
1 parent 7c44c9d commit 4580ba7

2 files changed

Lines changed: 121 additions & 15 deletions

File tree

‎assets/css/modern.css‎

Lines changed: 81 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -67,7 +67,7 @@ h3 {
6767
}
6868

6969
p {
70-
color: var(--ink-subtle);
70+
color: var(--ink);
7171
}
7272

7373
a {
@@ -584,24 +584,68 @@ a:hover {
584584
.project-card__content p {
585585
margin: 0;
586586
font-size: 0.95rem;
587+
color: var(--ink-subtle);
587588
}
588589

589590
.project-card__content .button {
590591
margin-top: 0.55rem;
591592
align-self: flex-start;
592593
}
593594

594-
.project-badge {
595-
display: inline-block;
595+
.project-links {
596+
margin-top: 0.55rem;
597+
display: flex;
598+
gap: 0.45rem;
599+
flex-wrap: wrap;
600+
}
601+
602+
.project-link-icon {
603+
display: inline-flex;
604+
align-items: center;
605+
gap: 0.35rem;
606+
border: 1px solid #c7d7ee;
596607
border-radius: 999px;
597-
border: 1px solid #f0c7c7;
598-
background: #fff4f4;
599-
color: #b33535;
608+
background: #ffffff;
609+
color: #1f4f88;
610+
text-decoration: none;
611+
font-size: 0.92rem;
600612
font-weight: 700;
601-
font-size: 0.75rem;
602-
letter-spacing: 0.04em;
613+
line-height: 1;
614+
padding: 0.34rem 0.62rem;
615+
transition: all 0.2s ease;
616+
}
617+
618+
.project-link-icon i {
619+
font-size: 0.94rem;
620+
}
621+
622+
.project-link-icon:hover {
623+
border-color: var(--brand);
624+
background: var(--brand);
625+
color: #ffffff;
626+
}
627+
628+
.project-card__content .project-badge {
629+
display: inline-flex;
630+
align-items: center;
631+
gap: 0.42rem;
632+
border: 0;
633+
border-radius: 0;
634+
background: transparent;
635+
color: #c34040;
636+
font-weight: 700;
637+
font-size: 0.8rem;
638+
letter-spacing: 0.08em;
603639
text-transform: uppercase;
604-
padding: 0.22rem 0.58rem;
640+
padding: 0;
641+
}
642+
643+
.project-card__content .project-badge::before {
644+
content: "";
645+
width: 18px;
646+
height: 1px;
647+
background: #cda9a9;
648+
display: inline-block;
605649
}
606650

607651
.project-carousel-shell {
@@ -636,13 +680,40 @@ a:hover {
636680
}
637681

638682
.project-carousel .project-card__content {
639-
min-height: 292px;
683+
min-height: 0;
684+
display: flex;
685+
flex-direction: column;
686+
gap: 1rem;
687+
}
688+
689+
@media (min-width: 992px) {
690+
.project-carousel .project-card {
691+
height: 450px;
692+
}
693+
}
694+
695+
.project-carousel .project-card__content h3 {
696+
display: -webkit-box;
697+
-webkit-line-clamp: 2;
698+
-webkit-box-orient: vertical;
699+
overflow: hidden;
700+
}
701+
702+
.project-carousel .project-card__content p:not(.project-badge) {
703+
display: -webkit-box;
704+
-webkit-line-clamp: 4;
705+
-webkit-box-orient: vertical;
706+
overflow: hidden;
640707
}
641708

642709
.project-carousel .project-card__content .project-badge {
643710
margin-top: auto;
644711
}
645712

713+
.project-carousel .project-links {
714+
margin-top: 0.35rem;
715+
}
716+
646717
.project-carousel .owl-nav {
647718
margin-top: 18px;
648719
display: flex;

‎index.html‎

Lines changed: 40 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -100,7 +100,14 @@ <h2 class="section-intro__title">Recent Projects</h2>
100100
<h3>Catching Silent Errors in Deep Learning Training</h3>
101101
<p>TrainCheck learns semantic invariants from sample pipelines and enforces proactive checks at runtime to catch silent training errors early.</p>
102102
<p class="project-badge">OSDI 2025</p>
103-
<a class="button button-light" href="{{ '/paper/traincheck-osdi25-preprint.pdf' | relative_url }}" target="_blank">Read Paper</a>
103+
<div class="project-links" aria-label="TrainCheck links">
104+
<a class="project-link-icon" href="{{ '/paper/traincheck-osdi25-preprint.pdf' | relative_url }}" target="_blank" rel="noopener" title="Paper">
105+
<i class="fas fa-file-alt" aria-hidden="true"></i><span>Paper</span>
106+
</a>
107+
<a class="project-link-icon" href="https://github.com/OrderLab/TrainCheck" target="_blank" rel="noopener" title="Software">
108+
<i class="fab fa-github" aria-hidden="true"></i><span>Software</span>
109+
</a>
110+
</div>
104111
</div>
105112
</article>
106113

@@ -112,7 +119,14 @@ <h3>Catching Silent Errors in Deep Learning Training</h3>
112119
<h3>Equivalence-Based Verification for Distributed Training</h3>
113120
<p>TrainVerify verifies the parallelization logic of LLM training to eliminate subtle correctness bugs.</p>
114121
<p class="project-badge">SOSP 2025</p>
115-
<a class="button button-light" href="{{ '/paper/trainverify-sosp25.pdf' | relative_url }}" target="_blank">Read Paper</a>
122+
<div class="project-links" aria-label="TrainVerify links">
123+
<a class="project-link-icon" href="{{ '/paper/trainverify-sosp25.pdf' | relative_url }}" target="_blank" rel="noopener" title="Paper">
124+
<i class="fas fa-file-alt" aria-hidden="true"></i><span>Paper</span>
125+
</a>
126+
<a class="project-link-icon" href="https://github.com/verify-llm/TrainVerify" target="_blank" rel="noopener" title="Software">
127+
<i class="fab fa-github" aria-hidden="true"></i><span>Software</span>
128+
</a>
129+
</div>
116130
</div>
117131
</article>
118132

@@ -124,7 +138,14 @@ <h3>Equivalence-Based Verification for Distributed Training</h3>
124138
<h3>Optimistic Recovery via Partial Process State Preservation</h3>
125139
<p>Phoenix introduces OS-level mechanisms of partial process state preservation and optimistic recovery to improve application availability.</p>
126140
<p class="project-badge">SOSP 2025</p>
127-
<a class="button button-light" href="{{ '/paper/phoenix-sosp25.pdf' | relative_url }}" target="_blank">Read Paper</a>
141+
<div class="project-links" aria-label="Phoenix links">
142+
<a class="project-link-icon" href="{{ '/paper/phoenix-sosp25.pdf' | relative_url }}" target="_blank" rel="noopener" title="Paper">
143+
<i class="fas fa-file-alt" aria-hidden="true"></i><span>Paper</span>
144+
</a>
145+
<a class="project-link-icon" href="https://github.com/OrderLab/phoenix" target="_blank" rel="noopener" title="Software">
146+
<i class="fab fa-github" aria-hidden="true"></i><span>Software</span>
147+
</a>
148+
</div>
128149
</div>
129150
</article>
130151

@@ -136,7 +157,14 @@ <h3>Optimistic Recovery via Partial Process State Preservation</h3>
136157
<h3>Mitigating Application Resource Overload with Targeted Task Cancellation</h3>
137158
<p>Atropos is an overload control framework that uses targeted task cancellation to reduce application resource overload.</p>
138159
<p class="project-badge">SOSP 2025</p>
139-
<a class="button button-light" href="{{ '/paper/atropos-sosp25.pdf' | relative_url }}" target="_blank">Read Paper</a>
160+
<div class="project-links" aria-label="Atropos links">
161+
<a class="project-link-icon" href="{{ '/paper/atropos-sosp25.pdf' | relative_url }}" target="_blank" rel="noopener" title="Paper">
162+
<i class="fas fa-file-alt" aria-hidden="true"></i><span>Paper</span>
163+
</a>
164+
<a class="project-link-icon" href="https://github.com/OrderLab/Atropos" target="_blank" rel="noopener" title="Software">
165+
<i class="fab fa-github" aria-hidden="true"></i><span>Software</span>
166+
</a>
167+
</div>
140168
</div>
141169
</article>
142170

@@ -148,7 +176,14 @@ <h3>Mitigating Application Resource Overload with Targeted Task Cancellation</h3
148176
<h3>Enhancing Slow-Fault Tolerance in Distributed Systems</h3>
149177
<p>Xinda diagnoses and mitigates slow faults with adaptive mechanisms tailored to modern distributed system behavior.</p>
150178
<p class="project-badge">NSDI 2025</p>
151-
<a class="button button-light" href="{{ '/paper/xinda-nsdi25-preprint.pdf' | relative_url }}" target="_blank">Read Paper</a>
179+
<div class="project-links" aria-label="Xinda links">
180+
<a class="project-link-icon" href="{{ '/paper/xinda-nsdi25-preprint.pdf' | relative_url }}" target="_blank" rel="noopener" title="Paper">
181+
<i class="fas fa-file-alt" aria-hidden="true"></i><span>Paper</span>
182+
</a>
183+
<a class="project-link-icon" href="https://github.com/OrderLab/xinda" target="_blank" rel="noopener" title="Software">
184+
<i class="fab fa-github" aria-hidden="true"></i><span>Software</span>
185+
</a>
186+
</div>
152187
</div>
153188
</article>
154189
</div>

0 commit comments

Comments
 (0)