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

(-)a/koha-tmpl/opac-tmpl/bootstrap/css/src/_responsive.scss (+5 lines)
Lines 542-545 Link Here
542
    .koha_url_text {
542
    .koha_url_text {
543
        display: inline;
543
        display: inline;
544
    }
544
    }
545
546
    #patron-virtual-card {
547
        max-width: 500px;
548
        min-width: 300px;
549
    }
545
}
550
}
(-)a/koha-tmpl/opac-tmpl/bootstrap/css/src/opac.scss (-23 / +28 lines)
Lines 2935-2972 $star-selected: #EDB867; Link Here
2935
}
2935
}
2936
2936
2937
#patron-virtual-card {
2937
#patron-virtual-card {
2938
    border: 1px solid #BBB;
2939
    border-radius: 15px;
2940
    box-shadow: 5px 5px 6px rgba( 4, 0, 0, .2 );
2941
    margin: 1rem 0;
2942
    padding: 1rem;
2938
    width: 100%;
2943
    width: 100%;
2939
    min-width: 300px;
2944
}
2940
    max-width: 500px;
2945
2946
#image-container {
2947
    padding: 0 .5rem;
2948
}
2949
2950
#patron-image {
2941
    border-radius: 15px;
2951
    border-radius: 15px;
2942
    box-shadow: 0 1px 6px rgba(0, 0, 0, 0.3);
2943
    display: flex;
2952
    display: flex;
2944
    flex-direction: column;
2953
    flex-direction: column;
2945
    align-items: flex-start;
2954
    flex-shrink: 1;
2955
    width: auto;
2956
}
2946
2957
2947
    #image-container {
2958
#card-details {
2948
        width: 100%;
2959
    display: flex;
2949
        #patron-image {
2960
    flex-direction: column;
2950
            height: 75%;
2961
    flex-grow: 1;
2951
            width: auto;
2962
    padding: 0 .5rem;
2952
            border-radius: 15px;
2963
}
2953
            padding: 0.5rem;
2954
        }
2955
    }
2956
2964
2957
    #barcode-container {
2965
#barcode-container {
2966
    margin-bottom: 1rem;
2967
2968
    svg {
2969
        display: block;
2958
        width: 100%;
2970
        width: 100%;
2959
        padding: 0.25rem 0.5rem 0.25rem 0.5rem;
2960
        &.qrcode {
2961
            width: 50%; // Set a smaller width for QR codes
2962
        }
2963
    }
2971
    }
2964
2972
2965
    #lib-container {
2973
    &.qrcode {
2966
        width: 100%;
2974
        width: 50%; // Set a smaller width for QR codes
2967
        #patron-lib {
2968
            padding-left: 0.5rem;
2969
        }
2970
    }
2975
    }
2971
}
2976
}
2972
2977
(-)a/koha-tmpl/opac-tmpl/bootstrap/en/includes/usermenu.inc (-4 / +5 lines)
Lines 4-9 Link Here
4
    <div id="menu">
4
    <div id="menu">
5
        <ul>
5
        <ul>
6
            <li [% IF userview %]class="active"[% END %]> <a href="/cgi-bin/koha/opac-user.pl">Summary</a></li>
6
            <li [% IF userview %]class="active"[% END %]> <a href="/cgi-bin/koha/opac-user.pl">Summary</a></li>
7
8
            [% IF Koha.Preference( 'OPACVirtualCard' ) %]
9
                <li [% IF virtualcardview %]class="active"[% END %]> <a href="/cgi-bin/koha/opac-virtual-card.pl">Library card</a></li>
10
            [% END %]
11
7
            [% IF ( OPACFinesTab ) %]
12
            [% IF ( OPACFinesTab ) %]
8
                <li [% IF accountview %]class="active"[% END %]> <a href="/cgi-bin/koha/opac-account.pl">Charges</a></li>
13
                <li [% IF accountview %]class="active"[% END %]> <a href="/cgi-bin/koha/opac-account.pl">Charges</a></li>
9
            [% END %]
14
            [% END %]
Lines 76-85 Link Here
76
            [% IF logged_in_user.alert_subscriptions.count %]
81
            [% IF logged_in_user.alert_subscriptions.count %]
77
                <li [% IF alertsview %]class="active"[% END %]> <a href="/cgi-bin/koha/opac-alert-subscriptions.pl">Alert subscriptions ([% logged_in_user.alert_subscriptions.count | html %])</a></li>
82
                <li [% IF alertsview %]class="active"[% END %]> <a href="/cgi-bin/koha/opac-alert-subscriptions.pl">Alert subscriptions ([% logged_in_user.alert_subscriptions.count | html %])</a></li>
78
            [% END %]
83
            [% END %]
79
80
            [% IF Koha.Preference( 'OPACVirtualCard' ) %]
81
                <li [% IF virtualcardview %]class="active"[% END %]> <a href="/cgi-bin/koha/opac-virtual-card.pl">My virtual card</a></li>
82
            [% END %]
83
        </ul>
84
        </ul>
84
    </div>
85
    </div>
85
[% END %]
86
[% END %]
(-)a/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-virtual-card.tt (-16 / +17 lines)
Lines 7-13 Link Here
7
[% SET OpacNav = AdditionalContents.get( location => "OpacNav", lang => lang, library => logged_in_user.branchcode || default_branch, blocktitle => 0 ) %]
7
[% SET OpacNav = AdditionalContents.get( location => "OpacNav", lang => lang, library => logged_in_user.branchcode || default_branch, blocktitle => 0 ) %]
8
[% SET OpacNavBottom = AdditionalContents.get( location => "OpacNavBottom", lang => lang, library => logged_in_user.branchcode || default_branch, blocktitle => 0 ) %]
8
[% SET OpacNavBottom = AdditionalContents.get( location => "OpacNavBottom", lang => lang, library => logged_in_user.branchcode || default_branch, blocktitle => 0 ) %]
9
[% INCLUDE 'doc-head-open.inc' %]
9
[% INCLUDE 'doc-head-open.inc' %]
10
<title>My virtual card &rsaquo; [% IF ( LibraryNameTitle ) %][% LibraryNameTitle | html %][% ELSE %]Koha online[% END %] catalog</title>
10
<title>Your library card &rsaquo; [% IF ( LibraryNameTitle ) %][% LibraryNameTitle | html %][% ELSE %]Koha online[% END %] catalog</title>
11
[% INCLUDE 'doc-head-close.inc' %]
11
[% INCLUDE 'doc-head-close.inc' %]
12
[% BLOCK cssinclude %]
12
[% BLOCK cssinclude %]
13
[% END %]
13
[% END %]
Lines 21-27 Link Here
21
            <a href="/cgi-bin/koha/opac-user.pl">[% INCLUDE 'patron-title.inc' patron = logged_in_user %]</a>
21
            <a href="/cgi-bin/koha/opac-user.pl">[% INCLUDE 'patron-title.inc' patron = logged_in_user %]</a>
22
        [% END %]
22
        [% END %]
23
        [% WRAPPER breadcrumb_item bc_active= 1 %]
23
        [% WRAPPER breadcrumb_item bc_active= 1 %]
24
            <span>My virtual card</span>
24
            <span>Your library card</span>
25
        [% END %]
25
        [% END %]
26
    [% END #/ WRAPPER breadcrumbs %]
26
    [% END #/ WRAPPER breadcrumbs %]
27
27
Lines 30-54 Link Here
30
            <div class="col-lg-2">
30
            <div class="col-lg-2">
31
                <div id="navigation"> [% INCLUDE 'navigation.inc' IsPatronPage=1 %] </div>
31
                <div id="navigation"> [% INCLUDE 'navigation.inc' IsPatronPage=1 %] </div>
32
            </div>
32
            </div>
33
            <div class="col-10 order-first order-lg-2">
33
            <div class="col-lg-10 order-first order-lg-2">
34
                <h1>My virtual card </h1>
34
                <h1>Your library card </h1>
35
                <div id="patron-virtual-card">
35
                <div id="patron-virtual-card">
36
                    [% IF ( display_patron_image ) %]
36
                    [% IF ( display_patron_image ) %]
37
                        <div id="image-container">
37
                        <div id="image-container">
38
                            <img id="patron-image" src="/cgi-bin/koha/opac-patron-image.pl" alt="" />
38
                            <img id="patron-image" src="/cgi-bin/koha/opac-patron-image.pl" alt="" />
39
                        </div>
39
                        </div>
40
                    [% END %]
40
                    [% END %]
41
                    <div id="barcode-container">
41
                    <div id="card-details">
42
                        <svg id="patron-barcode" data-barcode="[% patron.cardnumber | html %]" data-barcode-format="[% barcode_format | html %]"></svg>
42
                        <div id="barcode-container">
43
                    </div>
43
                            <svg id="patron-barcode" data-barcode="[% patron.cardnumber | html %]" data-barcode-format="[% barcode_format | html %]"></svg>
44
                    <div id="lib-container">
44
                        </div>
45
                        <p id="patron-lib"><strong>Library:</strong> [% Branches.GetName( patron.branchcode ) | html %]</p>
45
                        <div id="lib-container">
46
                    </div>
46
                            <p id="patron-lib"><strong>Library:</strong> [% Branches.GetName( patron.branchcode ) | html %]</p>
47
                    <div id="cardnumber-container">
47
                        </div>
48
                        <p id="patron-cardnumber"><strong>Card number:</strong> [% patron.cardnumber | html %]</p>
48
                        <div id="cardnumber-container">
49
                    </div>
49
                            <p id="patron-cardnumber"><strong>Card number:</strong> [% patron.cardnumber | html %]</p>
50
                    <div id="dateexpiry-container">
50
                        </div>
51
                        <p id="patron-dateexpiry"><strong>Expiration date:</strong> [% patron.dateexpiry | $KohaDates %]</p>
51
                        <div id="dateexpiry-container">
52
                            <p id="patron-dateexpiry"><strong>Expiration date:</strong> [% patron.dateexpiry | $KohaDates %]</p>
53
                        </div>
52
                    </div>
54
                    </div>
53
                </div>
55
                </div>
54
            </div>
56
            </div>
55
- 

Return to bug 38792