使用 Bootstrap_package 为 Typo3 中的内容元素添加多个额外的预定义背景颜色

Question

I tried to add new predefined background colours according to the instructions for the bootstrap_package

https://github.com/benjaminkott/bootstrap_package/wiki/Add-additional-Background-Colors-to-Content-Elements

It works fine with only one additional colour, adding the code from the instructions to PageTsConfig and TypoScript constants (the SCSS snippet seems to be not necessary). However, I'm not able to make it work with more than one colour. The pageTsConfig part seems to work (I see all the new colors as option in the backend editor).

TCEFORM {
    tt_content {
        background_color_class {
            addItems {
                red = Red
                white = White
                hblau = Herth-Blau
            }
        }
    }
}

But the change in the CSS (through the constants of the extension) does not work. I tried this code there:

plugin.bootstrap_package.settings.scss {
    frame-backgrounds = ( hblau:(background: #0092d0, link-color: #e0efff, link-hover-color: #ffffff),
                          white:(background: #ffffff, link-color: #e0efff, link-hover-color: #ffffff),
                          red:(background: #ff0000, link-color: #ffeeee, link-hover-color: #ffffff)
     )
} 

Does any body else have an idea, what I'm doing wrong here?

Any help highly appreciated.

kind regards Chris

Answer 1

As you are writing TypoScript code, you are using the assignment operator "=" and you have to write all the values within the same line; I'll borrow some lines from the official documentation

Value assignment: The “=” operator

This simply assigns a value to an object path.

Rules:

Everything after the = sign and up to the end of the line is considered to be the value. > In other words: You don't need to quote anything!

Be aware that the value will be trimmed, which means stripped of whitespace at both ends

Example:

myObject.myProperty = value 2

If you want to use multiline values, you have to use the "()" operator and write

• the opening parenthesis on the same line of the object
• the value assigned on a new line (or multiple lines)
• and the closing parenthesis on new line

Multi-line values: The ( ) signs Opening and closing parenthesis are used to assign a multi-line value. With this method you can define values which span several lines and thus include line breaks.

Important

You cannot use multi-line values in constants. They are only available in the setup part of TypoScript.

Example

myObject = TEXT
myObject.value (
   <p class="warning">
     This is HTML code.
   </p>
)