alpha_full/admin/styles/grid.php
2026-04-06 22:58:51 +02:00

174 lines
7.2 KiB
PHP
Executable File

<?php
$nomFicAppelant = basename(__FILE__);
echo '<div class="boiteCss" >';
echo '<div ><span class="boiteCssTitre">Grid : Tableau en grille </span>';
echo '<a target="_blank" href="https://www.w3schools.com/CSSref/pr_grid.asp"> Plus d\'info sur la balise Grid</a>';
echo '</div>';
echo '<table border=1>';
// -----------------------------------------------------
// Element
// -----------------------------------------------------
echo '<tr style="background:lightblue;" >';
echo '<td colspan="2" >';
// echo '<span class="puceMenu" ></span>';
echo '<span >Définir un tableau : </span> &#160;';
echo '</td>';
echo '</tr>';
// -----------------------------------------------------
// Grid template colonne
// -----------------------------------------------------
echo '<tr>';
echo '<td>';
echo '<span >Grille modèle des colonnes : </span> &#160;';
echo '</td>';
echo '<td>';
$theTitle='Grid permet de gérer les colonnes. Exemple1 : auto auto auto. Exemple2 : 20px 80px 20px 80px';
echo '<input value="' .$cssGridTemplateColumns[$theNumCss]. '"" type="text" style="width:250px;" class="inputWebmaster" id="gridTemplateColumnsCss" name="gridTemplateColumnsCss" title="' .$theTitle. '" >';
echo '</td>';
echo '</tr>';
// -----------------------------------------------------
// Grid template ligne
// -----------------------------------------------------
echo '<tr>';
echo '<td>';
echo '<span >Grille modèle des lignes : </span> &#160;';
echo '</td>';
echo '<td>';
$theTitle='Grid permet de gérer les colonnes. Exemple1 : auto auto auto. Exemple2 : 20px 80px 20px 80px';
echo '<input value="' .$cssGridTemplateRows[$theNumCss]. '" type="text" style="width:250px;" class="inputWebmaster" id="gridTemplateRowsCss" name="gridTemplateRowsCss" title="' .$theTitle. '" >';
echo '</td>';
echo '</tr>';
// -----------------------------------------------------
// Grid-column-gap
// -----------------------------------------------------
echo '<tr>';
echo '<td>';
// echo '<span class="puceMenu" ></span>';
echo '<span >Espace entre les colonnes : </span> &#160;';
echo '</td>';
echo '<td>';
$theTitle='Grid permet de gérer les colonnes. Exemple1 : auto auto auto. Exemple2 : 20px 80px 20px 80px';
echo '<input value="' .$cssGridColumnGap[$theNumCss]. '" type="text" style="width:250px;" class="inputWebmaster" id="gridColumnGapCss" name="gridColumnGapCss" title="' .$theTitle. '" >';
echo '</td>';
echo '</tr>';
// -----------------------------------------------------
// Grid-row-gap
// -----------------------------------------------------
echo '<tr>';
echo '<td>';
// echo '<span class="puceMenu" ></span>';
echo '<span >Espace entre les lignes : </span> &#160;';
echo '</td>';
echo '<td>';
$theTitle='Grid permet de gérer les colonnes. Exemple1 : auto auto auto. Exemple2 : 20px 80px 20px 80px';
echo '<input value="' .$cssGridRowGap[$theNumCss]. '" type="text" style="width:250px;" class="inputWebmaster" id="gridRowGappCss" name="gridRowGappCss" title="' .$theTitle. '" >';
echo '</td>';
echo '</tr>';
// -----------------------------------------------------
// Grid-gap
// -----------------------------------------------------
echo '<tr>';
echo '<td>';
// echo '<span class="puceMenu" ></span>';
echo '<span >Espace entre les colonnes et les lignes : </span> &#160;';
echo '</td>';
echo '<td>';
$theTitle='Grid Gap';
echo '<input value="' .$cssGridGap[$theNumCss]. '" type="text" style="width:250px;" class="inputWebmaster" id="gridGappCss" name="gridGappCss" title="' .$theTitle. '" >';
echo '</td>';
echo '</tr>';
// -----------------------------------------------------
// Grid-template-areas
// -----------------------------------------------------
echo '<tr>';
echo '<td>';
// echo '<span class="puceMenu" ></span>';
echo '<span >Modèle de zone nomée : </span> &#160;';
echo '</td>';
echo '<td>';
$theTitle='Modele de zone';
echo '<input value="' .$cssGridTemplateArea[$theNumCss]. '" type="text" style="width:250px;" class="inputWebmaster" id="gridTemplateAreaCss" name="gridTemplateAreaCss" title="' .$theTitle. '" >';
echo '</td>';
echo '</tr>';
// -----------------------------------------------------
// Element
// -----------------------------------------------------
echo '<tr style="background:lightgreen;" >';
echo '<td colspan="2" >';
// echo '<span class="puceMenu" ></span>';
echo '<span >Définir une position pour un élément : </span> &#160;';
echo '</td>';
echo '</tr>';
// -----------------------------------------------------
// Grid-colonne
// -----------------------------------------------------
echo '<tr>';
echo '<td>';
// echo '<span class="puceMenu" ></span>';
echo '<span >N° colonne: </span> &#160;';
echo '</td>';
echo '<td>';
$theTitle='N° colonne';
echo '<input value="' .$cssGridColumn[$theNumCss]. '" type="text" style="width:250px;" class="inputWebmaster" id="gridColumnCss" name="gridColumnCss" title="' .$theTitle. '" >';
echo '</td>';
echo '</tr>';
// -----------------------------------------------------
// Grid-row
// -----------------------------------------------------
echo '<tr>';
echo '<td>';
// echo '<span class="puceMenu" ></span>';
echo '<span >N° ligne : </span> &#160;';
echo '</td>';
echo '<td>';
$theTitle='N° ligne';
echo '<input value="' .$cssGridRow[$theNumCss]. '" type="text" style="width:250px;" class="inputWebmaster" id="gridRowCss" name="gridRowCss" title="' .$theTitle. '" >';
echo '</td>';
echo '</tr>';
// -----------------------------------------------------
// Grid-area
// -----------------------------------------------------
echo '<tr>';
echo '<td>';
// echo '<span class="puceMenu" ></span>';
echo '<span >Zone nomée : </span> &#160;';
echo '</td>';
echo '<td>';
$theTitle='Zone spécifique';
echo '<input value="' .$cssGridArea[$theNumCss]. '" type="text" style="width:250px;" class="inputWebmaster" id="gridAreaCss" name="gridAreaCss" title="' .$theTitle. '" >';
echo '</td>';
echo '</tr>';
// -----------------------------------------------------
// Bouton valider
// -----------------------------------------------------
echo '<tr style="background-color:#EAF5F4;border:1px solid lightgrey;border-radius:7px;margin:5px;"> ';
echo '<td align="center" colspan="8" style="background-color:#EAF5F4;border:1px solid lightgrey;border-radius:7px;margin:5px;" >';
echo '<span class="boutonsMenusWbm boutonEnregistrer" >';
echo '&#160;<i id="btnPub" class=" boutonEnregistrer fad fa-save"></i>';
echo '<span title="Enregistrer et générer les fichiers CSS du thème" onClick="editMonForm(\'submit\',0);" style=" color:white;">&#160;Valider</span>&#160;';
echo '</span>';
echo '</td>';
echo '</tr>';
echo '</table>';
echo '</div>';
?>