sphinx tabs not rendering properly

[shahzebsiddiqui]

Describe the problem

The sphinx tabs are not showing up properly i want them to be rendered in bash but they show up like this

See https://buildtest--940.org.readthedocs.build/en/940/installing_buildtest.html

Working through this problem in this PR: https://github.com/buildtesters/buildtest/pull/940

Link to your repository or website

https://github.com/buildtesters/buildtest/

Steps to reproduce

Follow instructions on installing buildtest https://buildtest.readthedocs.io/en/devel/installing_buildtest.html and building docs: https://buildtest.readthedocs.io/en/devel/contributing/build_documentation.html

The version of Python you're using

3.7

Your operating system

MacOS

Versions of your packages

No response

Additional context

No response

[welcome[bot]]

Thanks for opening your first issue here! Engagement like this is essential for open source projects! :hugs:
If you haven't done so already, check out EBP's Code of Conduct. Also, please try to follow the issue template as it helps other community members to contribute more effectively.
If your issue is a feature request, others may react to it, to raise its prominence (see Feature Voting).
Welcome to the EBP community! :tada:

[shahzebsiddiqui]

I have tried several variations of this i basically want to get the title HTTPS and SSH in the tab for git clone and the installing buildtest with title Virtual Environment, conda and pipenv the problem is the content is not being rendered in code block.

I tried using .. code-tabs:: bash but then i wasn't getting my captions right.

I tried doing .. code-tabs: bash Virtual Environment

I also tried

.. code-tabs: Virtual Environment

   .. code-block:: console

         some bash code 

[shahzebsiddiqui]

i was sort of able to figure this out in https://buildtest--940.org.readthedocs.build/en/940/installing_buildtest.html#id2.

Right now i am doing something like this. Not sure if this is the right way. The double colon vs using code-tabs with custom title.

.. tabs::

    .. tab:: Virtual Environment

       ::

           python3 -m venv $HOME/buildtest
           source $HOME/buildtest/activate
           cd buildtest
           source setup.sh

    .. tab:: Conda

        ::

           conda create -n buildtest python=3.7
           source activate buildtest
           cd buildtest
           source setup.sh

    .. tab:: pipenv

       ::

           pipenv --python 3.7
           pipenv shell
           cd buildtest
           source setup.sh

[foster999]

Hi @shahzebsiddiqui, apologies for the slow reply to this!

code-tab is mostly just a wrapper around your last example (a code-block inside a tab), but I think the correct syntax for your example should be:

.. tabs::

    .. code-tab:: bash Virtual Environment

           python3 -m venv $HOME/buildtest
           source $HOME/buildtest/activate
           cd buildtest
           source setup.sh

[shahzebsiddiqui]

With this example will title include bash in the title or just Virtual Environment. I was able to get it working you can check out https://buildtest.readthedocs.io/en/devel/installing_buildtest.html#id2. The title was meant to allow user to select installation method depending on their python environment preference.

[foster999]

With this example will title include bash in the title or just Virtual Environment. I was able to get it working you can check out https://buildtest.readthedocs.io/en/devel/installing_buildtest.html#id2. The title was meant to allow user to select installation method depending on their python environment preference.

The first word is used to determine the highlighting of the code block (i.e. bash), while the remaining words should be displayed as the tab label (Virtual Environment).

[shahzebsiddiqui]

thanks for clarification i didnt read the documentation carefully i see it states this. I just jumped into the examples below.

The first argument to a code-tab is the name of the language to use for code highlighting, while the optional second argument is a custom label for the tab.