+            width: 90%;

+

+.two-column-icon {

+    display: inline-block;

+    line-height: 30px;

+    margin-left: 10px;

+    i {

+        font-size: 16px;

+        margin-right: 5px;

+        line-height: 20px;

+    }

+

+    label {

+        padding-top: 7px;

+    }

+}

+

+.absoluteAndLeftMargin {

+    position: absolute;

+    margin-left: 260px;

+}

+

+.page-nums {

+    margin-left: -120px !important;

+}

+

+#pageslide {

+    /* These styles MUST be included. Do not change. */

+    display: none;

+    position: absolute;

+    position: fixed;

+    top: 0;

+    height: 100%;

+    z-index: 999999;

+

+    /* Specify the width of your pageslide here */

+    width: 50%;

+    padding: 1px;

+

+    /* These styles are optional, and describe how the pageslide will look */

+    background-color: #333;

+    color: #FFF;

+    -webkit-box-shadow: inset 0 0 5px 5px #222;

+    -moz-shadow: inset 0 0 5px 5px #222;

+    //box-shadow: inset 0 0 5px 5px #222;

+    box-shadow: 2px 2px 8px #000;

+}

+    .page-nums {

+        margin-left: 0;

+    }

+* Yona, 21st Century Project Hosting SW

+* Copyright Yona & Yobi Authors & NAVER Corp.

+* https://yona.io

+                @defining(IssueLabel.findByProject(project)) { labels =>

+                        @if(!labels.isEmpty) {

+                            <div class="board-labels">

+                            @issue.partial_select_label(labels, param.labelIdSet, "", "", project)

+                            </div>

+                        }

+                @common.twoColumnModeCheckboxArea(false)

+<script type="text/javascript" src="@routes.Assets.at("javascripts/lib/jquery.pageslide.js")"></script>

+<script type="text/javascript" src="@routes.Assets.at("javascripts/service/yona.twoColumnMode.js")"></script>

+* Yona, 21st Century Project Hosting SW

+* Copyright Yona & Yobi Authors & NAVER Corp.

+* https://yona.io

+<li class="post-item title" href="@routes.BoardApp.post(project.owner, project.name, post.getNumber)">

+        $('.logo, .title > a, .project-menu-nav > li > a, .show-progress-bar, .project-breadcrumb > span > a, .project-name > a, a[class="title"]').on('click.progressbar', function(){

+@**

+* Yona, 21st Century Project Hosting SW

+*

+* Copyright Yona & Yobi Authors & NAVER Corp.

+* https://yona.io

+**@

+@(requireLeftMargin: Boolean = true)

+

+@additionalCssForLeftMargin = @{

+    if(requireLeftMargin) {

+        "pull-left absoluteAndLeftMargin"

+    } else {

+        ""

+    }

+}

+<div class="@additionalCssForLeftMargin two-column-icon mr10 hide-in-mobile" id="two-column-mode-checkbox" title='@Messages("common.two.column.mode")' data-content='@Messages("common.two.column.mode.desc")'>

+    <label class="checkbox">

+        <input id="two-column-mode" type="checkbox"> <i class="yobicon-explorerwindow"></i>

+    </label>

+</div>

+* Yona, 21st Century Project Hosting SW

+* Copyright Yona & Yobi Authors & NAVER Corp.

+* https://yona.io

+<script type="text/javascript" src="@routes.Assets.at("javascripts/lib/jquery.pageslide.js")"></script>

+<script type="text/javascript" src="@routes.Assets.at("javascripts/service/yona.twoColumnMode.js")"></script>

+        _initTwoColumnMode();

+

+* Yona, 21st Century Project Hosting SW

+* Copyright Yona & Yobi Authors & NAVER Corp.

+* https://yona.io

+        <li class="post-item title" href="@routes.PullRequestApp.pullRequest(req.toProject.owner, req.toProject.name, req.number)">

+    <div class="left-menu span2 search-wrap hide-in-mobile" style="padding-top:0;">

+      @common.twoColumnModeCheckboxArea()

+<script type="text/javascript" src="@routes.Assets.at("javascripts/lib/jquery.pageslide.js")"></script>

+<script type="text/javascript" src="@routes.Assets.at("javascripts/service/yona.twoColumnMode.js")"></script>

+    <script type="text/javascript" src="@routes.Assets.at("javascripts/lib/jquery.pageslide.js")"></script>

+    <script type="text/javascript" src="@routes.Assets.at("javascripts/service/yona.twoColumnMode.js")"></script>

+    <li class="post-item title" id="issue-item-@issue.id" href="@routes.IssueApp.issue(project.owner, project.name, issue.getNumber)">

+* Yona, 21st Century Project Hosting SW

+* Copyright Yona & Yobi Authors & NAVER Corp.

+* https://yona.io

+    <div class="left-menu span2 span-hard-wrap">

+        @common.twoColumnModeCheckboxArea()

+    <li class="post-item title" id="issue-item-@issue.id" data-item="issue-item" data-value="@user.loginId @issue.getNumber @issue.title" href="@routes.IssueApp.issue(project.owner, project.name, issue.getNumber)">

+            <div for="issue-@issue.id" class="issue-item-row">

+            </div>

+    <div class=" left-menu span2 span-hard-wrap">

+        @common.twoColumnModeCheckboxArea()

+* Yona, 21st Century Project Hosting SW

+* Copyright Yona & Yobi Authors & NAVER Corp.

+* https://yona.io

+                @common.twoColumnModeCheckboxArea(false)

+<script type="text/javascript" src="@routes.Assets.at("javascripts/lib/jquery.pageslide.js")"></script>

+<script type="text/javascript" src="@routes.Assets.at("javascripts/service/yona.twoColumnMode.js")"></script>

+<li class="post-item title" href="@routes.BoardApp.post(project.owner, project.name, post.getNumber)">

+* Yona, 21st Century Project Hosting SW

+* Copyright Yona & Yobi Authors & NAVER Corp.

+* https://yona.io

+    <script type="text/javascript" src="@routes.Assets.at("javascripts/lib/jquery.pageslide.js")"></script>

+    <script type="text/javascript" src="@routes.Assets.at("javascripts/service/yona.twoColumnMode.js")"></script>

+    <li class="post-item title" id="issue-item-@issue.id" href="@routes.IssueApp.issue(issue.project.owner, issue.project.name, issue.getNumber)">

+    <div class="left-menu span2 span-hard-wrap">

+        @common.twoColumnModeCheckboxArea()

+common.two.column.mode = Two Column Mode

+common.two.column.mode.desc = Splits list and body into columns respectively

+common.two.column.mode = Two Column Mode

+common.two.column.mode.desc = 리스트와 본문을 각각 컬럼으로 분할해서 보여줍니다

+/*

+ * jQuery pageSlide

+ * Version 2.0.1

+ * https://github.com/tacitknowledge/jquery-pageslide

+ *

+ *

+ *

+ *

+ * Copyright (c) 2011 Scott Robbin (srobbin.com)

+ * Modified by Tacit Knowledge for CommonJS and AMD integration 2015

+ * Dual licensed under the MIT and GPL licenses.

+ */

+

+(function(factory){

+    if (typeof define === 'function' && define.amd) {

+        define(function () {

+            return factory;

+        });

+    } else if (typeof module === 'object' && typeof module.exports === 'object') {

+        exports = factory;

+    } else {

+        factory(jQuery);

+    }

+})(function($){

+    // Not inintializing second time

+    if ($.fn.pageslide) {

+        return;

+    }

+    // Convenience vars for accessing elements

+    var $body = $('body'),

+        $pageslide = $('#pageslide');

+

+    var _sliding = false,   // Mutex to assist closing only once

+        _lastCaller;        // Used to keep track of last element to trigger pageslide

+

+    // If the pageslide element doesn't exist, create it

+    if( $pageslide.length == 0 ) {

+        $pageslide = $('<div />').attr( 'id', 'pageslide' )

+            .css( 'display', 'none' )

+            .appendTo( $body );

+    }

+

+    /*

+     * Private methods

+     */

+    function _load( url, useIframe ) {

+        // Are we loading an element from the page or a URL?

+        if ( url.indexOf("#") === 0 ) {

+            // Load a page element

+            $(url).clone(true).appendTo( $pageslide.empty() ).show();

+        } else {

+            // Load a URL. Into an iframe?

+            if( useIframe ) {

+                var iframe = $("<iframe />").attr({

+                    src: url,

+                    frameborder: 0,

+                    hspace: 0

+                })

+                    .css({

+                        width: "100%",

+                        height: "100%"

+                    });

+

+                $pageslide.html( iframe );

+            } else {

+                $pageslide.load( url );

+            }

+

+            $pageslide.data( 'localEl', false );

+

+        }

+    }

+

+    // Function that controls opening of the pageslide

+    function _start( direction, speed ) {

+        var slideWidth = $pageslide.outerWidth( true ),

+            bodyAnimateIn = {},

+            slideAnimateIn = {};

+

+        // If the slide is open or opening, just ignore the call

+        if( $pageslide.is(':visible') || _sliding ) return;

+        _sliding = true;

+

+        switch( direction ) {

+            case 'left':

+                $pageslide.css({ left: 'auto', right: '-' + slideWidth + 'px' });

+                // bodyAnimateIn['margin-left'] = '-=' + slideWidth;

+                slideAnimateIn['right'] = '+=' + slideWidth;

+                break;

+            default:

+                $pageslide.css({ left: '-' + slideWidth + 'px', right: 'auto' });

+                bodyAnimateIn['margin-left'] = '+=' + slideWidth;

+                slideAnimateIn['left'] = '+=' + slideWidth;

+                break;

+        }

+

+        // Animate the slide, and attach this slide's settings to the element

+        $body.animate(bodyAnimateIn, speed);

+        $pageslide.show()

+            .animate(slideAnimateIn, speed, function() {

+                _sliding = false;

+            });

+    }

+

+    /*

+     * Declaration

+     */

+    $.fn.pageslide = function(options) {

+        var $elements = this;

+

+        // On click

+        $elements.on('click.pageslide', function(e) {

+            var $self = $(this),

+                settings = $.extend({ href: $self.attr('href') }, options);

+

+            // Prevent the default behavior and stop propagation

+            e.preventDefault();

+            e.stopPropagation();

+

+            if ( $pageslide.is(':visible') && $self[0] == _lastCaller ) {

+                // If we clicked the same element twice, toggle closed

+                $.pageslide.close();

+            } else {

+                // Open

+                $.pageslide( settings );

+

+                // Record the last element to trigger pageslide

+                _lastCaller = $self[0];

+            }

+        });

+    };

+

+    /*

+     * Default settings

+     */

+    $.fn.pageslide.defaults = {

+        speed:      200,        // Accepts standard jQuery effects speeds (i.e. fast, normal or milliseconds)

+        direction:  'right',    // Accepts 'left' or 'right'

+        modal:      false,      // If set to true, you must explicitly close pageslide using $.pageslide.close();

+        iframe:     true,       // By default, linked pages are loaded into an iframe. Set this to false if you don't want an iframe.

+        href:       null        // Override the source of the content. Optional in most cases, but required when opening pageslide programmatically.

+    };

+

+    /*

+     * Public methods

+     */

+

+    // Open the pageslide

+    $.pageslide = function( options ) {

+        // Extend the settings with those the user has provided

+        var settings = $.extend({}, $.fn.pageslide.defaults, options);

+

+        // Are we trying to open in different direction?

+        if( $pageslide.is(':visible') && $pageslide.data( 'direction' ) != settings.direction) {

+            $.pageslide.close(function(){

+                _load( settings.href, settings.iframe );

+                _start( settings.direction, settings.speed );

+            });

+        } else {

+            _load( settings.href, settings.iframe );

+            if( $pageslide.is(':hidden') ) {

+                _start( settings.direction, settings.speed );

+            }

+        }

+

+        $pageslide.data( settings );

+    }

+

+    // Close the pageslide

+    $.pageslide.close = function( callback ) {

+        var $pageslide = $('#pageslide'),

+            slideWidth = $pageslide.outerWidth( true ),

+            speed = $pageslide.data( 'speed' ),

+            bodyAnimateIn = {},

+            slideAnimateIn = {}

+

+        // If the slide isn't open, just ignore the call

+        if( $pageslide.is(':hidden') || _sliding ) return;

+        _sliding = true;

+

+        switch( $pageslide.data( 'direction' ) ) {

+            case 'left':

+                // bodyAnimateIn['margin-left'] = '+=' + slideWidth;

+                slideAnimateIn['right'] = '-=' + slideWidth;

+                break;

+            default:

+                bodyAnimateIn['margin-left'] = '-=' + slideWidth;

+                slideAnimateIn['left'] = '-=' + slideWidth;

+                break;

+        }

+

+        $pageslide.animate(slideAnimateIn, speed);

+        $body.animate(bodyAnimateIn, speed, function() {

+            $pageslide.hide();

+            _sliding = false;

+            if( typeof callback != 'undefined' ) callback();

+        });

+

+        $(".left-menu").show(200);

+    }

+

+    /* Events */

+

+    // Don't let clicks to the pageslide close the window

+    $pageslide.on('click.pageslide', function(e) {

+        e.stopPropagation();

+    });

+

+    // Close the pageslide if the document is clicked or the users presses the ESC key, unless the pageslide is modal

+    $(document).bind('click keyup', function(e) {

+        // If this is a keyup event, let's see if it's an ESC key

+        if( e.type == "keyup" && e.keyCode != 27) return;

+

+        // Make sure it's visible, and we're not modal

+        if( $pageslide.is( ':visible' ) && !$pageslide.data( 'modal' ) ) {

+            $.pageslide.close();

+        }

+    });