◊(Local Yarn Code "Check-in [8e848ec1]")

Overview
Comment:Fix styles for note permlinks in individual article pages
Timelines: family | ancestors | descendants | both | trunk
Files: files | file ages | folders
SHA3-256: 8e848ec1e1d34c8cce3e44b24ccab9105d8742088407f5ba0a5b3dc6e7dc0f7b
User & Date: joel on 2018-09-26 03:39:01
Other Links: manifest | tags
Context
2019-02-09
19:32
Rename template-html.rkt → snippets-html.rkt check-in: 99fe3246 user: joel tags: trunk
2018-09-26
03:39
Fix styles for note permlinks in individual article pages check-in: 8e848ec1 user: joel tags: trunk
02:57
Make note author bylines italic check-in: 6069a320 user: joel tags: trunk
Changes

Modified template-html.rkt from [f7768941] to [38947f14].

140
141
142
143
144
145
146
147

148
149
150
151
152
153
154
140
141
142
143
144
145
146

147
148
149
150
151
152
153
154







-
+








(define (html$-note-in-article id date contents author author-url)
  (define maybe-author-class?
    (cond [(or (string=? author default-authorname) (string=? author "")) "by-proprietor"]
          [else ""]))

  ◊string-append{<div class="note ◊maybe-author-class? u-comment" id="◊|id|">
 <h3><a href="#◊|id|"><time class="dt-published" datetime="◊date">◊ymd->english[date]</time>
 <h3><a class="rel-bookmark note-permlink" href="#◊|id|"><time class="dt-published" datetime="◊date">◊ymd->english[date]</time>
 </a></h3>
 <div class="p-content p-name">
 ◊contents
 </div>
 <div class="note-meta">
 &mdash;<a class="u-author h-card" href="◊|author-url|"><i>◊|author|</i></a>
 </div>

Modified web-extra/martin.css.pp from [8449f20b] to [de63ae31].

149
150
151
152
153
154
155
156
157
158
159

160
161
162
163
164
165
166
149
150
151
152
153
154
155


156

157
158
159
160
161
162
163
164







-
-

-
+







        transition: filter 0.25s ease;
    }

    main header:hover h1 {
        color: ◊color-bodytext;
        /* transition: color 0.25s ease; */
    }
    /* Links. Generally, we want them colored that weird springy green, underlines
       only when hovered, thanks.

       I read somewhere years ago that you should specify styling for links in the
    /* I read somewhere years ago that you should specify styling for links in the
       following order: Link, Visited, Hover, Active. 
           → Remember the mnemonic: Lord Vader Has Arrived.
       
       Not sure if that's relevant advice any more but I still follow it. It can't hurt. */
       
    a:link, a:visited {         /* [L]ord [V]ader… */
        color: ◊color-link;
255
256
257
258
259
260
261
262

263
264
265
266
267
268
269
253
254
255
256
257
258
259

260
261
262
263
264
265
266
267







-
+







    a.rel-bookmark::after {
        content: '\f894'; 
        margin-left: 4px;
        font-style: normal;
        color: #809102;
    }
    a.rel-bookmark.note-permlink::after {
        content: '-';       /* NB: this is not a hyphen! It is a U+002D glyph, the Unicode “minus sign” */
        content: '\f897';
        margin-left: 4px;
    }

    a.rel-bookmark:hover::after {
        color: #aaba16;
    }