View | Details | Raw Unified | Return to bug 18084
Collapse All | Expand All

(-)a/koha-tmpl/opac-tmpl/bootstrap/css/src/_responsive.scss (-41 / +13 lines)
Lines 22-28 Link Here
22
    }
22
    }
23
23
24
    #wrap {
24
    #wrap {
25
        padding: 0px;
25
        padding: 0;
26
    }
26
    }
27
}
27
}
28
28
Lines 271-310 Link Here
271
    }
271
    }
272
272
273
    #members {
273
    #members {
274
        clear: both;
275
        display: none;
276
277
        li {
278
            border-bottom: 1px solid #555;
279
            padding-right: 20px;
280
            text-align: right;
281
282
            &:first-child {
283
                border-top: 1px solid #555;
284
            }
285
286
            &:last-child {
287
                border-bottom: 0;
288
            }
289
        }
290
291
        .nav {
292
            float: none;
293
294
            > li {
295
                float: none;
296
            }
297
274
298
            &.pull-right {
299
                float: none;
300
            }
301
        }
302
303
        .divider-vertical {
304
            border: 0;
305
            height: 0;
306
            margin: 0;
307
        }
308
    }
275
    }
309
}
276
}
310
277
Lines 445-451 Link Here
445
@media only screen and ( max-width: 800px ) {
412
@media only screen and ( max-width: 800px ) {
446
    /* Screens below 800 pixels wide */
413
    /* Screens below 800 pixels wide */
447
    .cartlabel,
414
    .cartlabel,
448
    .listslabel {
415
    .listslabel,
416
    .langlabel,
417
    .userlabel {
449
        display: none;
418
        display: none;
450
    }
419
    }
451
420
Lines 453-464 Link Here
453
        .divider-vertical {
422
        .divider-vertical {
454
            margin: 0 2px;
423
            margin: 0 2px;
455
        }
424
        }
456
457
        #members {
458
            .divider-vertical {
459
                margin: 0 9px;
460
            }
461
        }
462
    }
425
    }
463
426
464
    .toolbar {
427
    .toolbar {
Lines 587-589 Link Here
587
        min-width: 0;
550
        min-width: 0;
588
    }
551
    }
589
}
552
}
553
554
@media only screen and ( max-width: 1100px ) {
555
    .cartlabel,
556
    .listslabel,
557
    .langlabel,
558
    .userlabel {
559
        display: none;
560
    }
561
}
(-)a/koha-tmpl/opac-tmpl/bootstrap/css/src/opac.scss (-10 / +101 lines)
Lines 33-41 $footer-height: 45px; Link Here
33
    }
33
    }
34
}
34
}
35
35
36
.fa.fa-icon-black,
36
.fa {
37
.fa.fa-icon-white {
37
    &.fa-icon-black,
38
    color: #000;
38
    &.fa-icon-white {
39
        color: #000;
40
    }
39
}
41
}
40
42
41
.popup {
43
.popup {
Lines 84-89 a { Link Here
84
    &.login-link {
86
    &.login-link {
85
        color: #005580;
87
        color: #005580;
86
        font-weight: bold;
88
        font-weight: bold;
89
87
        &.loginModal-trigger {
90
        &.loginModal-trigger {
88
            color: #85ca11;
91
            color: #85ca11;
89
        }
92
        }
Lines 268-276 a { Link Here
268
}
271
}
269
272
270
h1 {
273
h1 {
274
    color: #727272;
271
    font-size: 140%;
275
    font-size: 140%;
272
    line-height: 150%;
276
    line-height: 150%;
273
    color: #727272;
274
277
275
    &#libraryname {
278
    &#libraryname {
276
        background: transparent url( "../images/logo-koha.png" ) no-repeat scroll 0%;
279
        background: transparent url( "../images/logo-koha.png" ) no-repeat scroll 0%;
Lines 311-318 h4 { Link Here
311
}
314
}
312
315
313
h5 {
316
h5 {
314
    font-size: 100%;
315
    color: #727272;
317
    color: #727272;
318
    font-size: 100%;
316
}
319
}
317
320
318
caption {
321
caption {
Lines 333-341 textarea { Link Here
333
}
336
}
334
337
335
legend {
338
legend {
339
    color: #727272;
336
    font-size: 110%;
340
    font-size: 110%;
337
    font-weight: bold;
341
    font-weight: bold;
338
    color: #727272;
339
}
342
}
340
343
341
table {
344
table {
Lines 383-389 th { Link Here
383
        text-align: right;
386
        text-align: right;
384
    }
387
    }
385
388
386
    &[scope=row] {
389
    &[scope="row"] {
387
        background-color: transparent;
390
        background-color: transparent;
388
        text-align: right;
391
        text-align: right;
389
    }
392
    }
Lines 414-419 th { Link Here
414
    }
417
    }
415
}
418
}
416
419
420
.dropdown-menu-right {
421
    left: auto;
422
    right: 0;
423
}
424
425
.navbar {
426
    .nav {
427
        margin-right: 0;
428
429
        & > li {
430
            & > a {
431
                color: #777777;
432
                float: none;
433
                padding: 10px 15px 10px;
434
                text-decoration: none;
435
                text-shadow: 0 1px 0 #FFFFFF;
436
            }
437
438
            & > .dropdown-menu {
439
                &.dropdown-menu-right {
440
                    &::after {
441
                        left: unset;
442
                        right: 10px;
443
                    }
444
445
                    &::before {
446
                        left: unset;
447
                        right: 9px;
448
                    }
449
                }
450
            }
451
        }
452
    }
453
}
454
455
.navbar-inverse {
456
    .navbar-inner {
457
        #members {
458
            ul {
459
                &.dropdown-menu {
460
                    a {
461
                        &:hover {
462
                            color: #005580;
463
                            text-decoration: underline;
464
465
                            &.logout {
466
                                &:hover {
467
                                    color: #E8583C;
468
                                }
469
                            }
470
                        }
471
                    }
472
                }
473
            }
474
475
            .divider-vertical {
476
                border-left-color: #CCC;
477
                border-right-color: #FCF9FC;
478
                margin: 0 5px;
479
            }
480
        }
481
    }
482
}
417
483
418
#members {
484
#members {
419
    display: block;
485
    display: block;
Lines 426-434 th { Link Here
426
        &.logout {
492
        &.logout {
427
            color: #E8583C;
493
            color: #E8583C;
428
            font-weight: bold;
494
            font-weight: bold;
429
            padding: 0 .3em;
495
496
            &:hover {
497
                color: #E8583C;
498
            }
430
        }
499
        }
431
    }
500
    }
501
502
    .search_history {
503
        a {
504
            display: inline-block;
505
            padding: 10px 0;
506
507
            &.logout {
508
                font-size: 80%;
509
                font-weight: normal;
510
            }
511
        }
512
513
        .divider-vertical {
514
            border-left-color: #CCC;
515
            border-right-color: #FCF9FC;
516
            margin: 0 5px;
517
        }
518
    }
519
}
520
521
#loggedinuser-menu {
522
    min-width: 300px;
523
    padding: .5em 1em;
432
}
524
}
433
525
434
#moresearches {
526
#moresearches {
Lines 2165-2172 input { Link Here
2165
2257
2166
#cartDetails,
2258
#cartDetails,
2167
#cartUpdate,
2259
#cartUpdate,
2168
#holdDetails,
2260
#holdDetails {
2169
#listsDetails {
2170
    background-color: #FFF;
2261
    background-color: #FFF;
2171
    border: 1px solid rgba( 0, 0, 0, .2 );
2262
    border: 1px solid rgba( 0, 0, 0, .2 );
2172
    border-radius: 6px;
2263
    border-radius: 6px;
(-)a/koha-tmpl/opac-tmpl/bootstrap/en/includes/masthead-langmenu.inc (-27 / +31 lines)
Lines 1-31 Link Here
1
[%# Following on one line for translatability %]
1
[%# Following on one line for translatability %]
2
[% IF ( ( opaclanguagesdisplay ) && ( ! one_language_enabled ) && ( languages_loop ) && ( OpacLangSelectorMode == 'both' || OpacLangSelectorMode == 'top') ) %]
2
[% IF ( ( opaclanguagesdisplay ) && ( ! one_language_enabled ) && ( languages_loop ) && ( OpacLangSelectorMode == 'both' || OpacLangSelectorMode == 'top') ) %]
3
<li class="dropdown">
3
    <div id="header_langmenu" class="pull-left">
4
  <a href="#" title="Switch languages" class="dropdown-toggle" id="langmenu" data-toggle="dropdown" role="button"><i class="fa fa-flag fa-icon-white"></i> <span class="langlabel">Languages</span> <b class="caret"></b></a>
4
        <ul class="nav">
5
    <ul aria-labelledby="langmenu" role="menu" class="dropdown-menu">
5
            <li class="dropdown">
6
    [% FOREACH languages_loo IN languages_loop %]
6
              <a href="#" title="Switch languages" class="dropdown-toggle" id="langmenu" data-toggle="dropdown" role="button"><i class="fa fa-flag fa-icon-white"></i> <span class="langlabel">Languages</span> <b class="caret"></b></a>
7
        [% IF ( languages_loo.group_enabled ) %]
7
                <ul aria-labelledby="langmenu" role="menu" class="dropdown-menu dropdown-menu-right">
8
            [% IF ( languages_loo.plural ) %]
8
                [% FOREACH languages_loo IN languages_loop %]
9
                [% FOREACH sublanguages_loo IN languages_loo.sublanguages_loop %]
9
                    [% IF ( languages_loo.group_enabled ) %]
10
                    [% IF ( sublanguages_loo.enabled ) %]
10
                        [% IF ( languages_loo.plural ) %]
11
                        [% IF ( sublanguages_loo.sublanguage_current ) %]
11
                            [% FOREACH sublanguages_loo IN languages_loo.sublanguages_loop %]
12
                         <li role="presentation"> <a href="#" tabindex="-1" role="menuitem">[% sublanguages_loo.native_description | html %] [% sublanguages_loo.script_description | html %] [% sublanguages_loo.region_description | html %] [% sublanguages_loo.variant_description | html %]&nbsp;<i class="fa fa-check"></i></a></li>
12
                                [% IF ( sublanguages_loo.enabled ) %]
13
                                    [% IF ( sublanguages_loo.sublanguage_current ) %]
14
                                     <li role="presentation"> <a href="#" tabindex="-1" role="menuitem">[% sublanguages_loo.native_description | html %] [% sublanguages_loo.script_description | html %] [% sublanguages_loo.region_description | html %] [% sublanguages_loo.variant_description | html %]&nbsp;<i class="fa fa-check"></i></a></li>
15
                                    [% ELSE %]
16
                                    <li role="presentation"><a href="/cgi-bin/koha/opac-changelanguage.pl?language=[% sublanguages_loo.rfc4646_subtag | uri %]"  tabindex="-1" role="menuitem"> [% sublanguages_loo.native_description | html %] [% sublanguages_loo.script_description | html %] [% sublanguages_loo.region_description | html %] [% sublanguages_loo.variant_description | html %]</a></li>
17
                                    [% END %]
18
                                [% END # / IF sublanguages_loo.enabled %]
19
                            [% END # / FOREACH sublanguages_loo %]
13
                        [% ELSE %]
20
                        [% ELSE %]
14
                        <li role="presentation"><a href="/cgi-bin/koha/opac-changelanguage.pl?language=[% sublanguages_loo.rfc4646_subtag | uri %]"  tabindex="-1" role="menuitem"> [% sublanguages_loo.native_description | html %] [% sublanguages_loo.script_description | html %] [% sublanguages_loo.region_description | html %] [% sublanguages_loo.variant_description | html %]</a></li>
21
                            [% IF ( languages_loo.group_enabled ) %]
15
                        [% END %]
22
                                [% IF ( languages_loo.current ) %]
16
                    [% END # / IF sublanguages_loo.enabled %]
23
                                <li role="presentation"><a href="#" tabindex="-1" class="menu-inactive" role="menuitem">[% IF ( languages_loo.native_description ) %][% languages_loo.native_description | html %][% ELSE %][% languages_loo.rfc4646_subtag | html %][% END %]&nbsp;<i class="fa fa-check"></i></a></li>
17
                [% END # / FOREACH sublanguages_loo %]
24
                                [% ELSE %]
18
            [% ELSE %]
25
                                <li role="presentation"><a href="/cgi-bin/koha/opac-changelanguage.pl?language=[% languages_loo.rfc4646_subtag | uri %]"  tabindex="-1" role="menuitem">[% IF ( languages_loo.native_description ) %][% languages_loo.native_description | html %][% ELSE %][% languages_loo.rfc4646_subtag | html %][% END %]</a></li>
19
                [% IF ( languages_loo.group_enabled ) %]
26
                                [% END %]
20
                    [% IF ( languages_loo.current ) %]
27
                            [% END # / IF languages_loo.current %]
21
                    <li role="presentation"><a href="#" tabindex="-1" class="menu-inactive" role="menuitem">[% IF ( languages_loo.native_description ) %][% languages_loo.native_description | html %][% ELSE %][% languages_loo.rfc4646_subtag | html %][% END %]&nbsp;<i class="fa fa-check"></i></a></li>
28
                        [% END # / IF ( languages_loo.plural ) %]
22
                    [% ELSE %]
29
                    [% END # / IF ( languages_loo.group_enabled ) %]
23
                    <li role="presentation"><a href="/cgi-bin/koha/opac-changelanguage.pl?language=[% languages_loo.rfc4646_subtag | uri %]"  tabindex="-1" role="menuitem">[% IF ( languages_loo.native_description ) %][% languages_loo.native_description | html %][% ELSE %][% languages_loo.rfc4646_subtag | html %][% END %]</a></li>
30
                [% END # / FOREACH languages_loo IN languages_loop %]
24
                    [% END %]
31
                </ul> <!-- /# .dropdown-menu -->
25
                [% END # / IF languages_loo.current %]
32
            </li> <!-- / .dropdown -->
26
            [% END # / IF ( languages_loo.plural ) %]
33
        </ul> <!-- /.nav.pull-right -->
27
        [% END # / IF ( languages_loo.group_enabled ) %]
34
    </div> <!-- /#header_langmenu -->
28
    [% END # / FOREACH languages_loo IN languages_loop %]
29
    </ul> <!-- /# .dropdown-menu -->
30
</li> <!-- / .dropdown -->
31
[% END # / IF opaclanguagedisplay %]
35
[% END # / IF opaclanguagedisplay %]
(-)a/koha-tmpl/opac-tmpl/bootstrap/en/includes/masthead.inc (-28 / +54 lines)
Lines 80-123 Link Here
80
                            </li> <!-- / .dropdown -->
80
                            </li> <!-- / .dropdown -->
81
                        [% END # / IF virtualshelves %]
81
                        [% END # / IF virtualshelves %]
82
                    </ul> <!-- / .nav -->
82
                    </ul> <!-- / .nav -->
83
                    [% IF Koha.Preference( 'virtualshelves' ) == 1 %]<div id="listsDetails"></div>[% END %]
84
                    [% IF Koha.Preference( 'opacuserlogin' ) == 1 || opaclanguagesdisplay || EnableOpacSearchHistory %]
85
                        <a id="user-menu-trigger" class="pull-right" href="#"><i class="fa fa-user fa-icon-white"></i> <span class="caret"></span></a>
86
                        <div id="members">
87
                            <ul class="nav pull-right">
88
83
89
                                [% INCLUDE 'masthead-langmenu.inc' %]
84
                    [% IF Koha.Preference( 'opacuserlogin' ) == 1 ||  Koha.Preference( 'EnableOpacSearchHistory') || Koha.Preference( 'opaclanguagesdisplay' ) %]
90
85
91
                                [% IF Koha.Preference( 'opacuserlogin' ) == 1 %]
86
                        <div id="members" class="pull-right">
92
                                    [% UNLESS ( loggedinusername ) %]
87
                            [% IF ( Koha.Preference( 'opaclanguagesdisplay' ) ) %]
93
                                        [% IF Koha.Preference('casAuthentication') %]
88
                                [% INCLUDE 'masthead-langmenu.inc' %]
94
                                            [%# CAS authentication is too complicated for modal window %]
89
                            [% END %]
95
                                            <li><a class="login-link" href="/cgi-bin/koha/opac-user.pl">Log in to your account</a></li>
90
                            <ul class="nav">
96
                                        [% ELSIF ( Koha.Preference('GoogleOpenIDConnect') == 1 ) %]
91
                                <li class="dropdown">
97
                                            <li><a class="login-link" href="/cgi-bin/koha/svc/auth/googleopenidconnect" role="button" data-toggle="modal">Log in to your account</a></li>
92
                                    [% IF ( Koha.Preference( 'opacuserlogin' ) == 1 ) %]
93
                                        [% IF ( loggedinusername ) %]
94
                                            <a href="#" class="dropdown-toggle" id="user-menu" data-toggle="dropdown" role="button">
95
                                                <i class="fa fa-user fa-icon-white fa-fw"></i>
96
                                                <span class="userlabel">Welcome, [% INCLUDE 'patron-title.inc' patron = logged_in_user no_html = 1 %]</span>
97
                                                <b class="caret"></b>
98
                                            </a>
98
                                        [% ELSE %]
99
                                        [% ELSE %]
99
                                            <li><a href="/cgi-bin/koha/opac-user.pl" class="login-link loginModal-trigger" role="button" data-toggle="modal">Log in to your account</a></li>
100
                                            [% IF Koha.Preference('casAuthentication') %]
101
                                                [%# CAS authentication is too complicated for modal window %]
102
                                                    <a class="login-link" href="/cgi-bin/koha/opac-user.pl"><i class="fa fa-user fa-icon-white fa-fw"></i> <span class="userlabel">Log in to your account</span></a>
103
                                            [% ELSIF ( Koha.Preference('GoogleOpenIDConnect') == 1 ) %]
104
                                                <a class="login-link" href="/cgi-bin/koha/svc/auth/googleopenidconnect" role="button" data-toggle="modal"><i class="fa fa-user fa-icon-white fa-fw"></i> <span class="userlabel">Log in to your account</span></a>
105
                                            [% ELSE %]
106
                                                <a href="/cgi-bin/koha/opac-user.pl" class="login-link loginModal-trigger" role="button" data-toggle="modal"><i class="fa fa-user fa-icon-white fa-fw"></i> <span class="userlabel">Log in to your account</span></a>
107
                                            [% END %]
100
                                        [% END %]
108
                                        [% END %]
101
                                    [% END %]
109
                                    [% END %]
102
                                    [% IF ( loggedinusername ) %]
110
103
                                        <li><p class="members navbar-text">Welcome, <a class="login-link" href="/cgi-bin/koha/opac-user.pl"><span class="loggedinusername" data-borrowernumber="[% logged_in_user.borrowernumber | html %]" data-branchcode="[% logged_in_user.branchcode | html %]" data-categorycode="[% logged_in_user.categorycode | html %]">[% INCLUDE 'patron-title.inc' patron = logged_in_user no_html = 1 %]</span></a></p></li>
111
                                    [% IF ( Koha.Preference( 'opacuserlogin' ) == 1 && loggedinusername ) %]
104
                                        <li class="divider-vertical"></li>
112
                                        <ul aria-labelledby="user-menu" role="menu" class="dropdown-menu dropdown-menu-right">
113
                                            <li role="presentation">
114
                                                <div id="loggedinuser-menu">
115
                                                    <p>
116
                                                        <a class="login-link" href="/cgi-bin/koha/opac-user.pl"><span class="loggedinusername" data-borrowernumber="[% logged_in_user.borrowernumber | html %]" data-branchcode="[% logged_in_user.branchcode | html %]" >Your account</span></a>
117
                                                    </p>
118
                                                    [% IF Koha.Preference( 'EnableOpacSearchHistory' ) %]
119
                                                        <p class="search_history">
120
                                                            <a tabindex="-1" role="menuitem" class="login-link" href="/cgi-bin/koha/opac-search-history.pl" title="View your search history">Search history</a>
121
                                                            <span class="divider-vertical"></span>
122
                                                            <a class="logout clearsh" href="/cgi-bin/koha/opac-search-history.pl?action=delete" title="Delete your search history"><i class="fa fa-trash"></i> Clear</a>
123
                                                        </p>
124
                                                    [% END %]
125
                                                    <p>
126
                                                        <a tabindex="-1" role="menuitem" class="logout" id="logout" href="/cgi-bin/koha/opac-main.pl?logout.x=1">
127
                                                        Log out</a>
128
                                                    </p>
129
                                                </div>
130
                                            </li>
131
                                        </ul>
105
                                    [% END %]
132
                                    [% END %]
106
                                [% END %]
133
                                </li>
107
                                [% IF EnableOpacSearchHistory %]
134
                                [% IF ( !Koha.Preference( 'opacuserlogin') || !loggedinusername ) %]
108
                                    <li><p class="navbar-text"><a class="login-link" href="/cgi-bin/koha/opac-search-history.pl" title="View your search history">Search history</a> [<a class="logout clearsh" href="/cgi-bin/koha/opac-search-history.pl?action=delete" title="Delete your search history">x</a>]</p></li>
135
                                    [% IF Koha.Preference( 'EnableOpacSearchHistory' ) %]
109
                                    <li class="divider-vertical"></li>
136
                                        <li class="search_history">
110
                                [% END %]
137
                                            <a href="/cgi-bin/koha/opac-search-history.pl" title="View your search history">Search history</a>
111
                                [% IF Koha.Preference( 'opacuserlogin' ) == 1 %]
138
                                            <span class="divider-vertical"></span>
112
                                    [% IF ( loggedinusername ) %]
139
                                            <a class="logout clearsh" href="/cgi-bin/koha/opac-search-history.pl?action=delete" title="Delete your search history"><i class="fa fa-trash"></i> Clear</a>
113
                                        <li><p class="navbar-text">
140
                                        </li>
114
                                            <a class="logout" id="logout" href="/cgi-bin/koha/opac-main.pl?logout.x=1">
115
                                            Log out</a></p></li>
116
                                    [% END %]
141
                                    [% END %]
117
                                [% END %]
142
                                [% END %]
118
                            </ul>
143
                            </ul>
119
                        </div> <!-- /members -->
144
                        </div> <!-- /members -->
120
                    [% END # IF opacuserlogin %]
145
                    [% END # IF opacuserlogin || EnableOpacSearchHistory || opaclanguagesdisplay %]
146
121
                </div> <!-- /container-fluid -->
147
                </div> <!-- /container-fluid -->
122
            </div> <!-- /navbar-inner -->
148
            </div> <!-- /navbar-inner -->
123
        </div> <!-- /navbar -->
149
        </div> <!-- /navbar -->
(-)a/koha-tmpl/opac-tmpl/bootstrap/js/script.js (-14 / +6 lines)
Lines 1-3 Link Here
1
/* global enquire readCookie updateBasket delCookie */
1
enquire.register("screen and (max-width:608px)", {
2
enquire.register("screen and (max-width:608px)", {
2
    match : function() {
3
    match : function() {
3
        $("#masthead_search").insertAfter("#select_library");
4
        $("#masthead_search").insertAfter("#select_library");
Lines 58-80 $(document).ready(function(){ Link Here
58
            return true;
59
            return true;
59
        }
60
        }
60
    });
61
    });
61
    $("#user-menu-trigger").on("click",function(){
62
62
        var mem = $("#members");
63
    $(".menu-collapse-toggle").on("click",function(e){
63
        if(mem.is(":hidden")){
64
        e.preventDefault();
64
            mem.show();
65
        $(this).toggleClass("menu-open");
65
        } else {
66
        $(".menu-collapse").toggle();
66
            mem.removeAttr("style");
67
        }
68
    });
67
    });
69
68
70
    $(".loginModal-trigger").on("click",function(e){
69
    $(".loginModal-trigger").on("click",function(e){
71
        e.preventDefault();
70
        e.preventDefault();
72
        $("#loginModal").modal("show");
71
        $("#loginModal").modal("show");
73
        $("#members").removeAttr("style");
74
    });
75
    $("#loginModal").on("hide",function(){
76
        if($("#user-menu-trigger").is(":hidden")){
77
            $("#members").removeAttr("style");
78
        }
79
    });
72
    });
80
});
73
});
81
- 

Return to bug 18084