Cheatsheet Content for Developers

في الرنين: <span class="katex"> X_L = X_C </span> → <span class="katex"> Z = R </span> (أقل مقاومة في التوالي)

• زينر: انهيار عكسي مُتحكم به لتثبيت الجهد.

المقاومات:
<span class="katex">1\;\text{k}\Omega = 1000\,\Omega</span>
<span class="katex">1\;\text{M}\Omega = 1{,}000{,}000\,\Omega</span>

المكثفات:
<span class="katex">1\,\mu\text{F}=10^{-6}\,\text{F}</span> — <span class="katex">1\,\text{nF}=10^{-9}\,\text{F}</span> — <span class="katex">1\,\text{pF}=10^{-12}\,\text{F}</span>

• C (Capacitance) = السعة

• مقلوب السعة الكلية = مجموع مقلوبات السعات

Update Tailwind config:

theme: {
  extend: {
    colors: {
      primary: 'hsl(var(--primary))',
      // etc.
    }
  }
}

.item {
  /* Grid Area - Multiple ways to use it */
  grid-area: header;                              /* Named template area */
  grid-area: 1 / 1 / 2 / 3;                       /* row-start/column-start/row-end/column-end */
  grid-area: 2 / span 3;                          /* Start at row 2, span 3 columns */

  /* Individual grid-row/column properties */
  grid-column: 1 / 3;                             /* Start / end column */
  grid-column: span 2;                            /* Span multiple columns */
  grid-row: 1 / 3;                                /* Start / end row */

  /* Individual alignment */
  justify-self: start | end | center | stretch;
  align-self: start | end | center | stretch;
  place-self: center center;                      /* Shorthand for both */
}

/* Example usage of grid-area with template areas */
.header { grid-area: header; }
.sidebar { grid-area: sidebar; }
.main { grid-area: main; }
.footer { grid-area: footer; }

<!-- Basic grid -->
<div class="grid">

<!-- Column configurations -->
<div class="grid grid-cols-3">                    <!-- 3 equal columns -->
<div class="grid grid-cols-none">                 <!-- No columns -->
<div class="grid grid-cols-[200px_1fr_200px]">    <!-- Custom columns -->

<!-- Row configurations -->
<div class="grid grid-rows-3">                    <!-- 3 equal rows -->
<div class="grid grid-rows-[200px_1fr_100px]">    <!-- Custom rows -->

<!-- Gaps -->
<div class="gap-4">                               <!-- Both row and column gap -->
<div class="gap-x-4">                             <!-- Column gap only -->
<div class="gap-y-4">                             <!-- Row gap only -->

<!-- Auto flow -->
<div class="grid-flow-row">
<div class="grid-flow-col">
<div class="grid-flow-dense">

<!-- Alignment -->
<div class="justify-items-start">
<div class="justify-items-center">
<div class="items-center">                        <!-- Vertical alignment -->