<footer> <p><i class="far fa-copyright"></i> 2026 Paper Portfolio — A WordPress Theme Concept. Crafted with <i class="fas fa-feather-alt"></i> and vintage vibes.</p> <p style="margin-top: 8px; font-size: 0.7rem;">Built to celebrate the beauty of paper textures — fully compatible with Gutenberg & classic editor.</p> </footer> </div>
body { background: #d9cdb0; /* warm vintage paper background */ font-family: 'Inter', sans-serif; color: #2c2b28; line-height: 1.5; padding: 2rem 1.5rem; position: relative; }
<!-- 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>
// simple smooth scrolling for anchor links (keeping paper style navigation) document.querySelectorAll('.wp-nav a[href^="#"], .wp-btn[href^="#"]').forEach(anchor => { anchor.addEventListener('click', function(e) { const targetId = this.getAttribute('href'); if(targetId && targetId !== "#" && targetId.startsWith('#')) { const targetElement = document.querySelector(targetId); if(targetElement) { e.preventDefault(); targetElement.scrollIntoView({ behavior: 'smooth', block: 'start' }); } } }); }); Portfolio WordPress Theme
.contact-details { display: flex; flex-wrap: wrap; gap: 1.8rem; margin-top: 1.2rem; }
h1 { font-size: 3.2rem; font-weight: 600; background: linear-gradient(135deg, #3a2c1f, #6b4e2e); background-clip: text; -webkit-background-clip: text; color: transparent; margin-bottom: 0.5rem; }
<!-- optional micro-interaction: console info to mimic wordpress theme enqueue --> <script> // small script to simulate WordPress theme live preview / dynamic year (function() { // dynamic copyright year (optional) const footerYear = document.querySelector('footer p:first-child'); if(footerYear) { const currentYear = new Date().getFullYear(); footerYear.innerHTML = `<i class="far fa-copyright"></i> ${currentYear} Paper Portfolio — A WordPress Theme Concept. Crafted with <i class="fas fa-feather-alt"></i> and vintage vibes.`; } i class="far fa-copyright">
.project-excerpt { color: #4a4238; font-size: 0.9rem; margin-bottom: 1.2rem; line-height: 1.45; }
/* 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>
.project-card:hover { transform: translateY(-6px); box-shadow: 0 20px 30px -12px rgba(0, 0, 0, 0.2), 0 0 0 1px #e7d8bc; } i class="fas fa-feather-alt">
.contact-item { display: flex; align-items: center; gap: 10px; background: #f7efdf; padding: 0.6rem 1.2rem; border-radius: 60px; font-size: 0.9rem; }
// add a small console greeting (wordpress theme style) console.log('%c✨ Paper Portfolio Theme loaded — “Where texture meets typography.”', 'background: #f0e7d8; color: #6b4e2e; font-size: 12px; padding: 4px 8px; border-radius: 12px;'); // simulate fake WP block: hover effect log (just for fun) const cards = document.querySelectorAll('.project-card'); cards.forEach((card, idx) => { card.addEventListener('mouseenter', () => { // subtle paper rustle feeling (just a console silent) if(window.innerWidth > 700) { // do nothing but keep atmosphere } }); }); })(); </script> </body> </html>