Skip to content

Commit 4adf4c7

Browse files
steinaragustlisteinaragustli
committed
CB-13969 updating README.MD to better explain lefttoright parameter option, reverting unneccesary indent changes on inappbrowser.css
1 parent 74ccef1 commit 4adf4c7

File tree

2 files changed

+167
-54
lines changed

2 files changed

+167
-54
lines changed

‎README.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -104,7 +104,7 @@ instance, or the system browser.
104104
All platforms support:
105105

106106
- __location__: Set to `yes` or `no` to turn the `InAppBrowser`'s location bar on or off.
107-
- __lefttoright__: Set to `yes` to swap position of the navigation buttons and the close button.
107+
- __lefttoright__: Set to `yes` to swap positions of the navigation buttons and the close button. Specifically from left to right on iOS, and from right to left for Android(since the default values for the platforms are opposites).
108108

109109
Android supports these additional options:
110110

‎www/inappbrowser.css‎

Lines changed: 166 additions & 53 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
/*
1+
/*
22
* Licensed to the Apache Software Foundation (ASF) under one
33
* or more contributor license agreements. See the NOTICE file
44
* distributed with this work for additional information
@@ -18,97 +18,210 @@
1818
*/
1919

2020
.inAppBrowserWrap {
21-
margin: 0;
22-
padding: 0;
23-
outline: 0;
24-
font-size: 100%;
25-
vertical-align: baseline;
26-
background: 0 0;
27-
position: fixed;
28-
top: 0;
29-
left: 0;
30-
width: 100%;
31-
height: 100%;
32-
z-index: 9999999;
33-
box-sizing: border-box;
34-
border: 40px solid #bfbfbf;
35-
border: 40px solid rgba(0, 0, 0, 0.25);
21+
margin: 0;
22+
padding: 0;
23+
outline: 0;
24+
font-size: 100%;
25+
vertical-align: baseline;
26+
background: 0 0;
27+
position: fixed;
28+
top: 0;
29+
left: 0;
30+
width: 100%;
31+
height: 100%;
32+
z-index: 9999999;
33+
box-sizing: border-box;
34+
border: 40px solid #bfbfbf;
35+
border: 40px solid rgba(0, 0, 0, 0.25);
3636
}
3737

3838
.inAppBrowserWrapFullscreen {
39-
border: 0;
39+
border: 0;
4040
}
4141

4242
.inappbrowser-app-bar {
43-
height: 70px;
44-
background-color: #404040;
45-
z-index: 9999999;
43+
height: 70px;
44+
background-color: #404040;
45+
z-index: 9999999;
4646
}
4747

4848
.inappbrowser-app-bar-inner {
49-
padding-top: 10px;
50-
height: 60px;
51-
width: 155px;
52-
margin: 0 auto;
53-
background-color: #404040;
54-
z-index: 9999999;
49+
padding-top: 10px;
50+
height: 60px;
51+
width: 155px;
52+
margin: 0 auto;
53+
background-color: #404040;
54+
z-index: 9999999;
5555
}
5656

5757
.app-bar-action {
58-
width: auto;
59-
height: 40px;
60-
margin-left: 20px;
61-
font-family: 'Segoe UI Symbol';
62-
float: left;
63-
color: white;
64-
font-size: 12px;
65-
text-transform: lowercase;
66-
text-align: center;
67-
cursor: default;
58+
width: auto;
59+
height: 40px;
60+
margin-left: 20px;
61+
font-family: "Segoe UI Symbol";
62+
float: left;
63+
color: white;
64+
font-size: 12px;
65+
text-transform: lowercase;
66+
text-align: center;
67+
cursor: default;
6868
}
6969

7070
.app-bar-action[disabled] {
71-
color: gray;
72-
/*disable click*/
73-
pointer-events: none;
71+
color: gray;
72+
/*disable click*/
73+
pointer-events: none;
7474
}
7575

7676
.app-bar-action::before {
77-
font-size: 28px;
78-
display: block;
79-
height: 36px;
77+
font-size: 28px;
78+
display: block;
79+
height: 36px;
8080
}
8181

8282
/* Back */
83-
.action-back {
84-
margin-left: 0px;
83+
.action-back {
84+
margin-left: 0px;
8585
}
8686

8787
.action-back::before {
88-
content: '\E0BA';
88+
content: "\E0BA";
8989
}
9090

9191
.action-back:not([disabled]):hover::before {
92-
content: '\E0B3';
92+
content: "\E0B3";
9393
}
9494

9595
/* Forward */
9696
.action-forward::before {
97-
content: '\E0AC';
97+
content: "\E0AC";
9898
}
9999

100100
.action-forward:not([disabled]):hover::before {
101-
content: '\E0AF';
101+
content: "\E0AF";
102102
}
103103

104104
/* Close */
105105
.action-close::before {
106-
content: '\E0C7';
107-
/* close icon is larger so we re-size it to fit other icons */
108-
font-size: 20px;
109-
line-height: 40px;
106+
content: "\E0C7";
107+
/* close icon is larger so we re-size it to fit other icons */
108+
font-size: 20px;
109+
line-height: 40px;
110110
}
111111

112112
.action-close:not([disabled]):hover::before {
113-
content: '\E0CA';
113+
content: "\E0CA";
114+
}/*
115+
* Licensed to the Apache Software Foundation (ASF) under one
116+
* or more contributor license agreements. See the NOTICE file
117+
* distributed with this work for additional information
118+
* regarding copyright ownership. The ASF licenses this file
119+
* to you under the Apache License, Version 2.0 (the
120+
* "License"); you may not use this file except in compliance
121+
* with the License. You may obtain a copy of the License at
122+
*
123+
* http://www.apache.org/licenses/LICENSE-2.0
124+
*
125+
* Unless required by applicable law or agreed to in writing,
126+
* software distributed under the License is distributed on an
127+
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
128+
* KIND, either express or implied. See the License for the
129+
* specific language governing permissions and limitations
130+
* under the License.
131+
*/
132+
133+
.inAppBrowserWrap {
134+
margin: 0;
135+
padding: 0;
136+
outline: 0;
137+
font-size: 100%;
138+
vertical-align: baseline;
139+
background: 0 0;
140+
position: fixed;
141+
top: 0;
142+
left: 0;
143+
width: 100%;
144+
height: 100%;
145+
z-index: 9999999;
146+
box-sizing: border-box;
147+
border: 40px solid #bfbfbf;
148+
border: 40px solid rgba(0, 0, 0, 0.25);
114149
}
150+
151+
.inAppBrowserWrapFullscreen {
152+
border: 0;
153+
}
154+
155+
.inappbrowser-app-bar {
156+
height: 70px;
157+
background-color: #404040;
158+
z-index: 9999999;
159+
}
160+
161+
.inappbrowser-app-bar-inner {
162+
padding-top: 10px;
163+
height: 60px;
164+
width: 155px;
165+
margin: 0 auto;
166+
background-color: #404040;
167+
z-index: 9999999;
168+
}
169+
170+
.app-bar-action {
171+
width: auto;
172+
height: 40px;
173+
margin-left: 20px;
174+
font-family: "Segoe UI Symbol";
175+
float: left;
176+
color: white;
177+
font-size: 12px;
178+
text-transform: lowercase;
179+
text-align: center;
180+
cursor: default;
181+
}
182+
183+
.app-bar-action[disabled] {
184+
color: gray;
185+
/*disable click*/
186+
pointer-events: none;
187+
}
188+
189+
.app-bar-action::before {
190+
font-size: 28px;
191+
display: block;
192+
height: 36px;
193+
}
194+
195+
/* Back */
196+
.action-back {
197+
margin-left: 0px;
198+
}
199+
200+
.action-back::before {
201+
content: "\E0BA";
202+
}
203+
204+
.action-back:not([disabled]):hover::before {
205+
content: "\E0B3";
206+
}
207+
208+
/* Forward */
209+
.action-forward::before {
210+
content: "\E0AC";
211+
}
212+
213+
.action-forward:not([disabled]):hover::before {
214+
content: "\E0AF";
215+
}
216+
217+
/* Close */
218+
.action-close::before {
219+
content: "\E0C7";
220+
/* close icon is larger so we re-size it to fit other icons */
221+
font-size: 20px;
222+
line-height: 40px;
223+
}
224+
225+
.action-close:not([disabled]):hover::before {
226+
content: "\E0CA";
227+
}

0 commit comments

Comments
 (0)