Brief - a feed reading extension for Firefox

Customizing apperance of feeds

Brief lets you change the appearance of feeds using CSS. To add custom style rules, open Brief's options, select the Display tab and click Customize. You can also edit the CSS file directly, it is stored under /chrome/brief-custom-style.css in your profile.

Rules which you define are applied in addition to the default style.

This is the structure of the page used to display feeds:

<body>
    <div id="container">

        <div id="header">
            <img id="feed-image"/>
            <a id="feed-title"/>
            <div id="feed-subtitle"/>
        </div>

        <div id="feed-content">

            <!-- Articles go here. -->

            <!-- Structure of a single article: -->
            <div class="article-container">

                <div class="article-header">
                    <div class="expand-button"/>
                    <div class="star-container"/>
                    <div class="article-controls"/>

                    <!-- Shown only in collapsed articles (headlines view): -->
                    <div class="collapsed-article-subheader">
                        <div class="article-date"/>
                        <div class="feed-name"/>
                    </div>

                    <a class="article-title-link"/>

                    <!-- Shown only in full articles: -->
                    <div class="article-subheader">
                        <div class="article-date"/>
                        <div class="article-authors"/>
                        <div class="feed-name"/>
                    </div>
                </div>

                <div class="article-content"/>

            </div>

        </div>

    </div>
</body>

Once you create your own style, please share it with others!