CoderDojoPotsdam / regex-tutorial

Interactive Tutorial for Regular Expressions | Interaktives Tutorial für Reguläre Ausdrücke
https://coderdojopotsdam.github.io/regex-tutorial
11 stars 17 forks source link

text for progess #11

Open niccokunzmann opened 7 years ago

niccokunzmann commented 7 years ago

When the mouse hovers above the bubbles on the progress bar, the title of the linked page should be displayed.

weerox commented 7 years ago

Do you want the built-in hover title design, or should we create something of our own? I like the GitHub implementation (to view this, hover the "Owner" tag in a comment).

niccokunzmann commented 7 years ago

Looks good. As you like.

I think, the more we do although it is fun, the less new people can do and maybe the less contributions we get. How did you decide to contribute? Was it because you fixed a small mistake? If we also find those small issues, we can get more people involved.

weerox commented 7 years ago

Yeah, you're right.

joshhazelhurst123 commented 7 years ago

Hi, I am interested in contributing to this project and learning as much as possible. I like the github implementation as mentioned by @weerox. Is there a github api to search through or code for the tag?

niccokunzmann commented 7 years ago

In Firefox (Chrome, Opera and Edge, too) You can inspect websites and tags. You can right-click on the page, click on Inspect Element and then have a look at source code and styling. grafik

It seems like it uses CSS animations to fade in after 0.4 seconds: grafik

niccokunzmann commented 7 years ago

And you can view the animation and the styling by clicking on the file. grafik

I do not know if I could answer your question in any way.

joshhazelhurst123 commented 5 years ago

hmmm I can't get edit the progress bar, I look at progress.css and tutorial.html to make the changes that I wanted to make on the progress bar but I can't figure out how it works. Thanks.

niccokunzmann commented 5 years ago

@joshhazelhurst123 Hi, did you set up jekyll locally?

The code for the progress bar starts here: https://github.com/CoderDojoPotsdam/regex-tutorial/blob/058c263dc6d11b9d45ed63096f9c5006456d2d7f/_layouts/tutorial.html#L70 and this is the link for which the hover effect can be changed: https://github.com/CoderDojoPotsdam/regex-tutorial/blob/058c263dc6d11b9d45ed63096f9c5006456d2d7f/_layouts/tutorial.html#L96

Could I answer some questions? Do you have new questions? Which changes did you try and make?

joshhazelhurst123 commented 5 years ago

Yes jekyll works, you have helped me a lot!

Thanks for your comment and reply. I managed to put a basic hover tag in tutorial.html which hovers over all paragraphs, and a href links.
p:hover, a:hover { background-color: yellow; } I would like to make the changes as requested in this issue request, I want the tooltip to appear when hovering over the link in the progress bar. I think adding the tooltip-appear in tutorial.html under