A UserScript that will make the Scratch website look like it did before 2015.
Scratch 3 to 2 by 09878901234321
Details
Author09878901234321
LicenseNo License
Categoryscratch.mit.edu
Created
Updated
Code size117 kB
Code checksum2e612651
Statistics
Learn how we calculate statistics in the FAQ.
Failed to fetch stats.
Description
Notes
Scratch 3 to 2
This is not consistently being updated. Sorry! This is a decision by me as I no longer have much interest in this project. Anyone is free to use this code as they please.
Instead of using this, I recommend using the Scratch Addons 3.0 -> 2.0 addon, and using the 2.0 custom colors. Those do not have all of the functionality that my extension does, but they do have some improvements over mine, and will likely be consistently updated.
Credit to:
Source code
Source code has over 10K characters, so we truncated it. You can inspect the full source code on install link./* ==UserStyle==
@name Scratch 3 to 2
@namespace https://github.com/09878901234321/Scratch-2-to-3/
@version 0.1
@license none
@description Reverts 3.0 pages into 2.0!
@author 09878901234321
@preprocessor stylus
==/UserStyle== */
@-moz-document domain("scratch.mit.edu") {
/*2013 padding logo*/
#navigation .logo {
margin-right: 4px !important;
}
pan.scratch {
width: 84px !important;
}
/*big title size*/
.project-title.no-edit,
.studio-info .studio-title {
font-size: 24px !important;
font-weight: 500 !important;
line-height: 1.5em !important;
}
.preview .project-header .inplace-input {
margin-top: 7px !important;
}
.flex-row.project-header {
min-height: 58px;
}
.studio-info .studio-title {
top: -4.95rem;
}
.flex-row.project-header .title {
padding-left: 3px;
}
.button.see-inside-button {
margin-top: 9px !important;
}
.preview .guiPlayer {
margin-left: 16px;
margin-right: 0;
}
/*2013 avatar padding studio*/
.studio-compose-container .flex-row.comment-container .avatar {
padding-right: 2px;
}
/*texts before*/
button.button.action-button.report-button::after {
content: " this";
}
button.button.action-button.copy-link-button,
button.button.action-button.studio-button {
font-size: 0 !important;
}
button.button.action-button.copy-link-button::after {
content: "Embed";
font-size: 13px;
line-height: 23px;
}
button.button.action-button.studio-button::after {
content: "Studios";
font-size: 13px;
line-height: 23px;
}
button.button.action-button {
width: 4.8rem;
}
.studio-info .studio-info-footer-report button {
width: 111px;
}
.studio-info .studio-info-footer-report button::after {
content: " this studio";
}
.dropdown.with-arrow.open a[href="/accounts/password_reset/"]:before {
content: "Forgot password?";
font-size: 13px;
position: relative;
top: -2px;
left: 2px;
}
button.button.action-button.report-button {
width: 6rem !important;
left: 10.5rem !important;
}
.action-buttons-overflow-fix .button.action-button.submit-button:first-child::before {
content: "Cancel";
margin-left: -3px;
font-size: 13px;
}
.action-buttons-overflow-fix .button.action-button.submit-button:first-child {
font-size: 0;
display: inline-flex;
}
.studio-info .studio-info-footer-report button {
left: -13px;
}
.compose-limit.compose-valid::before {
content: "You have ";
}
.thumbnail-creator a:before {
content: "by ";
}
.studio-project-username::before {
color: #666;
content: "by ";
}
/*features before*/
.featured-project-heading {
display: none;
}
.player .title::before {
content: "FEATURED:";
font-weight: bold;
font-size: 15px;
}
#profile-box .player [data-control="edit"] {
top: 5px;
}
/* homepage in may 2013 style */
.box {
box-shadow: 0 2px 3px rgba(34, 25, 25, 0.3);
}
.box-header h4 {
text-shadow: 0 1px #fff;
margin-top: 2px;
font-size: 1.0rem;
}
.slick-list .thumbnail.gallery .thumbnail-image img {
border: 1px solid #ddd !important;
margin-top: 4px;
width: 168px !important;
height: 96px !important;
padding: 6px;
padding-left: 6px;
padding-right: 5px;
}
.slick-list .thumbnail-creator a {
font-weight: 1 !important;
}
.box .box-header {
background-color: #f7f7f7;
padding: 6px 20px;
height: 22px;
}
.thumbnail .thumbnail-loves::before,
.thumbnail .thumbnail-remixes::before {
background-image: url(http://cdn.scratch.mit.edu/scratchr2/static/__1385142220__/images/icons_xs.d77c1366cd05.png);
background-position: -7px -58px;
background-size: 2.06rem;
position: relative;
left: -3px;
}
.thumbnail .thumbnail-remixes::before {
background-position: -7px -182px;
}
.thumbnail-loves,
.thumbnail-remixes {
font-size: 11px !important;
padding-left: 3px;
position: relative;
top: -1px;
}
.box-content .carousel .slick-list .slick-track .thumbnail.gallery .thumbnail-image::after {
top: -35px;
left: 8.2rem;
}
.slick-track .thumbnail .thumbnail-title a {
font-weight: 700;
}
.box .box-content {
padding-top: 0;
}
.tabs-content {
padding-top: 10px !important;
}
.slick-track .thumbnail.project {
width: 146px;
}
.slick-track .thumbnail.gallery.slick-slide.slick-active .thumbnail-image::before {
content: "";
width: 167px !important;
height: 95px;
border: 1px solid #ddd;
display: block;
position: fixed;
top: 7px;
margin-left: 6px;
}
.flex-row.action-buttons {
direction: rtl;
}
.carousel .slick-prev::before,
.carousel .slick-next::before {
background-image: unset;
content: "‹";
color: #1aa0d8;
font-family: Verdana;
font-size: 60px;
opacity: 0.5 !important;
}
.carousel .slick-next::before {
content: "›";
}
.carousel .slick-prev:hover::before,
.carousel .slick-next:hover::before {
opacity: 0.8 !important;
}
.slick-arrow.slick-prev.slick-disabled::before {
color: #CCC;
cursor: auto;
}
.carousel .slick-next,
.carousel .slick-prev {
margin-top: -32px;
}
.box-header a {
font-size: 0.9em;
font-weight: normal;
position: relative;
top: -3px;
}
/* studio bit improved */
.studio-adder-section .studio-adder-row button:nth-child(2) {
left: 56.1% !important;
position: absolute;
top: 48px !important;
border-radius: 0 5px 5px 0 !important;
}
.studio-adder-section .studio-adder-row input {
width: 52.8% !important;
border-radius: 5px 0 0 5px;
}
.studio-adder-section .studio-adder-row button:nth-child(4) {
margin-left: -7px;
}
.studio-members + .studio-members button.button {
left: 55.8% !important;
}
#navigation .logo a {
background-image: url("https://cdn.scratch.mit.edu/scratchr2/static/__5d56a1729a208cd66a981fc9a4c62225__/images/logo_sm.png");
top: 6px;
transition: none;
background-size: unset;
left: -0.08rem;
height: 23px !important;
position: relative;
margin-right: 0;
}
#navigation .logo a:hover {
background-image: url("https://cdn.scratch.mit.edu/scratchr2/static/__5d56a1729a208cd66a981fc9a4c62225__/images/logo_sm_highlight.png");
transition: none;
background-size: unset;
background-color: unset !important;
}
#navigation {
background-color: #0f8bc0 !important;
height: 35px;
box-shadow: 0 1px 1px #ccc;
}
#navigation a {
top: -8px;
position: relative;
}
#navigation li a {
border-left: 1px solid #149acb;
height: 25px !important;
}
#navigation .link > a:hover,
.ignore-react-onclickoutside.user-info:hover,
.ignore-react-onclickoutside.user-info.open,
.dropdown.production.open a:hover,
.overflow-menu-container .overflow-menu-dropdown li button:hover {
background-color: #0c6185 !important;
}
.link.about a {
border-right: 1px solid #149acb;
}
#navigation .link > a {
font-weight: unset;
line-height: 25px;
font-size: 15px;
}
#navigation .inner > ul > li.search .btn-search {
background-image: url("https://cdn.scratch.mit.edu/scratchr2/static/__5d56a1729a208cd66a981fc9a4c62225__/images/nav-search-glass.png");
padding: 0;
border-right: 1px solid #ccc;
height: 22px !important;
opacity: .8;
z-index: 1;
background-size: 15px;
width: 28px;
margin-top: 6px;
background-position: 8px 4px;
margin-left: 2px;
}
li.search {
margin: 0 0 0 3px !important;
}
.form {
margin-left: 6px !important;
}
::placeholder {
color: #767676 !important;
}
#navigation .inner > ul > li.search .input[type="text"] {
height: 22px;
background-color: #fff!important;
color: #555;
border-radius: 10px;
margin-top: 6px;
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
font-size: 13px;
padding-left: 33.1px;
margin-left: 1px;
padding-right: 5px;
line-height: 24px;
}
#navigation .inner > ul > li.search .input[type="text"]:focus {
background-color: #fff;
color: #555;
}
#navigation .messages > a {
background-image: url("https://cdn.scratch.mit.edu/scratchr2/static/__5d56a1729a208cd66a981fc9a4c62225__/images/nav-notifications.png");
background-size: unset;
height: 26px !important;
background-position: 10px 18px;
width: 22px;
}
#navigation .mystuff > a {
background-image: url("https://cdn.scratch.mit.edu/scratchr2/static/__5d56a1729a208cd66a981fc9a4c62225_...