GitHub/quartz
1
0
Fork 2
mirror of https://github.com/jackyzha0/quartz.git synced 2026-03-21 13:35:42 -05:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

home page

Browse Source
This commit is contained in:
riceset 2026-03-18 19:04:55 +09:00
parent 53fe8361a4
commit bf5d18547f
6 changed files with 21 additions and 43 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
quartz/components/HomeProfile.tsx
View File

@ -123,15 +123,13 @@ const HomeProfile: QuartzComponent = () => {
<span class="home-org-logo-badge">
<img class="home-org-logo" src={item.logo} alt={item.company} />
</span>
<div class="home-exp-header">
<div class="home-exp-text">
<span class="home-exp-role">{item.role}</span>
<span class="home-exp-company">{item.company}</span>
</div>
<div class="home-exp-right">
<span class="home-exp-period">{item.period}</span>
<span class="home-exp-location">{item.location}</span>
</div>
<div class="home-exp-text">
<span class="home-exp-role">{item.role}</span>
<span class="home-exp-company">{item.company}</span>
</div>
<div class="home-exp-right">
<span class="home-exp-period">{item.period}</span>
<span class="home-exp-location">{item.location}</span>
</div>
</div>
{item.description && (

22
quartz/components/styles/homeProfile.scss
View File

@ -97,36 +97,22 @@
}
}
.home-exp-header {
flex: 1;
display: flex;
justify-content: space-between;
align-items: flex-start;
gap: 1rem;
min-width: 0;
@media all and ($mobile) {
flex-direction: column;
gap: 0.15rem;
}
}
.home-exp-text {
flex: 1;
display: flex;
flex-direction: column;
gap: 0.1rem;
min-width: 0;
}
.home-exp-right {
display: flex;
flex-direction: column;
margin-left: auto;
align-items: flex-end;
text-align: right;
gap: 0.1rem;
flex-shrink: 0;
@media all and ($mobile) {
align-items: flex-start;
}
}
.home-exp-role {

11
quartz/static/logos/tufs.svg
View File

File diff suppressed because one or more lines are too long
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 8.8 KiB

After

Width:  |  Height:  |  Size: 8.4 KiB

2
quartz/styles/base.scss
View File

@ -393,7 +393,7 @@ h1 {
margin-bottom: 1rem;
}
@media (max-width: 800px) {
@media all and ($mobile) {
h1 {
margin-top: 0;
}

5
quartz/styles/custom.scss
View File

@ -1,7 +1,8 @@
@use "./base.scss";
@use "./variables.scss" as *;
// Center the right sidebar content ONLY on mobile devices
@media (max-width: 800px) {
@media all and ($mobile) {
.right.sidebar {
text-align: center;
@ -22,7 +23,7 @@
}
// Keep everything left-aligned on desktop
@media (min-width: 801px) {
@media all and ($desktop) {
.right.sidebar {
text-align: left;
display: flex !important;

8
quartz/styles/variables.scss
View File

@ -2,16 +2,16 @@
/**
* Layout breakpoints
* $mobile: screen width below this value will use mobile styles
* $desktop: screen width above this value will use desktop styles
* $mobile: screen width below the desktop breakpoint will use mobile styles
* $desktop: screen width at or above the desktop breakpoint will use desktop styles
*/
$breakpoints: (
mobile: 800px,
desktop: 1200px,
);
$mobile: "(max-width: #{map.get($breakpoints, mobile)})";
$desktop: "(min-width: #{map.get($breakpoints, mobile) + 1px})";
$mobile: "(max-width: #{map.get($breakpoints, desktop) - 1px})";
$desktop: "(min-width: #{map.get($breakpoints, desktop)})";
$pageWidth: #{map.get($breakpoints, mobile)};
$sidePanelWidth: 320px; //380px;