r/p5.js-web-editor
1
0
Fork 0
Code Issues 1 Pull requests Releases 1 Wiki Activity

fixes #537 (#544)

Browse source 
Commented out hello p5 video page.
Did not remove the features as it can be used again after revamping the hello p5 page.
This commit is contained in:
Himanshu 2018-02-16 01:13:32 +05:30 committed by Cassie Tarakajian
parent 6f5472020c
commit 1969c48cce
2 changed files with 30 additions and 27 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
client/modules/IDE/components/About.jsx
View file

@ -10,7 +10,8 @@ function About(props) {
<div className="about__content">
<div className="about__content-column">
<InlineSVG className="about__logo" src={squareLogoUrl} alt="p5js Square Logo" />
<p className="about__play-video">
{/* Video button to hello p5 video page */}
{/* <p className="about__play-video">
<a
href="http://hello.p5js.org/"
target="_blank"
@ -18,7 +19,7 @@ function About(props) {
>
<InlineSVG className="about__play-video-button" src={playUrl} alt="Play Hello Video" />
Play hello! video</a>
</p>
</p> */}
</div>
<div className="about__content-column">
<h3 className="about__content-column-title">New to p5.js?</h3>

52
client/styles/components/_about.scss
View file

@ -6,32 +6,34 @@
}
}
.about__play-video {
padding-top: #{9 / $base-font-size}rem;
padding-left: #{5 / $base-font-size}rem;
}
// hello p5 video link button css
.about__play-video-button {
@include themify() {
@extend %toolbar-button;
width: #{32 / $base-font-size}rem;
height: #{32 / $base-font-size}rem;
line-height: #{34 / $base-font-size}rem;
border-radius: #{24 / $base-font-size}rem;
background-color: $about-play-background-color;
border: solid 0.5px $about-button-border-color;
&:hover {
border-color: getThemifyVariable('button-background-hover-color');
}
}
padding-left: 2px;
margin-right: #{9 / $base-font-size}rem;
svg {
width: #{11 / $base-font-size}rem;
height: #{11 / $base-font-size}rem;
margin-left: #{1 / $base-font-size}rem;
}
}
// .about__play-video {
// padding-top: #{9 / $base-font-size}rem;
// padding-left: #{5 / $base-font-size}rem;
// }
// .about__play-video-button {
// @include themify() {
// @extend %toolbar-button;
// width: #{32 / $base-font-size}rem;
// height: #{32 / $base-font-size}rem;
// line-height: #{34 / $base-font-size}rem;
// border-radius: #{24 / $base-font-size}rem;
// background-color: $about-play-background-color;
// border: solid 0.5px $about-button-border-color;
// &:hover {
// border-color: getThemifyVariable('button-background-hover-color');
// }
// }
// padding-left: 2px;
// margin-right: #{9 / $base-font-size}rem;
// svg {
// width: #{11 / $base-font-size}rem;
// height: #{11 / $base-font-size}rem;
// margin-left: #{1 / $base-font-size}rem;
// }
// }
.about__content {
display: flex;