Webseiten und ZubehörProgrammierung UmsetzungPflege Backups BetreuungJoomla-Spezialist

SpeziellSchnipsel

Editor-CSS-Klassen für Text-Stile (rückwärtskompatibel), kompiliert aus editorghsvs.less. Template wohnmichl (BS2to3-Version). Die Programmlogik für dyn. Ausgabe in /media/php-includes_ghsvs/editorghsvs-classes.php

CSS-Klassen, dynamisch aus editorghsvs.css ausgelesen

templates/protostarbs3ghsvs/less/text-styles-custom.less

templates/protostarbs3ghsvs/css/separateLessCompile/editorghsvs.css

  • breakall

    Ein Beispiel für einen Text in einem SPAN-Tag (inline style) mit CSS-Klasse breakall.

    <span class="breakall"></span>

    Ein Beispiel für einen Text in einem P-Tag (Absatz) mit der CSS-Klasse breakall

    <p class="breakall"></p>

  • code-inline

    Ein Beispiel für einen Text in einem SPAN-Tag (inline style) mit CSS-Klasse code-inline.

    <span class="code-inline"></span>

    Ein Beispiel für einen Text in einem P-Tag (Absatz) mit der CSS-Klasse code-inline

    <p class="code-inline"></p>

  • icon-done

    <span class="icon-done"></span>

    <p class="icon-done"></p>

  • text-bildbeschriftung

    Ein Beispiel für einen Text in einem SPAN-Tag (inline style) mit CSS-Klasse text-bildbeschriftung.

    <span class="text-bildbeschriftung"></span>

    Ein Beispiel für einen Text in einem P-Tag (Absatz) mit der CSS-Klasse text-bildbeschriftung

    <p class="text-bildbeschriftung"></p>

  • text-base

    Ein Beispiel für einen Text in einem SPAN-Tag (inline style) mit CSS-Klasse text-base.

    <span class="text-base"></span>

    Ein Beispiel für einen Text in einem P-Tag (Absatz) mit der CSS-Klasse text-base

    <p class="text-base"></p>

  • text-courier | text-monospace

    Ein Beispiel für einen Text in einem SPAN-Tag (inline style) mit CSS-Klasse text-courier.

    <span class="text-courier"></span>

    Ein Beispiel für einen Text in einem P-Tag (Absatz) mit der CSS-Klasse text-courier

    <p class="text-courier"></p>

    Ein Beispiel für einen Text in einem SPAN-Tag (inline style) mit CSS-Klasse text-monospace.

    <span class="text-monospace"></span>

    Ein Beispiel für einen Text in einem P-Tag (Absatz) mit der CSS-Klasse text-monospace

    <p class="text-monospace"></p>

  • text-fett | text-bold

    Ein Beispiel für einen Text in einem SPAN-Tag (inline style) mit CSS-Klasse text-fett.

    <span class="text-fett"></span>

    Ein Beispiel für einen Text in einem P-Tag (Absatz) mit der CSS-Klasse text-fett

    <p class="text-fett"></p>

    Ein Beispiel für einen Text in einem SPAN-Tag (inline style) mit CSS-Klasse text-bold.

    <span class="text-bold"></span>

    Ein Beispiel für einen Text in einem P-Tag (Absatz) mit der CSS-Klasse text-bold

    <p class="text-bold"></p>

  • text-fett-blau

    Ein Beispiel für einen Text in einem SPAN-Tag (inline style) mit CSS-Klasse text-fett-blau.

    <span class="text-fett-blau"></span>

    Ein Beispiel für einen Text in einem P-Tag (Absatz) mit der CSS-Klasse text-fett-blau

    <p class="text-fett-blau"></p>

  • text-fett-gruen

    Ein Beispiel für einen Text in einem SPAN-Tag (inline style) mit CSS-Klasse text-fett-gruen.

    <span class="text-fett-gruen"></span>

    Ein Beispiel für einen Text in einem P-Tag (Absatz) mit der CSS-Klasse text-fett-gruen

    <p class="text-fett-gruen"></p>

  • text-fett-lila | text-fett-purple

    Ein Beispiel für einen Text in einem SPAN-Tag (inline style) mit CSS-Klasse text-fett-lila.

    <span class="text-fett-lila"></span>

    Ein Beispiel für einen Text in einem P-Tag (Absatz) mit der CSS-Klasse text-fett-lila

    <p class="text-fett-lila"></p>

    Ein Beispiel für einen Text in einem SPAN-Tag (inline style) mit CSS-Klasse text-fett-purple.

    <span class="text-fett-purple"></span>

    Ein Beispiel für einen Text in einem P-Tag (Absatz) mit der CSS-Klasse text-fett-purple

    <p class="text-fett-purple"></p>

  • text-fett-orange

    Ein Beispiel für einen Text in einem SPAN-Tag (inline style) mit CSS-Klasse text-fett-orange.

    <span class="text-fett-orange"></span>

    Ein Beispiel für einen Text in einem P-Tag (Absatz) mit der CSS-Klasse text-fett-orange

    <p class="text-fett-orange"></p>

  • text-fett-rot

    Ein Beispiel für einen Text in einem SPAN-Tag (inline style) mit CSS-Klasse text-fett-rot.

    <span class="text-fett-rot"></span>

    Ein Beispiel für einen Text in einem P-Tag (Absatz) mit der CSS-Klasse text-fett-rot

    <p class="text-fett-rot"></p>

  • text-fett-unterstrichen

    Ein Beispiel für einen Text in einem SPAN-Tag (inline style) mit CSS-Klasse text-fett-unterstrichen.

    <span class="text-fett-unterstrichen"></span>

    Ein Beispiel für einen Text in einem P-Tag (Absatz) mit der CSS-Klasse text-fett-unterstrichen

    <p class="text-fett-unterstrichen"></p>

  • text-fett-zentriert

    Ein Beispiel für einen Text in einem SPAN-Tag (inline style) mit CSS-Klasse text-fett-zentriert.

    <span class="text-fett-zentriert"></span>

    Ein Beispiel für einen Text in einem P-Tag (Absatz) mit der CSS-Klasse text-fett-zentriert

    <p class="text-fett-zentriert"></p>

  • text-kursiv | text-italic

    Ein Beispiel für einen Text in einem SPAN-Tag (inline style) mit CSS-Klasse text-kursiv.

    <span class="text-kursiv"></span>

    Ein Beispiel für einen Text in einem P-Tag (Absatz) mit der CSS-Klasse text-kursiv

    <p class="text-kursiv"></p>

    Ein Beispiel für einen Text in einem SPAN-Tag (inline style) mit CSS-Klasse text-italic.

    <span class="text-italic"></span>

    Ein Beispiel für einen Text in einem P-Tag (Absatz) mit der CSS-Klasse text-italic

    <p class="text-italic"></p>

  • text-large | large

    Ein Beispiel für einen Text in einem SPAN-Tag (inline style) mit CSS-Klasse text-large.

    <span class="text-large"></span>

    Ein Beispiel für einen Text in einem P-Tag (Absatz) mit der CSS-Klasse text-large

    <p class="text-large"></p>

    Ein Beispiel für einen Text in einem SPAN-Tag (inline style) mit CSS-Klasse large.

    <span class="large"></span>

    Ein Beispiel für einen Text in einem P-Tag (Absatz) mit der CSS-Klasse large

    <p class="large"></p>

  • text-large-lineheight

    Ein Beispiel für einen Text in einem SPAN-Tag (inline style) mit CSS-Klasse text-large-lineheight.

    <span class="text-large-lineheight"></span>

    Ein Beispiel für einen Text in einem P-Tag (Absatz) mit der CSS-Klasse text-large-lineheight

    <p class="text-large-lineheight"></p>

  • text-lila | text-purple

    Ein Beispiel für einen Text in einem SPAN-Tag (inline style) mit CSS-Klasse text-lila.

    <span class="text-lila"></span>

    Ein Beispiel für einen Text in einem P-Tag (Absatz) mit der CSS-Klasse text-lila

    <p class="text-lila"></p>

    Ein Beispiel für einen Text in einem SPAN-Tag (inline style) mit CSS-Klasse text-purple.

    <span class="text-purple"></span>

    Ein Beispiel für einen Text in einem P-Tag (Absatz) mit der CSS-Klasse text-purple

    <p class="text-purple"></p>

  • text-links | text-left

    Ein Beispiel für einen Text in einem SPAN-Tag (inline style) mit CSS-Klasse text-links.

    <span class="text-links"></span>

    <p class="text-links"></p>

    Ein Beispiel für einen Text in einem SPAN-Tag (inline style) mit CSS-Klasse text-left.

    <span class="text-left"></span>

    Ein Beispiel für einen Text in einem P-Tag (Absatz) mit der CSS-Klasse text-left

    <p class="text-left"></p>

  • text-medium

    Ein Beispiel für einen Text in einem SPAN-Tag (inline style) mit CSS-Klasse text-medium.

    <span class="text-medium"></span>

    Ein Beispiel für einen Text in einem P-Tag (Absatz) mit der CSS-Klasse text-medium

    <p class="text-medium"></p>

  • text-medium-lineheight

    Ein Beispiel für einen Text in einem SPAN-Tag (inline style) mit CSS-Klasse text-medium-lineheight.

    <span class="text-medium-lineheight"></span>

    Ein Beispiel für einen Text in einem P-Tag (Absatz) mit der CSS-Klasse text-medium-lineheight

    <p class="text-medium-lineheight"></p>

  • text-lineheight-small

    Ein Beispiel für einen Text in einem SPAN-Tag (inline style) mit CSS-Klasse text-lineheight-small.

    <span class="text-lineheight-small"></span>

    Ein Beispiel für einen Text in einem P-Tag (Absatz) mit der CSS-Klasse text-lineheight-small

    <p class="text-lineheight-small"></p>

  • text-rot | text-red

    Ein Beispiel für einen Text in einem SPAN-Tag (inline style) mit CSS-Klasse text-rot.

    <span class="text-rot"></span>

    Ein Beispiel für einen Text in einem P-Tag (Absatz) mit der CSS-Klasse text-rot

    <p class="text-rot"></p>

    Ein Beispiel für einen Text in einem SPAN-Tag (inline style) mit CSS-Klasse text-red.

    <span class="text-red"></span>

    Ein Beispiel für einen Text in einem P-Tag (Absatz) mit der CSS-Klasse text-red

    <p class="text-red"></p>

  • text-smaller

    Ein Beispiel für einen Text in einem SPAN-Tag (inline style) mit CSS-Klasse text-smaller.

    <span class="text-smaller"></span>

    Ein Beispiel für einen Text in einem P-Tag (Absatz) mit der CSS-Klasse text-smaller

    <p class="text-smaller"></p>

  • text-mini

    Ein Beispiel für einen Text in einem SPAN-Tag (inline style) mit CSS-Klasse text-mini.

    <span class="text-mini"></span>

    Ein Beispiel für einen Text in einem P-Tag (Absatz) mit der CSS-Klasse text-mini

    <p class="text-mini"></p>

  • text-unterstrichen | text-underline

    Ein Beispiel für einen Text in einem SPAN-Tag (inline style) mit CSS-Klasse text-unterstrichen.

    <span class="text-unterstrichen"></span>

    Ein Beispiel für einen Text in einem P-Tag (Absatz) mit der CSS-Klasse text-unterstrichen

    <p class="text-unterstrichen"></p>

    Ein Beispiel für einen Text in einem SPAN-Tag (inline style) mit CSS-Klasse text-underline.

    <span class="text-underline"></span>

    Ein Beispiel für einen Text in einem P-Tag (Absatz) mit der CSS-Klasse text-underline

    <p class="text-underline"></p>

  • text-zentriert

    Ein Beispiel für einen Text in einem SPAN-Tag (inline style) mit CSS-Klasse text-zentriert.

    <span class="text-zentriert"></span>

    Ein Beispiel für einen Text in einem P-Tag (Absatz) mit der CSS-Klasse text-zentriert

    <p class="text-zentriert"></p>

  • block

    Ein Beispiel für einen Text in einem SPAN-Tag (inline style) mit CSS-Klasse block.

    <span class="block"></span>

    Ein Beispiel für einen Text in einem P-Tag (Absatz) mit der CSS-Klasse block

    <p class="block"></p>

  • inline-info

    Ein Beispiel für einen Text in einem SPAN-Tag (inline style) mit CSS-Klasse inline-info.

    <span class="inline-info"></span>

    Ein Beispiel für einen Text in einem P-Tag (Absatz) mit der CSS-Klasse inline-info

    <p class="inline-info"></p>

  • block-info

    Ein Beispiel für einen Text in einem SPAN-Tag (inline style) mit CSS-Klasse block-info.

    <span class="block-info"></span>

    Ein Beispiel für einen Text in einem P-Tag (Absatz) mit der CSS-Klasse block-info

    <p class="block-info"></p>

  • block-info-gray

    Ein Beispiel für einen Text in einem SPAN-Tag (inline style) mit CSS-Klasse block-info-gray.

    <span class="block-info-gray"></span>

    Ein Beispiel für einen Text in einem P-Tag (Absatz) mit der CSS-Klasse block-info-gray

    <p class="block-info-gray"></p>

  • inline-todo

    Ein Beispiel für einen Text in einem SPAN-Tag (inline style) mit CSS-Klasse inline-todo.

    <span class="inline-todo"></span>

    Ein Beispiel für einen Text in einem P-Tag (Absatz) mit der CSS-Klasse inline-todo

    <p class="inline-todo"></p>

  • inline-warning

    Ein Beispiel für einen Text in einem SPAN-Tag (inline style) mit CSS-Klasse inline-warning.

    <span class="inline-warning"></span>

    Ein Beispiel für einen Text in einem P-Tag (Absatz) mit der CSS-Klasse inline-warning

    <p class="inline-warning"></p>

  • block-warning

    Ein Beispiel für einen Text in einem SPAN-Tag (inline style) mit CSS-Klasse block-warning.

    <span class="block-warning"></span>

    Ein Beispiel für einen Text in einem P-Tag (Absatz) mit der CSS-Klasse block-warning

    <p class="block-warning"></p>

  • inline-danger

    Ein Beispiel für einen Text in einem SPAN-Tag (inline style) mit CSS-Klasse inline-danger.

    <span class="inline-danger"></span>

    Ein Beispiel für einen Text in einem P-Tag (Absatz) mit der CSS-Klasse inline-danger

    <p class="inline-danger"></p>

  • block-danger

    Ein Beispiel für einen Text in einem SPAN-Tag (inline style) mit CSS-Klasse block-danger.

    <span class="block-danger"></span>

    Ein Beispiel für einen Text in einem P-Tag (Absatz) mit der CSS-Klasse block-danger

    <p class="block-danger"></p>

  • inline-success

    Ein Beispiel für einen Text in einem SPAN-Tag (inline style) mit CSS-Klasse inline-success.

    <span class="inline-success"></span>

    Ein Beispiel für einen Text in einem P-Tag (Absatz) mit der CSS-Klasse inline-success

    <p class="inline-success"></p>

  • block-success

    Ein Beispiel für einen Text in einem SPAN-Tag (inline style) mit CSS-Klasse block-success.

    <span class="block-success"></span>

    Ein Beispiel für einen Text in einem P-Tag (Absatz) mit der CSS-Klasse block-success

    <p class="block-success"></p>

<?php
/**
2015-08-30
editorghsvs-classes.php
Siehe ReadMe.txt.
Liest aktuelle editorghsvs.css des akt. Template aus,
die, falls veraltet / fehlt zuvor aus LESS kompiliert
wird.

2016-03-18

*/

defined('_JEXEC') or die;

if(!class_exists('JFile')) jimport('joomla.filesystem.file');

$html = array();
$lessFile = '';

// 2015-11-12:
// Ggf. aus LESS kompilieren und Pfad empfangen.
$file = JHtml::_(
 'lessghsvs.addLessCss',
 'text-styles-custom.less',
 array(
  'inputDir' => '',
  'outputFile' => 'editorghsvs',
  'addStyleSheet' => false,
  'returnInOut' => true,
  // Da Link angezeigt wird.
  'compress' => false,
  // Da Link angezeigt wird. Halt bisschen unperformant.
		'force' => true,
 )
);

if (is_array($file))
{
 $lessFile = $file['input'];
 $file = $file['output'];
}

$fileAbs = JPATH_SITE . '/' . $file;

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

$link = '';

if (!is_string($file) || !JFile::exists($fileAbs))
{
 $html[] = '<p class="alert alert-error">Datei ';
 $html[] = $file;
 $html[] = ' nicht gefunden.';
 $html[] = $apologise;
 $html[] = '</p>';
}
else
{
 
 // Fix. Don't use $html[] yet.
 if ($lessFile && JFile::exists(JPATH_SITE . '/' . $lessFile))
 {
  $link .= '<p><a href="' . JUri::root() . $lessFile . '" target=_blank rel=nofollow>' . $lessFile . '</a></p>';
 }
 $link .= '<p><a href="' . JUri::root() . $file . '" target=_blank rel=nofollow>' . $file . '</a></p>';
 
 $fileContent = file_get_contents($fileAbs);

 $muster = '/(\.[-a-z0-9]+(,.+?|))\s*{/s';
 
 $found = preg_match_all($muster, $fileContent, $matches, PREG_SET_ORDER);

 foreach ($matches as $key => &$match)
 {
  
  if (empty($match[1]))
  {
   unset($matches[$key]);
   continue;
  }
  unset($match[0], $match[2]);
  
  $match[1] = str_replace(array(' ', ':before', "\n", "\r", '.'), '', $match[1]);
  $match[1] = explode(',', $match[1]);
 }
 unset($match);
 $matches = array_values($matches);

 $nl = "\n";
 if (count($matches))
 {
  $html[] = '<ul class="list-group">' . $nl;
  foreach ($matches as $match)
  {
   $html[] = '<li class="list-group-item">';
   
   $html[] = '<p><strong>' . implode(' | ', $match[1]) . '</strong></p>' . $nl;
   foreach ($match[1] as $cssClass)
   {
    if (strpos($cssClass, 'icon-') === false)
    {
     $spanText = JText::sprintf('EDITORGHSVS_SPAN_BEISPIEL', $cssClass);
     $pText = JText::sprintf('EDITORGHSVS_P_BEISPIEL', $cssClass);
    }
    else
    {
     $spanText = $pText = '';
    }
    $html[] = '<p><span class="' . $cssClass . '">' . $spanText . '</span></p>';
    $html[] = '<p><span class="code-inline">' . htmlentities('<span class="' . $cssClass . '"></span>') . '</span></p>';

    $html[] = '<p class="' . $cssClass . '">' . $pText . ' </p>';
    $html[] = '<p><span class="code-inline">' . htmlentities('<p class="' . $cssClass . '"></p>') . '</span></p>';
   }
   $html[] = '</li>' . $nl;
  }
  $html[] = '</ol>' . $nl;
 }
}
if (!count($html))
{
 $html[] = '<p class="alert alert-error">Da ist wohl was schief gelaufen. ';
 $html[] = $apologise;
 $html[] = '</p>';
}
echo $link . implode('', $html);

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.

Joomla CSS Frontend LESS Template