index.html

<!DOCTYPE html>

<html lang="ar" role="main">
  <head>
    <title>لغة البرمجة الف</title>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta
      name="description"
      content="لغة البرمجة العربية ألف بنسختها الخامسة"
    />
    <meta
      name="keywords"
      content="لغة البرمجة العربية الف, لغة البرمجة العربية, لغة ألف, لغة الف, لغة برمجة عربية, برمجة عربية, Alif Programming Language, لغات برمجة"
    />
    <link
      rel="shortcut icon"
      href="/source/assets/AlifLogo.svg"
      type="image/x-icon"
    />
    <link
      rel="preload"
      as="font"
      type="font/woff2"
      href="source/fonts/Tajawal-Medium.woff2"
      crossorigin
    />
    <link rel="stylesheet" href="source/style/main-style.css" />
  </head>

  <body class="page">
    <section class="container header-section">
      <header class="header">
        <div class="menu">
          <label class="lines">
            <input type="checkbox" id="lines" />
            <svg class="svg" viewBox="0 0 32 32">
              <path
                class="line top-bottom"
                d="M27 10 13 10C10.8 10 9 8.2 9 6 9 3.5 10.8 2 13 2 15.2 2 17 3.8 17 6L17 26C17 28.2 18.8 30 21 30 23.2 30 25 28.2 25 26 25 23.8 23.2 22 21 22L7 22"
              ></path>
              <path class="line middle" d="M7 16 27 16"></path>
            </svg>
          </label>
        </div>

        <div class="logo">
          <a href="/"
            ><img
              alt="شعار ألف"
              width="36"
              height="36"
              src="source/assets/AlifLogo.svg"
          /></a>
        </div>

        <div class="top-menu">
          <ul class="list">
            <li class="item"><a href="learn/">الـتـعـلـيـم</a></li>
            <li class="item"><a href="docs/">الـوثـائـق</a></li>
            <li class="item"><a href="support/">الـدعـم</a></li>
          </ul>
          <div class="contribute">
            <span class="line"></span>
            <!-- button1 -->
            <!-- <a href="#" class="button1">المساهمة</a> -->
            <!-- button2 -->
            <div class="button2-front">
              <a href="/contribution/">المساهمة</a>
            </div>
            <div class="button2"></div>
            <!-- button3 -->
            <!-- <div class="button3"><a href="#" class="label">المساهمة</a></div> -->
          </div>
        </div>
      </header>
    </section>

    <section class="menu-section">
      <div class="stroke-anim"></div>
      <div class="slide-menu">
        <a href="learn/">الـتـعـلـيــم</a>
        <a href="docs/">الـوثـائـق</a>
        <a href="support/">الـدعـم</a>
        <a href="license/">الـرخـصـة</a>
        <a href="about-us/">مـن نـحـن</a>
        <a href="contribution/">المساهمة</a>
      </div>
    </section>

    <section class="container content-section">
      <div class="right">
        <h2 class="title">
          البرمجة<br />
          أصبحت أسهل
        </h2>
        <p class="paragraph">
          قم بتجربة لغة البرمجة العربية ألف والتي ستفتح لك آفاق جديدة في البرمجة
        </p>

        <div class="for-tab">
          <div class="logo-card">
            <img
              alt="شعار ألف"
              class="logo"
              width="256"
              height="256"
              src="source/assets/AlifLogo.svg"
            />
          </div>
          <img alt="شفرة" class="code" src="source/assets/Code-Mobile.webp" />
        </div>

        <div class="bottom">
          <div class="download">
            <span class="line"></span>
            <!-- button1 -->
            <!-- <a href="Source/Pages/Download.html" class="button1">تحميل اللغة</a> -->
            <!-- button2 -->
            <div class="button2-front"><a href="download/">تحميل اللغة</a></div>
            <div class="button2"></div>
            <!-- button3 -->
            <!-- <div class="button3"><a class="label" href="Source/Pages/Download.html">تحميل اللغة</a></div> -->
          </div>
          <a class="underline-button" href="https://t.me/aliflang"
            >انضم إلى المجتمع</a
          >
        </div>
      </div>
      <div class="left">
        <div class="logo-card">
          <img alt="شعار ألف" class="logo" src="source/assets/AlifLogo.svg" />
        </div>
        <img alt="شفرة" class="code" src="source/assets/Code.webp" />
      </div>
    </section>

    <section class="container footer-section">
      <a class="item text" href="license/">الـرخـصـة</a>
      <a class="item text" href="about-us/">مـن نـحـن</a>
      <a class="item text" href="alif2/">ألـف2</a>
      <a class="item circle" href="#">
        <img
          class="img"
          alt="انستاغرام"
          width="30"
          height="30"
          src="source/assets/Instagram.svg"
        />
      </a>
      <a
        class="item circle"
        href="https://youtube.com/@aliflang47"
        target="_blank"
      >
        <img
          class="img"
          alt="يوتيوب"
          width="30"
          height="30"
          src="source/assets/Youtube.svg"
        />
      </a>
      <a
        class="item circle"
        href="https://github.com/alifcommunity/Alif"
        target="_blank"
      >
        <img
          class="img"
          alt="غيتهب"
          width="30"
          height="30"
          src="source/assets/Github.svg"
        />
      </a>
    </section>

    <section>
      <div class="space"></div>
    </section>

    <script class="scripe" src="source/javascript/script.js" defer></script>
  </body>
</html>