Skip to content

Commit 950e0d3

Browse files
antoinemantoinem
committed
Update layout to have the 3 columns centered on very large screens
1 parent fb0b191 commit 950e0d3

File tree

5 files changed

+185
-169
lines changed

5 files changed

+185
-169
lines changed

‎lib/rdoc/generator/template/rorvswild/_topbar.rhtml‎

Lines changed: 8 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,12 @@
11
<header class="topbar">
2-
<%= render '_sidebar_toggle.rhtml' %>
3-
<a href="<%= rel_prefix %>/index.html" rel="home"><%= @options.title %></a>
4-
<button type="button" aria-label="Search" class="search-button">
5-
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-search"><circle cx="11" cy="11" r="8"></circle><line x1="21" y1="21" x2="16.65" y2="16.65"></line></svg>
6-
<span>search</span>
7-
</button>
2+
<div class="width-limiter">
3+
<%= render '_sidebar_toggle.rhtml' %>
4+
<a href="<%= rel_prefix %>/index.html" rel="home"><%= @options.title %></a>
5+
<button type="button" aria-label="Search" class="search-button">
6+
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-search"><circle cx="11" cy="11" r="8"></circle><line x1="21" y1="21" x2="16.65" y2="16.65"></line></svg>
7+
<span>search</span>
8+
</button>
9+
</div>
810
</header>
911

1012
<%= render '_dialog_search.rhtml' %>

‎lib/rdoc/generator/template/rorvswild/class.rhtml‎

Lines changed: 134 additions & 132 deletions
Original file line numberDiff line numberDiff line change
@@ -1,154 +1,156 @@
11
<body id="top" role="document">
22
<%= render '_topbar.rhtml' %>
3-
<%= render '_navigation.rhtml' %>
3+
<div class="wrapper">
4+
<%= render '_navigation.rhtml' %>
45

5-
<main role="main" aria-labelledby="<%=h klass.aref %>">
6-
<article>
7-
<h1 id="<%=h klass.aref %>">
8-
<%= klass.type %> <%= klass.full_name %>
9-
</h1>
6+
<main role="main" aria-labelledby="<%=h klass.aref %>">
7+
<article>
8+
<h1 id="<%=h klass.aref %>">
9+
<%= klass.type %> <%= klass.full_name %>
10+
</h1>
1011

11-
<%= klass.description %>
12+
<%= klass.description %>
1213

13-
<%- klass.each_section do |section, constants, attributes| -%>
14-
15-
<%- if section.title then -%>
16-
<h2><%= section.title %></h2>
17-
<%- end -%>
14+
<%- klass.each_section do |section, constants, attributes| -%>
15+
16+
<%- if section.title then -%>
17+
<h2><%= section.title %></h2>
18+
<%- end -%>
1819

19-
<%- if section.comment then -%>
20-
<div><%= section.description %></div>
21-
<%- end -%>
20+
<%- if section.comment then -%>
21+
<div><%= section.description %></div>
22+
<%- end -%>
2223

23-
<%- unless constants.empty? then -%>
24-
<section class="constants-list">
25-
<header>
26-
<h2>Constants</h2>
27-
</header>
28-
<dl>
29-
<%- constants.each do |const| -%>
30-
<dt id="<%= const.name %>"><%= const.name %></dt>
31-
<%- if const.comment then -%>
32-
<dd><%= const.description.strip %></dd>
33-
<%- else -%>
34-
<dd class="missing-docs">(Not documented)</dd>
35-
<%- end -%>
36-
<%- end -%>
37-
</dl>
38-
</section>
39-
<%- end -%>
40-
41-
<%- unless attributes.empty? then -%>
42-
<section class="attribute-method-details" class="method-section">
43-
<header>
44-
<h2>Attributes</h2>
45-
</header>
46-
<%- attributes.each do |attrib| -%>
47-
<div id="<%= attrib.aref %>" class="method-detail">
48-
<div class="method-heading attribute-method-heading">
49-
<span class="method-name"><%= h attrib.name %></span>
50-
<span class="attribute-access-type">[<%= attrib.rw %>]</span>
51-
</div>
52-
53-
<div class="method-description">
54-
<%- if attrib.comment then -%>
55-
<%= attrib.description.strip %>
24+
<%- unless constants.empty? then -%>
25+
<section class="constants-list">
26+
<header>
27+
<h2>Constants</h2>
28+
</header>
29+
<dl>
30+
<%- constants.each do |const| -%>
31+
<dt id="<%= const.name %>"><%= const.name %></dt>
32+
<%- if const.comment then -%>
33+
<dd><%= const.description.strip %></dd>
5634
<%- else -%>
57-
<p class="missing-docs">(Not documented)</p>
35+
<dd class="missing-docs">(Not documented)</dd>
5836
<%- end -%>
59-
</div>
60-
</div>
61-
<%- end -%>
62-
</section>
63-
<%- end -%>
64-
65-
<%- klass.methods_by_type(section).each do |type, visibilities|
66-
next if visibilities.empty?
67-
visibilities.each do |visibility, methods|
68-
next if methods.empty? %>
69-
<section id="<%= visibility %>-<%= type %>-<%= section.aref %>-method-details" class="method-section">
70-
<header>
71-
<h2><%= visibility.to_s.capitalize %> <%= type.capitalize %> Methods</h2>
72-
</header>
37+
<%- end -%>
38+
</dl>
39+
</section>
40+
<%- end -%>
7341

74-
<%- methods.each do |method| -%>
75-
<div id="<%= method.aref %>" class="method-detail <%= method.is_alias_for ? "method-alias" : '' %>">
76-
<div class="method-header">
77-
<%- if (call_seq = method.call_seq) then -%>
78-
<%- call_seq.strip.split("\n").each_with_index do |call_seq, i| -%>
79-
<div class="method-heading">
80-
<span class="method-callseq">
81-
<%= h(call_seq.strip.
82-
gsub( /^\w+\./m, '')).
83-
gsub(/(.*)[-=]&gt;/, '\1&rarr;') %>
84-
</span>
85-
</div>
86-
<%- end -%>
87-
<%- elsif method.has_call_seq? then -%>
88-
<div class="method-heading">
89-
<span class="method-name"><%= h method.name %></span>
90-
</div>
91-
<%- else -%>
92-
<div class="method-heading">
93-
<span class="method-name"><%= h method.name %></span>
94-
<span class="method-args"><%= h method.param_seq %></span>
95-
</div>
96-
<%- end -%>
97-
</div>
42+
<%- unless attributes.empty? then -%>
43+
<section class="attribute-method-details" class="method-section">
44+
<header>
45+
<h2>Attributes</h2>
46+
</header>
47+
<%- attributes.each do |attrib| -%>
48+
<div id="<%= attrib.aref %>" class="method-detail">
49+
<div class="method-heading attribute-method-heading">
50+
<span class="method-name"><%= h attrib.name %></span>
51+
<span class="attribute-access-type">[<%= attrib.rw %>]</span>
52+
</div>
9853

99-
<%- unless method.skip_description? then -%>
10054
<div class="method-description">
101-
<%- if method.comment then -%>
102-
<%= method.description.strip %>
55+
<%- if attrib.comment then -%>
56+
<%= attrib.description.strip %>
10357
<%- else -%>
10458
<p class="missing-docs">(Not documented)</p>
10559
<%- end -%>
106-
<%- if method.calls_super then -%>
107-
<div class="method-calls-super">
108-
Calls superclass method <%= method.superclass_method ? method.formatter.link(method.superclass_method.full_name, method.superclass_method.full_name) : nil %>
60+
</div>
61+
</div>
62+
<%- end -%>
63+
</section>
64+
<%- end -%>
65+
66+
<%- klass.methods_by_type(section).each do |type, visibilities|
67+
next if visibilities.empty?
68+
visibilities.each do |visibility, methods|
69+
next if methods.empty? %>
70+
<section id="<%= visibility %>-<%= type %>-<%= section.aref %>-method-details" class="method-section">
71+
<header>
72+
<h2><%= visibility.to_s.capitalize %> <%= type.capitalize %> Methods</h2>
73+
</header>
74+
75+
<%- methods.each do |method| -%>
76+
<div id="<%= method.aref %>" class="method-detail <%= method.is_alias_for ? "method-alias" : '' %>">
77+
<div class="method-header">
78+
<%- if (call_seq = method.call_seq) then -%>
79+
<%- call_seq.strip.split("\n").each_with_index do |call_seq, i| -%>
80+
<div class="method-heading">
81+
<span class="method-callseq">
82+
<%= h(call_seq.strip.
83+
gsub( /^\w+\./m, '')).
84+
gsub(/(.*)[-=]&gt;/, '\1&rarr;') %>
85+
</span>
86+
</div>
87+
<%- end -%>
88+
<%- elsif method.has_call_seq? then -%>
89+
<div class="method-heading">
90+
<span class="method-name"><%= h method.name %></span>
10991
</div>
110-
<%- end -%>
111-
<%- if method.token_stream then -%>
112-
<button class="toggle-source">toggle source</button>
113-
<div class="method-source-code" id="<%= method.html_name %>-source">
114-
<pre><%= method.markup_code %></pre>
92+
<%- else -%>
93+
<div class="method-heading">
94+
<span class="method-name"><%= h method.name %></span>
95+
<span class="method-args"><%= h method.param_seq %></span>
11596
</div>
11697
<%- end -%>
11798
</div>
118-
<%- end -%>
11999

120-
<%- unless method.aliases.empty? then -%>
121-
<div class="aliases">
122-
Also aliased as: <%= method.aliases.map do |aka|
123-
if aka.parent then # HACK lib/rexml/encodings
124-
%{<a href="#{klass.aref_to aka.path}">#{h aka.name}</a>}
125-
else
126-
h aka.name
127-
end
128-
end.join ", " %>
129-
</div>
130-
<%- end -%>
100+
<%- unless method.skip_description? then -%>
101+
<div class="method-description">
102+
<%- if method.comment then -%>
103+
<%= method.description.strip %>
104+
<%- else -%>
105+
<p class="missing-docs">(Not documented)</p>
106+
<%- end -%>
107+
<%- if method.calls_super then -%>
108+
<div class="method-calls-super">
109+
Calls superclass method <%= method.superclass_method ? method.formatter.link(method.superclass_method.full_name, method.superclass_method.full_name) : nil %>
110+
</div>
111+
<%- end -%>
112+
<%- if method.token_stream then -%>
113+
<button class="toggle-source">toggle source</button>
114+
<div class="method-source-code" id="<%= method.html_name %>-source">
115+
<pre><%= method.markup_code %></pre>
116+
</div>
117+
<%- end -%>
118+
</div>
119+
<%- end -%>
131120

132-
<%- if method.is_alias_for then -%>
133-
<div class="aliases">
134-
Alias for: <a href="<%= klass.aref_to method.is_alias_for.path %>"><%= h method.is_alias_for.name %></a>
135-
</div>
136-
<%- end -%>
137-
</div>
138-
<%- end -%>
139-
</section>
140-
<%- end
141-
end %>
142-
<%- end -%>
143-
</article>
144-
<nav class="contextual">
145-
<%= render '_sidebar_parent.rhtml' %>
146-
<%= render '_sidebar_includes.rhtml' %>
147-
<%= render '_sidebar_table_of_contents.rhtml' %>
148-
<%= render '_sidebar_sections.rhtml' %>
149-
<%= render '_sidebar_extends.rhtml' %>
150-
<%= render '_sidebar_constants.rhtml' %>
151-
<%= render '_sidebar_methods.rhtml' %>
152-
</nav>
153-
</main>
121+
<%- unless method.aliases.empty? then -%>
122+
<div class="aliases">
123+
Also aliased as: <%= method.aliases.map do |aka|
124+
if aka.parent then # HACK lib/rexml/encodings
125+
%{<a href="#{klass.aref_to aka.path}">#{h aka.name}</a>}
126+
else
127+
h aka.name
128+
end
129+
end.join ", " %>
130+
</div>
131+
<%- end -%>
132+
133+
<%- if method.is_alias_for then -%>
134+
<div class="aliases">
135+
Alias for: <a href="<%= klass.aref_to method.is_alias_for.path %>"><%= h method.is_alias_for.name %></a>
136+
</div>
137+
<%- end -%>
138+
</div>
139+
<%- end -%>
140+
</section>
141+
<%- end
142+
end %>
143+
<%- end -%>
144+
</article>
145+
<nav class="contextual">
146+
<%= render '_sidebar_parent.rhtml' %>
147+
<%= render '_sidebar_includes.rhtml' %>
148+
<%= render '_sidebar_table_of_contents.rhtml' %>
149+
<%= render '_sidebar_sections.rhtml' %>
150+
<%= render '_sidebar_extends.rhtml' %>
151+
<%= render '_sidebar_constants.rhtml' %>
152+
<%= render '_sidebar_methods.rhtml' %>
153+
</nav>
154+
</main>
155+
</div>
154156
</body>

‎lib/rdoc/generator/template/rorvswild/css/rdoc.css‎

Lines changed: 13 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,7 @@
66
*/
77

88
:root {
9+
--page-max-width: 1600px;
910
--sidebar-width: 240px;
1011

1112
--color-primary: oklch(0.5 0.18 29);
@@ -46,7 +47,6 @@ body {
4647
padding-top: 35px;
4748
}
4849

49-
5050
body > footer {
5151
display: none; /* quickfix waiting for Ruby to upgrade RDoc and use the latest darkfish.rb */
5252
}
@@ -333,17 +333,22 @@ main header h3 {
333333
position: fixed;
334334
top: 0;
335335
background-color: var(--color-topbar);
336+
}
337+
338+
.topbar .width-limiter {
339+
max-width: var(--page-max-width);
340+
margin: 0 auto;
336341
display: flex;
337342
gap: 8px;
338343
}
339344

340-
.topbar > a:any-link {
345+
.topbar .width-limiter > a:any-link {
341346
text-decoration: none;
342347
font-weight: 700;
343348
color: var(--color-topbar-text);
344349
}
345350

346-
.topbar > a:any-link:hover { color: var(--color-topbar-text); }
351+
.topbar .width-limiter > a:any-link:hover { color: var(--color-topbar-text); }
347352

348353
#navigation-toggle {
349354
display: inline-block;
@@ -355,7 +360,6 @@ nav {
355360
position: fixed;
356361
top: 35px;
357362
bottom: 0;
358-
left: 0;
359363
width: 100%;
360364
max-width: var(--sidebar-width);
361365
background: var(--color-background);
@@ -758,7 +762,6 @@ pre + .toggle-source { margin-top: 0.5rem; }
758762
main {
759763
margin: 0 auto;
760764
width: 100%;
761-
max-width: 1300px;
762765
padding: 0;
763766
position: relative;
764767
grid-column: 2/ span 1;
@@ -793,11 +796,14 @@ pre + .toggle-source { margin-top: 0.5rem; }
793796
@media (min-width: 1024px) {
794797
html { font-size: 16px; }
795798

796-
body {
797-
padding-top: 40px;
799+
body > .wrapper {
798800
display: grid;
799801
grid-template-columns: var(--sidebar-width) auto;
800802
gap: 1rem;
803+
width: 100%;
804+
max-width: var(--page-max-width);
805+
margin: 0 auto;
806+
position: relative;
801807
}
802808

803809
#navigation-toggle { display: none }

0 commit comments

Comments
 (0)