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 261-300 Link Here
261
    }
261
    }
262
262
263
    #members {
263
    #members {
264
        clear: both;
265
        display: none;
266
267
        li {
268
            border-bottom: 1px solid #555;
269
            padding-right: 20px;
270
            text-align: right;
271
272
            &:first-child {
273
                border-top: 1px solid #555;
274
            }
275
276
            &:last-child {
277
                border-bottom: 0;
278
            }
279
        }
280
281
        .nav {
282
            float: none;
283
284
            > li {
285
                float: none;
286
            }
287
264
288
            &.pull-right {
289
                float: none;
290
            }
291
        }
292
293
        .divider-vertical {
294
            border: 0;
295
            height: 0;
296
            margin: 0;
297
        }
298
    }
265
    }
299
}
266
}
300
267
Lines 438-444 Link Here
438
@media only screen and ( max-width: 800px ) {
405
@media only screen and ( max-width: 800px ) {
439
    /* Screens below 800 pixels wide */
406
    /* Screens below 800 pixels wide */
440
    .cartlabel,
407
    .cartlabel,
441
    .listslabel {
408
    .listslabel,
409
    .langlabel,
410
    .userlabel {
442
        display: none;
411
        display: none;
443
    }
412
    }
444
413
Lines 446-457 Link Here
446
        .divider-vertical {
415
        .divider-vertical {
447
            margin: 0 2px;
416
            margin: 0 2px;
448
        }
417
        }
449
450
        #members {
451
            .divider-vertical {
452
                margin: 0 9px;
453
            }
454
        }
455
    }
418
    }
456
}
419
}
457
420
Lines 528-530 Link Here
528
        min-width: 0;
491
        min-width: 0;
529
    }
492
    }
530
}
493
}
494
495
@media only screen and ( max-width: 1100px ) {
496
    .cartlabel,
497
    .listslabel,
498
    .langlabel,
499
    .userlabel {
500
        display: none;
501
    }
502
}
(-)a/koha-tmpl/opac-tmpl/bootstrap/css/src/opac.scss (-10 / +101 lines)
Lines 25-33 $footer-height: 45px; Link Here
25
    }
25
    }
26
}
26
}
27
27
28
.fa.fa-icon-black,
28
.fa {
29
.fa.fa-icon-white {
29
    &.fa-icon-black,
30
    color: #000;
30
    &.fa-icon-white {
31
        color: #000;
32
    }
31
}
33
}
32
34
33
.popup {
35
.popup {
Lines 76-81 a { Link Here
76
    &.login-link {
78
    &.login-link {
77
        color: #005580;
79
        color: #005580;
78
        font-weight: bold;
80
        font-weight: bold;
81
79
        &.loginModal-trigger {
82
        &.loginModal-trigger {
80
            color: #85ca11;
83
            color: #85ca11;
81
        }
84
        }
Lines 254-262 a { Link Here
254
}
257
}
255
258
256
h1 {
259
h1 {
260
    color: #727272;
257
    font-size: 140%;
261
    font-size: 140%;
258
    line-height: 150%;
262
    line-height: 150%;
259
    color: #727272;
260
263
261
    &#libraryname {
264
    &#libraryname {
262
        background: transparent url( "../images/logo-koha.png" ) no-repeat scroll 0%;
265
        background: transparent url( "../images/logo-koha.png" ) no-repeat scroll 0%;
Lines 297-304 h4 { Link Here
297
}
300
}
298
301
299
h5 {
302
h5 {
300
    font-size: 100%;
301
    color: #727272;
303
    color: #727272;
304
    font-size: 100%;
302
}
305
}
303
306
304
caption {
307
caption {
Lines 319-327 textarea { Link Here
319
}
322
}
320
323
321
legend {
324
legend {
325
    color: #727272;
322
    font-size: 110%;
326
    font-size: 110%;
323
    font-weight: bold;
327
    font-weight: bold;
324
    color: #727272;
325
}
328
}
326
329
327
table {
330
table {
Lines 363-369 th { Link Here
363
        text-align: right;
366
        text-align: right;
364
    }
367
    }
365
368
366
    &[scope=row] {
369
    &[scope="row"] {
367
        background-color: transparent;
370
        background-color: transparent;
368
        text-align: right;
371
        text-align: right;
369
    }
372
    }
Lines 394-399 th { Link Here
394
    }
397
    }
395
}
398
}
396
399
400
.dropdown-menu-right {
401
    left: auto;
402
    right: 0;
403
}
404
405
.navbar {
406
    .nav {
407
        margin-right: 0;
408
409
        & > li {
410
            & > a {
411
                color: #777777;
412
                float: none;
413
                padding: 10px 15px 10px;
414
                text-decoration: none;
415
                text-shadow: 0 1px 0 #FFFFFF;
416
            }
417
418
            & > .dropdown-menu {
419
                &.dropdown-menu-right {
420
                    &::after {
421
                        left: unset;
422
                        right: 10px;
423
                    }
424
425
                    &::before {
426
                        left: unset;
427
                        right: 9px;
428
                    }
429
                }
430
            }
431
        }
432
    }
433
}
434
435
.navbar-inverse {
436
    .navbar-inner {
437
        #members {
438
            ul {
439
                &.dropdown-menu {
440
                    a {
441
                        &:hover {
442
                            color: #005580;
443
                            text-decoration: underline;
444
445
                            &.logout {
446
                                &:hover {
447
                                    color: #E8583C;
448
                                }
449
                            }
450
                        }
451
                    }
452
                }
453
            }
454
455
            .divider-vertical {
456
                border-left-color: #CCC;
457
                border-right-color: #FCF9FC;
458
                margin: 0 5px;
459
            }
460
        }
461
    }
462
}
397
463
398
#members {
464
#members {
399
    display: block;
465
    display: block;
Lines 406-414 th { Link Here
406
        &.logout {
472
        &.logout {
407
            color: #E8583C;
473
            color: #E8583C;
408
            font-weight: bold;
474
            font-weight: bold;
409
            padding: 0 .3em;
475
476
            &:hover {
477
                color: #E8583C;
478
            }
410
        }
479
        }
411
    }
480
    }
481
482
    .search_history {
483
        a {
484
            display: inline-block;
485
            padding: 10px 0;
486
487
            &.logout {
488
                font-size: 80%;
489
                font-weight: normal;
490
            }
491
        }
492
493
        .divider-vertical {
494
            border-left-color: #CCC;
495
            border-right-color: #FCF9FC;
496
            margin: 0 5px;
497
        }
498
    }
499
}
500
501
#loggedinuser-menu {
502
    min-width: 300px;
503
    padding: .5em 1em;
412
}
504
}
413
505
414
#moresearches {
506
#moresearches {
Lines 2129-2136 input { Link Here
2129
2221
2130
#cartDetails,
2222
#cartDetails,
2131
#cartUpdate,
2223
#cartUpdate,
2132
#holdDetails,
2224
#holdDetails {
2133
#listsDetails {
2134
    background-color: #FFF;
2225
    background-color: #FFF;
2135
    border: 1px solid rgba( 0, 0, 0, .2 );
2226
    border: 1px solid rgba( 0, 0, 0, .2 );
2136
    border-radius: 6px;
2227
    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 / +53 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
                                    [% IF ( Koha.Preference( 'opacuserlogin' ) == 1 && loggedinusername ) %]
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 %]" >[% INCLUDE 'patron-title.inc' patron = logged_in_user no_html = 1 %]</span></a></p></li>
111
                                        <ul aria-labelledby="user-menu" role="menu" class="dropdown-menu dropdown-menu-right">
104
                                        <li class="divider-vertical"></li>
112
                                            <li role="presentation">
113
                                                <div id="loggedinuser-menu">
114
                                                    <p>
115
                                                        <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>
116
                                                    </p>
117
                                                    [% IF Koha.Preference( 'EnableOpacSearchHistory' ) %]
118
                                                        <p class="search_history">
119
                                                            <a tabindex="-1" role="menuitem" class="login-link" href="/cgi-bin/koha/opac-search-history.pl" title="View your search history">Search history</a>
120
                                                            <span class="divider-vertical"></span>
121
                                                            <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>
122
                                                        </p>
123
                                                    [% END %]
124
                                                    <p>
125
                                                        <a tabindex="-1" role="menuitem" class="logout" id="logout" href="/cgi-bin/koha/opac-main.pl?logout.x=1">
126
                                                        Log out</a>
127
                                                    </p>
128
                                                </div>
129
                                            </li>
130
                                        </ul>
105
                                    [% END %]
131
                                    [% END %]
106
                                [% END %]
132
                                </li>
107
                                [% IF EnableOpacSearchHistory %]
133
                                [% 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>
134
                                    [% IF Koha.Preference( 'EnableOpacSearchHistory' ) %]
109
                                    <li class="divider-vertical"></li>
135
                                        <li class="search_history">
110
                                [% END %]
136
                                            <a href="/cgi-bin/koha/opac-search-history.pl" title="View your search history">Search history</a>
111
                                [% IF Koha.Preference( 'opacuserlogin' ) == 1 %]
137
                                            <span class="divider-vertical"></span>
112
                                    [% IF ( loggedinusername ) %]
138
                                            <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">
139
                                        </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 %]
140
                                    [% END %]
117
                                [% END %]
141
                                [% END %]
118
                            </ul>
142
                            </ul>
119
                        </div> <!-- /members -->
143
                        </div> <!-- /members -->
120
                    [% END # IF opacuserlogin %]
144
                    [% END # IF opacuserlogin || EnableOpacSearchHistory || opaclanguagesdisplay %]
145
121
                </div> <!-- /container-fluid -->
146
                </div> <!-- /container-fluid -->
122
            </div> <!-- /navbar-inner -->
147
            </div> <!-- /navbar-inner -->
123
        </div> <!-- /navbar -->
148
        </div> <!-- /navbar -->
(-)a/koha-tmpl/opac-tmpl/bootstrap/js/script.js (-15 / +1 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 40-53 $(document).ready(function(){ Link Here
40
            return true;
41
            return true;
41
        }
42
        }
42
    });
43
    });
43
    $("#user-menu-trigger").on("click",function(){
44
        var mem = $("#members");
45
        if(mem.is(":hidden")){
46
            mem.show();
47
        } else {
48
            mem.removeAttr("style");
49
        }
50
    });
51
    $(".menu-collapse-toggle").on("click",function(e){
44
    $(".menu-collapse-toggle").on("click",function(e){
52
        e.preventDefault();
45
        e.preventDefault();
53
        $(this).toggleClass("menu-open");
46
        $(this).toggleClass("menu-open");
Lines 56-66 $(document).ready(function(){ Link Here
56
    $(".loginModal-trigger").on("click",function(e){
49
    $(".loginModal-trigger").on("click",function(e){
57
        e.preventDefault();
50
        e.preventDefault();
58
        $("#loginModal").modal("show");
51
        $("#loginModal").modal("show");
59
        $("#members").removeAttr("style");
60
    });
61
    $("#loginModal").on("hide",function(){
62
        if($("#user-menu-trigger").is(":hidden")){
63
            $("#members").removeAttr("style");
64
        }
65
    });
52
    });
66
});
53
});
67
- 

Return to bug 18084