Skip to content

Commit 80bb0f7

Browse files
zombieFoxzombieFox
authored
[feature] add open all links control to groups
1 parent 926bb35 commit 80bb0f7

File tree

16 files changed

+426
-137
lines changed

16 files changed

+426
-137
lines changed

‎package-lock.json‎

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "nightTab",
3-
"version": "4.41.0",
3+
"version": "4.42.0",
44
"description": "A neutral new tab page accented with a chosen colour. Customise the layout, style, background and bookmarks in nightTab.",
55
"main": "index.js",
66
"scripts":{

‎src/css/group.css‎

Lines changed: 65 additions & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -40,6 +40,62 @@
4040
transition: padding var(--layout-timing-extra-fast) var(--layout-duration-04);
4141
}
4242

43+
.group-header-item{
44+
display: flex;
45+
}
46+
47+
.is-group-area-justify-center .group-header-item:not(:only-child):not(:last-child),
48+
.is-group-area-justify-left .group-header-item:not(:only-child):not(:last-child){
49+
margin-right:calc(var(--layout-space) *var(--layout-gutter));
50+
}
51+
52+
.is-group-area-justify-right .group-header-item:not(:only-child):not(:last-child){
53+
margin-left:calc(var(--layout-space) *var(--layout-gutter));
54+
}
55+
56+
.group-header-item-name{
57+
flex-shrink:1;
58+
overflow: hidden;
59+
}
60+
61+
.group-header-item-control{
62+
height:0;
63+
width:0;
64+
overflow: hidden;
65+
flex-shrink:0;
66+
transition:
67+
width var(--layout-timing-extra-fast),
68+
height var(--layout-timing-extra-fast) var(--layout-duration-04),
69+
margin var(--layout-timing-extra-fast);
70+
}
71+
72+
.is-edit .group-header-item-control{
73+
height:2.5em;
74+
width:15em;
75+
transition:
76+
width var(--layout-timing-extra-fast) var(--layout-duration-04),
77+
height var(--layout-timing-extra-fast),
78+
margin var(--layout-timing-extra-fast) var(--layout-duration-04);
79+
}
80+
81+
.is-group-area-justify-center .group-header-item-control:not(:only-child):not(:last-child),
82+
.is-group-area-justify-left .group-header-item-control:not(:only-child):not(:last-child){
83+
margin-right:0;
84+
}
85+
86+
.is-edit.is-group-area-justify-center .group-header-item-control:not(:only-child):not(:last-child),
87+
.is-edit.is-group-area-justify-left .group-header-item-control:not(:only-child):not(:last-child){
88+
margin-right:calc(var(--layout-space) *var(--layout-gutter));
89+
}
90+
91+
.is-group-area-justify-right .group-header-item-control:not(:only-child):not(:last-child){
92+
margin-left:0;
93+
}
94+
95+
.is-edit.is-group-area-justify-right .group-header-item-control:not(:only-child):not(:last-child){
96+
margin-left:calc(var(--layout-space) *var(--layout-gutter));
97+
}
98+
4399
.is-edit .group-header{
44100
transition: padding var(--layout-timing-extra-fast);
45101
}
@@ -58,30 +114,25 @@
58114
justify-content: flex-start;
59115
}
60116

117+
.is-group-order-headerbody.is-group-openall-show .group-header,
61118
.is-group-order-headerbody.is-group-name-show .group-header,
62119
.is-group-order-headerbody.is-edit .group-header{
63120
padding-bottom:calc(var(--layout-space) *var(--layout-gutter));
64121
}
65122

123+
.is-group-order-bodyheader.is-group-openall-show .group-header,
66124
.is-group-order-bodyheader.is-group-name-show .group-header,
67125
.is-group-order-bodyheader.is-edit .group-header{
68126
padding-top:calc(var(--layout-space) *var(--layout-gutter));
69127
}
70128

71129
.group-name{
72-
margin-right:0;
130+
height:2.5em;
73131
display: flex;
74132
align-items: center;
75-
height:0;
76133
max-width:100%;
77134
overflow: hidden;
78135
font-size:var(--group-name-size);
79-
transition: height var(--layout-timing-extra-fast);
80-
}
81-
82-
.is-group-name-show .group-name{
83-
display: flex;
84-
height:2.5em;
85136
}
86137

87138
.group-name-text{
@@ -91,41 +142,15 @@
91142
white-space: nowrap;
92143
}
93144

94-
.group-control{
95-
margin-right:0;
96-
margin-bottom:0;
97-
overflow: hidden;
98-
height:0;
99-
width:0;
145+
.group-control-item{
146+
padding-left:0;
147+
padding-right:0;
100148
flex-shrink:0;
101-
transition:
102-
width var(--layout-timing-extra-fast),
103-
height var(--layout-timing-extra-fast) var(--layout-duration-04),
104-
margin var(--layout-timing-extra-fast);
105-
}
106-
107-
.is-edit .group-control{
108-
height:2.5em;
109-
width:16em;
110-
transition:
111-
width var(--layout-timing-extra-fast) var(--layout-duration-04),
112-
height var(--layout-timing-extra-fast),
113-
margin var(--layout-timing-extra-fast) var(--layout-duration-04);
114-
}
115-
116-
.is-edit.is-group-name-show.is-group-area-justify-left .group-control,
117-
.is-edit.is-group-name-show.is-group-area-justify-center .group-control{
118-
margin-right:1em;
149+
width:3em;
119150
}
120151

121-
.is-edit.is-group-name-show.is-group-area-justify-right .group-control{
122-
margin-left:1em;
123-
}
124-
125-
.group-control-item{
126-
padding-left:1.25em;
127-
padding-right:1.25em;
128-
flex-shrink:0;
152+
.group-openall{
153+
font-size:var(--group-openall-size);
129154
}
130155

131156
.group-body{

‎src/css/header.css‎

Lines changed: 0 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -192,17 +192,6 @@
192192
position: relative;
193193
}
194194

195-
.header-item-menu-baseline-alignment-character{
196-
width:0;
197-
opacity:0;
198-
pointer-events: none;
199-
visibility: hidden;
200-
padding:0;
201-
clip:rect(0,0,0,0);
202-
white-space: nowrap;
203-
border:0;
204-
}
205-
206195
.header-item-body{
207196
display: flex;
208197
align-items: center;

‎src/css/utilities.css‎

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -64,3 +64,14 @@
6464
flex-wrap: nowrap;
6565
align-items: center;
6666
}
67+
68+
.baseline-alignment-icon-character{
69+
width:0;
70+
opacity:0;
71+
pointer-events: none;
72+
visibility: hidden;
73+
padding:0;
74+
clip:rect(0,0,0,0);
75+
white-space: nowrap;
76+
border:0;
77+
}

‎src/css/variables.css‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -90,6 +90,7 @@
9090
--header-transitional-size:1em;
9191
/* group */
9292
--group-name-size:1em;
93+
--group-openall-size:1em;
9394
--group-border:0;
9495
/* link */
9596
--link-area-width:100%;

‎src/html/menu/menu-content/groups.html‎

Lines changed: 60 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,35 @@
11
<divid="menu-content-groups" class="menu-content menu-content-overscroll menu-content-groups is-hidden">
2+
<divid="menu-content-groups-area" class="menu-content-item">
3+
<divclass="menu-item-header">
4+
<h1class="menu-item-header-text">Area</h1>
5+
</div>
6+
<divclass="menu-item-form">
7+
<divclass="form-wrap">
8+
<divclass="form-wrap">
9+
<labelclass="control-group-area-justify-label">Group horizontal alignment</label>
10+
</div>
11+
<divclass="form-wrap">
12+
<divclass="form-grid form-grid-3x1 control-group-area-justify-grid">
13+
<divclass="form-wrap">
14+
<inputid="control-group-area-justify-left" class="control-group-area-justify-left" type="radio" name="control-group-area-justify" value="left" tabindex="-1">
15+
<labelfor="control-group-area-justify-left"><spanclass="label-icon"></span><spanclass="sr-only">Left</span></label>
16+
</div>
17+
<divclass="form-wrap">
18+
<inputid="control-group-area-justify-center" class="control-group-area-justify-center" type="radio" name="control-group-area-justify" value="center" tabindex="-1">
19+
<labelfor="control-group-area-justify-center"><spanclass="label-icon"></span><spanclass="sr-only">Center</span></label>
20+
</div>
21+
<divclass="form-wrap">
22+
<inputid="control-group-area-justify-right" class="control-group-area-justify-right" type="radio" name="control-group-area-justify" value="right" tabindex="-1">
23+
<labelfor="control-group-area-justify-right"><spanclass="label-icon"></span><spanclass="sr-only">Right</span></label>
24+
</div>
25+
</div>
26+
</div>
27+
</div>
28+
<divclass="form-helper">
29+
<pclass="control-group-area-justify-helper form-helper-item">Effects may not be visible if the Group Name is not shown.</p>
30+
</div>
31+
</div>
32+
</div>
233
<divid="menu-content-groups-names" class="menu-content-item">
334
<divclass="menu-item-header">
435
<h1class="menu-item-header-text">Names</h1>
@@ -20,30 +51,40 @@ <h1 class="menu-item-header-text">Names</h1>
2051
</div>
2152
</div>
2253
</div>
23-
<hr>
54+
</div>
55+
</div>
56+
<divid="menu-content-groups-order" class="menu-content-item">
57+
<divclass="menu-item-header">
58+
<h1class="menu-item-header-text">Open all Bookmarks</h1>
59+
</div>
60+
<divclass="menu-item-form">
2461
<divclass="form-wrap">
25-
<divclass="form-wrap">
26-
<labelclass="control-group-area-justify-label">Group name horizontal alignment</label>
27-
</div>
28-
<divclass="form-wrap">
29-
<divclass="form-grid form-grid-3x1 control-group-area-justify-grid">
30-
<divclass="form-wrap">
31-
<inputid="control-group-area-justify-left" class="control-group-area-justify-left" type="radio" name="control-group-area-justify" value="left" tabindex="-1">
32-
<labelfor="control-group-area-justify-left"><spanclass="label-icon"></span><spanclass="sr-only">Left</span></label>
33-
</div>
34-
<divclass="form-wrap">
35-
<inputid="control-group-area-justify-center" class="control-group-area-justify-center" type="radio" name="control-group-area-justify" value="center" tabindex="-1">
36-
<labelfor="control-group-area-justify-center"><spanclass="label-icon"></span><spanclass="sr-only">Center</span></label>
37-
</div>
38-
<divclass="form-wrap">
39-
<inputid="control-group-area-justify-right" class="control-group-area-justify-right" type="radio" name="control-group-area-justify" value="right" tabindex="-1">
40-
<labelfor="control-group-area-justify-right"><spanclass="label-icon"></span><spanclass="sr-only">Right</span></label>
62+
<inputid="control-group-openall-show" class="control-group-openall-show" type="checkbox" tabindex="-1">
63+
<labelfor="control-group-openall-show"><spanclass="label-icon"></span> Show</label>
64+
</div>
65+
<divclass="form-wrap">
66+
<divclass="form-indent">
67+
<divclass="form-wrap">
68+
<labelfor="control-group-openall-size-range">Size</label>
69+
<divclass="form-group form-group-block">
70+
<inputid="control-group-openall-size-range" class="control-group-openall-size-range mr-3" type="range" value="0" tabindex="-1">
71+
<inputclass="control-group-openall-size-number form-group-item-medium form-group-radius-left" type="number" value="0" tabindex="-1">
72+
<buttonclass="control-group-openall-size-default button" tabindex="-1" title="Reset to default"><spanclass="icon-replay"></span></button>
4173
</div>
4274
</div>
4375
</div>
4476
</div>
45-
<divclass="form-helper">
46-
<pclass="control-group-area-justify-helper form-helper-item">Effects may not be visible if the Group Name is not shown.</p>
77+
<hr>
78+
<divclass="form-wrap">
79+
<labelclass="control-group-openall-style-label">Button style</label>
80+
</div>
81+
<divclass="form-wrap">
82+
<inputid="control-group-openall-style-box" class="control-group-openall-style-box" type="radio" name="control-group-openall-style" value="box" tabindex="-1">
83+
<labelfor="control-group-openall-style-box"><spanclass="label-icon"></span> Box</label>
84+
</div>
85+
<divclass="form-wrap">
86+
<inputid="control-group-openall-style-clear" class="control-group-openall-style-clear" type="radio" name="control-group-openall-style" value="clear" tabindex="-1">
87+
<labelfor="control-group-openall-style-clear"><spanclass="label-icon"></span> Clear</label>
4788
</div>
4889
</div>
4990
</div>

‎src/html/menu/menu-content/header.html‎

Lines changed: 12 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -508,7 +508,9 @@ <h1 class="menu-item-header-text">Search</h1>
508508
</div>
509509
</div>
510510
<hr>
511-
<labelclass="control-header-search-style-label">Style</label>
511+
<divclass="form-wrap">
512+
<labelclass="control-header-search-style-label">Input style</label>
513+
</div>
512514
<divclass="form-wrap">
513515
<inputid="control-header-search-style-box" class="control-header-search-style-box" type="radio" name="control-header-search-style" value="box" tabindex="-1">
514516
<labelfor="control-header-search-style-box"><spanclass="label-icon"></span> Box</label>
@@ -629,7 +631,9 @@ <h1 class="menu-item-header-text">Edit/Add</h1>
629631
</div>
630632
<divclass="form-wrap">
631633
<divclass="form-indent">
632-
<labelclass="control-header-editadd-style-label">Style</label>
634+
<divclass="form-wrap">
635+
<labelclass="control-header-editadd-style-label">Button style</label>
636+
</div>
633637
<divclass="form-wrap">
634638
<inputid="control-header-editadd-style-box" class="control-header-editadd-style-box" type="radio" name="control-header-editadd-style" value="box" tabindex="-1">
635639
<labelfor="control-header-editadd-style-box"><spanclass="label-icon"></span> Box</label>
@@ -678,7 +682,9 @@ <h1 class="menu-item-header-text">Colour/Accent</h1>
678682
<labelfor="control-header-coloraccent-dot-show"><spanclass="label-icon"></span> Show colour dots</label>
679683
</div>
680684
<hr>
681-
<labelclass="control-header-coloraccent-style-label">Style</label>
685+
<divclass="form-wrap">
686+
<labelclass="control-header-coloraccent-style-label">Button style</label>
687+
</div>
682688
<divclass="form-wrap">
683689
<inputid="control-header-coloraccent-style-box" class="control-header-coloraccent-style-box" type="radio" name="control-header-coloraccent-style" value="box" tabindex="-1">
684690
<labelfor="control-header-coloraccent-style-box"><spanclass="label-icon"></span> Box</label>
@@ -713,7 +719,9 @@ <h1 class="menu-item-header-text">Colour/Accent</h1>
713719
<h1class="menu-item-header-text">Settings menu</h1>
714720
</div>
715721
<divclass="menu-item-form">
716-
<labelclass="control-header-menu-style-label">Style</label>
722+
<divclass="form-wrap">
723+
<labelclass="control-header-menu-style-label">Button style</label>
724+
</div>
717725
<divclass="form-wrap">
718726
<inputid="control-header-menu-style-box" class="control-header-menu-style-box" type="radio" name="control-header-menu-style" value="box" tabindex="-1">
719727
<labelfor="control-header-menu-style-box"><spanclass="label-icon"></span> Box</label>

‎src/html/menu/menu-nav.html‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -31,6 +31,7 @@
3131
<divclass="menu-nav-item">
3232
<buttonclass="control-menu-groups menu-nav-tab button" tabindex="-1">Groups</button>
3333
<divclass="menu-nav-body menu-nav-body-groups active">
34+
<ahref="#menu-content-groups-area" class="menu-nav-sub button button-small" tabindex="-1">Area</a>
3435
<ahref="#menu-content-groups-names" class="menu-nav-sub button button-small" tabindex="-1">Names</a>
3536
<ahref="#menu-content-groups-order" class="menu-nav-sub button button-small" tabindex="-1">Order</a>
3637
<ahref="#menu-content-groups-border" class="menu-nav-sub button button-small" tabindex="-1">Border</a>

0 commit comments

Comments
(0)