Add my impression

[ryudedev]

タイトル

新規コメントを追加

概要

ハンズオンにより、新規要素を追加しました。

変更内容

• 新規要素を追加しました

<div class="impression">
  <p>業務で苦戦しないように、GitHubを改めてはじめからしっかりと学習できました。本当にありがとうございます！</p>

  <!-- LinkCardをここに追加 -->
  <div id="link-card" class="link-card">
      <a href="https://github.com/ryudedev" target="_blank" rel="noopener noreferrer">
          <div class="link-card-content">
              <!-- 自身のprofile画像を出力 -->
              <img src="https://avatars.githubusercontent.com/u/90295010?v=4" alt="GitHub Logo" class="link-card-icon">
              <div class="link-card-text">
                  <h3>Ryudedev Profile</h3>
                  <p>Visit ryudedev's GitHub profile</p>
              </div>
          </div>
      </a>
  </div>
</div>

• stylesheet.css

.link-card {
    margin-top: 15px;
    border: 1px solid #e1e4e8;
    border-radius: 8px;
    overflow: hidden;
    transition: box-shadow 0.3s ease;
    cursor: pointer;
}

.link-card:hover {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.link-card-content {
    display: flex;
    align-items: center;
    padding: 12px;
    background-color: #fff;
}

.link-card-icon {
    width: 40px;
    height: 40px;
    margin-right: 12px;
}

.link-card-text h3 {
    font-size: 16px;
    font-weight: bold;
    color: #0366d6;
    margin: 0;
}

.link-card-text p {
    font-size: 14px;
    color: #586069;
    margin: 0;
}