#about-container
  section.top-section
    .top-content
      .float-texts
        each text, index in site.data.about.top_info.float_text.slice(0, 4)
          .float-text(class=`float-text-${index + 1}`) #{text}
      .avatar-container
        img.no-lightbox.avatar(src=url_for(site.data.about.top_info.avatar) onerror=`this.onerror=null;this.src='` + url_for(theme.error_img.flink) + `'` alt="")
      .float-texts
        each text, index in site.data.about.top_info.float_text.slice(4, 8)
          .float-text(class=`float-text-${index + 5}`) #{text}
    .site-name #{site.data.about.top_info.site_name}
    .motto #{site.data.about.top_info.motto}

  section.info-section
    .left-column.card
      .personal-info
        h2.section-title 个人信息
        .info-grid
          p 
            strong 姓名: 
            | #{site.data.about.personal_info.name}
          p 
            strong 性别: 
            | #{site.data.about.personal_info.gender}
          p 
            strong 地址: 
            | #{site.data.about.personal_info.address}
          p 
            strong 学校: 
            | #{site.data.about.personal_info.school}
          p 
            strong 年级: 
            | #{site.data.about.personal_info.grade}
          p 
            strong 专业: 
            | #{site.data.about.personal_info.major}
          p 
            strong 邮箱: 
            a(href=`mailto:${site.data.about.personal_info.email}`) #{site.data.about.personal_info.email}
          p 
            strong QQ: 
            | #{site.data.about.personal_info.QQ}
          p 
            strong 生日: 
            | #{site.data.about.personal_info.birthday}
      .flex-1
      img.left-column-bottom(src=url_for(site.data.about.personal_info.bottom_img) onerror=`this.onerror=null;this.src='` + url_for(theme.error_img.flink) + `'` alt="")
    .right-column
      .personality.card
        .personality-info
          p.type 
            | #{site.data.about.personality.type}
          p.type_name #{site.data.about.personality.type_name}
          .flex-1
          p.learn_more 
            | 点击在 
            a(href=url_for(site.data.about.personality.url), target="_blank" ref="noopener nofollower") 16Personalities
            |  上了解更多
        .personality-svg
          img.no-lightbox.svg(src=site.data.about.personality.svg onerror=`this.onerror=null;this.src='` + url_for(theme.error_img.flink) + `'` alt="Personality SVG")

      .description-and-social.card
        p.description #{site.data.about.description_and_social_links.description}
        .social-links
          each link in site.data.about.description_and_social_links.social_links
            a(href=link.url, target="_blank")
              img.no-lightbox(src=url_for(link.icon) onerror=`this.onerror=null;this.src='` + url_for(theme.error_img.flink) + `'` alt=link.platform)

  section.skills-and-projects
    .skills.card
      h2.section-title 技能
      .skills-grid
        .skill-category
          each skill in site.data.about.skills.technical
            .skill-card
              img(src=url_for(skill) onerror=`this.onerror=null;this.src='` + url_for(theme.error_img.flink) + `'` alt="技术图标") 
        .skill-category.category-2
          each skill in site.data.about.skills.general
            .skill-card
              img(src=url_for(skill) onerror=`this.onerror=null;this.src='` + url_for(theme.error_img.flink) + `'` alt="通用图标")
      p.learning 
        | #{site.data.about.skills.learning}
    .projects.card
      h2.section-title 项目
      .projects-grid
        each project in site.data.about.projects
          .project
            a(href=project.url, target="_blank")
              h3 #{project.name}
              p #{project.description}

  section.hobbies-and-evaluation
    .hobbies.card
      h2.section-title 爱好
      ul.hobbies-list
        each hobby in site.data.about.hobbies
          li #{hobby}
    .self-evaluation.card
      h2.section-title 评价
      p 
        strong 思想: 
        | #{site.data.about.self_evaluation.thoughts}
      p 
        strong 工作: 
        | #{site.data.about.self_evaluation.work}
      p.summary 
        strong 总结: 
        | #{site.data.about.self_evaluation.summary}