Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Passing this challenge is very tricky - this can cause confusion #15012

Closed
owususamuel opened this issue May 23, 2017 · 13 comments

Comments

@owususamuel
Copy link

commented May 23, 2017

Challenge create-a-more-complex-shape-using-css-and-html has an issue.
User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/58.0.3029.110 Safari/537.36.
Please describe how to reproduce this issue, and include links to screenshots if possible.

<style>
.heart {
  position: absolute;
  margin: auto;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-color: pink;
  height: 50px;
  width: 50px;
  transform: rotate(-45deg);
}
.heart:after {
  background-color: pink;
  content: "";
  border-radius: 50%;
  position: absolute;
  width: 50px;
  height: 50px;
  top: 0px;
  left: 25px;
}
.heart:before {
  content: "";  // when you add any extra space outside the empty string will not pass this challenge
  background-color: pink;
  border-radius: 50%;
  position: absolute;
  width: 50px;
  height: 50px;
  top: -25px;
  left: 0px;
}
</style>
<div class = "heart"></div>

content: ""; // when you addany extra space outside the empty string will not pass this challenge. Can't you add any whitespace?

@owususamuel owususamuel changed the title Passing this challenge is very tricky - this could cause confusion Passing this challenge is very tricky - this can cause confusion May 23, 2017

@texas2010 texas2010 added the beta label May 23, 2017

@ghost

This comment has been minimized.

Copy link

commented May 26, 2017

I believe this is by intention, rather than being a bug.

You can, but you would do so using a few different means such as margin, padding, or positioning depending on the situation and what you are trying to accomplish. The content attribute of the :before and :after attributes would not interpret arbitrary white space in the way I believe you are asking.

@ahmadabdolsaheb

This comment has been minimized.

Copy link
Member

commented Feb 6, 2018

@owususamuel I see what you mean, the tests are too strict. I could fix this if a moderator approves that the tests need to be changed. @BerkeleyTrue

@QuincyLarson

This comment has been minimized.

Copy link
Contributor

commented Jun 3, 2018

@ahmadabdolsaheb @owususamuel We just launched the new curriculum and learning platform. Please take a look at it: learn.freecodecamp.org

Do you still think this challenge is confusing or overly hard? If so, we would welcome improvements to this challenge.

@ahmadabdolsaheb

This comment has been minimized.

Copy link
Member

commented Jun 3, 2018

@QuincyLarson I will look into the tests tomorrow.

@QuincyLarson QuincyLarson removed the beta label Jun 3, 2018

@QuincyLarson

This comment has been minimized.

Copy link
Contributor

commented Jun 3, 2018

@ahmadabdolsaheb You're the man. Thanks! Please keep us posted 👍

@ahmadabdolsaheb

This comment has been minimized.

Copy link
Member

commented Jun 4, 2018

@QuincyLarson, I will prepared this and a couple of others for first timers. If the issue is not taken in a couple of days, I will come back and fix them. Let me know if you want me to fix them immediately

The location of the test that needs to be changed:

"testString": "assert(code.match(/\\.heart:before\\s*?{\\s*?content:\\s*?(\"|')\\1;/gi), 'The <code>content</code> of the <code>heart:before</code> selector should be an empty string.');"

the new line should be:

"testString": "assert(code.match(/\.heart:before\s*?{[\s\S]content:\s?\"\"\s*?;/gi), 'The content of the heart:before selector should be an empty string.');"

@ahmadabdolsaheb

This comment has been minimized.

Copy link
Member

commented Jun 4, 2018

FYI @QuincyLarson, on the issues page it encourages fist timers to search for the "good first issue" label which does not exist. It should say "first timers welcome"
screen shot 2018-06-04 at 17 13 42

@prateek3255

This comment has been minimized.

Copy link
Contributor

commented Jun 9, 2018

Does the issue still exist if not then I would like to work on it?

@ahmadabdolsaheb

This comment has been minimized.

Copy link
Member

commented Jun 13, 2018

@prateek3255 sorry for the late response. Yes it is open.

@QuincyLarson

This comment has been minimized.

Copy link
Contributor

commented Jun 14, 2018

@ahmadabdolsaheb could you link me to the page where you're seeing this?

Then I can update it.

@ahmadabdolsaheb

This comment has been minimized.

Copy link
Member

commented Jun 14, 2018

@QuincyLarson, https://github.com/freeCodeCamp/freeCodeCamp/issues
It is on the issues page when I sign in with my moderator account.

@prateek3255

This comment has been minimized.

Copy link
Contributor

commented Jun 14, 2018

@ahmadabdolsaheb please review my PR #17571 regarding this issue.

@QuincyLarson

This comment has been minimized.

Copy link
Contributor

commented Jun 16, 2018

@ahmadabdolsaheb OK - thanks for letting me know - I still can't see it for some reason so you would be a better person to QA this.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
5 participants
You can’t perform that action at this time.