- www.ghsvs.de, 2019-06-16
- https://www.ghsvs.de/programmierer-schnipsel/spezielles-ghsvs-internes/138-uebersicht-eigener-less-variablen-template
- Übersicht eigener Bootstrap-3-LESS-Variablen aus Template - GHSVS-Dein Web mit Mehr

SpeziellSchnipsel

Eine Liste eigener LESS-Variablen des aktiven Templates, die Bootstrap 3 nicht kennt. In LESS kann man Variablen vordefinieren. Farbwerte, Paddings und mehr. Hilfreich z.B., will man mal einen Grauton etwas heller stellen, Man muss nicht in diversen Dateien die color-Werte anpassen, sondern kann das an 1 Stelle erledigen. Man kann zusätzlich eigene (custom) definieren oder z.B. in Bootstrap 3 Variable aus Bootstrap 2 weiterverwenden und nach und nach umstellen. 

Custom Bootstrap-3-Variable des aktuellen Templates dynamisch ausgelesen

/templates/protostarbs3ghsvs/less/variables.less

/media/plg_system_bs3ghsvs/less/variables.less

Alle 61 Einträge auf 1 Seite anzeigen

Eigene Template-Variablen (protostarbs3ghsvs)

Variable Wert #
@screen-min 320px 1
@screen-max 1600px 2
@text-area-max-width 1024px 3
@screen-xxs-max (@screen-xs-min - 1) 4
@screen-sm2 840px 5
@screen-md2 1024px 6
@navbarCollapseWidth 730px 7
@teaserJumpWidth 609px 8
@rearrangeWidth 609px 9
@navbarCollapseWidthSidebar 767px 10
@navbarCollapsedFloatNone 575px 11
@img-max-width-articlebody @screen-xs-min 12
@text-bg @white 13
@black #000 14
@blue #0000ff 15
@blue-light lighten(@blue, 45%) 16
@blueDark #0064cd 17
@brown-light #F4A460 18
@green #46a546 19
@green-light #CFC 20
@green-light2 lighten(@green, 40%) 21
@orange #fc8301 22
@orange-light #FC9 23
@pink #c3325f 24
@purple #7a43b6 25
@red #781212 26
@white #ffffff 27
@yellow #ffc40d 28
@yellow-light #FFC 29
@gray-lighter2 #ddd 30
@gray-lighter3 #eee 31
@gray-lighter4 #e5e5e5 32
@gray-lighter5 #fafafa 33
@logoBgColor #410000 34
@separator-border-color @blue 35
@invalid-color #ff0000 36
@dropdownLinkColor @gray-darker 37
@dropdownLinkColorHover @white 38
@slicknav-btn-bg-color @orange 39
@fontFamilyHandschrift "Just Me Again Down Here", Georgia, "Times New Roman", cursive 40
@headingsFontFamilyArticleBody @headings-font-family 41
@headingsColorDark @black 42
@spaceVertical @line-height-computed 43
@link-decoration none 44
@tooltip-font-size inherit 45
@label-tag-bg #3a87ad 46
@label-categorytag-bg @purple 47
@label-font-size (@font-size-base * 0.9) 48
@label-color-catid84 darken(@orange, 0%) 49
@label-color-catid91 darken(@purple, 10%) 50
@label-color-catid92 darken(@green, 10%) 51
@label-color-catid95 darken(#dd0000, 0%) 52
@thumbnail-margin (@line-height-computed/2) 53
@thumbnail-caption-margin-top @thumbnail-caption-padding 54
@thumbnail-caption-bg @state-info-bg 55
@thumbnail-caption-align center 56
@thumbnail-caption-style italic 57
@pagination-margin 0 0 0 0 58
@navbar-nav-child-border @gray 59
@breadcrumb-margin 0 60
@breadcrumb-border-radius 0 61
<?php
/*
2015-10-31
custom-bootstrap-3-variables.php
Variablen und Werte aus BS3-variables.less (Orig.) auslesen.
Anschließend Abgleich mit variables.less aus Template.
Anzeige nur der eigenen Variablen.
*/
?>
<?php
defined('_JEXEC') or die;
$selector = 'custom-bootstrap-3-variables';

$html = array();
$link = '';
$countCollect = 0;
$app = JFactory::getApplication();

// Relevant für FooTable, wenn paging enabled
if (!($maxentries = $app->input->get->getInt('maxentries')))
{
 $maxentries = 50;
}

$apologise = JText::_('ICOMOONCLASSES_APOLOGISE');

$file = '/media/plg_system_bs3ghsvs/less/variables.less';
$fileAbs = JPATH_SITE . $file;

$template = $app->getTemplate();
$fileCustom = '/templates/' . $template . '/less/variables.less';
$fileCustomAbs = JPATH_SITE . $fileCustom;

if (!file_exists($fileAbs))
{
 $html[] = '<p class="alert alert-error">Datei ';
 $html[] = $file;
 $html[] = ' nicht gefunden.';
 $html[] = $apologise;
 $html[] = '</p>';
}
elseif (!file_exists($fileCustomAbs))
{
 $html[] = '<p class="alert alert-error">Datei ';
 $html[] = $fileCustom;
 $html[] = ' nicht gefunden.';
 $html[] = $apologise;
 $html[] = '</p>';
}
else
{
 $link = '<p><a href="' . JUri::root(true) . $fileCustom . '" target="_blank">' . $fileCustom . '</a></p>';
 $link .= '<p><a href="' . JUri::root(true) . $file . '" target="_blank">' . $file . '</a></p>';
 $collect = collectLessVariablesGhsvs($fileAbs);
 $nl = "\n";
 if (count($collect))
 {
  $collectCustom = collectLessVariablesGhsvs($fileCustomAbs);
  $countCollect = count($collectCustom);
  if ($countCollect)
  {
   $i = 0;
   $html[] = '<h4>Eigene Template-Variablen (' . $template . ')</h4>';
   #$html[] = '<div class="table-responsive">';
   $html[] = '<table class="table table-condensed table-bordered" id="' . $selector . '">';
   $html[] = '<thead>';
   $html[] = '<tr>';
   $html[] = '<th>Variable</th>';
   $html[] = '<th data-breakpoints="xxs">Wert</th>';
   $html[] = '<th data-type="number">#</th>';
   $html[] = '</tr>';
   $html[] = '</thead>';
   $html[] = '<tbody>';
   foreach ($collectCustom as $k => $v)
   {
    if (isset($collect[$k])){
					--$countCollect;
					continue;
				}

    $html[] = '<tr>';
    $html[] = '<td data-ghsvs="toggle">' . $k . '</td>';
    $html[] = '<td>' . $v . '</td>';
    $html[] = '<td data-ghsvs="number">' . (++$i) . '</td>';
    $html[] = '</tr>';
   }
   $html[] = '</tbody>';
   $html[] = '</table>';
   #$html[] = '</div><!--/table-responsive-->';
  }
 }
}
if (!count($html))
{
 $html[] = '<p class="alert alert-error">Da ist wohl was schief gelaufen. ';
 $html[] = $apologise;
 $html[] = '</p>';
}
else
{
 // Mehr Einträge in Tabelle anzeigen?
 $uri = JUri::getInstance();
 if ($countCollect > $maxentries)
 {
  $uri->setVar('maxentries', $countCollect);
  $link .= '<p class=" btn btn-default text-fett" style="font-size:1.3em;"><a rel="nofollow" href="'.$uri.'#BELOWHEADER">Alle '.$countCollect.' Einträge auf 1 Seite  anzeigen</a></p>';
 }

 ########### FooTable 3 START ###########
 // Speziell. Wir haben Footable auf unserem Server via Plugin installiert.
 // Ggf. Zeilen entfernen
 $options = array(
  'empty' => JText::_('GHSVS_MODULES_FOOTABLE_EMPTY'),
  'sorting' => array(
   'enabled' => true
  ),
  'filtering' => array(
   'enabled' => true
  ),
  'paging' => array(
   'enabled' => ($countCollect > $maxentries) ? true : false,
   'size' => $maxentries,
   'countFormat' => JText::sprintf('JLIB_HTML_PAGE_CURRENT_OF_TOTAL', '{CP}', '{TP}'),
   'current' => 1,
   'limit' => 10,
   'position' => 'center'
  ),
  'state' => array(
   'enabled' => true,
   'filtering' => true,
   'paging' => true,
   'sorting' => true,
   'key' => $selector
  ),
  // Erster geöffnet. Auch nach Sortieren wird erster geöffnet.
  'expandFirst' => false,
  //'useParentWidth' => true,
  'stopPropagation' => false,
  // Leichteres Handling der Breakpoints. Nehmen drunter liegende mit.
  'cascade' => true,
  'breakpoints' => array(
  // Du muss xxs eingeben, damit Spalte bei *xs* *verschwindet*!
  'xxs' => 480,
  'xs' => 620,
  'sm' => 768,
  'md' => 992,
  'lg' => 1200,
  ),
 );
 JHtml::_('bs3ghsvs.footable', '#' . $selector, $options);
 ########### FooTable 3 ENDE ###########

 echo '<style>table{
 word-wrap: normal
 -webkit-hyphens: none;
 -moz-hyphens: none;
 -ms-hyphens: none;
 -o-hyphens: none;
 hyphens: none;
 }
 @-moz-document url-prefix() {
 fieldset { display: table-cell; }
 }
 [data-ghsvs="toggle"]{
  font-weight: bold;
  background-color: #fafafa;
  cursor:pointer;
 }
 [data-ghsvs="number"]{
  text-align: right;
 }
 </style>';

}

echo $link . implode("\n", $html);

function collectLessVariablesGhsvs($fileAbs)
{
 $lines = file($fileAbs);
	
 $collect = array();

 foreach ($lines as $i => $line){
  $line = trim($line);
  if (strpos($line, '@') !== 0 || strpos($line, ':') === false)
  {
   continue;
  }
  // Fix 2015-10-17.
  // Derzeit verwendet BS3 nur "//" als Kommentarzeichen
  if (strpos($line, '//') !== false)
  {
   $line = explode('//', $line, 2);
   $line = $line[0];
  }

  $line = explode(':', $line, 2);
  if (count($line) != 2){
   continue;
  }
  
  // Vorsicht! Derzeit geht das noch mit Semikolon.
  // Es sind aber auch Semikolons statt Komma zwischen
  // Funktions-Parametern erlaubt.
  // Siehe "Fix 2015-10-17"
  // $parts = explode(';', $line[1], 2);
  // $line[1] = trim($parts[0]);
  
  $collect[trim($line[0])] = trim($line[1], ' ;');
 }
		
 return $collect;
}

Verbesserungsvorschläge und Feature-Wünsche sind willkommen.

Alle nicht explizit als fertige Erweiterung markierten Skripte und Codes von www.ghsvs.de dienen als Ansätze / Ideen für eigene Ausarbeitung. GHSVS bzw. die jeweiligen Autoren übernehmen keinerlei Garantien beim Einsatz Ihrer kostenlosen Erweiterungen, Programme, Codes und Skripte, helfen aber gerne bei Rückfragen, soweit zeitlich möglich.

CSS Konfiguration LESS Template Bootstrap