Wordpress Theme - Portfolio
.project-excerpt { color: #4a4238; font-size: 0.9rem; margin-bottom: 1.2rem; line-height: 1.45; }
.contact-item { display: flex; align-items: center; gap: 10px; background: #f7efdf; padding: 0.6rem 1.2rem; border-radius: 60px; font-size: 0.9rem; }
/* main content container — like a paper sheet stack */ .paper-stack { max-width: 1400px; margin: 0 auto; position: relative; z-index: 2; } Portfolio WordPress Theme
<!-- ABOUT SECTION (paper-themed) --> <section id="about" class="about-paper"> <h2 class="section-title">About this theme</h2> <div style="display: flex; flex-wrap: wrap; gap: 2rem; margin-top: 1rem;"> <div style="flex: 2; min-width: 200px;"> <p style="margin-bottom: 1rem; font-size: 1rem;">Inspired by the tactility of handmade paper, <strong>Paper Portfolio</strong> is a WordPress theme concept that blends editorial elegance with portfolio functionality. Every element — from the grain overlay to the rounded paper cards — evokes the warmth of a physical sketchbook.</p> <p style="margin-bottom: 1rem;">Perfect for artists, designers, writers, and creative studios who want their online presence to feel authentic, calm, and deeply human. Fully responsive, block-editor ready, and crafted with <i class="fas fa-heart" style="color:#c69c6d;"></i> for the WordPress ecosystem.</p> <div style="display: flex; gap: 12px; margin-top: 1.5rem;"> <span class="wp-btn" style="background:#efe2cd;"><i class="fab fa-wordpress"></i> Download theme</span> <span class="wp-btn"><i class="fas fa-file-alt"></i> Documentation</span> </div> </div> <div style="flex: 1; background: #f3ead9; border-radius: 24px; padding: 1.2rem; text-align: center; border: 1px solid #e7dcc4;"> <i class="fas fa-paper-plane" style="font-size: 2rem; color: #b48b48;"></i> <p style="font-size: 0.8rem; margin-top: 8px;">“Paper has more patience than people.” <br>— Anne Frank</p> </div> </div> </section>
<!-- tiny wordpress-style admin bar mock (just for paper portfolio flavor) --> <div class="mock-wp-toolbar"> <span><i class="fas fa-wordpress-simple"></i> Paper Theme</span> <span><i class="far fa-edit"></i> Edit Portfolio</span> <span><i class="fas fa-palette"></i> Customize</span> </div> .project-excerpt { color: #4a4238
body { background: #d9cdb0; /* warm vintage paper background */ font-family: 'Inter', sans-serif; color: #2c2b28; line-height: 1.5; padding: 2rem 1.5rem; position: relative; }
/* subtle grain overlay (paper texture effect) */ body::before { content: ""; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 400 300" opacity="0.08"><filter id="noise"><feTurbulence type="fractalNoise" baseFrequency="0.65" numOctaves="3" stitchTiles="stitch"/></filter><rect width="100%" height="100%" filter="url(%23noise)"/></svg>'); background-repeat: repeat; pointer-events: none; z-index: 0; } } .contact-item { display: flex
/* responsive touches */ @media (max-width: 680px) { body { padding: 1rem; } h1 { font-size: 2.2rem; } .paper-header { padding: 1.5rem; } .portfolio-grid { gap: 1.2rem; } }
/* wordpress admin bar simulation (optional aesthetic) */ .mock-wp-toolbar { background: #1e1e1e; color: #ddd; font-size: 0.7rem; padding: 4px 12px; display: flex; justify-content: flex-end; gap: 20px; position: fixed; top: 0; left: 0; width: 100%; z-index: 999; font-family: monospace; backdrop-filter: blur(4px); background: rgba(0,0,0,0.6); } body { padding-top: 28px; } @media (max-width: 600px) { body { padding-top: 24px; } } .mock-wp-toolbar span { cursor: default; } </style> </head> <body>
