Merge pull request #8865 from MiroslavDionisiev/UEPR-67
[UEPR-67] restyle community guidelines page
|
@ -37,6 +37,7 @@ $ui-purple-10percent: hsla(260, 60%, 60%, .1);
|
|||
$ui-purple-25percent: hsla(260, 60%, 60%, .25);
|
||||
$ui-magenta: hsla(300, 53%, 60%, 1); /* #CF63CF Sounds Primary */
|
||||
$ui-magenta-dark: hsla(300, 48%, 50%, 1); /* #BD42BD Sounds Tertiary */
|
||||
$ui-light-grayish-blue: hsla(215, 76%, 95%, 1);
|
||||
|
||||
$ui-yellow: hsla(45, 100%, 50%, 1); // #FFBF00 Events Primary
|
||||
$ui-coral: hsla(350, 100%, 70%, 1); // #FF6680 More Blocks Primary
|
||||
|
|
|
@ -1,50 +1,179 @@
|
|||
const FormattedMessage = require('react-intl').FormattedMessage;
|
||||
const React = require('react');
|
||||
|
||||
const Box = require('../../components/box/box.jsx');
|
||||
|
||||
const Page = require('../../components/page/www/page.jsx');
|
||||
const render = require('../../lib/render.jsx');
|
||||
const {useIntl} = require('react-intl');
|
||||
|
||||
require('./guidelines.scss');
|
||||
|
||||
const Guidelines = () => (
|
||||
<div className="inner guidelines">
|
||||
<Box
|
||||
title={
|
||||
<FormattedMessage id="guidelines.title" />
|
||||
}
|
||||
>
|
||||
<p>
|
||||
<FormattedMessage id="guidelines.header1" />
|
||||
<strong><FormattedMessage id="guidelines.header2" /></strong>
|
||||
<FormattedMessage id="guidelines.header3" />
|
||||
</p>
|
||||
<dl>
|
||||
<dt><FormattedMessage id="guidelines.respectheader" /></dt>
|
||||
<dd><FormattedMessage id="guidelines.respectbody" /></dd>
|
||||
<dt><FormattedMessage id="guidelines.privacyheader" /></dt>
|
||||
<dd><FormattedMessage id="guidelines.privacybody" /></dd>
|
||||
<dt><FormattedMessage id="guidelines.helpfulheader" /></dt>
|
||||
<dd><FormattedMessage id="guidelines.helpfulbody" /></dd>
|
||||
<dt><FormattedMessage id="guidelines.remixheader" /></dt>
|
||||
<dd>
|
||||
<em><FormattedMessage id="guidelines.remixbody1" /></em><br />
|
||||
<FormattedMessage id="guidelines.remixbody2" />
|
||||
</dd>
|
||||
<dt><FormattedMessage id="guidelines.honestyheader" /></dt>
|
||||
<dd><FormattedMessage id="guidelines.honestybody" /></dd>
|
||||
<dt><FormattedMessage id="guidelines.friendlyheader" /></dt>
|
||||
<dd><FormattedMessage id="guidelines.friendlybody" /></dd>
|
||||
</dl>
|
||||
<div className="guidelines-footer">
|
||||
<img
|
||||
alt="sprites"
|
||||
src="//cdn.scratch.mit.edu/scratchr2/static/images/help/spritesforcommunityguid.png"
|
||||
/>
|
||||
</div>
|
||||
</Box>
|
||||
</div>
|
||||
);
|
||||
const pageSections = [
|
||||
{
|
||||
id: 'respect',
|
||||
headerTextId: 'guidelines.respectheader',
|
||||
contentTexts: [
|
||||
{id: 'guidelines.respectbody1'},
|
||||
{id: 'guidelines.respectbody2'}
|
||||
],
|
||||
sectionImgSrc: '/svgs/guidelines/illustration_respect.svg',
|
||||
sectionImgAltTextId: 'guidelines.respectSectionImageDescription',
|
||||
buttonImgSrc: '/svgs/guidelines/blobblue_respect.svg',
|
||||
buttonImgAltTextId: 'guidelines.respectButtonImageDescription'
|
||||
},
|
||||
{
|
||||
id: 'privacy',
|
||||
headerTextId: 'guidelines.privacyheader',
|
||||
contentTexts: [
|
||||
{id: 'guidelines.privacybody1'},
|
||||
{id: 'guidelines.privacybody2'}
|
||||
],
|
||||
sectionImgSrc: '/svgs/guidelines/illustration_safe.svg',
|
||||
sectionImgAltTextId: 'guidelines.privacySectionImageDescription',
|
||||
buttonImgSrc: '/svgs/guidelines/blobyellow_safe.svg',
|
||||
buttonImgAltTextId: 'guidelines.privacyButtonImageDescription'
|
||||
},
|
||||
{
|
||||
id: 'helpful',
|
||||
headerTextId: 'guidelines.helpfulheader',
|
||||
contentTexts: [
|
||||
{id: 'guidelines.helpfulbody1'},
|
||||
{id: 'guidelines.helpfulbody2'}
|
||||
],
|
||||
sectionImgSrc: '/svgs/guidelines/illustration_feedback.svg',
|
||||
sectionImgAltTextId: 'guidelines.helpfulSectionImageDescription',
|
||||
buttonImgSrc: '/svgs/guidelines/blobmagenta_feedback.svg',
|
||||
buttonImgAltTextId: 'guidelines.helpfulButtonImageDescription'
|
||||
},
|
||||
{
|
||||
id: 'remix',
|
||||
headerTextId: 'guidelines.remixheader',
|
||||
contentTexts: [
|
||||
{id: 'guidelines.remixbody1'},
|
||||
{id: 'guidelines.remixbody2'}
|
||||
],
|
||||
sectionImgSrc: '/svgs/guidelines/illustration_remix.svg',
|
||||
sectionImgAltTextId: 'guidelines.remixSectionImageDescription',
|
||||
buttonImgSrc: '/svgs/guidelines/blobgreen_remix.svg',
|
||||
buttonImgAltTextId: 'guidelines.remixButtonImageDescription'
|
||||
},
|
||||
{
|
||||
id: 'honesty',
|
||||
headerTextId: 'guidelines.honestyheader',
|
||||
contentTexts: [
|
||||
{id: 'guidelines.honestybody1'},
|
||||
{id: 'guidelines.honestybody2'}
|
||||
],
|
||||
sectionImgSrc: '/svgs/guidelines/illustration_honest.svg',
|
||||
sectionImgAltTextId: 'guidelines.honestySectionImageDescription',
|
||||
buttonImgSrc: '/svgs/guidelines/blobpurple_honest.svg',
|
||||
buttonImgAltTextId: 'guidelines.honestyButtonImageDescription'
|
||||
},
|
||||
{
|
||||
id: 'friendly',
|
||||
headerTextId: 'guidelines.friendlyheader',
|
||||
contentTexts: [
|
||||
{id: 'guidelines.friendlybody1'},
|
||||
{id: 'guidelines.friendlybody2'}
|
||||
],
|
||||
sectionImgSrc: '/svgs/guidelines/illustration_friendly.svg',
|
||||
sectionImgAltTextId: 'guidelines.friendlySectionImageDescription',
|
||||
buttonImgSrc: '/svgs/guidelines/blobpink_friendly.svg',
|
||||
buttonImgAltTextId: 'guidelines.friendlyButtonImageDescription'
|
||||
},
|
||||
{
|
||||
id: 'learn-more',
|
||||
headerTextId: 'guidelines.learnMoreheader',
|
||||
contentTexts: [
|
||||
{
|
||||
id: 'guidelines.learnMorebody1',
|
||||
values: {
|
||||
a: chunks => (
|
||||
<a href="https://resources.scratch.mit.edu/www/guides/en/scratch-community-guide.pdf">
|
||||
{chunks}
|
||||
</a>
|
||||
)
|
||||
}
|
||||
},
|
||||
{id: 'guidelines.learnMorebody2'}
|
||||
],
|
||||
sectionImgSrc: '/svgs/guidelines/illustration_learn_more.svg',
|
||||
sectionImgAltTextId: 'guidelines.learnMoreSectionImageDescription'
|
||||
}
|
||||
];
|
||||
|
||||
render(<Page><Guidelines /></Page>, document.getElementById('app'));
|
||||
const Guidelines = () => {
|
||||
const intl = useIntl();
|
||||
|
||||
return (
|
||||
<div className="guidelines-page">
|
||||
<header>
|
||||
<div className="title">
|
||||
<FormattedMessage id="guidelines.title" />
|
||||
</div>
|
||||
<div className="header1">
|
||||
<FormattedMessage id="guidelines.header1" />
|
||||
</div>
|
||||
<div className="header2">
|
||||
<FormattedMessage id="guidelines.header2" />
|
||||
</div>
|
||||
</header>
|
||||
<section className="navigation">
|
||||
<div className="header3">
|
||||
<FormattedMessage id="guidelines.header3" />
|
||||
</div>
|
||||
<section className="navigation-buttons">
|
||||
{pageSections
|
||||
.filter(guide => guide.buttonImgSrc)
|
||||
.map(({id, headerTextId, buttonImgSrc, buttonImgAltTextId}) => (
|
||||
<a
|
||||
key={id}
|
||||
href={`#${id}`}
|
||||
>
|
||||
<img
|
||||
alt={intl.formatMessage({id: buttonImgAltTextId})}
|
||||
src={buttonImgSrc}
|
||||
/>
|
||||
<FormattedMessage id={headerTextId} />
|
||||
</a>
|
||||
))}
|
||||
</section>
|
||||
</section>
|
||||
<section className="inner guidelines">
|
||||
{pageSections.map(
|
||||
({id, headerTextId, contentTexts, sectionImgSrc, sectionImgAltTextId}, index) => (
|
||||
<div
|
||||
id={id}
|
||||
key={id}
|
||||
className={`guideline ${
|
||||
index % 2 === 0 ? 'content-first' : 'image-first'
|
||||
}`}
|
||||
>
|
||||
<div>
|
||||
<div className="guideline-title">
|
||||
<FormattedMessage id={headerTextId} />
|
||||
</div>
|
||||
<p className="first-paragraph">
|
||||
<FormattedMessage {...contentTexts[0]} />
|
||||
</p>
|
||||
<p className="second-paragraph">
|
||||
<FormattedMessage {...contentTexts[1]} />
|
||||
</p>
|
||||
</div>
|
||||
<img
|
||||
alt={intl.formatMessage({id: sectionImgAltTextId})}
|
||||
src={sectionImgSrc}
|
||||
/>
|
||||
</div>
|
||||
)
|
||||
)}
|
||||
</section>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
render(
|
||||
<Page>
|
||||
<Guidelines />
|
||||
</Page>,
|
||||
document.getElementById('app')
|
||||
);
|
||||
|
|
|
@ -1,23 +1,215 @@
|
|||
@import "../../colors";
|
||||
@import "../../frameless";
|
||||
|
||||
.guidelines {
|
||||
.guidelines-footer {
|
||||
margin-top: 1.5rem;
|
||||
text-align: center;
|
||||
#view {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.guidelines-page {
|
||||
header {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
|
||||
background-color: $motion-blue-3;
|
||||
background-image: url('/svgs/guidelines/header_sprinkles_left.svg'), url('/svgs/guidelines/header_sprinkles_right.svg');
|
||||
background-position: left, right;
|
||||
background-repeat: no-repeat;
|
||||
|
||||
padding: 6.25rem 0;
|
||||
|
||||
div {
|
||||
color: $ui-white;
|
||||
text-align: center;
|
||||
font-family: "Helvetica Neue", "Helvetica", Arial, sans-serif;
|
||||
width: 708px;
|
||||
}
|
||||
|
||||
.title {
|
||||
margin-bottom: 2.25rem;
|
||||
font-size: 2.25rem;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.header1, .header2 {
|
||||
font-size: 1.5rem;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.header1 {
|
||||
margin-bottom: 1.5rem;
|
||||
}
|
||||
}
|
||||
|
||||
dl {
|
||||
dt {
|
||||
margin-top: 1.5rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media #{$medium-and-smaller}{
|
||||
.guidelines-footer {
|
||||
img {
|
||||
display: none;
|
||||
.navigation {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
gap: 4.5rem;
|
||||
margin: 6rem 15% 0 15%;
|
||||
padding-bottom: 6rem;
|
||||
|
||||
border-bottom: 1px solid $active-gray;
|
||||
|
||||
.header3 {
|
||||
font-size: 1.25rem;
|
||||
font-weight: 400;
|
||||
font-family: "Helvetica Neue", "Helvetica", Arial, sans-serif;
|
||||
text-align: start;
|
||||
}
|
||||
|
||||
.navigation-buttons {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
grid-template-rows: repeat(3, 1fr);
|
||||
grid-auto-flow: column;
|
||||
column-gap: 2.25rem;
|
||||
row-gap: 1rem;
|
||||
|
||||
a {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 1.875rem;
|
||||
|
||||
padding: 1rem 2rem;
|
||||
|
||||
font-size: 1.125rem;
|
||||
font-weight: 500;
|
||||
font-family: "Helvetica Neue", "Helvetica", Arial, sans-serif;
|
||||
color: $header-gray;
|
||||
text-align: start;
|
||||
word-wrap: break-word;
|
||||
|
||||
border: 1px solid $box-shadow-light-gray;
|
||||
border-radius: 10px;
|
||||
transition: background 0.5s ease-in-out;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
background-color: $ui-light-grayish-blue;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.guidelines {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 12rem;
|
||||
|
||||
margin: 6rem auto;
|
||||
|
||||
.guideline {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 4.5rem;
|
||||
scroll-margin-top: 6rem;
|
||||
|
||||
div, p {
|
||||
font-family: "Helvetica Neue", "Helvetica", Arial, sans-serif;
|
||||
text-align: start;
|
||||
}
|
||||
|
||||
.guideline-title {
|
||||
font-size: 1.5rem;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.first-paragraph {
|
||||
font-size: 1.25rem;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.second-paragraph {
|
||||
font-size: 1rem;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
img {
|
||||
width: $cols4;
|
||||
}
|
||||
|
||||
a {
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
|
||||
.content-first {
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
.image-first {
|
||||
flex-direction: row-reverse;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 1024px) {
|
||||
.guidelines {
|
||||
.guideline {
|
||||
flex-direction: column-reverse;
|
||||
gap: 2.25rem;
|
||||
margin: 0 10%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 768px) {
|
||||
header {
|
||||
background-image: unset;
|
||||
padding: 6.25rem 10%;
|
||||
|
||||
div {
|
||||
width: auto;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 560px) {
|
||||
header {
|
||||
.title {
|
||||
font-size: 2rem;
|
||||
}
|
||||
|
||||
.header1, .header2 {
|
||||
font-size: 1.25rem;
|
||||
}
|
||||
}
|
||||
|
||||
.navigation {
|
||||
.navigation-buttons {
|
||||
grid-template-columns: repeat(1, 1fr);
|
||||
grid-template-rows: unset;
|
||||
grid-auto-flow: unset;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 360px) {
|
||||
header {
|
||||
.title {
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
|
||||
.header1, .header2 {
|
||||
font-size: 1rem;
|
||||
}
|
||||
}
|
||||
|
||||
.navigation {
|
||||
.header3 {
|
||||
font-size: 1rem;
|
||||
}
|
||||
}
|
||||
|
||||
.guidelines {
|
||||
.guideline {
|
||||
.guideline-title {
|
||||
font-size: 1.25rem;
|
||||
}
|
||||
|
||||
.first-paragraph {
|
||||
font-size: 1.125rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -1,19 +1,40 @@
|
|||
{
|
||||
"guidelines.title": "Scratch Community Guidelines",
|
||||
"guidelines.title": "The Purpose of Scratch Community",
|
||||
"guidelines.header1": "Scratch is a friendly and welcoming community for everyone, where people create, share, and learn together.",
|
||||
"guidelines.header2": "We welcome people of all ages, races, ethnicities, religions, abilities, sexual orientations, and gender identities.",
|
||||
"guidelines.header3": "Help keep Scratch a welcoming, supportive, and creative space for all by following these Community Guidelines:",
|
||||
"guidelines.respectheader": "Treat everyone with respect.",
|
||||
"guidelines.respectbody": "Scratchers have diverse backgrounds, interests, identities, and experiences. Everyone on Scratch is encouraged to share things that excite them and are important to them—we hope that you find ways to celebrate your own identity on Scratch, and allow others to do the same. It’s never OK to attack a person or group’s identity or to be unkind to someone about their background or interests.",
|
||||
"guidelines.respectbody1": "Scratchers have diverse backgrounds, interests, identities, and experiences.",
|
||||
"guidelines.respectbody2": "Everyone on Scratch is encouraged to share things that excite them and are important to them—we hope that you find ways to celebrate your own identity on Scratch, and allow others to do the same. It’s never OK to attack a person or group’s identity or to be unkind to someone about their background or interests.",
|
||||
"guidelines.privacyheader": "Be safe: keep personal and contact information private.",
|
||||
"guidelines.privacybody": "For safety reasons, don't give out any information that could be used for private communication, in person or online. This includes sharing real last names, phone numbers, addresses, hometowns, school names, email addresses, usernames or links to social media sites, video chatting applications, or websites with private chat functionality.",
|
||||
"guidelines.privacybody1": "For safety reasons, don't give out any information that could be used for private communication, in person or online.",
|
||||
"guidelines.privacybody2": "This includes sharing real last names, phone numbers, addresses, hometowns, school names, email addresses, usernames or links to social media sites, video chatting applications, or websites with private chat functionality.",
|
||||
"guidelines.helpfulheader": "Give helpful feedback.",
|
||||
"guidelines.helpfulbody": "Everyone on Scratch is learning. When commenting on a project, remember to say something you like about it, offer suggestions, and be kind, not critical. Please keep comments respectful and avoid spamming or posting chain mail. We encourage you to try new things, experiment, and learn from others.",
|
||||
"guidelines.helpfulbody1": "Everyone on Scratch is learning.",
|
||||
"guidelines.helpfulbody2": "When commenting on a project, remember to say something you like about it, offer suggestions, and be kind, not critical. Please keep comments respectful and avoid spamming or posting chain mail. We encourage you to try new things, experiment, and learn from others.",
|
||||
"guidelines.remixheader": "Embrace remix culture.",
|
||||
"guidelines.remixbody1": "Remixing is when you build upon someone else’s projects, code, ideas, images, or anything else they share on Scratch to make your own unique creation.",
|
||||
"guidelines.remixbody2": "Remixing is a great way to collaborate and connect with other Scratchers. You are encouraged to use anything you find on Scratch in your own creations, as long as you provide credit to everyone whose work you used and make a meaningful change to it. And when you share something on Scratch, you are giving permission to all Scratchers to use your work in their creations, too.",
|
||||
"guidelines.honestyheader": "Be honest.",
|
||||
"guidelines.honestybody": "It’s important to be honest and authentic when interacting with others on Scratch, and remember that there is a person behind every Scratch account. Spreading rumors, impersonating other Scratchers or celebrities, or pretending to be seriously ill is not respectful to the Scratch Community.",
|
||||
"guidelines.honestybody1": "It’s important to be honest and authentic when interacting with others on Scratch, and remember that there is a person behind every Scratch account.",
|
||||
"guidelines.honestybody2": "Spreading rumors, impersonating other Scratchers or celebrities, or pretending to be seriously ill is not respectful to the Scratch Community.",
|
||||
"guidelines.friendlyheader": "Help keep the site friendly.",
|
||||
"guidelines.friendlybody": "It’s important to keep your creations and conversations friendly and appropriate for all ages. If you think something on Scratch is mean, insulting, too violent, or otherwise disruptive to the community, click “Report” to let us know about it. Please use the “Report” button rather than engaging in fights, spreading rumors about other people’s behavior, or otherwise responding to any inappropriate content. The Scratch Team will look at your report and take the appropriate action."
|
||||
"guidelines.friendlybody1": "It’s important to keep your creations and conversations friendly and appropriate for all ages.",
|
||||
"guidelines.friendlybody2": "If you think something on Scratch is mean, insulting, too violent, or otherwise disruptive to the community, click “Report” to let us know about it. Please use the “Report” button rather than engaging in fights, spreading rumors about other people’s behavior, or otherwise responding to any inappropriate content. The Scratch Team will look at your report and take the appropriate action.",
|
||||
"guidelines.learnMoreheader": "Want to learn more?",
|
||||
"guidelines.learnMorebody1": "<a>Download the guide</a> for more details!",
|
||||
"guidelines.learnMorebody2": "Discover the limitless potential of the Scratch online community with our guides! These valuable resources are designed to help you navigate and thrive as a Scratcher, revealing everything from setting up your profile to connecting with like-minded individuals. Learn how to connect with others, share your unique creations, and find inspiration for your next project.",
|
||||
"guidelines.respectButtonImageDescription": "A blue circle",
|
||||
"guidelines.privacyButtonImageDescription": "A yellow circle",
|
||||
"guidelines.helpfulButtonImageDescription": "A magenta circle",
|
||||
"guidelines.remixButtonImageDescription": "A green circle",
|
||||
"guidelines.honestyButtonImageDescription": "A purple circle",
|
||||
"guidelines.friendlyButtonImageDescription": "A pink circle",
|
||||
"guidelines.respectSectionImageDescription": "A graphic of two hands grasping each other in a handshake, with a pink heart above them.",
|
||||
"guidelines.privacySectionImageDescription": "A graphic of a blue combination lock lock on a yellow background. Inside the lock is the shape of a head with a question mark printed on the face.",
|
||||
"guidelines.helpfulSectionImageDescription": "A graphic of a piece of paper on top of a pink background. On the paper, there is a Scratch project with a white cat on a blue background. A pink pen with a heart on the cap is drawing a heart and a pencil is writing a comment.",
|
||||
"guidelines.remixSectionImageDescription": "A graphic of the Scratch \"remix\" swirl on a green background. Two hands move orange, blue, and purple Scratch blocks around. A paintbrush paints a green streak.",
|
||||
"guidelines.honestySectionImageDescription": "A graphic of a light blue compass on a purple background. There is a pink heart in the \"North\" position.",
|
||||
"guidelines.friendlySectionImageDescription": "A graphic of 5 hands with different skin tones using their pointer and middle fingers to create a star on a pink background with a pink star and yellow star in the center.",
|
||||
"guidelines.learnMoreSectionImageDescription": "A graphic of a box with a green arrow pointing inside of it with stars in the background."
|
||||
}
|
||||
|
|
1
static/svgs/guidelines/blobblue_respect.svg
Normal file
|
@ -0,0 +1 @@
|
|||
<svg width="45" height="46" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M44.572 22.631c0 12.427-7.428 20.7-22.286 22.5C7.43 46.931 0 35.059 0 22.632c0-12.426 2.476-21 22.286-22.5 19.81-1.5 22.286 10.074 22.286 22.5z" fill="#4C97FF"/></svg>
|
After Width: | Height: | Size: 251 B |
1
static/svgs/guidelines/blobgreen_remix.svg
Normal file
|
@ -0,0 +1 @@
|
|||
<svg width="45" height="46" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M44.572 22.631c0 12.427-7.428 20.7-22.286 22.5C7.43 46.931 0 35.059 0 22.632c0-12.426 2.476-21 22.286-22.5 19.81-1.5 22.286 10.074 22.286 22.5z" fill="#59C059"/></svg>
|
After Width: | Height: | Size: 251 B |
1
static/svgs/guidelines/blobmagenta_feedback.svg
Normal file
|
@ -0,0 +1 @@
|
|||
<svg width="45" height="46" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M44.572 22.631c0 12.427-7.428 20.7-22.286 22.5C7.43 46.931 0 35.059 0 22.632c0-12.426 2.476-21 22.286-22.5 19.81-1.5 22.286 10.074 22.286 22.5z" fill="#CF63CF"/></svg>
|
After Width: | Height: | Size: 251 B |
1
static/svgs/guidelines/blobpink_friendly.svg
Normal file
|
@ -0,0 +1 @@
|
|||
<svg width="45" height="46" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M44.572 22.631c0 12.427-7.428 20.7-22.286 22.5C7.43 46.931 0 35.059 0 22.632c0-12.426 2.476-21 22.286-22.5 19.81-1.5 22.286 10.074 22.286 22.5z" fill="#FF6680"/></svg>
|
After Width: | Height: | Size: 251 B |
1
static/svgs/guidelines/blobpurple_honest.svg
Normal file
|
@ -0,0 +1 @@
|
|||
<svg width="45" height="46" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M44.572 22.631c0 12.427-7.428 20.7-22.286 22.5C7.43 46.931 0 35.059 0 22.632c0-12.426 2.476-21 22.286-22.5 19.81-1.5 22.286 10.074 22.286 22.5z" fill="#96F"/></svg>
|
After Width: | Height: | Size: 248 B |
1
static/svgs/guidelines/blobyellow_safe.svg
Normal file
|
@ -0,0 +1 @@
|
|||
<svg width="45" height="46" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M44.572 22.631c0 12.427-7.428 20.7-22.286 22.5C7.43 46.931 0 35.059 0 22.632c0-12.426 2.476-21 22.286-22.5 19.81-1.5 22.286 10.074 22.286 22.5z" fill="#FFAB19"/></svg>
|
After Width: | Height: | Size: 251 B |
27
static/svgs/guidelines/header_sprinkles_left.svg
Normal file
|
@ -0,0 +1,27 @@
|
|||
<svg version="1.2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 201 354" width="201" height="354">
|
||||
<title>header_sprinkles-svg</title>
|
||||
<defs>
|
||||
<clipPath clipPathUnits="userSpaceOnUse" id="cp1">
|
||||
<path d="m0 0h1280v354h-1280z"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
<style>
|
||||
.s0 { opacity: .1;fill: #000000 }
|
||||
.s1 { opacity: .1;fill: none;stroke: #000000;stroke-miterlimit:10;stroke-width: 2 }
|
||||
.s2 { opacity: .3;fill: #ffffff }
|
||||
</style>
|
||||
<g id="Clip-Path" clip-path="url(#cp1)">
|
||||
<g>
|
||||
<path class="s0" d="m1270.5 132.8c27 0 48.6-23.3 48.6-52.1 0-28.8-21.9-52.1-48.6-52.1h-17.7c-27 0-48.6 23.3-48.6 52.1 0 28.8 21.8 52.1 48.6 52.1l-15.7-3.8c2.9 6.9 3.5 11.1 2 25.3-1.8 17.7 13.3 19.5 39.6-22 0.4-0.6 3.3-5 3.7-5.5z"/>
|
||||
<path class="s0" d="m1260.3 113.3c19.1 0 34.5-15.5 34.5-34.6 0-19.1-15.4-34.6-34.5-34.6-19 0-34.5 15.5-34.5 34.6 0 19.1 15.5 34.6 34.5 34.6z"/>
|
||||
<path fill-rule="evenodd" class="s1" d="m1244 84.3c0 0 15.4 10.2 32 0.8"/>
|
||||
<path class="s0" d="m1238.2 77.6c2.3 0 4.2-1.9 4.2-4.2 0-1.1-0.4-2.2-1.2-3-0.8-0.8-1.9-1.2-3-1.2-1.1 0-2.2 0.4-3 1.2-0.8 0.8-1.2 1.9-1.2 3 0 2.3 1.9 4.2 4.2 4.2zm44.2 0c2.3 0 4.2-1.9 4.2-4.2q0-0.8-0.3-1.6-0.3-0.8-0.9-1.4-0.6-0.6-1.4-0.9-0.7-0.3-1.6-0.3c-2.3 0-4.2 1.9-4.2 4.2 0 2.3 1.9 4.2 4.2 4.2z"/>
|
||||
<path class="s0" d="m1225.1 280.9h-81c-13 0-23.5 11.6-23.5 26 0 14.3 10.5 25.9 23.5 25.9h46c0.1 0.3 0.4 0.4 0.6 0.7 12.7 20.8 31.6 25.2 29.9 15.8-1.3-6.9-2.3-13-1-16.5h5.5c13 0 23.5-11.6 23.5-25.9-0.1-14.4-10.5-26-23.5-26z"/>
|
||||
<path fill-rule="evenodd" class="s0" d="m1220.8 302.5c-0.8 8.4-10.3 15.1-12.8 15.1-2.4 0-12-6.7-12.7-15.1v-0.8c0-4.1 3.3-7.4 7.4-7.4 2 0 3.9 0.8 5.3 2.1 1.3-1.4 3.2-2.1 5.4-2.1 4 0 7.4 3.3 7.4 7.4z"/>
|
||||
<path class="s0" d="m1163.5 318.2l3-6.3c0.3-0.4 0.6-0.7 1.2-0.8l6.8-1c1.3-0.2 1.7-1.8 0.9-2.6l-5-4.8c-0.3-0.3-0.5-0.9-0.4-1.3l1.2-6.8c0.1-1.2-1.1-2.2-2.2-1.6l-6.1 3.2c-0.4 0.2-1 0.2-1.4 0l-6.1-3.2c-1.2-0.6-2.5 0.3-2.2 1.6l1.2 6.8c0.1 0.4-0.2 1-0.4 1.3l-5 4.8c-0.8 0.8-0.4 2.3 0.9 2.6l6.8 1c0.4 0 0.9 0.4 1.2 0.8l3 6.3c0.4 1.1 2 1.1 2.6 0z"/>
|
||||
<path class="s2" d="m18.2 15.8c2.4-0.6 4.2-2.6 4.9-4.9l1.5-5.6c0.6-2.7 4.4-2.7 5.1 0l1.4 5.6c0.7 2.4 2.7 4.3 5 4.9l5.6 1.5c2.6 0.7 2.6 4.5 0 5.1l-5.6 1.5c-2.5 0.7-4.3 2.6-5 4.9l-1.4 5.6c-0.7 2.7-4.5 2.7-5.1 0l-1.5-5.6c-0.7-2.4-2.6-4.2-4.9-4.9l-5.6-1.5c-2.7-0.6-2.7-4.4 0-5.1zm1162.3 3.1c1.2-0.3 2-1.2 2.3-2.3l0.7-2.6c0.3-1.3 2.1-1.3 2.4 0l0.7 2.6c0.3 1.2 1.3 2 2.4 2.3l2.6 0.7c1.2 0.3 1.2 2.1 0 2.4l-2.6 0.7c-1.2 0.3-2.1 1.3-2.4 2.3l-0.7 2.7c-0.3 1.2-2.1 1.2-2.4 0l-0.7-2.7c-0.3-1.1-1.2-2-2.3-2.3l-2.6-0.7c-1.3-0.3-1.3-2.1 0-2.4zm-31.1 181.2c1.1-0.3 2-1.2 2.3-2.3l0.7-2.7c0.3-1.2 2.1-1.2 2.4 0l0.7 2.7c0.3 1.1 1.2 2 2.3 2.3l2.6 0.7c1.3 0.3 1.3 2.1 0 2.4l-2.6 0.7c-1.1 0.3-2 1.3-2.3 2.3l-0.7 2.7c-0.3 1.2-2.1 1.2-2.4 0l-0.7-2.7c-0.3-1.1-1.2-2-2.3-2.3l-2.7-0.7c-1.2-0.3-1.2-2.1 0-2.4zm-29-26.5c2.5-0.6 4.3-2.6 4.9-4.9l1.5-5.6c0.7-2.7 4.5-2.7 5.1 0l1.5 5.6c0.6 2.4 2.6 4.3 4.9 4.9l5.6 1.5c2.6 0.7 2.6 4.4 0 5.1l-5.6 1.5c-2.4 0.7-4.3 2.6-4.9 4.9l-1.5 5.6c-0.6 2.7-4.4 2.7-5.1 0l-1.5-5.6c-0.6-2.4-2.6-4.2-4.9-4.9l-5.6-1.5c-2.6-0.7-2.6-4.4 0-5.1zm-1027.8 119.7c2.3-0.6 4-2.4 4.7-4.5l1.3-5.1c0.7-2.4 4.2-2.4 4.8 0l1.4 5.1c0.7 2.2 2.5 3.9 4.7 4.5l5.2 1.3c2.5 0.6 2.5 4.1 0 4.7l-5.2 1.4c-2.3 0.6-4 2.4-4.7 4.5l-1.4 5.1c-0.6 2.4-4.1 2.4-4.8 0l-1.3-5.1c-0.7-2.3-2.5-3.9-4.7-4.5l-5.2-1.4c-2.5-0.6-2.5-4.1 0-4.7zm28.2-16.6c1.1-0.3 1.9-1.1 2.2-2.1l0.7-2.5c0.3-1.2 1.9-1.2 2.2 0l0.7 2.5c0.3 1 1.1 1.8 2.2 2.1l2.4 0.7c1.2 0.3 1.2 2 0 2.2l-2.4 0.7c-1.1 0.3-1.9 1.2-2.2 2.2l-0.7 2.5c-0.3 1.1-1.9 1.1-2.2 0l-0.7-2.5c-0.3-1.1-1.1-1.9-2.2-2.2l-2.4-0.7c-1.2-0.2-1.2-1.9 0-2.2z"/>
|
||||
<path class="s0" d="m116.9 220.6c28.4 0 51.4-24.7 51.4-55.1 0-30.4-23.1-55-51.4-55h-147c-28.5-0.2-51.6 24.4-51.6 54.9 0 30.4 23.1 55 51.4 55h12.3c3 7.4 0.7 20.3-2.2 35.2-3.9 20 37.8 10.5 65.5-33.4 0.5-0.6 0.7-1.2 1.2-1.6z"/>
|
||||
<path fill-rule="evenodd" class="s0" d="m39 156.7c-2.1 22.7-27.7 40.5-34.2 40.5-6.5 0-32-17.8-34.1-40.5 0-0.7-0.1-1.5-0.1-2.2 0-11 8.9-19.8 19.9-19.8q2-0.1 4 0.3 2 0.4 3.8 1.2 1.9 0.8 3.5 2 1.7 1.1 3 2.5 1.4-1.4 3.1-2.5 1.6-1.2 3.5-2 1.8-0.8 3.8-1.2 1.9-0.4 4-0.3c10.9 0 19.9 8.9 19.9 19.8 0 0.7-0.1 1.5-0.1 2.2zm78.2 2.7c-1.5 16-19.4 28.4-24 28.4-4.7 0-22.6-12.4-24-28.4 0-0.5-0.2-1-0.2-1.6 0-7.6 6.4-14 14-14 4 0 7.6 1.6 10 4.2 2.5-2.6 6.1-4.2 10-4.2 7.8 0 14 6.2 14 14 0.3 0.6 0.2 1.2 0.2 1.6z"/>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
After Width: | Height: | Size: 4.2 KiB |
27
static/svgs/guidelines/header_sprinkles_right.svg
Normal file
|
@ -0,0 +1,27 @@
|
|||
<svg version="1.2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 224 354" width="224" height="354">
|
||||
<title>header_sprinkles-svg</title>
|
||||
<defs>
|
||||
<clipPath clipPathUnits="userSpaceOnUse" id="cp1">
|
||||
<path d="m-1056 0h1280v354h-1280z"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
<style>
|
||||
.s0 { opacity: .1;fill: #000000 }
|
||||
.s1 { opacity: .1;fill: none;stroke: #000000;stroke-miterlimit:10;stroke-width: 2 }
|
||||
.s2 { opacity: .3;fill: #ffffff }
|
||||
</style>
|
||||
<g id="Clip-Path" clip-path="url(#cp1)">
|
||||
<g>
|
||||
<path class="s0" d="m214.5 132.8c27 0 48.6-23.3 48.6-52.1 0-28.8-21.9-52.1-48.6-52.1h-17.7c-27 0-48.6 23.3-48.6 52.1 0 28.8 21.8 52.1 48.6 52.1l-15.7-3.8c2.9 6.9 3.5 11.1 2 25.3-1.8 17.7 13.3 19.5 39.6-22 0.4-0.6 3.3-5 3.7-5.5z"/>
|
||||
<path class="s0" d="m204.3 113.3c19.1 0 34.5-15.5 34.5-34.6 0-19.1-15.4-34.6-34.5-34.6-19 0-34.5 15.5-34.5 34.6 0 19.1 15.5 34.6 34.5 34.6z"/>
|
||||
<path fill-rule="evenodd" class="s1" d="m188 84.3c0 0 15.4 10.2 32 0.8"/>
|
||||
<path class="s0" d="m182.2 77.6c2.3 0 4.2-1.9 4.2-4.2 0-1.1-0.4-2.2-1.2-3-0.8-0.8-1.9-1.2-3-1.2-1.1 0-2.2 0.4-3 1.2-0.8 0.8-1.2 1.9-1.2 3 0 2.3 1.9 4.2 4.2 4.2zm44.2 0c2.4 0 4.2-1.9 4.2-4.2q0-0.8-0.3-1.6-0.3-0.8-0.9-1.4-0.6-0.6-1.4-0.9-0.7-0.3-1.6-0.3c-2.3 0-4.2 1.9-4.2 4.2 0 2.3 1.9 4.2 4.2 4.2z"/>
|
||||
<path class="s0" d="m169.1 280.9h-81c-13 0-23.5 11.6-23.5 26 0 14.3 10.5 25.9 23.5 25.9h46c0.1 0.3 0.4 0.4 0.6 0.7 12.7 20.8 31.6 25.2 29.9 15.8-1.3-6.9-2.3-13-1-16.5h5.5c13 0 23.5-11.6 23.5-25.9-0.1-14.4-10.5-26-23.5-26z"/>
|
||||
<path fill-rule="evenodd" class="s0" d="m164.8 302.5c-0.8 8.4-10.3 15.1-12.8 15.1-2.4 0-12-6.7-12.7-15.1v-0.8c0-4.1 3.3-7.4 7.4-7.4 2 0 3.9 0.8 5.3 2.1 1.3-1.4 3.2-2.1 5.4-2.1 4 0 7.3 3.3 7.3 7.4z"/>
|
||||
<path class="s0" d="m107.5 318.2l3-6.3c0.3-0.4 0.6-0.7 1.2-0.8l6.8-1c1.3-0.2 1.7-1.8 0.9-2.6l-5-4.8c-0.3-0.3-0.5-0.9-0.4-1.3l1.2-6.8c0.1-1.2-1.1-2.2-2.2-1.6l-6.1 3.2c-0.4 0.2-1 0.2-1.4 0l-6.1-3.2c-1.2-0.6-2.5 0.3-2.2 1.6l1.2 6.8c0.1 0.4-0.2 1-0.4 1.3l-5 4.8c-0.8 0.8-0.4 2.3 0.9 2.6l6.8 1c0.4 0 0.9 0.4 1.2 0.8l3 6.3c0.4 1.1 2 1.1 2.6 0z"/>
|
||||
<path class="s2" d="m-1037.8 15.8c2.4-0.6 4.2-2.6 4.9-4.9l1.5-5.6c0.6-2.7 4.4-2.7 5.1 0l1.4 5.6c0.7 2.4 2.7 4.3 5 4.9l5.6 1.5c2.6 0.7 2.6 4.5 0 5.1l-5.6 1.5c-2.5 0.7-4.3 2.6-5 4.9l-1.4 5.6c-0.7 2.7-4.5 2.7-5.1 0l-1.5-5.6c-0.7-2.4-2.6-4.2-4.9-4.9l-5.6-1.5c-2.7-0.6-2.7-4.4 0-5.1zm1162.3 3.1c1.2-0.3 2-1.2 2.3-2.3l0.7-2.6c0.3-1.3 2.1-1.3 2.4 0l0.7 2.6c0.3 1.2 1.3 2 2.4 2.3l2.6 0.7c1.2 0.3 1.2 2.1 0 2.4l-2.6 0.7c-1.2 0.3-2.1 1.3-2.4 2.3l-0.7 2.7c-0.3 1.2-2.1 1.2-2.4 0l-0.7-2.7c-0.3-1.1-1.2-2-2.3-2.3l-2.6-0.7c-1.3-0.3-1.3-2.1 0-2.4zm-31.1 181.2c1.1-0.3 2-1.2 2.3-2.3l0.7-2.7c0.3-1.2 2.1-1.2 2.4 0l0.7 2.7c0.3 1.1 1.2 2 2.3 2.3l2.6 0.7c1.3 0.3 1.3 2.1 0 2.4l-2.6 0.7c-1.1 0.3-2 1.3-2.3 2.3l-0.7 2.7c-0.3 1.2-2.1 1.2-2.4 0l-0.7-2.7c-0.3-1.1-1.2-2-2.3-2.3l-2.7-0.7c-1.2-0.3-1.2-2.1 0-2.4zm-29-26.5c2.5-0.6 4.3-2.6 4.9-4.9l1.5-5.6c0.7-2.7 4.5-2.7 5.1 0l1.5 5.6c0.6 2.4 2.6 4.3 4.9 4.9l5.6 1.5c2.6 0.7 2.6 4.4 0 5.1l-5.6 1.5c-2.4 0.7-4.3 2.6-4.9 4.9l-1.5 5.6c-0.6 2.7-4.4 2.7-5.1 0l-1.5-5.6c-0.6-2.4-2.6-4.2-4.9-4.9l-5.6-1.5c-2.6-0.7-2.6-4.4 0-5.1zm-1027.8 119.7c2.3-0.6 4-2.4 4.7-4.5l1.3-5.1c0.7-2.4 4.2-2.4 4.8 0l1.4 5.1c0.7 2.2 2.5 3.9 4.7 4.5l5.2 1.3c2.5 0.6 2.5 4.1 0 4.7l-5.2 1.4c-2.3 0.6-4 2.4-4.7 4.5l-1.4 5.1c-0.6 2.4-4.1 2.4-4.8 0l-1.3-5.1c-0.7-2.3-2.5-3.9-4.7-4.5l-5.2-1.4c-2.5-0.6-2.5-4.1 0-4.7zm28.2-16.6c1.1-0.3 1.9-1.1 2.2-2.1l0.7-2.5c0.3-1.2 1.9-1.2 2.2 0l0.7 2.5c0.3 1 1.1 1.8 2.2 2.1l2.4 0.7c1.2 0.3 1.2 2 0 2.2l-2.4 0.7c-1.1 0.3-1.9 1.2-2.2 2.2l-0.7 2.5c-0.3 1.1-1.9 1.1-2.2 0l-0.7-2.5c-0.3-1.1-1.1-1.9-2.2-2.2l-2.4-0.7c-1.2-0.2-1.2-1.9 0-2.2z"/>
|
||||
<path class="s0" d="m-939.1 220.6c28.5 0 51.4-24.7 51.4-55.1 0-30.4-23.1-55-51.4-55h-147c-28.5-0.2-51.6 24.4-51.6 54.9 0 30.4 23.1 55 51.4 55h12.3c3 7.4 0.7 20.3-2.2 35.2-3.9 20 37.8 10.5 65.5-33.4 0.5-0.6 0.7-1.2 1.2-1.6z"/>
|
||||
<path fill-rule="evenodd" class="s0" d="m-1017 156.7c-2.1 22.7-27.7 40.5-34.2 40.5-6.5 0-32-17.8-34.1-40.5 0-0.7-0.1-1.5-0.1-2.2 0-11 8.9-19.8 19.9-19.8q2-0.1 4 0.3 2 0.4 3.8 1.2 1.9 0.8 3.5 2 1.7 1.1 3 2.5 1.4-1.4 3.1-2.5 1.6-1.2 3.5-2 1.8-0.8 3.8-1.2 1.9-0.4 4-0.3c10.9 0 19.9 8.9 19.9 19.8 0 0.7-0.1 1.5-0.1 2.2zm78.2 2.7c-1.5 16-19.4 28.4-24 28.4-4.7 0-22.6-12.4-24-28.4 0-0.5-0.2-1-0.2-1.6 0-7.6 6.4-14 14-14 4 0 7.6 1.6 10 4.2 2.5-2.6 6.1-4.2 10-4.2 7.8 0 14 6.2 14 14 0.3 0.6 0.2 1.2 0.2 1.6z"/>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
After Width: | Height: | Size: 4.2 KiB |
1
static/svgs/guidelines/illustration_feedback.svg
Normal file
After Width: | Height: | Size: 9 KiB |
1
static/svgs/guidelines/illustration_friendly.svg
Normal file
After Width: | Height: | Size: 8.7 KiB |
1
static/svgs/guidelines/illustration_honest.svg
Normal file
After Width: | Height: | Size: 5.1 KiB |
21
static/svgs/guidelines/illustration_learn_more.svg
Normal file
|
@ -0,0 +1,21 @@
|
|||
<svg width="360" height="360" viewBox="0 0 360 360" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M32.3633 67.768C70.5711 26.4296 215.385 28.6821 285.363 80.7676C322.505 108.397 396.426 229.869 291.416 286.124C245.694 310.617 156.911 311.364 104.287 272.135C98.1483 267.559 93.5905 261.245 90.0314 254.466C29.8569 139.854 -11.691 115.368 32.3633 67.768Z" fill="#0FBD8C"/>
|
||||
<path d="M107.855 320.009C94.7183 324.907 41.9505 298.05 32.2258 278.631C27.1001 268.36 0.0265617 181.281 27.6749 180.655C41.2962 180.355 72.1233 252.972 81.2347 265.47C96.5873 286.54 123.445 314.191 107.855 320.009Z" fill="#0FBD8C"/>
|
||||
<path d="M209.096 249.909C266.03 245.929 311.361 230.941 310.346 216.434C309.332 201.926 262.356 193.393 205.422 197.375C148.488 201.355 103.156 216.343 104.171 230.85C105.185 245.357 152.161 253.891 209.096 249.909Z" fill="black" fill-opacity="0.1"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M104.018 233.118C103.589 233.066 103.268 232.7 103.268 232.267V145.472C103.268 145.208 103.386 144.959 103.592 144.796L151.904 106.602C152.056 106.482 152.244 106.419 152.434 106.419C152.456 106.419 260.469 114.813 260.469 114.813C260.915 114.848 261.258 115.221 261.258 115.667V199.879C261.258 200.112 261.163 200.336 260.994 200.5L213.129 246.288C212.969 246.44 212.759 246.524 212.54 246.524C212.505 246.524 212.472 246.522 212.436 246.518L104.018 233.118Z" fill="#CC9900"/>
|
||||
<path d="M211.452 242.393L257.284 198.548V118.552C256.809 118.514 256.232 118.47 255.521 118.415C250.457 118.021 250.457 118.021 243.284 117.464C230.626 116.48 217.968 115.496 206.152 114.578H206.144C190.955 113.398 178.297 112.414 169.014 111.694C163.739 111.283 159.623 110.964 156.774 110.743C155.311 110.629 154.184 110.541 153.407 110.481L107.243 146.978V229.512L211.452 242.393ZM104.018 233.118C103.589 233.066 103.268 232.7 103.268 232.267V145.472C103.268 145.208 103.386 144.959 103.592 144.796L151.904 106.602C152.056 106.482 152.244 106.419 152.434 106.419C152.456 106.419 260.469 114.813 260.469 114.813C260.915 114.848 261.258 115.221 261.258 115.667V199.879C261.258 200.112 261.163 200.336 260.994 200.5L213.129 246.288C212.969 246.44 212.759 246.524 212.54 246.524C212.505 246.524 212.472 246.522 212.436 246.518L104.018 233.118Z" fill="black" fill-opacity="0.2"/>
|
||||
<path d="M154.938 150.14C154.938 151.237 154.048 152.127 152.95 152.127C151.853 152.127 150.963 151.237 150.963 150.14V111.387C150.963 110.29 151.853 109.399 152.95 109.399C154.048 109.399 154.938 110.29 154.938 111.387V150.14Z" fill="black" fill-opacity="0.2"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M213.562 240.837L258.04 198.897V169.261L241.045 184.437L213.562 157.095V240.837Z" fill="#B38600"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M108.474 146.441L151.175 150.415V111.838L108.474 146.441Z" fill="#B38600"/>
|
||||
<path d="M214.438 158.752C214.403 159.709 214.369 161.115 214.339 162.966C214.278 166.684 214.225 172.183 214.183 179.464C214.101 194.032 214.06 215.724 214.06 244.536C214.06 245.634 213.17 246.524 212.072 246.524C210.975 246.524 210.085 245.634 210.085 244.536C210.085 180.891 210.219 157.351 210.792 156.207C211.283 155.224 212.477 154.826 213.458 155.317C214.44 155.808 214.837 157.002 214.347 157.984C214.488 157.701 214.484 157.797 214.489 157.723C214.472 157.954 214.455 158.301 214.438 158.752Z" fill="black" fill-opacity="0.2"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M188.433 133.248C186.333 133.248 184.345 132.266 182.98 130.555L160.648 102.584C158.805 100.277 158.397 97.1278 159.583 94.3708C160.767 91.6108 163.265 89.8981 166.099 89.8981H176.225V58.3379C176.225 54.7158 178.976 51.7679 182.357 51.7679H195.26C198.643 51.7679 201.391 54.7158 201.391 58.3379V89.8981H211.343C214.197 89.8981 216.702 91.6278 217.881 94.4138C219.057 97.1978 218.618 100.359 216.737 102.656L193.823 130.631C192.463 132.294 190.498 133.248 188.433 133.248Z" fill="#59C059"/>
|
||||
<path d="M188.433 128.279C188.991 128.279 189.551 128.007 189.98 127.482L212.894 99.5078C213.6 98.6458 213.766 97.4428 213.304 96.3478C212.89 95.3678 212.164 94.8668 211.343 94.8668H196.423V58.3379C196.423 57.3851 195.818 56.7362 195.26 56.7362H182.357C181.799 56.7362 181.194 57.3857 181.194 58.3379V94.8668H166.099C165.288 94.8668 164.563 95.3648 164.147 96.3338C163.681 97.4158 163.837 98.6158 164.531 99.4838L186.864 127.457C187.297 128 187.863 128.279 188.433 128.279ZM188.433 133.248C186.333 133.248 184.345 132.266 182.98 130.555L160.648 102.584C158.805 100.277 158.397 97.1278 159.583 94.3708C160.767 91.6108 163.265 89.8981 166.099 89.8981H176.225V58.3379C176.225 54.7158 178.976 51.7679 182.357 51.7679H195.26C198.643 51.7679 201.391 54.7158 201.391 58.3379V89.8981H211.343C214.197 89.8981 216.702 91.6278 217.881 94.4138C219.057 97.1978 218.618 100.359 216.737 102.656L193.823 130.631C192.463 132.294 190.498 133.248 188.433 133.248Z" fill="black" fill-opacity="0.15"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M212.614 156.008C212.497 155.663 212.618 155.246 212.914 155.026L259.995 115.566C260.15 115.434 260.35 115.363 260.558 115.362C261.026 115.362 261.106 115.445 286.85 141.467C287.181 141.803 287.174 142.341 286.831 142.666C286.391 143.082 243.035 184.207 242.579 184.649C242.418 184.806 242.138 184.918 241.91 184.918C239.254 184.918 212.713 156.299 212.614 156.008Z" fill="#CC9900"/>
|
||||
<path d="M219.765 157.935C222.717 161.096 226.034 164.587 229.155 167.803C233.005 171.77 236.361 175.117 238.947 177.543C240.014 178.546 240.934 179.375 241.687 180.015C248.784 173.277 273.951 149.403 281.772 141.986C267.711 127.772 264.334 124.368 261.573 121.624C261.118 121.171 260.719 120.776 260.372 120.435L217.955 155.988C218.501 156.58 219.114 157.237 219.765 157.935ZM212.614 156.008C212.497 155.663 212.618 155.246 212.914 155.026L259.995 115.566C260.15 115.434 260.35 115.363 260.558 115.362C261.026 115.362 261.106 115.445 286.85 141.467C287.181 141.803 287.174 142.341 286.831 142.666C286.391 143.082 243.035 184.207 242.579 184.649C242.418 184.806 242.138 184.918 241.91 184.918C239.254 184.918 212.713 156.299 212.614 156.008Z" fill="black" fill-opacity="0.2"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M88.4871 182.005C88.3489 181.779 88.3251 181.503 88.4225 181.256L102.337 145.713C102.464 145.385 102.781 145.171 103.129 145.171C103.154 145.171 212.79 155.431 212.79 155.431C213.064 155.454 213.305 155.61 213.444 155.844C213.583 156.078 213.602 156.367 213.491 156.615L197.518 193.349C197.383 193.662 197.076 193.86 196.739 193.86C196.709 193.86 89.1252 182.408 89.1252 182.408C88.8612 182.381 88.6243 182.232 88.4871 182.005Z" fill="#CC9900"/>
|
||||
<path d="M207.708 158.946C202.57 158.466 202.57 158.466 195.289 157.785C182.441 156.582 169.592 155.381 157.598 154.259L157.589 154.258C142.172 152.815 129.324 151.613 119.901 150.732C114.547 150.231 110.369 149.84 107.477 149.57C106.588 149.486 105.821 149.415 105.179 149.355L93.6168 178.89C93.7914 178.909 93.975 178.928 94.1688 178.948C99.2113 179.486 99.2113 179.486 106.356 180.246C118.963 181.588 131.572 182.93 143.341 184.182L143.353 184.183C158.481 185.794 171.089 187.136 180.336 188.12C185.59 188.678 189.689 189.115 192.528 189.416C193.404 189.509 194.159 189.59 194.79 189.656L208.127 158.986C207.993 158.974 207.853 158.96 207.708 158.946ZM88.4871 182.005C88.3489 181.779 88.3251 181.503 88.4225 181.256L102.337 145.713C102.464 145.385 102.781 145.171 103.129 145.171C103.154 145.171 212.79 155.431 212.79 155.431C213.064 155.454 213.305 155.61 213.444 155.844C213.583 156.078 213.602 156.367 213.491 156.615L197.518 193.349C197.383 193.662 197.076 193.86 196.739 193.86C196.709 193.86 89.1252 182.408 89.1252 182.408C88.8612 182.381 88.6243 182.232 88.4871 182.005Z" fill="black" fill-opacity="0.2"/>
|
||||
<path d="M54.6349 251.695C53.1051 251.278 51.8534 250.026 51.4362 248.496L50.4627 245.02C50.0455 243.351 47.6812 243.351 47.264 245.02L46.2905 248.496C45.8733 250.026 44.6216 251.278 43.0918 251.695L39.615 252.669C37.9461 253.086 37.9461 255.45 39.615 255.867L43.0918 256.841C44.6216 257.258 45.8733 258.51 46.2905 260.039L47.264 263.516C47.6812 265.185 50.0455 265.185 50.4627 263.516L51.4362 260.039C51.8534 258.51 53.1051 257.258 54.6349 256.841L58.1117 255.867C59.7806 255.45 59.7806 253.086 58.1117 252.669L54.6349 251.695Z" fill="#FFBF00"/>
|
||||
<path d="M314.416 187.678C313.249 187.367 312.394 186.433 312.083 185.345L311.383 182.701C311.072 181.457 309.283 181.457 308.972 182.701L308.273 185.345C307.962 186.511 307.028 187.367 305.94 187.678L303.296 188.377C302.052 188.688 302.052 190.477 303.296 190.788L305.94 191.488C307.106 191.799 307.962 192.732 308.273 193.821L308.972 196.464C309.283 197.708 311.072 197.708 311.383 196.464L312.083 193.821C312.394 192.654 313.327 191.799 314.416 191.488L317.059 190.788C318.304 190.477 318.304 188.688 317.059 188.377L314.416 187.678Z" fill="#FFBF00"/>
|
||||
<path d="M97.4593 99.4268C95.2643 98.8788 93.4356 97.0498 92.7041 94.6718L91.241 89.5511C90.5094 87.1735 87.0345 87.1735 86.4858 89.5511L85.0226 94.6718C84.4739 96.8668 82.6451 98.6958 80.2675 99.4268L75.1465 100.891C72.7689 101.622 72.7689 105.097 75.1465 105.646L80.2675 107.109C82.4622 107.657 84.2911 109.486 85.0226 111.864L86.4858 116.985C87.2173 119.362 90.6923 119.362 91.241 116.985L92.7041 111.864C93.2527 109.669 95.0813 107.84 97.4593 107.109L102.58 105.646C104.957 104.914 104.957 101.439 102.58 100.891L97.4593 99.4268Z" fill="#FFBF00"/>
|
||||
<path d="M61.8756 271.937C61.2536 271.781 60.787 271.314 60.6315 270.692L60.2427 269.293C60.0872 268.593 59.0763 268.593 58.9208 269.293L58.532 270.692C58.3765 271.314 57.9099 271.781 57.2879 271.937L55.8882 272.325C55.1884 272.481 55.1884 273.492 55.8882 273.647L57.2879 274.036C57.9099 274.192 58.3765 274.658 58.532 275.28L58.9208 276.68C59.0763 277.38 60.0872 277.38 60.2427 276.68L60.6315 275.28C60.787 274.658 61.2536 274.192 61.8756 274.036L63.2753 273.647C63.9751 273.492 63.9751 272.481 63.2753 272.325L61.8756 271.937Z" fill="#FFBF00"/>
|
||||
</svg>
|
After Width: | Height: | Size: 9.7 KiB |
1
static/svgs/guidelines/illustration_remix.svg
Normal file
After Width: | Height: | Size: 12 KiB |
1
static/svgs/guidelines/illustration_respect.svg
Normal file
After Width: | Height: | Size: 6.1 KiB |
1
static/svgs/guidelines/illustration_safe.svg
Normal file
After Width: | Height: | Size: 6 KiB |