MusareMeteor/app/client/templates/news.html

<template name="news">
    {{> header}}
    <main class="content-box row hack-container">
        <h3 class="black-text thin center">News</h3>
            {{#each articles}}
                <div class="card light-blue-text col m6 s12 l6 offset-m3 offset-l3">
                    <div class="card-content">
                        <h3 class="center">{{title}}</h3>
                        <hr style="margin: 15px;">
                        <p id="news-content" style="word-wrap:break-word;" class="black-text">
                            {{content}}
                        </p>
                    </div>
                    <div class="card-action">
                        <span>Posted by: {{author}}.</span><br>
                        <span>Created at: {{rtime time}}.</span>
                    </div>
                </div>
            {{/each}}
    </main>
    <div class="fixed-action-btn" style="bottom: 45px; right: 24px;">
        <a class="btn-floating btn-large red modal-trigger" href="#createArticle"><i class="large material-icons">add</i></a>
    </div>
    <div id="createArticle" class="modal">
        <div class="modal-content musare white-text">
            <h4 class="center-align">Create Article</h4>
            <div class="row">
                <div class="input-field col l8 m8 s12 offset-l2 offset-m2">
                    <label for="title" class="white-text">Title</label>
                    <input class="validate" name="title" id="title" type="text"/>
                </div>
                <div class="input-field col l8 m8 s12 offset-l2 offset-m2">
                    <textarea class="materialize-textarea validate" name="content" id="content" type="text"></textarea>
                    <label for="content" class="white-text">Content</label>
                </div>
                <div class="col l8 m8 s12 offset-l2 offset-m2">
                    <div class="switch">
                        <label class="white-text">
                            Post as myself
                            <input id="anonymous" type="checkbox">
                            <span class="lever"></span>
                            Post anonymous
                        </label>
                    </div>
                </div>
            </div>
            <div class="row">
                <button type="button" id="createArticleButton" class="btn btn-large col l6 m6 s10 offset-l3 offset-m3 offset-s1 waves-effect waves-light">Create Article</button>
            </div>
        </div>
        <div class="modal-footer musare white-text">
            <a href="#!" class="modal-action modal-close waves-effect waves-light btn-flat white">X</a>
        </div>
    </div>
    <script>
        $(document).ready(function(){
            // the "href" attribute of .modal-trigger must specify the modal ID that wants to be triggered
            $('.modal-trigger').leanModal();
        });
    </script>
    {{> footer}}
</template>