Um in CSS Marker verwenden zu können folgendes in das TS Template (hier für 2 Stylesheets + 4 Overlays):

#--------------------------------
# Stylesheets parsing
#--------------------------------

# ---------- Template ----------
cssTemplate1 = TEMPLATE
cssTemplate1.template = FILE
cssTemplate1.template.file = fileadmin/layout/css/rsys_layout.css

# ---------- Markers ----------
cssTemplate1.marks {
    BODY = TEXT
    BODY {
        data = levelmedia: -1 "slide"
        wrap = background-image: url(uploads/media/ |); background-repeat: no-repeat;
        listNum = 0
    }
    FULL_WIDTH = TEXT
    FULL_WIDTH.value = {$full_width}
    LINK_HOVER = TEXT
    LINK_HOVER.value = {$link_hover}
    LINK_NORMAL = TEXT
    LINK_NORMAL.value = {$link_normal}
}

# ---------- Page Object ----------
cssObject1 = PAGE
cssObject1 {
  typeNum = 31
  config {
    disableAllHeaderCode = 1
    additionalHeaders = Content-type: text/css
    admPanel = 0
  }
  # dynamische CSS-Vorlage aus Bibliothek laden
  20 < cssTemplate1
}

# ---------- Duplicate and modify Template ----------
cssTemplate2 < .cssTemplate1
cssTemplate3 < .cssTemplate1
cssTemplate4 < .cssTemplate1
cssTemplate5 < .cssTemplate1
cssTemplate6 < .cssTemplate1

cssTemplate2.template.file = fileadmin/layout/css/rsys_style.css
cssTemplate3.template.file = fileadmin/layout/css/rsys_style-overlay-1.css
cssTemplate4.template.file = fileadmin/layout/css/rsys_style-overlay-2.css
cssTemplate5.template.file = fileadmin/layout/css/rsys_style-overlay-3.css
cssTemplate6.template.file = fileadmin/layout/css/rsys_style-overlay-4.css

# ---------- Duplicate and modify  Page Object  ----------
cssObject2 < .cssObject1
cssObject3 < .cssObject1
cssObject4 < .cssObject1
cssObject5 < .cssObject1
cssObject6 < .cssObject1

cssObject2.typeNum = 32
cssObject3.typeNum = 33
cssObject4.typeNum = 34
cssObject5.typeNum = 35
cssObject6.typeNum = 36

cssObject2.20 < cssTemplate2
cssObject3.20 < cssTemplate3
cssObject4.20 < cssTemplate4
cssObject5.20 < cssTemplate5
cssObject6.20 < cssTemplate6


# ---------- Include ----------
page.headerData {
    5 = TEXT
    5 {
        value (
    <link rel="stylesheet" type = "text/css" media="screen" title="Style"href="rsys_layout.css">
  
        )
        insertData =1
    }
}
page.headerData {
    6 = TEXT
    6 {
        value (
<link rel="stylesheet" type = "text/css" media="screen" title="Style" href="rsys_style.css">
  
        )
        insertData =1
    }
}
page.headerData {
    7 = TEXT
    7 {
        value (
<link rel="stylesheet" type = "text/css" media="screen" title="Style" href="rsys_style-overlay-1.css">
  
        )
        insertData =1
    }
}

In die Constants dann:

link_hover = green
link_normal = green
full_width = 900px

Um schönere Namen zu haben folgendes in die localconf.php bei RealURL:

// -------------------------
// Stylesheet parsing
// -------------------------
array(
    'GETvar' => 'type',
    'valueMap' => array(
        'rsys_layout.css' => '31',
        'rsys_style.css' => '32',
        'rsys_style-overlay-1.css' => '33',
        'rsys_style-overlay-2.css' => '34',
        'rsys_style-overlay-3.css' => '35',
        'rsys_style-overlay-4.css' => '36',
        'valueDefault' => '31',
    ),
    'noMatch' => 'bypass',
),

Um folgende Sachen zu erreichen:

1.) Marker in Stylesheets verwenden zu können

2.) Stylesheets in einzeln Dateien in Untervereichnisse aufzuteillen

habe ich letzlich ein php-Skript geschrieben, welche die zentrale CSS Datei "ausgibt".

Punkt 2 ginge auch mit den @import Anweisungen von css - dies hat aber den Nachteil, dass die Browser diese dann nicht mehr parallel sondern sequentiell laden, was zu einer starken Performance Einbusse führt.

rsysstyle.php

Das Skript rsysstyle.php sieht folgendermassen aus:

<?php

$filename = $_SERVER['DOCUMENT_ROOT'] . $_SERVER['REQUEST_URI'];
$basename =  preg_match('/(\/.*\/).*css/', $filename, $matches);
$basename = $matches[1];

header('Content-type: text/css');

$lines = file ( $filename);
foreach ($lines as $line_num => $line) {
    
    if( preg_match('/\@import url\((.*css)/', $line, $matches)) {
   
        $sublines = file ($basename . $matches[1]);
        foreach ($sublines as $subline_num => $subline) {
            echo parse($subline);
        }
    } else {
        echo  $line;
    }
}


function parse($text) {

    $replacements = array(
        '#3B66BD' =>'grellrot',
    );
    $ret = str_replace('../../','../',$text);
    foreach ($replacements as $search => $replace) {
        $ret = str_replace($search, $replace, $ret);
    }
    return $ret;
}
?>

.htaccess

Das Skript rsysstyle.php wird mittels .htaccess Einstellungen aufgerufen wenn Stylesheets angefordert werden. Die .htaccess sieht folgendermassen aus:

# Enable URL rewriting
RewriteEngine On

RewriteRule fileadmin/layout/css/(.*)\.(css)$ rsysstyle.php?filename=$1 [C]

# Typo Standard
RewriteRule ^(typo3|t3lib|tslib|fileadmin|typo3conf|typo3temp|uploads|showpic\.php|favicon\.ico)/ - [L]

Stylesheets

Die angeforderten Stylesheets sind bei mir z.B. fileadmin/layout/css/rsys_layout.css. Die Datei rsys_layout.css sieht dabei folgendermassen aus:

@import url(./layout/layout-boxes.css);
@import url(./layout/layout-common.css);
@import url(./layout/layout-content.css);
@import url(./layout/layout-footer.css);
@import url(./layout/layout-header.css);
@import url(./layout/layout-login.css);
@import url(./layout/layout-menues.css);
@import url(./layout/layout-search.css);

Das php Skript lädt die mit @import deklarierten Stylesheets und gibt sie allessamt als eine Datei Namens rsys_layout.css aus. Der Vorteil des gesamt Konzeptes ist dass es auch ohne das Skript funktioniert - dann wird einfach der css import Befehl interpretiert.