Skip to content

Commit a3c1db7

Browse files
committed
fix img html, improve img css, change colours, rename vars
1 parent d8656a5 commit a3c1db7

File tree

6 files changed

+86
-48
lines changed

6 files changed

+86
-48
lines changed
Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
11
<div>
2-
<h4>%1</h4>
3-
<div>%2</div>
2+
<h4><span>Error: </span>%1</h4>
3+
<div role="alert">%2</div>
44
</div>
Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1 @@
1-
&#32;&#47;&nbsp;<a class="rssguard-menc" href="%1"><div style="display:none"><!-- cannot be removed -->%2</div><span style="text-transform: uppercase;">%3</span></a>
1+
&#32;&#47;&nbsp;<a class="rssguard-menc" href="%1"><span style="display:none"><!-- Cannot be removed -->%2</span><span style="text-transform: uppercase;">%3</span></a>
Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1,5 @@
1-
<a href="%1"><img src="%1" alt="%2" style="height: %3px;" /></a>
1+
<a href="%1">
2+
<img alt="%2"
3+
src="%1"
4+
style="max-height: %3px;">
5+
</a>
Lines changed: 10 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,12 @@
1-
<div dir="auto">
2-
<div class="rssguard-mwrapper">
3-
<section class="rssguard-mhead">
4-
<div style="float: right; margin: 10px;"><!-- where should I put it??? -->%7</div>
5-
<span class="rssguard-msmall">%2</span>
6-
<h1>%1<span class="rssguard-mlinks">%6<span class="rssguard-murl">&nbsp;&#47;&nbsp;<a href="%3">URL</a></span></span></h1>
7-
<span class="rssguard-msmall">%5</span>
8-
</section>
9-
<hr />
10-
<div class="rssguard-mbody">
11-
%4
12-
</div>
1+
<div class="rssguard-mwrapper" dir="auto">
2+
<section class="rssguard-mhead">
3+
<div style="float: right; margin: 10px;"><!-- Should it remain here??? -->%7</div>
4+
<span class="rssguard-msmall">%2</span>
5+
<h1>%1<span class="rssguard-mlinks">%6<span class="rssguard-murl">&nbsp;&#47;&nbsp;<a href="%3">URL</a></span></span></h1>
6+
<span class="rssguard-msmall">%5</span>
7+
</section>
8+
<hr>
9+
<div class="rssguard-mbody">
10+
%4
1311
</div>
1412
</div>

resources/skins/nudus/html_wrapper.html

Lines changed: 65 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -13,15 +13,16 @@
1313
<head>
1414
<style>
1515
:root {
16-
--base-unit: 10px;
17-
--brad-unit: .3em;
16+
--rssguard-base-unit: 10px;
17+
--rssguard-dbase-unit: calc(var(--rssguard-base-unit) * 2);
18+
--rssguard-em-unit: .3em;
1819
/* Qt5 fusion border grey */
19-
--grey1: #B8B8B8;
20+
--rssguard-grey01: #B8B8B8;
2021

2122
/* Some other grey */
22-
--grey2: #CFCFCF;
23-
--grey10: #343434;
24-
--grey20: #F1F1F1;
23+
--rssguard-grey02: #CFCFCF;
24+
--rssguard-grey10: #343434;
25+
--rssguard-grey20: #F1F1F1;
2526
}
2627
body, h1, h2, h3, h4, h5, h6,
2728
p, blockquote, pre, hr,
@@ -32,9 +33,10 @@
3233
h1, h2, h3, h4, h5, h6,
3334
p, blockquote, pre,
3435
ul, ol, dl, figure {
35-
margin-bottom: var(--base-unit);
36+
margin-bottom: var(--rssguard-base-unit);
3637
}
3738
body {
39+
box-sizing: border-box;
3840
cursor: default;
3941
font-kerning: normal;
4042
-webkit-text-size-adjust: 100%;
@@ -100,28 +102,28 @@
100102
font-size: .8em !important;
101103
}
102104
blockquote {
103-
color: var(--grey10);
104-
border-left: 4px solid var(--grey2);
105+
color: var(--rssguard-grey10);
106+
border-left: var(--rssguard-em-unit) solid var(--rssguard-grey02);
105107
margin-left: 0;
106-
padding: 0 var(--base-unit);
108+
padding: 0 var(--rssguard-base-unit);
107109
}
108110
pre,
109111
code {
110-
background: var(--grey20);
112+
background: var(--rssguard-grey20);
111113
}
112114
pre {
113115
--horiz: 13px;
114116

115-
border-radius: var(--brad-unit);
117+
border-radius: var(--rssguard-em-unit);
116118
margin 0;
117119
overflow-x: auto;
118120
padding: 7px var(--horiz);
119121
white-space: pre !important;
120122
width: calc(100wv - calc(var(--horiz) * 2)) !important;
121123
}
122124
code {
123-
border-radius: var(--brad-unit);
124-
color: var(--grey10);
125+
border-radius: var(--rssguard-em-unit);
126+
color: var(--rssguard-grey10);
125127
padding: 0 .25em;
126128
word-break: break-word;
127129
}
@@ -137,43 +139,65 @@
137139
table,
138140
th,
139141
td {
140-
border: 1px solid var(--grey1);
142+
border: 1px solid var(--rssguard-grey01);
143+
}
144+
li {
145+
display: list-item;
146+
}
147+
ul {
148+
display: block;
149+
list-style-type: circle;
150+
padding-left: var(--rssguard-dbase-unit);
151+
}
152+
ul li ul {
153+
list-style-type: square;
154+
}
155+
ol {
156+
display: block;
157+
list-style-type: decimal;
158+
padding-left: var(--rssguard-dbase-unit);
159+
}
160+
ol li ol {
161+
list-style-type: lower-roman;
141162
}
142163
img {
143-
max-height: 100%;
144-
/*
145-
* There are few cases in horizontal layout when
146-
* max-width: 500px; looks better with hi-res images
147-
*/
148-
max-width: 100%;
164+
/* redundant? */
165+
display: inline-block;
166+
167+
height: auto;
168+
width: auto;
149169
}
150170
details > summary {
151-
border-radius: var(--brad-unit);
171+
border-radius: var(--rssguard-em-unit);
152172
cursor: pointer;
153173
}
154174
details > summary:hover {
155-
background: var(--grey20);
175+
background: var(--rssguard-grey20);
156176
}
157177
details[open] > summary {
158-
background: var(--grey20);
178+
background: var(--rssguard-grey20);
159179
}
160180
details > summary:focus {
161181
box-shadow: none;
162182
outline: none;
163183
}
164184
hr {
165-
background: var(--grey2);
185+
background: var(--rssguard-grey02);
166186
border: none;
167187
display: block;
168188
height: 2px;
169-
margin: var(--base-unit) 0;
189+
margin: var(--rssguard-base-unit) 0;
170190
}
171191
iframe {
172192
max-width: 100%;
173-
max-height: auto;
193+
height: auto;
194+
width: auto;
195+
}
196+
select {
197+
max-width: 100%;
174198
}
175199
.rssguard-mwrapper {
176-
padding: var(--base-unit) !important;
200+
padding: var(--rssguard-base-unit) !important;
177201
}
178202
.rssguard-mhead .rssguard-msmall,
179203
.rssguard-mhead .rssguard-mlinks {
@@ -194,14 +218,26 @@
194218
body:hover .rssguard-mwrapper .rssguard-murl {
195219
visibility: visible;
196220
}
221+
@media only screen and (max-width: 800px) {
222+
.rssguard-mbody img {
223+
max-width: 100% !important;
224+
}
225+
}
226+
.rssguard-mbody img {
227+
max-width: 450px;
228+
}
197229
.rssguard-mbody {
198230
/*
199231
* For articles without html elements;
200232
* Not sure if I want to apply this to *all*;
201-
* otherwise apply only to links
233+
* otherwise *must* be applied to links in mbody
202234
*/
203235
word-break: break-word;
204236
}
237+
/* fix at least some mess made by above */
238+
table {
239+
word-break: normal;
240+
}
205241
</style>
206242
<style>
207243
html, body, div, span, applet, object, iframe,

resources/skins/nudus/metadata.xml

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -4,8 +4,8 @@
44
<name>Maki Blackwell</name>
55
</author>
66
<palette>
7-
<color key="1">#4861F0</color>
8-
<color key="2">#F04861</color>
9-
<color key="3">#61F048</color>
7+
<color key="1">#3A4EE4</color>
8+
<color key="2">#E43A4E</color>
9+
<color key="3">#4EE43A</color>
1010
</palette>
1111
</skin>

0 commit comments

Comments
 (0)