DS4PS / cpp-527-fall-2020

http://ds4ps.org/cpp-527-fall-2020/
0 stars 1 forks source link

Lab 5-Add page and update navigation #36

Open malmufre opened 3 years ago

malmufre commented 3 years ago

Hi everyone,

I am trying to navigate the getting started page to copy the file to my main folder on GitHub , but I think the link is broken. This is the link in the course page( https://github.com/daattali/beautiful-jekyll/blob/gh-pages/getstarted.md )

Would I be able to find the getting started page elsewhere?

Thanks

lecy commented 3 years ago

Please see https://github.com/DS4PS/cpp-527-fall-2020/issues/34

It looks like the basic site files have been changed. You can fork one of the other examples and update any of the basic MD files to create a new page.

This one is very clean and would be easy to use:

https://melyanna.github.io/

Niagara1000 commented 3 years ago

Please see #34

It looks like the basic site files have been changed. You can fork one of the other examples and update any of the basic MD files to create a new page.

This one is very clean and would be easy to use:

https://melyanna.github.io/

Professor @lecy ,

I saw the post #34 that you referred to above. I already started my assignment, and I'm stuck on the getstarted.md step. If I continue with the Beautiful Jekyll template that I forked, what should I do for this step? There is no getstarted.md present in this template.

Were you also recommending that we create, for example, a "Search" page, as shown here ? If so, do we only change the content of the file or the structure of the file itself?

Thank you!

lecy commented 3 years ago

More like an ABOUT page.

Anything that lets you specify a basic page layout and add content using markdown exclusively.

---
layout: page
title: About me
subtitle: A list of my projects and some useful links
---

https://github.com/Melyanna/Melyanna.github.io/blob/master/about.md

Anything with galleries or widgets will be too confusing.

The "About Me" would be fine in Beautiful Jekyll, but the MD page does not actually match the HTML version, so it's confusing.

https://deanattali.com/aboutme/

https://github.com/daattali/beautiful-jekyll/blob/master/aboutme.md

Niagara1000 commented 3 years ago

Ok, I will add an aboutme.md file. Thank you!

hos1995 commented 3 years ago

@lecy I am trying to update the style for the Steps in the Beautiful-Jekyll example. I've been able to update everything else so far but trying to update the style and dividing the classes isn't working like I thought. This is my code to divide the 3 steps: image

This is the style I set at the end of the getstarted.md to start playing with the stylization: ``

But this is how it looks in the website: image

What is going wrong here?

lecy commented 3 years ago

@hos1995 The code looks fine.

I would need a little more info to diagnose anything.

Can you please include links to the repo MD file for this page and to the URL of your live HTML version?

Also paste code when sharing code, not a screen shot of the code. It's impossible to check for things like tabs instead of spaces, missing spaces are the end of lines, etc. (the usual suspects) when it is an image.

hos1995 commented 3 years ago

@lecy Here is the link to the live HTML version and here is the link to the getstarted.md file in my repo. I tried copying the code in but it ran the code and so you couldn't see the dividing code snips. Thanks for your help!

lecy commented 3 years ago

Alright, can you please try one of the following:

Add markdown="1" attribute to the div tag

<div class="gs-section-01" markdown="1">

### 1. Fork (copy) the Beautiful Jekyll project 

Fork the [repository](https://github.com/daattali/beautiful-jekyll) by clicking the Fork button on the top right corner in GitHub.

</div>

Use double-squirrely brackets around markdown text

<div class="gs-section-01"> {{

### 1. Fork (copy) the Beautiful Jekyll project 

Fork the [repository](https://github.com/daattali/beautiful-jekyll) by clicking the Fork button on the top right corner in GitHub.

}} </div>
lecy commented 3 years ago

@hos1995

I tried copying the code in but it ran the code and so you couldn't see the dividing code snips.

Just place the code between fences (three back-tick marks, similar to RMD chunks):

### 1. Fork (copy) the Beautiful Jekyll project Fork the [repository](https://github.com/daattali/beautiful-jekyll) by clicking the Fork button on the top right corner in GitHub.
JayCastro commented 3 years ago

I dont know what happened but the post i had under _post just stopped showing up and im not sure how to fix it .

lecy commented 3 years ago

@JayCastro Please review rules for clear questions - with the information you provided we are left to guess what your current website files look like and what you might have changed for this to happen.

Please provide links to your site files and some sense of what you have recently changed.

Niagara1000 commented 3 years ago

Prof @lecy ,

Q1-A

Is this the right way to update the style tags at the end of getstarted.md?

Screen Shot 2020-09-25 at 6 33 16 PM

Or do we need to create separate <style> .. </style> chunks for each gs-section ?

Q1-B

Where do the gs-section sections (gs-section-01, gs-section-02, gs-section-03) get referred to when we use them here in the getstarted.md file ?

Q2

are the <div> tags supposed to be only around the headings or the text below them as well?

Niagara1000 commented 3 years ago

Hi Prof @lecy ,

Q3

Referring to the screenshot from my most recent response above, I am unable to change the color of the 2nd and 3rd heading sections. only the first can be seen as red.

my current getstarted.md page

lecy commented 3 years ago

@Niagara1000

If the first step heading is changing read it means your style elements are working.

Read a little more about how CSS works because I don't think you are understanding the tags.

In HTML we specify header types by level, 1 being the largest and most pronounced style and each subsequent level is smaller and less pronounced.

The equivalent markdown styles are designated with hash tags.

<h1>  # header 1
<h2>  ## header 2
<h3>  ### header 3

These are level 3 headers:

### 1. Fork this project

So you need level 3 style settings:

Current:

.gs-section-02 h1 { 
     color: blue }

Correct:

.gs-section-02 h3 { 
     color: blue }

The p controls paragraph text.

Hope it helps.

lecy commented 3 years ago

Or do we need to create separate chunks for each gs-section ?

You only need one <style> section for all of the CSS elements.

are the

tags supposed to be only around the headings or the text below them as well?

The <div> tags need to include whatever text you are trying to style. In this case you have CSS elements for paragraph text, so you would need to include the paragraphs below the headers in order to apply the style to them.

Think about it as a section of a report. You are applying the same style to the entire section.

Niagara1000 commented 3 years ago

Prof @lecy ,

Thank you for your answers.

I have some more questions:

Q4:

Can we customize the website to any extent as we want as long as we have the sections that you require?

Q5:

Is it ok to have a Fun Facts section in addition to the About Me page that was already provided? In another post, you suggested that I add an About Me page, but that was already provided in the Beautiful Jekyll template by daattali.

If the Fun Facts section isn't the best choice, can I have some examples? I tried to do a Search page and Tags page, but I'm not sure of which files to modify to make the changes appear on my website.

Q6:

Would you be able to check my website to see if the basic requirements are met for the assignment? I'm pretty sure I got everything, but just want to double-check before I submit the URL.

my Getting Started page home page