diff --git a/assets/css/main.css b/assets/css/main.css index a68e1bf..819870d 100644 --- a/assets/css/main.css +++ b/assets/css/main.css @@ -4568,3 +4568,112 @@ body { font-size: 17px; } .article-cta .cta-actions { width: 100%; } .article-cta .btn-primary, .article-cta .btn-secondary { text-align: center; flex: 1; } } + + +/* === Author Bio Component (moved from inline, Feb 2026) ===*/ + +.author-bio { + display: flex; + gap: 20px; + padding: 24px; + background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%); + border-radius: 12px; + margin: 40px 0; + border-left: 4px solid #179e83; +} + +.author-avatar img { + width: 80px; + height: 80px; + border-radius: 50%; + object-fit: cover; + border: 3px solid #179e83; +} + +.author-info { + flex: 1; +} + +.author-header { + font-size: 0.85rem; + text-transform: uppercase; + letter-spacing: 0.5px; + color: #144784; + margin: 0 0 8px 0; + font-weight: 600; +} + +.author-name { + font-size: 1.25rem; + font-weight: 700; + color: #1a1a1a; + margin: 0 0 4px 0; +} + +.author-role { + font-size: 0.95rem; + color: #666; + margin: 0 0 12px 0; + font-weight: 500; +} + +.author-description { + font-size: 0.95rem; + color: #444; + line-height: 1.6; + margin: 0 0 16px 0; +} + +.author-expertise { + display: flex; + flex-wrap: wrap; + gap: 8px; + align-items: center; + margin-bottom: 12px; +} + +.expertise-label { + font-size: 0.85rem; + font-weight: 600; + color: #555; +} + +.expertise-tag { + font-size: 0.8rem; + padding: 4px 10px; + background: #fff; + border: 1px solid #ddd; + border-radius: 16px; + color: #555; +} + +.author-social .linkedin-link { + display: inline-flex; + align-items: center; + gap: 6px; + color: #0077b5; + text-decoration: none; + font-size: 0.9rem; + font-weight: 500; + transition: color 0.2s; +} + +.author-social .linkedin-link:hover { + color: #005885; + text-decoration: underline; +} + +@media (max-width: 600px) { + .author-bio { + flex-direction: column; + text-align: center; + } + + .author-avatar { + margin: 0 auto; + } + + .author-expertise { + justify-content: center; + } +} diff --git a/assets/images/authors/david-martinez.svg b/assets/images/authors/david-martinez.svg new file mode 100644 index 0000000..5159106 --- /dev/null +++ b/assets/images/authors/david-martinez.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/assets/images/authors/emma-richardson.svg b/assets/images/authors/emma-richardson.svg new file mode 100644 index 0000000..5159106 --- /dev/null +++ b/assets/images/authors/emma-richardson.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/assets/images/authors/james-wilson.svg b/assets/images/authors/james-wilson.svg new file mode 100644 index 0000000..5159106 --- /dev/null +++ b/assets/images/authors/james-wilson.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/assets/images/authors/michael-thompson.svg b/assets/images/authors/michael-thompson.svg new file mode 100644 index 0000000..5159106 --- /dev/null +++ b/assets/images/authors/michael-thompson.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/assets/images/authors/rachel-singh.svg b/assets/images/authors/rachel-singh.svg new file mode 100644 index 0000000..5159106 --- /dev/null +++ b/assets/images/authors/rachel-singh.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/assets/images/authors/sarah-chen.svg b/assets/images/authors/sarah-chen.svg new file mode 100644 index 0000000..5159106 --- /dev/null +++ b/assets/images/authors/sarah-chen.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/assets/images/authors/team-avatar.svg b/assets/images/authors/team-avatar.svg new file mode 100644 index 0000000..5159106 --- /dev/null +++ b/assets/images/authors/team-avatar.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/blog/articles/business-intelligence-dashboard-design.php b/blog/articles/business-intelligence-dashboard-design.php index ee803da..570f7e3 100644 --- a/blog/articles/business-intelligence-dashboard-design.php +++ b/blog/articles/business-intelligence-dashboard-design.php @@ -1182,33 +1182,13 @@ $read_time = 12; - -