Avatar

a first attempt and a problem (Technics)

by Auge ⌂, Thursday, October 19, 2017, 20:43 (2371 days ago) @ Micha

Hello

I started to code the changes and ran into a trap.

Hypothesised, both links from the code below are read, the first was read when not logged in, the second was read in logged in state. Both links should follow any of the CSS-rules for :visited or .read. In case of font colour (color: #007;) all visited links applies the rules. In case of the background colour of a whole (visited) link the rules will only be applied for links with the class .read but not for links with the pseudo class :visited.

What am I doing wrong? The developer tools of firefox and vivaldi/chrome does not show a rewrite with more specific or later listed rules. There seems to be no misspellings.

<div id="latest-postings">
 <h3>letzte Einträge</h3>
 <ul id="latest-postings-container">
  <li><a href="index.php?id=11" title="Auge, 19.03.2017, 13:24 (Brot)">
   <span class="entry-title"><strong>Zwiebelsuppe bedarf einer aufwendigen Vorbereitung</strong></span><br />
   <span class="entry-date">vor 214 Tagen</span></a></li>
  <li><a href="index.php?id=10" title="Auge, 13.03.2017, 14:49 (Kuchen)" class="read">
   <span class="entry-title"><strong>thumbnail position</strong></span><br />
   <span class="entry-date">vor 220 Tagen</span></a></li>
 </ul>
</div>
#latest-postings li a {
 font-size:0.82em;
 line-height:1.5em;
 text-decoration:none;
 display:block;
 margin:0;
 padding:3px 5px;
}
#latest-postings li a:visited,
#latest-postings li a.read {
 background-color: #ffffff; /* will only be applied with .read */
}
#latest-postings li a:visited .entry-title,
#latest-postings li a.read .entry-title {
 color:#000077; /* will be applied with :visited and .read */
}
#latest-postings li a:focus,
#latest-postings li a:hover {
 background:#efefef;
 text-decoration:none;
}
#latest-postings li a .entry-date,
#latest-postings li a.read .entry-date {
 font-size: 0.82em;
 color: #808080;
}

The relevant code in my repo, branch "latest": subtemplates/index.inc.tpl (#10 and #11), the style.min.css (#86 to #93)

Tschö, Auge

--
Trenne niemals Müll, denn er hat nur eine Silbe!


Complete thread:

 RSS Feed of thread