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

(-)a/koha-tmpl/intranet-tmpl/prog/css/staff-global.css (-46 / +54 lines)
Lines 65-76 h3 { Link Here
65
}
65
}
66
66
67
h4 {
67
h4 {
68
	font-size : 116%;	
68
	font-size : 116%;
69
	font-weight : bold;
69
	font-weight : bold;
70
}
70
}
71
71
72
h5 {
72
h5 {
73
	font-size : 100%;	
73
	font-size : 100%;
74
	font-weight : bold;
74
	font-weight : bold;
75
}
75
}
76
76
Lines 561-575 div.yui-b fieldset.brief fieldset legend { Link Here
561
	font-size : 85%;
561
	font-size : 85%;
562
}
562
}
563
563
564
fieldset.rows {  
564
fieldset.rows {
565
border-width : 1px;
565
border-width : 1px;
566
border:2px solid #b9d8d9;
566
border:2px solid #b9d8d9;
567
float : left;
567
float : left;
568
font-size : 90%;
568
font-size : 90%;
569
clear : left;
569
clear : left;
570
margin: .9em 0 0 0;  
570
margin: .9em 0 0 0;
571
padding: 0;
571
padding: 0;
572
width: 100%; 
572
width: 100%;
573
}
573
}
574
574
575
fieldset.rows.unselected {
575
fieldset.rows.unselected {
Lines 578-594 fieldset.rows.unselected { Link Here
578
    border: 0;
578
    border: 0;
579
}
579
}
580
580
581
fieldset.rows legend {  
581
fieldset.rows legend {
582
	margin-left: 1em;
582
	margin-left: 1em;
583
	font-weight: bold;
583
	font-weight: bold;
584
	font-size : 110%;
584
	font-size : 110%;
585
}
585
}
586
586
587
fieldset.rows label, fieldset.rows span.label {  
587
fieldset.rows label, fieldset.rows span.label {
588
	float: left;  
588
	float: left;
589
	font-weight : bold;
589
	font-weight : bold;
590
	width: 6em;  
590
	width: 6em;
591
	margin-right: 1em;  
591
	margin-right: 1em;
592
	text-align: right;
592
	text-align: right;
593
}
593
}
594
594
Lines 599-614 fieldset.rows fieldset { Link Here
599
	padding : .3em;
599
	padding : .3em;
600
}
600
}
601
601
602
.yui-b fieldset.rows label, .yui-b fieldset.rows span.label {  
602
.yui-b fieldset.rows label, .yui-b fieldset.rows span.label {
603
	width: 9em;  
603
	width: 9em;
604
}
604
}
605
605
606
.yui-b fieldset.rows div.hint {
606
.yui-b fieldset.rows div.hint {
607
	margin-left : 10.5em;
607
	margin-left : 10.5em;
608
}
608
}
609
609
610
.yui-u fieldset.rows label, .yui-u fieldset.rows span.label {  
610
.yui-u fieldset.rows label, .yui-u fieldset.rows span.label {
611
	width: 10em;  
611
	width: 10em;
612
}
612
}
613
613
614
.yui-u fieldset.rows div.hint {
614
.yui-u fieldset.rows div.hint {
Lines 617-636 fieldset.rows fieldset { Link Here
617
617
618
fieldset.rows.left label, fieldset.rows.left span.label {
618
fieldset.rows.left label, fieldset.rows.left span.label {
619
	width : 8em;
619
	width : 8em;
620
	text-align : left;	
620
	text-align : left;
621
}
621
}
622
622
623
fieldset.rows ol {  
623
fieldset.rows ol {
624
padding: 1em 1em 0 1em;  
624
padding: 1em 1em 0 1em;
625
list-style-type: none;
625
list-style-type: none;
626
}
626
}
627
627
628
fieldset.rows li {  
628
fieldset.rows li {
629
float : left;
629
float : left;
630
clear : left;
630
clear : left;
631
padding-bottom: 1em;
631
padding-bottom: 1em;
632
list-style-type: none;
632
list-style-type: none;
633
width: 100%; 
633
width: 100%;
634
}
634
}
635
635
636
fieldset.rows.left li {
636
fieldset.rows.left li {
Lines 708-729 div.rows+div.rows { Link Here
708
div.rows {
708
div.rows {
709
float : left;
709
float : left;
710
clear : left;
710
clear : left;
711
margin: 0 0 0 0;  
711
margin: 0 0 0 0;
712
padding: 0;
712
padding: 0;
713
width: 100%; 
713
width: 100%;
714
}
714
}
715
715
716
716
717
div.rows span.label {  
717
div.rows span.label {
718
	float: left;  
718
	float: left;
719
	font-weight : bold;
719
	font-weight : bold;
720
	width: 9em;  
720
	width: 9em;
721
	margin-right: 1em;  
721
	margin-right: 1em;
722
	text-align: left;
722
	text-align: left;
723
}
723
}
724
724
725
div.rows ol {  
725
div.rows ol {
726
padding: .5em 1em 0 0;  
726
padding: .5em 1em 0 0;
727
list-style-type: none;
727
list-style-type: none;
728
}
728
}
729
729
Lines 738-744 clear : left; Link Here
738
padding-bottom: .2em;
738
padding-bottom: .2em;
739
padding-top: .1em;
739
padding-top: .1em;
740
list-style-type: none;
740
list-style-type: none;
741
width: 100%; 
741
width: 100%;
742
}
742
}
743
743
744
a.cancel {
744
a.cancel {
Lines 849-856 ol.bibliodetails span.label { Link Here
849
	border-right : 1px solid #E8E8E8;
849
	border-right : 1px solid #E8E8E8;
850
	float : left;
850
	float : left;
851
	font-weight: bold;
851
	font-weight: bold;
852
	width: 12em;  
852
	width: 12em;
853
	margin-right: 1em;  
853
	margin-right: 1em;
854
}
854
}
855
855
856
div.listgroup {
856
div.listgroup {
Lines 869-874 div.listgroup input { Link Here
869
	font-size: 80%;
869
	font-size: 80%;
870
}
870
}
871
871
872
div.listgroup ol li span.label i {
873
    margin-right : .5em;
874
}
875
876
div.listgroup ol li button,a {
877
    margin-left : .5em;
878
}
879
872
div.sysprefs h3 {
880
div.sysprefs h3 {
873
	margin : .2em 0 .2em .4em;
881
	margin : .2em 0 .2em .4em;
874
}
882
}
Lines 938-944 span.expired { Link Here
938
}
946
}
939
947
940
div.help {
948
div.help {
941
	margin: .9em 0 0 0;  
949
	margin: .9em 0 0 0;
942
}
950
}
943
951
944
.blocker {
952
.blocker {
Lines 996-1007 div.first fieldset { Link Here
996
.dialog table td {
1004
.dialog table td {
997
	text-align : left;
1005
	text-align : left;
998
}
1006
}
999
  
1007
1000
.dialog  h2, .dialog h3, .dialog h4 {
1008
.dialog  h2, .dialog h3, .dialog h4 {
1001
  	margin : auto;
1009
  	margin : auto;
1002
	text-align : center;
1010
	text-align : center;
1003
  }
1011
  }
1004
  
1012
1005
.dialog input {
1013
.dialog input {
1006
 	background-color : #FFF;
1014
 	background-color : #FFF;
1007
 	border : 1px solid #bcbcbc;
1015
 	border : 1px solid #bcbcbc;
Lines 1155-1165 div.note i.fa-exclamation { Link Here
1155
 div.results {
1163
 div.results {
1156
 	padding : .7em 0;
1164
 	padding : .7em 0;
1157
 }
1165
 }
1158
 
1166
1159
 .accesskey {
1167
 .accesskey {
1160
 	text-decoration : underline;
1168
 	text-decoration : underline;
1161
 }
1169
 }
1162
 
1170
1163
label.required,
1171
label.required,
1164
span.required {
1172
span.required {
1165
    color : #C00;
1173
    color : #C00;
Lines 1293-1299 h1#logo a { Link Here
1293
}
1301
}
1294
1302
1295
#closewindow a {
1303
#closewindow a {
1296
	font-weight : bold;	
1304
	font-weight : bold;
1297
}
1305
}
1298
1306
1299
.patroninfo+#menu {
1307
.patroninfo+#menu {
Lines 1326-1335 li.email { Link Here
1326
}
1334
}
1327
1335
1328
.clearfix:after {
1336
.clearfix:after {
1329
    content: "."; 
1337
    content: ".";
1330
    display: block; 
1338
    display: block;
1331
    height: 0; 
1339
    height: 0;
1332
    clear: both; 
1340
    clear: both;
1333
    visibility: hidden;
1341
    visibility: hidden;
1334
}
1342
}
1335
1343
Lines 1570-1576 input.warning { Link Here
1570
}
1578
}
1571
1579
1572
#displayexample {
1580
#displayexample {
1573
	padding: 5px; 
1581
	padding: 5px;
1574
	margin-bottom: 10px;
1582
	margin-bottom: 10px;
1575
	background-color: #CCCCCC;
1583
	background-color: #CCCCCC;
1576
}
1584
}
Lines 1689-1695 span.permissiondesc { Link Here
1689
1697
1690
.results_summary {
1698
.results_summary {
1691
  display: block;
1699
  display: block;
1692
  font-size : 85%; 
1700
  font-size : 85%;
1693
  color: #707070;
1701
  color: #707070;
1694
  padding : 0 0 .5em 0;
1702
  padding : 0 0 .5em 0;
1695
}
1703
}
Lines 1795-1804 fieldset.rows+h3 {clear:both;padding-top:.5em;} Link Here
1795
}
1803
}
1796
1804
1797
.m880 {
1805
.m880 {
1798
    display:block; 
1806
    display:block;
1799
    text-align:right; 
1807
    text-align:right;
1800
    float:right; 
1808
    float:right;
1801
    width:50%; 
1809
    width:50%;
1802
    padding-left:20px
1810
    padding-left:20px
1803
}
1811
}
1804
1812
(-)a/koha-tmpl/intranet-tmpl/prog/en/modules/catalogue/moredetail.tt (+2 lines)
Lines 15-20 Link Here
15
    browser.show();
15
    browser.show();
16
//]]>
16
//]]>
17
</script>
17
</script>
18
<script type="text/javascript" src="[% interface %]/[% theme %]/js/app/moredetail.js"></script>
18
</head>
19
</head>
19
<body id="catalog_moredetail" class="catalog">
20
<body id="catalog_moredetail" class="catalog">
20
[% USE KohaDates %]
21
[% USE KohaDates %]
Lines 199-204 Link Here
199
            [% END %]
200
            [% END %]
200
201
201
            </ol></div>
202
            </ol></div>
203
            <div id="item-messages-[% ITEM_DAT.itemnumber %]" class="item-messages"></div>
202
            <div class="listgroup"><h4>History</h4>
204
            <div class="listgroup"><h4>History</h4>
203
            <ol class="bibliodetails">
205
            <ol class="bibliodetails">
204
206
(-)a/koha-tmpl/intranet-tmpl/prog/js/public/moredetail.js (-1 / +124 lines)
Line 0 Link Here
0
- 
1
var React = require('react');
2
var ReactDOM = require('react-dom');
3
4
var ItemMessages = React.createClass({
5
    propTypes: {
6
        messages: React.PropTypes.array.isRequired
7
    },
8
    getInitialState: function() {
9
        return { messages: this.props.messages };
10
    },
11
    addMessage: function(message) {
12
        this.setState(function(state) {
13
            var newData = state.messages.slice();
14
            newData.push( message );
15
            return {messages: newData};
16
        });
17
    },
18
    removeMessage: function(index) {
19
        this.setState(function(state) {
20
            var newData = state.messages.slice();
21
            newData.splice(index, 1);
22
            return {messages: newData};
23
        });
24
    },
25
    render: function () {
26
        var item_messages = this;
27
        return  <div className="listgroup">
28
                    <h4>Messages</h4>
29
                    <ol className="bibliodetails">
30
                        {this.state.messages.map(function(message, index) {
31
                            return <ItemMessage key={message.id} message={message} index={index} onRemove={item_messages.removeMessage} />
32
                        })}
33
                        <ItemMessageCreator onAdd={item_messages.addMessage}/>
34
                    </ol>
35
                </div>;
36
    }
37
});
38
39
var ItemMessage = React.createClass({
40
    propTypes: {
41
        message: React.PropTypes.object.isRequired,
42
        index: React.PropTypes.number.isRequired,
43
        onRemove: React.PropTypes.func.isRequired,
44
    },
45
    removeMessage: function() {
46
        if ( confirm("Delete message the following message? : " + this.props.message.content ) ) {
47
            this.props.onRemove(this.props.index);
48
        }
49
    },
50
    render: function () {
51
        return  <li>
52
                    <span className="label">
53
                        <i className="fa fa-minus-circle" onClick={this.removeMessage}></i>
54
                        {this.props.message.type}
55
                    </span>
56
                    {this.props.message.content}
57
                </li>
58
      }
59
});
60
61
var ItemMessageCreator = React.createClass({
62
    propTypes: {
63
        onAdd: React.PropTypes.func.isRequired,
64
    },
65
    getInitialState: function () {
66
        return {
67
            content: "",
68
            type: "",
69
        };
70
    },
71
    addMessage: function() {
72
        this.props.onAdd(
73
            {
74
                id: Math.random() * 100,
75
                type: this.state.type,
76
                content: this.state.content,
77
            }
78
        );
79
    },
80
    cancelMessage: function() {
81
        this.setState( this.getInitialState );
82
        return false;
83
    },
84
    handleTypeChange: function(e) {
85
        this.setState({ type: e.target.value });
86
    },
87
    handleContentChange: function(e) {
88
        this.setState({ content: e.target.value });
89
    },
90
    render: function () {
91
        return  <li>
92
                    <span className="label">
93
                        <select value={this.state.type} onChange={this.handleTypeChange}>
94
                            <option value="test1">Test 1</option>
95
                            <option value="test2">Test 2</option>
96
                            <option value="test3">Test 3</option>
97
                        </select>
98
                    </span>
99
                    <input className="input-xlarge" type="text" value={this.state.content} onChange={this.handleContentChange} />
100
                    <button className="submit" onClick={this.addMessage}>
101
                        <i className="fa fa-plus-circle"></i>
102
                        Add message
103
                    </button>
104
                    <a href="javascript:void(0);" onClick={this.cancelMessage}>Cancel</a>
105
                </li>
106
      }
107
});
108
109
$( document ).ready(function() {
110
    var messages = [
111
        { id: 1, type: "Test 1", content: "Message 1" },
112
        { id: 2, type: "Test 2", content: "Message 2" },
113
        { id: 3, type: "Test 3", content: "Message 3" },
114
        { id: 4, type: "Test 4", content: "Message 4" },
115
        { id: 5, type: "Test 5", content: "Message 5" },
116
    ];
117
118
    $('.item-messages').each(function() {
119
        ReactDOM.render(
120
            <ItemMessages messages={messages}/>,
121
            this
122
        );
123
    });
124
});

Return to bug 17297