The importance of triangles

[sujato]

For styling I’m not sure what branch we’re running on staging, so if you could add it I would be grateful.

In text/popupnotes.css, we currently have

a.note {
  position:relative;
  color:#EE1700;

    .deets {
        background-color: #F7DBD0;
    }
}

a.bib {
  position:relative;
  color:#EED900;

    .deets {
        background-color: #F7F2C2;
    }
}

We can change to:

a.note {
  position: relative;
  color: pastel-color(dirty-green);
  @include sans-serif;
  cursor: help;
  font-size: 0.8rem;
  vertical-align:super;

    .deets {
        background-color: #F7DBD0;
    }
}

a.bib {
  position: relative;
  color: pastel-color(dirty-green);
  @include sans-serif;
  cursor: help;

    .deets {
        background-color: #F7F2C2;
    }
}

Or more economically, I think this should work, but beware the scopes:

.tri{
  position: relative;
  color: pastel-color(dirty-green);
  @include sans-serif;
  cursor: help;
    a.note {
       font-size: 0.8rem;
       vertical-align:super;

        .deets {
            background-color: #F7DBD0;
        }
    }

    a.bib {
        .deets {
        background-color: #F7F2C2;
        }
    }
}

[Vimala]

Thanks. Will have a look at everything later today.

@sujato

Use
summary {display: block;}

Thanks, but I was more thinking along the lines of making all dropdowns polymer rather than keeping troubleshooting Firefox issues.

@sujato

encapsulated so they can easily be imported

Quite possible but I have to figure out a few things about our own backend first. So please be patient … I will get there

[sujato]

Good, as it is not a breaking issue we can take some time and play around.

[Vimala]

Done the various changes so please have a look. Will start working on the various polymer issues now.

Search

Yes, babbu is sitting on my lap (or more precise biḷārikā ), but I was not very clear in my question.
What exactly do you mean with: However the selector seems to be implemented differently than elsewhere.

[sujato]

@Vimala

Done the various changes so please have a look

Yes, I see, it’s looking good.

One very minor issue: is it possible to swap the sequence when we have both .note and .bib? See the bottom of SuttaCentral

The .bib is really just an expansion of the basic reference, hence the … It makes more sense for that to be immediately after the references, with the “note” following. So on that page we would have, in the second last entry:

also cf. ix p. 394ff … ^note

@Vimala

What exactly do you mean with: However the selector seems to be implemented differently than elsewhere.

Just that the HTML is different: here it is a <select> element in a <form>. Maybe that’s okay, as it is, after all, a search form.

[Vimala]

@sujato

to swap the sequence when we have both .note and .bib?

Done.

@sujato

Just that the HTML is different:

Will look at that last. Maybe with a polymer dropdown everything will get standardised more. The two dropdowns in the sidebar are also very different.

[sujato]

In fact I think each dropdown is implemented in an entirely different way. Yay for diversity! If we can get just one Polymer element working, at least we’ll see what it involves.

[Vimala]

I’ve made something on staging with a switch for Textual Information and the checkboxes, just with css rather than polymere. (small bug in the area where the switch is rounded, but that can be removed; this is just to show how it can be)

[sujato]

That’s nice, thanks. It is more clear about what each control does. The only thing is that Textual Information seems to be on by default: it should be off by default.

[sujato]

Also, I just noticed a small bug: when you open the “Languages” panel in sibebar>navigation, the external links display the “offsite” icon on a separate line. The bad CSS is:

#sidebar details[open] .language-dropdown li a {
display: block;
}

[Vimala]

OK. All done now. It remembers the last user setting for Textual Info and the offsite icon is fixed.
I changed the background color of the checkboxes to grey. The yellow was a bit too much.

[sujato]

That’s looking good, thanks.

[Vimala]

You probably noticed that everything is uploaded to master too now.

[sujato]

I had not noticed—but I have now! Thanks so much, this looks nice.

[dhammachatta]

@Vimala

I like the on/off switch for Textual Information

I do like the switch very much, but even on my ‘best-ager/presbyopia-ready’ 5.5" mobile it might be a bit too tiny for it to be comfortably toggled…

EDIT: On Safari/iPhone the switch only works, when it is tapped. The visuals of the object, however, suggest a sliding usage, which does not work.

(Please do give a hint, if comments from non-devs on features under construction are a distraction from your work and should be refrained from)

[sujato]

Hi Dhammachatta,

Thanks for the comment, and also thanks for the sensitivity!

Like all the elements on the site, this will be implemented following the Material design guidelines, which, like it or loathe it, at least lets us say, not our choice!

As for commenting on Dev channels, generally speaking they are for Devas to discuss among ourselves. But occasional, specific, and relevant comments, like yours, are fine.

[dhammachatta]

@sujato

they are for Devas to discuss among ourselves

I appreciate that occasional comment by the Nagas is not frowned upon

@sujato

Like all the elements on the site, this will be implemented following the Material design guidelines, which, like it or loathe it, at least lets us say, not our choice!

I appreciate the advantage of a consistent design frame. Yet, when this frame encompasses elements with counter-intuitive functionality, it might be worth questioning their implementation on one’s own site.

I have no personal experience with Android, but those living in an iOS environment would always expect a sliding switch element to be activated by, err, emm… well sliding.

[Matt]

Maybe a checkbox or radio button instead?

[dhammachatta]

The grey checkboxes on current staging are very pleasing aesthetically, however they might confuse many users:

Since the days of yore (i.e. first Windows & mac OS and also throughout most Linux desktops) greyed-out buttons and checkboxes denote options that might be present in principle but are unavailable for user interaction in the present context, which is not, I presume, what you want to convey with regard to these elements.

Furthermore, the preset grey tickmarks might rather suggest that the option is on by default.

[sujato]

For now, we’ll just stick as closely to the MD spec as we can. All of these things are discussed in detail there, if you’re interested.

MD is the basis for Android, which is 50% of all computing devices sold today: so it can’t be too bad. If we need to modify it, we can look at that further down the road.