Übersicht CSS-Klassen Textstile editorghsvs.css

CSS-Klassen, dynamisch aus editorghsvs.css ausgelesen

Gerenderte Ausgabe der Datei editorghsvs-classes-bs4.php

Link zur CSS-Datei editorghsvs.css

CSS-Klassen und Ausgabe-Beispiele

EXCLUDEVENOBOX
Ich bin ein SPAN-Beispiel mit der CSS-Klasse EXCLUDEVENOBOX.

Ich bin ein P-Beispiel mit der CSS-Klasse EXCLUDEVENOBOX.

breakall
Ich bin ein SPAN-Beispiel mit der CSS-Klasse breakall.

Ich bin ein P-Beispiel mit der CSS-Klasse breakall.

code-filename | codecode-filename
Ich bin ein SPAN-Beispiel mit der CSS-Klasse code-filename.

Ich bin ein P-Beispiel mit der CSS-Klasse code-filename.

Ich bin ein SPAN-Beispiel mit der CSS-Klasse codecode-filename.

Ich bin ein P-Beispiel mit der CSS-Klasse codecode-filename.

code-htmltag | codecode-htmltag | abbr
Ich bin ein SPAN-Beispiel mit der CSS-Klasse code-htmltag.

Ich bin ein P-Beispiel mit der CSS-Klasse code-htmltag.

Ich bin ein SPAN-Beispiel mit der CSS-Klasse codecode-htmltag.

Ich bin ein P-Beispiel mit der CSS-Klasse codecode-htmltag.

Ich bin ein SPAN-Beispiel mit der CSS-Klasse abbr.

Ich bin ein P-Beispiel mit der CSS-Klasse abbr.

code-eigenname
Ich bin ein SPAN-Beispiel mit der CSS-Klasse code-eigenname.

Ich bin ein P-Beispiel mit der CSS-Klasse code-eigenname.

code-fachausdruck
Ich bin ein SPAN-Beispiel mit der CSS-Klasse code-fachausdruck.

Ich bin ein P-Beispiel mit der CSS-Klasse code-fachausdruck.

code-zeilenverweis
Ich bin ein SPAN-Beispiel mit der CSS-Klasse code-zeilenverweis.

Ich bin ein P-Beispiel mit der CSS-Klasse code-zeilenverweis.

code-inline
Ich bin ein SPAN-Beispiel mit der CSS-Klasse code-inline.

Ich bin ein P-Beispiel mit der CSS-Klasse code-inline.

text-courier | text-monospace
Ich bin ein SPAN-Beispiel mit der CSS-Klasse text-courier.

Ich bin ein P-Beispiel mit der CSS-Klasse text-courier.

Ich bin ein SPAN-Beispiel mit der CSS-Klasse text-monospace.

Ich bin ein P-Beispiel mit der CSS-Klasse text-monospace.

text-fett | text-bold
Ich bin ein SPAN-Beispiel mit der CSS-Klasse text-fett.

Ich bin ein P-Beispiel mit der CSS-Klasse text-fett.

Ich bin ein SPAN-Beispiel mit der CSS-Klasse text-bold.

Ich bin ein P-Beispiel mit der CSS-Klasse text-bold.

text-fett-blau
Ich bin ein SPAN-Beispiel mit der CSS-Klasse text-fett-blau.

Ich bin ein P-Beispiel mit der CSS-Klasse text-fett-blau.

text-fett-gruen
Ich bin ein SPAN-Beispiel mit der CSS-Klasse text-fett-gruen.

Ich bin ein P-Beispiel mit der CSS-Klasse text-fett-gruen.

text-fett-lila | text-fett-purple
Ich bin ein SPAN-Beispiel mit der CSS-Klasse text-fett-lila.

Ich bin ein P-Beispiel mit der CSS-Klasse text-fett-lila.

Ich bin ein SPAN-Beispiel mit der CSS-Klasse text-fett-purple.

Ich bin ein P-Beispiel mit der CSS-Klasse text-fett-purple.

text-fett-orange
Ich bin ein SPAN-Beispiel mit der CSS-Klasse text-fett-orange.

Ich bin ein P-Beispiel mit der CSS-Klasse text-fett-orange.

text-fett-rot
Ich bin ein SPAN-Beispiel mit der CSS-Klasse text-fett-rot.

Ich bin ein P-Beispiel mit der CSS-Klasse text-fett-rot.

text-fett-unterstrichen
Ich bin ein SPAN-Beispiel mit der CSS-Klasse text-fett-unterstrichen.

Ich bin ein P-Beispiel mit der CSS-Klasse text-fett-unterstrichen.

text-fett-zentriert
Ich bin ein SPAN-Beispiel mit der CSS-Klasse text-fett-zentriert.

Ich bin ein P-Beispiel mit der CSS-Klasse text-fett-zentriert.

text-kursiv | text-italic
Ich bin ein SPAN-Beispiel mit der CSS-Klasse text-kursiv.

Ich bin ein P-Beispiel mit der CSS-Klasse text-kursiv.

Ich bin ein SPAN-Beispiel mit der CSS-Klasse text-italic.

Ich bin ein P-Beispiel mit der CSS-Klasse text-italic.

text-large | large
Ich bin ein SPAN-Beispiel mit der CSS-Klasse text-large.

Ich bin ein P-Beispiel mit der CSS-Klasse text-large.

Ich bin ein SPAN-Beispiel mit der CSS-Klasse large.

Ich bin ein P-Beispiel mit der CSS-Klasse large.

text-large-lineheight
Ich bin ein SPAN-Beispiel mit der CSS-Klasse text-large-lineheight.

Ich bin ein P-Beispiel mit der CSS-Klasse text-large-lineheight.

text-lila | text-purple
Ich bin ein SPAN-Beispiel mit der CSS-Klasse text-lila.

Ich bin ein P-Beispiel mit der CSS-Klasse text-lila.

Ich bin ein SPAN-Beispiel mit der CSS-Klasse text-purple.

Ich bin ein P-Beispiel mit der CSS-Klasse text-purple.

text-links
Ich bin ein SPAN-Beispiel mit der CSS-Klasse text-links.

Ich bin ein P-Beispiel mit der CSS-Klasse text-links.

text-medium
Ich bin ein SPAN-Beispiel mit der CSS-Klasse text-medium.

Ich bin ein P-Beispiel mit der CSS-Klasse text-medium.

text-medium-lineheight
Ich bin ein SPAN-Beispiel mit der CSS-Klasse text-medium-lineheight.

Ich bin ein P-Beispiel mit der CSS-Klasse text-medium-lineheight.

text-lineheight-small
Ich bin ein SPAN-Beispiel mit der CSS-Klasse text-lineheight-small.

Ich bin ein P-Beispiel mit der CSS-Klasse text-lineheight-small.

text-rot | text-red
Ich bin ein SPAN-Beispiel mit der CSS-Klasse text-rot.

Ich bin ein P-Beispiel mit der CSS-Klasse text-rot.

Ich bin ein SPAN-Beispiel mit der CSS-Klasse text-red.

Ich bin ein P-Beispiel mit der CSS-Klasse text-red.

text-smaller
Ich bin ein SPAN-Beispiel mit der CSS-Klasse text-smaller.

Ich bin ein P-Beispiel mit der CSS-Klasse text-smaller.

text-mini
Ich bin ein SPAN-Beispiel mit der CSS-Klasse text-mini.

Ich bin ein P-Beispiel mit der CSS-Klasse text-mini.

text-unterstrichen | text-underline
Ich bin ein SPAN-Beispiel mit der CSS-Klasse text-unterstrichen.

Ich bin ein P-Beispiel mit der CSS-Klasse text-unterstrichen.

Ich bin ein SPAN-Beispiel mit der CSS-Klasse text-underline.

Ich bin ein P-Beispiel mit der CSS-Klasse text-underline.

text-zentriert
Ich bin ein SPAN-Beispiel mit der CSS-Klasse text-zentriert.

Ich bin ein P-Beispiel mit der CSS-Klasse text-zentriert.

block-primary
Ich bin ein SPAN-Beispiel mit der CSS-Klasse block-primary.

Ich bin ein P-Beispiel mit der CSS-Klasse block-primary.

alert-link
Ich bin ein SPAN-Beispiel mit der CSS-Klasse alert-link.

Ich bin ein P-Beispiel mit der CSS-Klasse alert-link.

inline-primary
Ich bin ein SPAN-Beispiel mit der CSS-Klasse inline-primary.

Ich bin ein P-Beispiel mit der CSS-Klasse inline-primary.

block-secondary
Ich bin ein SPAN-Beispiel mit der CSS-Klasse block-secondary.

Ich bin ein P-Beispiel mit der CSS-Klasse block-secondary.

alert-link
Ich bin ein SPAN-Beispiel mit der CSS-Klasse alert-link.

Ich bin ein P-Beispiel mit der CSS-Klasse alert-link.

inline-secondary
Ich bin ein SPAN-Beispiel mit der CSS-Klasse inline-secondary.

Ich bin ein P-Beispiel mit der CSS-Klasse inline-secondary.

block-success
Ich bin ein SPAN-Beispiel mit der CSS-Klasse block-success.

Ich bin ein P-Beispiel mit der CSS-Klasse block-success.

alert-link
Ich bin ein SPAN-Beispiel mit der CSS-Klasse alert-link.

Ich bin ein P-Beispiel mit der CSS-Klasse alert-link.

inline-success
Ich bin ein SPAN-Beispiel mit der CSS-Klasse inline-success.

Ich bin ein P-Beispiel mit der CSS-Klasse inline-success.

block-info
Ich bin ein SPAN-Beispiel mit der CSS-Klasse block-info.

Ich bin ein P-Beispiel mit der CSS-Klasse block-info.

alert-link
Ich bin ein SPAN-Beispiel mit der CSS-Klasse alert-link.

Ich bin ein P-Beispiel mit der CSS-Klasse alert-link.

inline-info
Ich bin ein SPAN-Beispiel mit der CSS-Klasse inline-info.

Ich bin ein P-Beispiel mit der CSS-Klasse inline-info.

block-warning
Ich bin ein SPAN-Beispiel mit der CSS-Klasse block-warning.

Ich bin ein P-Beispiel mit der CSS-Klasse block-warning.

alert-link
Ich bin ein SPAN-Beispiel mit der CSS-Klasse alert-link.

Ich bin ein P-Beispiel mit der CSS-Klasse alert-link.

inline-warning
Ich bin ein SPAN-Beispiel mit der CSS-Klasse inline-warning.

Ich bin ein P-Beispiel mit der CSS-Klasse inline-warning.

block-danger
Ich bin ein SPAN-Beispiel mit der CSS-Klasse block-danger.

Ich bin ein P-Beispiel mit der CSS-Klasse block-danger.

alert-link
Ich bin ein SPAN-Beispiel mit der CSS-Klasse alert-link.

Ich bin ein P-Beispiel mit der CSS-Klasse alert-link.

inline-danger
Ich bin ein SPAN-Beispiel mit der CSS-Klasse inline-danger.

Ich bin ein P-Beispiel mit der CSS-Klasse inline-danger.

block-light
Ich bin ein SPAN-Beispiel mit der CSS-Klasse block-light.

Ich bin ein P-Beispiel mit der CSS-Klasse block-light.

alert-link
Ich bin ein SPAN-Beispiel mit der CSS-Klasse alert-link.

Ich bin ein P-Beispiel mit der CSS-Klasse alert-link.

inline-light
Ich bin ein SPAN-Beispiel mit der CSS-Klasse inline-light.

Ich bin ein P-Beispiel mit der CSS-Klasse inline-light.

block-dark
Ich bin ein SPAN-Beispiel mit der CSS-Klasse block-dark.

Ich bin ein P-Beispiel mit der CSS-Klasse block-dark.

alert-link
Ich bin ein SPAN-Beispiel mit der CSS-Klasse alert-link.

Ich bin ein P-Beispiel mit der CSS-Klasse alert-link.

inline-dark
Ich bin ein SPAN-Beispiel mit der CSS-Klasse inline-dark.

Ich bin ein P-Beispiel mit der CSS-Klasse inline-dark.

hyphenate
Ich bin ein SPAN-Beispiel mit der CSS-Klasse hyphenate.

Ich bin ein P-Beispiel mit der CSS-Klasse hyphenate.

donthyphenate
Ich bin ein SPAN-Beispiel mit der CSS-Klasse donthyphenate.

Ich bin ein P-Beispiel mit der CSS-Klasse donthyphenate.

Quelltext der Datei editorghsvs-classes-bs4.php

<?php
/**
2019-10-30
editorghsvs-classes-bs4.php
Liest editorghsvs.css des akt. Template aus.
Siehe Hinweis im Kopf von editorghsvs.css.
Beitrag: 115
*/

defined('_JEXEC') or die;

use Joomla\CMS\Factory;
use Joomla\CMS\Uri\Uri;
use Joomla\CMS\Language\Text;

$cssFile = 'editorghsvs.css';

$template = Factory::getApplication()->getTemplate();
$file = 'templates/' . $template . '/css/' . $cssFile;
$fileAbs = JPATH_SITE . '/' . $file;
$html = array();
$lessFile = '';
$link = '';
$error = array();

if (!is_file($fileAbs) || !($fileContent = trim(file_get_contents($fileAbs))))
{
	$error[] = 'Error! File not found or empty: ' . $file;
}
else
{
	$link = '<h4>Link zur CSS-Datei ' . $cssFile . '</h4><p><a href="'
		. Uri::root() . $file . '">' . $file . '</a></p>';
	$muster = '/(\.[-a-z0-9]+(,.+?|))\s*{/si';
	$found = preg_match_all($muster, $fileContent, $matches, PREG_SET_ORDER);

	foreach ($matches as $key => &$match)
	{
		// e.g. ".text-courier, .text-monospace {" or ".text-fett-blau {"
		if (!$match[1])
		{
			unset($matches[$key]);
			continue;
		}
		// No need:
		unset($match[0], $match[2]);
		
		$match[1] = str_replace(array(' ', ':before', "\n", "\r", '.'), '', $match[1]);
		
		// multiple classes for one rule separated by comma.
		$match[1] = explode(',', $match[1]);
	}
	
	// We used a &$match reference. Thus no need anymore.
	unset($match);
	
	/* Array of arrays like
	[23] => Array
	(
		[1] => Array
		(
			[0] => text-unterstrichen
			[1] => text-underline
		)
	)
	*/
	$matches = array_values($matches);
	$nl = PHP_EOL;

	if (count($matches))
	{
		$html[] = '<ul class="list-group">' . $nl;

		foreach ($matches as $match)
		{
			$html[] = '<li class="list-group-item">';
			$html[] = '<h5>' . implode(' | ', $match[1]) . '</h5>' . $nl;

			foreach ($match[1] as $cssClass)
			{
				if (strpos($cssClass, 'icon-') === false)
				{
					$spanText = Text::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><code>'
					. htmlentities('<span class="' . $cssClass . '"></span>') . '</code></p>';

				$html[] = '<p class="' . $cssClass . '">' . $pText . '</p>';
				$html[] = '<p><code>'
					. htmlentities('<p class="' . $cssClass . '"></p>') . '</code></p><hr>';
			}
			$html[] = '</li>' . $nl;
		}
		$html[] = '</ol>' . $nl;
	}
}

if (!count($html))
{
	$error[] = 'Error! Nothing to output.';
}

if ($error)
{
	$html[] = '<p class="block-danger">';
	$html[] = implode('<br>', $error);
	$html[] = '</p>';
}
else
{
	echo $link . '<h4>CSS-Klassen und Ausgabe-Beispiele</h4>' . implode('', $html);
}

Beitrags-Schlagworte

Joomla CSS

Kategorien: Hauptkategorie: Schnipsel; Kategorie: Spezielles, GHSVS-Internes
Datum-Infos: Erstellt: 10.03.2013; Aktualisiert: 11.11.2019

Speziell (Chaotische Grabbelkiste)

Übersicht CSS-Klassen Textstile editorghsvs.css (Stand: Aktuell verwendet in aktivem Template)

CSS-Klassen, dynamisch aus editorghsvs.css ausgelesen

Gerenderte Ausgabe der Datei editorghsvs-classes-bs4.php

Link zur CSS-Datei editorghsvs.css

CSS-Klassen und Ausgabe-Beispiele

EXCLUDEVENOBOX

breakall

code-filename | codecode-filename

code-htmltag | codecode-htmltag | abbr

code-eigenname

code-fachausdruck

code-zeilenverweis

code-inline

text-courier | text-monospace

text-fett | text-bold

text-fett-blau

text-fett-gruen

text-fett-lila | text-fett-purple

text-fett-orange

text-fett-rot

text-fett-unterstrichen

text-fett-zentriert

text-kursiv | text-italic

text-large | large

text-large-lineheight

text-lila | text-purple

text-links

text-medium

text-medium-lineheight

text-lineheight-small

text-rot | text-red

text-smaller

text-mini

text-unterstrichen | text-underline

text-zentriert

block-primary

alert-link

inline-primary

block-secondary

alert-link

inline-secondary

block-success

alert-link

inline-success

block-info

alert-link

inline-info

block-warning

alert-link

inline-warning

block-danger

alert-link

inline-danger

block-light

alert-link

inline-light

block-dark

alert-link

inline-dark

hyphenate

donthyphenate

Quelltext der Datei editorghsvs-classes-bs4.php

Beitrags-Infos

Beitrags-Schlagworte

Beitrags-Veröffentlichungs-Infos