I am trying to reproduce a MediaWiki element inside a Confluence Wiki

[Milen Bilyanov]

Hi,

I have a MediWiki wiki that I am trying to migrate to Confluence. I have a specific element that I was not able to replicate in my Confluence Knowledge Base page.

It looks like this:

panel.png

the code is this:

Set these compiler flags:
{| style="font-style:regular; font-size:100%; width: 100%; border: 2px dashed; color: #000000; background-color: #FFF9E7;"
|-
|<code>$ export CC=clang </code>
|- 
|<code>$ export CXX=clang </code>
|-
|<code>$ export FFLAGS=-ff2c </code>
|-
|}

Could you please help me to achieve this look inside a Confluence Macro Panel?

Thanks,

Milen

[Milen Bilyanov]

Hi Stephen,

Thanks for the answer. I am new to Confluence and I will try your solution, but I still think there should be a simpler solution. I mean, the whole point of Confluence is being able to construct the wiki and knowledge pages really quickly and in a flexible way.

I am trying to understand how CSS works and how one can use custom CSS code, but as I said, this is my second day using confluence. I would expect to be able to inject some kind of a CSS formatting into the main "Place Code" and then access it through the CSS Macros. Any ideas? The solution above just seems a bit too elaborate. However, thanks for the time and the help.

[Stephen Deutsch]

Hi Milen,

If you have the Confluence Source Editor (https://marketplace.atlassian.com/plugins/com.atlassian.confluence.plugins.editor.confluence-source-editor) and the Content Formatting Macros (https://marketplace.atlassian.com/plugins/com.adaptavist.confluence.contentFormattingMacros), then you could paste something like this into your page source (the colors aren't perfectly exact):

<p>
  <strong> <span>Set these compiler flags:</span> </strong>
</p>
<ac:structured-macro ac:name="panel">
  <ac:parameter ac:name="bgColor">#FFF9E7</ac:parameter>
  <ac:parameter ac:name="borderStyle">dashed</ac:parameter>
  <ac:parameter ac:name="borderColor">black</ac:parameter>
  <ac:parameter ac:name="borderWidth">2</ac:parameter>
  <ac:rich-text-body>
    <ac:structured-macro ac:name="span">
      <ac:parameter ac:name="style">background-color:#FDFFFF</ac:parameter>
      <ac:parameter ac:name="atlassian-macro-output-type">INLINE</ac:parameter>
      <ac:rich-text-body>$ export CC=clang</ac:rich-text-body>
    </ac:structured-macro>
    <ac:structured-macro ac:name="div">
      <ac:rich-text-body>
        <p> </p>
      </ac:rich-text-body>
    </ac:structured-macro>
    <ac:structured-macro ac:name="span">
      <ac:parameter ac:name="style">background-color:#FDFFFF</ac:parameter>
      <ac:parameter ac:name="atlassian-macro-output-type">INLINE</ac:parameter>
      <ac:rich-text-body>$ export CXX=clang</ac:rich-text-body>
    </ac:structured-macro>
    <ac:structured-macro ac:name="div">
      <ac:rich-text-body>
        <p> </p>
      </ac:rich-text-body>
    </ac:structured-macro>
    <ac:structured-macro ac:name="span">
      <ac:parameter ac:name="style">background-color:#FDFFFF</ac:parameter>
      <ac:parameter ac:name="atlassian-macro-output-type">INLINE</ac:parameter>
      <ac:rich-text-body>$ export FFLAGS=-ff2c</ac:rich-text-body>
    </ac:structured-macro>
  </ac:rich-text-body>
</ac:structured-macro>

The problem is that the text is really sensitive, i.e. if you change the text in the macro editor, it will break the single word highlighting.  I couldn't find a good way to do it otherwise, though.  You could use a div, but then it would highlight the entire line and not just the words.