{% extends "layout/base.html" %}
{% block body %}
<header>
    <nav role="navigation" class="cyan lighten-2">
        <div class="nav-wrapper container"><a href="/w/" class="brand-logo title">mnemonics</a>
            <ul id="nav-mobile" class="right">
                <li><a href="/auth/logout">Sign out</a></li>
            </ul>
        </div>
    </nav>
</header>

<main>
    <div class="container">
        <div class="panel">
            <h3 class="title">Welcome to Tigris!</h3>

            <p class="desc">안녕하세요 티그리스입니다. 티그리스는 멍충이가 멍충한 지식을 멍충하게 정리하는 멍충한 위키입니다. 뭐 페이스북으로 로그인만 하시면 글 쓰는건 자유라서 맘껏 이용하시면
                됩니다. 한국어로만 만들어진 티그리스는 문서 000개가 실려있습니다. 이용방법은<a href="./How-to" style="text-decoration:underline"
                                                               class="cyan-text text-lighten-2">HOW-TO</a>로 가시면 상세한 내용을
                확인하실 수 있습니다! 가끔 영어로 쓰여질때도 있을수도 있으나 거의 없을거에요.
                짜증!
            </p>
        </div>
        <div class="panel">
            <h3 class="title">Today's Pick<span class="inline_btn"><a
                    class="btn-floating btn-small waves-effect waves-light"><i class="mdi-navigation-refresh small"></i></a></span>
            </h3>

            <p class="desc"><span>비슷한 랜덤 주제에 대한 내용입니다.</span></p>

            <div class="row">
                <div class="pick col s12 m6">
                    <div class="card">
                        <div class="card-image">
                            <div class="dimmed"><img
                                    src="https://raw.githubusercontent.com/quickhack/translations/master/git-workflows-and-tutorials/images/git-workflows-gitflow.png"/>
                            </div>
                            <span class="card-title">Card-Title</span>
                        </div>
                        <div class="card-content">
                            <p>
                                I am a very simple card. I am good at containing small bits of information.
                                I am convenient because I require little markup to use effectively.
                            </p>
                        </div>
                        <div class="card-action"><a href="#">LEARN MORE</a></div>
                    </div>
                </div>
                <div class="pick col s12 m6">
                    <div class="card">
                        <div class="card-image">
                            <div class="dimmed"><img src="http://materializecss.com/images/sample-1.jpg"/></div>
                            <span class="card-title">Card-Title</span>
                        </div>
                        <div class="card-content">
                            <p>
                                I am a very simple card. I am good at containing small bits of information.
                                I am convenient because I require little markup to use effectively.
                            </p>
                        </div>
                        <div class="card-action"><a href="#">LEARN MORE</a></div>
                    </div>
                </div>
            </div>
        </div>
        <div class="panel">
            <div class="row heading">
                <div class="col s12">
                    <h4 class="blue-grey-text text-lighten-3 title">Recently updated</h4><a href="./recentlyUpdated"
                                                                                            class="right more waves-effect btn btn-small gray-text blue-grey lighten-5 blue-grey-text text-darken-2">More</a>
                </div>
            </div>
            <div class="row">
                <div class="col s12 m4">
                    <div class="card">
                        <div class="card-content">
                            <div class="card-title truncate_pre blue-grey-text text-darken-2">타이틀영역한줄입니다.</div>
                            <p class="card-desc">
                                업데이트왼 위키 내용은 여기서 보여집니다.
                                여기는 컨텐츠 일부만 보여지고 클릭하면 상세페이지로 이동합니다.
                            </p>
                        </div>
                    </div>
                </div>
                <div class="col s12 m4">
                    <div class="card">
                        <div class="card-content">
                            <div class="card-title truncate_pre blue-grey-text text-darken-2">
                                타이틀영역입니다.
                                타이틀 영역은 두줄인데 뭘써야되는거임
                            </div>
                            <p class="card-desc">
                                업데이트왼 위키 내용은 여기서 보여집니다.
                                여기는 컨텐츠 일부만 보여지고 클릭하면 상세페이지로 이동합니다.
                            </p>
                        </div>
                    </div>
                </div>
                <div class="col s12 m4">
                    <div class="card">
                        <div class="card-content">
                            <div class="card-title truncate_pre blue-grey-text text-darken-2">
                                타이틀영역입니다.
                                타이틀 영역은 두줄인데 뭘써야되는거임
                            </div>
                            <p class="card-desc">
                                업데이트왼 위키 내용은 여기서 보여집니다.
                                여기는 컨텐츠 일부만 보여지고 클릭하면 상세페이지로 이동합니다.
                            </p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</main>
<footer class="page-footer cyan lighten-2">
    <div class="container">
        <div class="row">
            <div class="col l6 s12">
                <h5 class="white-text">Footer Content</h5>

                <p class="grey-text text-lighten-4">You can use rows and columns here to organize your footer
                    content.</p>
            </div>
            <div class="col l4 offset-l2 s12">
                <h5 class="white-text">Links</h5>
                <ul>
                    <li><a href="#!" class="grey-text text-lighten-3">Link 1</a></li>
                    <li><a href="#!" class="grey-text text-lighten-3">Link 2</a></li>
                    <li><a href="#!" class="grey-text text-lighten-3">Link 3</a></li>
                    <li><a href="#!" class="grey-text text-lighten-3">Link 4</a></li>
                </ul>
            </div>
        </div>
    </div>
    <div class="footer-copyright">
        <div class="container">© 2014 Copyright Text<a href="#!" class="grey-text text-lighten-4 right">More Links</a>
        </div>
    </div>
</footer>
{% endblock %}