mirror of
https://github.com/scratchfoundation/scratchx.git
synced 2025-02-17 19:30:20 -05:00
Final tweaks from @kaschm
This commit is contained in:
Ray Schamp
parent
6471daa634
commit
5ba04659e7
4 changed files with 67 additions and 65 deletions
|
|
@ -1493,29 +1493,30 @@ body.page-home > main > header {
|
|||
overflow: hidden; }
|
||||
.featured-extension > a {
|
||||
position: relative;
|
||||
display: block; }
|
||||
.featured-extension > a img {
|
||||
display: block;
|
||||
height: 107px; }
|
||||
.featured-extension > a .tryit {
|
||||
display: inline-block;
|
||||
position: absolute;
|
||||
background-color: #24a3ec;
|
||||
color: #fff;
|
||||
padding: 0 1em;
|
||||
border-radius: 1em;
|
||||
top: 0.375em;
|
||||
right: 0.375em; }
|
||||
.featured-extension > section {
|
||||
display: block;
|
||||
font-weight: normal; }
|
||||
.featured-extension img {
|
||||
display: block;
|
||||
height: 107px; }
|
||||
.featured-extension .tryit {
|
||||
display: inline-block;
|
||||
position: absolute;
|
||||
background-color: #24a3ec;
|
||||
color: #fff;
|
||||
padding: 0 1em;
|
||||
border-radius: 1em;
|
||||
top: 0.375em;
|
||||
right: 0.375em; }
|
||||
.featured-extension section {
|
||||
background-color: #fff;
|
||||
color: #58595b;
|
||||
padding: 0.75em;
|
||||
line-height: 1; }
|
||||
.featured-extension > section h2 {
|
||||
.featured-extension section h2 {
|
||||
color: #24a3ec;
|
||||
margin-bottom: 0;
|
||||
font-size: 1.1em; }
|
||||
.featured-extension > section p {
|
||||
.featured-extension section p {
|
||||
text-align: left;
|
||||
font-size: 0.9em;
|
||||
margin-bottom: 0; }
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
62
index.html
62
index.html
|
|
@ -38,38 +38,38 @@
|
|||
<li class="featured-extension">
|
||||
<a href="?url=https://technoboy10.github.io/twitter/extension.js" data-action="load-url">
|
||||
<img src="images/extensions/twitter_small.png" />
|
||||
<section>
|
||||
<h2>Twitter</h2>
|
||||
<p class="author">Connor Hudson and Kreg Hanning</p>
|
||||
</section>
|
||||
</a>
|
||||
<section>
|
||||
<h2>Twitter</h2>
|
||||
<p class="author">Connor Hudson and Kreg Hanning</p>
|
||||
</section>
|
||||
</li>
|
||||
<li class="featured-extension">
|
||||
<a href="?url=http://ericrosenbaum.github.io/tone-synth-extension/examples/Bouncing%20Synth%20Ball.sbx" data-action="load-url">
|
||||
<img src="images/extensions/tonesynth_small.png" />
|
||||
<section>
|
||||
<h2>Sound Synthesizer</h2>
|
||||
<p class="author">Eric Rosenbaum</p>
|
||||
</section>
|
||||
</a>
|
||||
<section>
|
||||
<h2>Sound Synthesizer</h2>
|
||||
<p class="author">Eric Rosenbaum</p>
|
||||
</section>
|
||||
</li>
|
||||
<li class="featured-extension">
|
||||
<a href="?url=http://sayamindu.github.io/scratch-extensions/text-to-speech/TalkingGobo.sbx" data-action="load-url">
|
||||
<img src="images/extensions/texttospeech_small.png" />
|
||||
<section>
|
||||
<h2>Text to Speech</h2>
|
||||
<p class="author">Sayamindu Dasgupta</p>
|
||||
</section>
|
||||
</a>
|
||||
<section>
|
||||
<h2>Text to Speech</h2>
|
||||
<p class="author">Sayamindu Dasgupta</p>
|
||||
</section>
|
||||
</li>
|
||||
<li class="featured-extension">
|
||||
<a href="?url=http://khanning.github.io/scratch-arduino-extension/arduino_extension.js" data-action="load-url">
|
||||
<img src="images/extensions/arduino_small.png" />
|
||||
<section>
|
||||
<h2>Arduino</h2>
|
||||
<p class="author">Kreg Hanning, David Mellis</p>
|
||||
</section>
|
||||
</a>
|
||||
<section>
|
||||
<h2>Arduino</h2>
|
||||
<p class="author">Kreg Hanning, David Mellis</p>
|
||||
</section>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
|
|
@ -124,7 +124,7 @@
|
|||
<h1>Gallery of Experimental Extensions</h1>
|
||||
<p>With Experimental Extensions, you can create Scratch projects that connect with external hardware and online resources. Try examples below to see the wide variety of things you can do with Experimental Extensions!</p>
|
||||
|
||||
<p>If you are a developer with an extension that you'd like to submit to our gallery, read more about the <a href="https://github.com/LLK/scratchx/wiki#how-do-i-submit-my-extension-for-consideration-on-scratchx">submission process here</a>.</p>
|
||||
<p>If you are a developer with an extension that you'd like to submit to our gallery, read more about the <a href="https://github.com/LLK/scratchx/wiki#how-do-i-submit-my-extension-for-consideration-on-scratchx" target="_blank">submission process here</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
|
@ -143,10 +143,10 @@
|
|||
<section class="description">
|
||||
<p>Control Arduino boards</p>
|
||||
<a href="http://khanning.github.io/scratch-arduino-extension/examples/Arduino%20Example%20-%20Blink%20a%20LED.sbx" data-action="load-url">Sample Project</a>
|
||||
<a href="http://khanning.github.io/scratch-arduino-extension/">Documentation</a>
|
||||
<a href="http://khanning.github.io/scratch-arduino-extension/" target="_blank">Documentation</a>
|
||||
</section>
|
||||
<section class="tags">
|
||||
<span class="tag hardware" data-action="load-url">Sample Project</span>
|
||||
<span class="tag hardware" title="Hardware Extension">Requires Hardware</span>
|
||||
</section>
|
||||
</li>
|
||||
<li>
|
||||
|
|
@ -160,7 +160,7 @@
|
|||
<section class="description">
|
||||
<p>Broadcast messages to other projects!</p>
|
||||
<a href="?url=http://technoboy10.tk/mesh/mesh.sbx" data-action="load-url">Sample Project</a>
|
||||
<a href="http://technoboy10.tk/mesh/">Documentation</a>
|
||||
<a href="http://technoboy10.tk/mesh/" target="_blank">Documentation</a>
|
||||
</section>
|
||||
<section class="tags">
|
||||
<span class="tag web" title="Web Extension">Requires Internet Connection</span>
|
||||
|
|
@ -177,7 +177,7 @@
|
|||
<section class="description">
|
||||
<p>Hand Gestures, face tracking, voice commands</p>
|
||||
<a href="http://intel-realsense-extension-for-scratch.github.io/public/extension/samples/simplest-realsense-blocks.sbx" data-action="load-url">Sample Project</a>
|
||||
<a href="http://intel-realsense-extension-for-scratch.github.io/public">Documentation</a>
|
||||
<a href="http://intel-realsense-extension-for-scratch.github.io/" target="_blank">Documentation</a>
|
||||
</section>
|
||||
<section class="tags">
|
||||
<span class="tag hardware" title="Hardware Extension">Requires Hardware</span>
|
||||
|
|
@ -194,7 +194,7 @@
|
|||
<section class="description">
|
||||
<p>International Space Station tracker</p>
|
||||
<a href="http://khanning.github.io/scratch-isstracker-extension/examples/ISS%20Tracker.sbx" data-action="load-url">Sample Project</a>
|
||||
<a href="http://khanning.github.io/scratch-isstracker-extension/">Documentation</a>
|
||||
<a href="http://khanning.github.io/scratch-isstracker-extension/" target="_blank">Documentation</a>
|
||||
</section>
|
||||
<section class="tags">
|
||||
<span class="tag web" title="Web Extension">Requires Internet Connection</span>
|
||||
|
|
@ -211,7 +211,7 @@
|
|||
<section class="description">
|
||||
<p>Hand and finger tracking</p>
|
||||
<a href="http://khanning.github.io/scratch-leapmotion-extension/examples/Leap%20Motion%20Example%20-%20Hand%20Skeleton.sbx" data-action="load-url">Sample Project</a>
|
||||
<a href="http://khanning.github.io/scratch-leapmotion-extension/">Documentation</a>
|
||||
<a href="http://khanning.github.io/scratch-leapmotion-extension/" target="_blank">Documentation</a>
|
||||
</section>
|
||||
<section class="tags">
|
||||
<span class="tag hardware" title="Hardware Extension">Requires Hardware</span>
|
||||
|
|
@ -228,7 +228,7 @@
|
|||
<section class="description">
|
||||
<p>Control littleBits creations</p>
|
||||
<a href="http://khanning.github.io/scratch-littlebits-extension/examples/littleBits%20-%20Move%20with%20Dimmer.sbx" data-action="load-url">Sample Project</a>
|
||||
<a href="http://khanning.github.io/scratch-littlebits-extension/">Documentation</a>
|
||||
<a href="http://khanning.github.io/scratch-littlebits-extension/" target="_blank">Documentation</a>
|
||||
</section>
|
||||
<section class="tags">
|
||||
<span class="tag hardware" title="Hardware Extension">Requires Hardware</span>
|
||||
|
|
@ -245,7 +245,7 @@
|
|||
<section class="description">
|
||||
<p>Synthesize sound effects and music</p>
|
||||
<a href="?url=http://ericrosenbaum.github.io/tone-synth-extension/examples/Bouncing%20Synth%20Ball.sbx" data-action="load-url">Sample Project</a>
|
||||
<a href="http://ericrosenbaum.github.io/tone-synth-extension">Documentation</a>
|
||||
<a href="http://ericrosenbaum.github.io/tone-synth-extension" target="_blank">Documentation</a>
|
||||
</section>
|
||||
<section class="tags">
|
||||
<span class="tag web" title="Web Extension">Requires Internet Connection</span>
|
||||
|
|
@ -262,7 +262,7 @@
|
|||
<section class="description">
|
||||
<p>Use Scratch to read text out loud</p>
|
||||
<a href="?url=http://sayamindu.github.io/scratch-extensions/text-to-speech/TalkingGobo.sbx" data-action="load-url">Sample Project</a>
|
||||
<a href="http://sayamindu.github.io/scratch-extensions/text-to-speech">Documentation</a>
|
||||
<a href="http://sayamindu.github.io/scratch-extensions/text-to-speech" target="_blank">Documentation</a>
|
||||
</section>
|
||||
<section class="tags">
|
||||
<span class="tag web" title="Web Extension">Requires Internet Connection</span>
|
||||
|
|
@ -279,7 +279,7 @@
|
|||
<section class="description">
|
||||
<p>Use Twitter in your projects!</p>
|
||||
<a href="?url=https://technoboy10.github.io/twitter/extension.js" data-action="load-url">Sample Project</a>
|
||||
<a href="http://technoboy10.tk/twitter/">Documentation</a>
|
||||
<a href="http://technoboy10.tk/twitter/" target="_blank">Documentation</a>
|
||||
</section>
|
||||
<section class="tags">
|
||||
<span class="tag web" title="Web Extension">Requires Internet Connection</span>
|
||||
|
|
@ -296,7 +296,7 @@
|
|||
<section class="description">
|
||||
<p>Control for Arduino, <acronym title="Raspberry Pi">RPi</acronym> and <acronym title="BeagleBone Black">BBB</acronym></p>
|
||||
<a href="https://github.com/MrYsLab/xi/blob/master/clients/scratch/projects/blink.sbx" data-action="load-url">Sample Project</a>
|
||||
<a href="https://github.com/MrYsLab/xi">Documentation</a>
|
||||
<a href="https://github.com/MrYsLab/xi" target="_blank">Documentation</a>
|
||||
</section>
|
||||
<section class="tags">
|
||||
<span class="tag hardware" title="Hardware Extension">Requires Hardware</span>
|
||||
|
|
@ -369,13 +369,13 @@
|
|||
<p>The Scratch Team has created ScratchX to enable people to create and test Experimental Extensions. However, the Scratch Team does not endorse, support or maintain specific Experimental Extensions. People using Experimental Extensions should be careful not to provide any personal details such as login passwords or personally-identifiable information if prompted by an Experimental Extension.</p>
|
||||
|
||||
<h2 id="faq-how-to-use-scratchx">How do I use ScratchX?</h2>
|
||||
<p>There are three pathways into ScratchX. If you have been given or sent a .sbx file, you can load that into ScratchX via the homepage (look for 'Open an Extension Project'). If you have been sent a ScratchX URL (starts with 'scratchx.org/'), you can click your link and the extension will load automatically, or you can enter that URL into the box on the homepage (look for 'Open an Extension URL'). Lastly, if you don't have an example extension, you can try out one on the site by clicking on a Featured Experimental Extension on the homepage (look for 'Featured Extensions').</p>
|
||||
<p>There are three pathways into ScratchX. If you have been given or sent a .sbx file, you can load that into ScratchX via the homepage (look for 'Open an Extension Project'). If you have been sent a ScratchX URL (starts with 'scratchx.org/'), you can click your link and the extension will load automatically, or you can enter that URL into the box on the homepage (look for 'Open an Extension URL'). Lastly, if you don't have an example extension, you can try out one on the site by visiting the <a href="#extensions">Gallery page</a> and clicking on an example extension there.</p>
|
||||
|
||||
<h2 id="faq-how-to-share">I made a cool project on ScratchX. How do I share it?</h2>
|
||||
<p>Click the 'Save' button at the top of the page to download your project as an .sbx file on to your local computer. You can then send this file to other people, and they can upload your file onto ScratchX to play with your project.</p>
|
||||
|
||||
<h2 id="faq-examples">Where can I find example Experimental Extensions to play around with?</h2>
|
||||
<p>We have linked to a few example extensions on the <a href="#home">ScratchX</a> homepage. We plan to highlight additional extensions in the coming months.</p>
|
||||
<p>You can find a list of example extensions in the <a href="#extensions">ScratchX Gallery</a>. We plan to add more extensions to this page in the coming months.</p>
|
||||
|
||||
<h2 id="faq-scratchx-url">What is a ScratchX URL?</h2>
|
||||
<p>Developers who make extensions for ScratchX can choose to create a custom web address or URL that points to their extension and/or demo project. Clicking on a ScratchX extension URL will take you directly to a project with an extension loaded.</p>
|
||||
|
|
@ -437,7 +437,7 @@
|
|||
<li><a href="http://www.scratchjr.org/">ScratchJr</a></li>
|
||||
<li><a href="https://scratch.mit.edu/conference/">Scratch Conference</a></li>
|
||||
<li><a href="http://day.scratch.mit.edu/">Scratch Day</a></li>
|
||||
<li><a href="http://codetolearn.org/">Scratch Foundation</a></li>
|
||||
<li><a href="http://scratchfoundation.org/">Scratch Foundation</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -242,25 +242,26 @@ body.page-home > main > header {
|
|||
> a {
|
||||
position: relative;
|
||||
display: block;
|
||||
|
||||
img {
|
||||
display: block;
|
||||
height: 107px;
|
||||
}
|
||||
|
||||
.tryit {
|
||||
display: inline-block;
|
||||
position: absolute;
|
||||
background-color: $bright-blue;
|
||||
color: $white;
|
||||
padding: 0 1em;
|
||||
border-radius: 1em;
|
||||
top: $vertical-base;
|
||||
right: $vertical-base;
|
||||
}
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
> section {
|
||||
img {
|
||||
display: block;
|
||||
height: 107px;
|
||||
}
|
||||
|
||||
.tryit {
|
||||
display: inline-block;
|
||||
position: absolute;
|
||||
background-color: $bright-blue;
|
||||
color: $white;
|
||||
padding: 0 1em;
|
||||
border-radius: 1em;
|
||||
top: $vertical-base;
|
||||
right: $vertical-base;
|
||||
}
|
||||
|
||||
section {
|
||||
background-color: $white;
|
||||
color: $base-font-color;
|
||||
padding: 2 * $vertical-base;
|
||||
|
|
|
|||
Loading…
Reference in a new issue