website/web/templates/index.html

{{define "title"}}A social network for real nudists and exhibitionists{{end}}
{{define "content"}}
<div class="block">
    <section class="hero is-light is-bold">
        <div class="hero-body">
            <div class="container">
                <h1 class="title">{{ PrettyTitle }}</h1>
                <h2 class="subtitle">{{ .Subtitle }}</h2>
            </div>
        </div>
    </section>
</div>

<div class="block p-4">
    <div class="columns">
        <div class="column content is-three-quarters p-4">
            <p>
                Welcome to <strong>{{PrettyTitle}}</strong>, a social network designed for <strong>real</strong>
                nudists and exhibitionists!
            </p>

            <p>
                This website was designed by a life-long nudist, exhibitionist and software engineer to create
                a safe space for like-minded individuals online, especially in the modern online political
                climate and after Tumblr, Pornhub and other social networks had begun clamping down and kicking
                off all the nudists from their platforms.
            </p>

            <p>
                This website is open to <em>all</em> nudists and exhibitionists, but I understand that not all
                nudists want to see any sexual content, so this site provides some controls to support
                both camps:
            </p>

            <ul>
                <li>
                    For <strong>nudists:</strong> a default setting on your profile will hide 'explicit content'
                    from users' profile pages and you will not see the explicit web forum threads either.
                </li>
                <li>
                    For <strong>exhibitionists:</strong> you can toggle that setting to view explicit content
                    and mark your own explicit pictures as such so that nudists who don't want to see them
                    don't have to.
                </li>
            </ul>

            <h1>Open Beta</h1>

            <p>
                This website is currently open for beta testing. It's not 100% complete yet, but is basically
                functional. It currently supports profile pages, photo galleries, friend requests, Direct
                Messages, a member directory to discover new users, and basic account management features.
            </p>

            <p>
                Before the "1.0" launch it will include web forums which will provide a community space to
                chat with and meet other members.
            </p>

            <h1>Site Rules</h1>

            <ul>
                <li>
                    🧑 Only <strong>real people</strong> are allowed to join. You must be comfortable showing your
                    face on your profile page. You don't need to include your face in your nudes but a profile picture
                    of your face is required.
                </li>
                <li>
                    ✅ <strong>Verification is mandatory.</strong> Along with the face picture on your profile page,
                    you will need to take a selfie with a hand-written note on paper to verify that you're a real
                    person.
                </li>
                <li>
                    🤳 <strong>Self pictures only.</strong> You are expected to post only pictures that you're in.
                    No "porn blogs" of random content you found online!
                </li>
                <li>
                    😈 <strong><span class="has-text-danger">Explicit content</span> is permitted in designated areas only.</strong>
                    Not all nudists want to see "sexual" content, but exhibitionists are welcome here too. If you want to upload
                    sexually charged content, mark those pictures as 'explicit' when uploading them or post them only to the
                    designated explicit forums so nudists who prefer not to see don't have to.
                </li>
                <li>
                    🔞 You must be <strong class="has-text-danger">18 years or older</strong> to sign up for this website.
                </li>
            </ul>

            <p>
                For more details, please check out the <a href="/tos">Terms of Service</a> as well as
                the <a href="/privacy">Privacy Policy</a>.
            </p>

        </div>

        <div class="column is-one-quarter">

            {{if .LoggedIn}}
            <div class="card">
                <header class="card-header has-background-link">
                    <p class="card-header-title has-text-light">Welcome back, {{.CurrentUser.Username}}!</p>
                </header>

                <div class="card-content p-2">
                    <ul class="menu-list">
                        <li>
                            <a href="/messages"{{if .NavUnreadMessages}} class="has-text-warning-dark"{{end}}>
                                <span class="icon"><i class="fa fa-envelope"></i></span>
                                {{if .NavUnreadMessages}}
                                    <span>{{.NavUnreadMessages}} New Message{{Pluralize64 .NavUnreadMessages}}!</span>
                                {{else}}
                                    <span>Messages</span>
                                {{end}}
                            </a>
                        </li>
                        <li>
                            <a href="/friends{{if .NavFriendRequests}}?view=requests{{end}}"{{if .NavFriendRequests}} class="has-text-warning-dark"{{end}}>
                                <span class="icon"><i class="fa fa-user-group"></i></span>
                                {{if .NavFriendRequests}}
                                    <span>{{.NavFriendRequests}} Friend Request{{Pluralize64 .NavFriendRequests}}!</span>
                                {{else}}
                                    <span>Friends</span>
                                {{end}}
                            </a>
                        </li>
                        <li>
                            <a href="/me{{if .NavUnreadNotifications}}?view=requests{{end}}"{{if .NavUnreadNotifications}} class="has-text-warning-dark"{{end}}>
                                <span class="icon"><i class="fa {{if .NavUnreadNotifications}}fa-bell{{else}}fa-home-user{{end}}"></i></span>
                                {{if .NavUnreadNotifications}}
                                    <span>{{.NavUnreadNotifications}} New Notification{{Pluralize64 .NavUnreadNotifications}}!</span>
                                {{else}}
                                    <span>Dashboard</span>
                                {{end}}
                            </a>
                        </li>
                        <li>
                            <a href="/u/{{.CurrentUser.Username}}">
                                <span class="icon"><i class="fa fa-user"></i></span>
                                My Profile
                            </a>
                        </li>
                        <li>
                            <a href="/photo/u/{{.CurrentUser.Username}}">
                                <span class="icon"><i class="fa fa-image"></i></span>
                                My Photos
                            </a>
                        </li>
                        <li>
                            <a href="/photo/upload">
                                <span class="icon"><i class="fa fa-upload"></i></span>
                                Upload Photos
                            </a>
                        </li>
                    </ul>
                </div>
            </div>
            {{else}}
            <div class="card">
                <header class="card-header has-background-link">
                    <p class="card-header-title has-text-light">Log In</p>
                </header>

                <div class="card-content">
                    <form action="/login" method="POST">
                        {{ InputCSRF }}
                        <div class="field">
                            <label class="label" for="idx_username">Username</label>
                            <input type="text" class="input"
                                name="username"
                                placeholder="username"
                                id="idx_username"
                                autocomplete="off">
                        </div>

                        <div class="field">
                            <label class="label" for="idx_password">Password</label>
                            <input type="password" class="input"
                                name="password"
                                placeholder="password"
                                id="idx_password"
                                autocomplete="off">
                            <a href="/forgot-password">Forgot?</a>
                        </div>

                        <div class="columns">
                            <div class="column">
                                <button type="submit" class="button is-link is-fullwidth">Log in</button>
                            </div>
                            <div class="column">
                                <a href="/signup" class="button is-secondary is-fullwidth">Sign up</a>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
            {{end}}
        </div>
    </div>
</div>
{{end}}