pagecord custom css 16 april 2026

gistfile1.txt

@import url(https://fonts.bunny.net/css?family=merriweather:300,300i,400,400i,500,500i,600,600i,700,700i,800,800i);

 body {
   font-family: Merriweather, serif;
   line-height: normal; 
   font-weight: 300; 
}



nav {
  justify-content: center;
}

.titlebar, .avatar-container {
  justify-content: center;
}

.bio {
  text-align: auto;
}

.avatar img {
  border-radius: clamp(5px, 12%, 10px);
}

 /* Labels on the footer icons 
from https://help.pagecord.com/custom-css */

.reply-by-email::after {
  content: "Reply";
  margin-inline-start: 0.25em;
}

.upvote::after {
  content: "Like";
  margin-inline-start: 0.25em;
}



/*************************************************

HEADER AND NAVIGATION

HTML structure:
- header
  - nav
  - div .titlebar
    - div .avatar-container
      - div .avatar
      - div .blog-title
  - div .bio
*/
header {
}

.avatar {
  display: none;
}
        
nav a {
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.25em;
}

header hr {
  width: 1rem;
  height: 1px;
  background-color: var(--color-text);
  border: none;
  
  visibility: hidden;
}



/***************************************************

SIMPLIFIED CARD VIEW 
inspired from https://olly.world/7e5c13be

HTML structure:

div .post-card-content
    h2 .post-card-title p-name
    div .post-card-summary p-summary
    div .post-card-meta no-tags [or has-tags]
        time .post-card-date dt-published  [datetime attribute]
        span .post-card-bard [read more]

*/

/* Strip card chrome */
.post-card-content {
  display: flex;
  flex-direction: column;
  border: none;
  box-shadow: none;
  padding: 0;
  background: transparent;
  transition: none;

}

.post-card-title {
  color: var(--color-text);
}

.post-card-date {
  opacity: 1;
  /*color: var(--color-accent);*/
}
               
.post-card:hover .post-card-content {
  box-shadow: none;
  transform: none;
}

post-card:hover .post-card-title {
  text-decoration-color: var(--color-text);
}


/* Date above title */
.post-card-meta {
  order: -1;
}

.post-card-meta.has-tags,
.post-card-meta.no-tags {
  margin-top: 0;
  margin-bottom: 0.5rem;
}

.post-card-badge {
  display: none;
}

/* Card content */
.post-card-summary {
  margin-bottom: 0;
  /*text-align: justify;*/
  hyphens: auto;
  line-height: 1.75;
  max-width: 68ch;
  color: var(--color-text);
}

/* Experimental: show tags */
.post-card[data-tags]::after {
  content: "tagged: "attr(data-tags);
  font-size: 0.75rem;
  opacity: 0.6;
  letter-spacing: 0.03em;
  line-height: 2em;
}

/******************************************

BODY CONTENT

*/
.lexxy-content {
  hyphens: auto;
  line-height: 1.75;
}


/* FIGURE LEFT, NOT CENTER ... 

:where(.lexxy-content) figure, 
:where(.lexxy-content) .attachment {
  text-align: left !important;  
  margin-inline: 0 !important;   
}

:where(.lexxy-content) .attachment__caption {
  text-align: left !important;   
  padding-left: 0;            
}

:where(.lexxy-content) figure img,
:where(.lexxy-content) .attachment--preview img {
  margin-inline: 0 !important;   
}
  ... */