Working agreements

Developer
Size
5,333 Kb
Views
16,192

How do I make an working agreements?

An example how you could display some working agreements. Uses jQuery, SCSS and CoffeeScript.. What is a working agreements? How do you make a working agreements? This script and codes were developed by Jeremias Erbs on 09 December 2022, Friday.

Working agreements Previews

Working agreements - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>Working agreements</title> <script src="https://s.codepen.io/assets/libs/modernizr.js" type="text/javascript"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/1.9.3/plugins/CSSPlugin.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/1.9.3/easing/EasePack.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/1.9.3/TweenLite.min.js"></script> <link rel='stylesheet prefetch' href='http://ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/themes/smoothness/jquery-ui.css'> <style> /* NOTE: The styles were added inline because Prefixfree needs access to your styles and they must be inlined if they are on local disk! */ @import url(https://fonts.googleapis.com/css?family=Noto+Serif:400,400italic,700italic);
html { background: white linear-gradient(180deg, #ddeeff, rgba(0, 0, 0, 0)) no-repeat; font-family: "Noto Serif", Georgia, Arial, sans-serif; height: 100%;
}
body { overflow-y: scroll; width: 70%; height: auto; margin: 40px auto; padding: 5px 10px; border-radius: 4px; background: -webkit-linear-gradient(60deg, rgba(28, 52, 76, 0.9), transparent), -webkit-radial-gradient(91% 89%, ellipse closest-corner, rgba(27, 3, 16, 0.4), transparent 280%), -webkit-radial-gradient(left center, ellipse farthest-side, rgba(255, 197, 70, 0.8) 0%, transparent 100%), -webkit-radial-gradient(10% 90%, ellipse closest-corner, rgba(40, 125, 125, 0.8) 0%, transparent 100%), -webkit-radial-gradient(center right, ellipse cover, rgba(252, 183, 115, 0.9), transparent), -webkit-radial-gradient(10% 10%, circle farthest-side, rgba(145, 196, 108, 0.5), transparent), -webkit-linear-gradient(140deg, rgba(25, 42, 10, 0.9), transparent), -webkit-radial-gradient(rgba(242, 242, 242, 0.9), transparent); box-shadow: 0 0 16px rgba(0, 0, 0, 0.8); border: 1px solid rgba(255, 255, 255, 0.8); text-align: center;
}
h1 { color: white; cursor: pointer; text-shadow: 1px 1px 8px #373764, 1px 1px 16px rgba(55, 55, 100, 0.2); font-size: 40px;
}
ul { list-style: none; padding: 0; overflow: auto; font-size: 32px; position: relative; overflow: auto; margin: 20px;
}
ul ul { display: none; transform: all 0.3s ease;
}
li { text-align: left; font-style: italic; background-color: rgba(255, 255, 255, 0.3); border: 1px solid rgba(255, 255, 255, 0.2); position: relative; color: #222; text-shadow: 1px 2px 2px rgba(255, 255, 255, 0.5); margin: 8px 20px; padding: 4px 8px; border-radius: 4px; box-shadow: 1px 1px 4px; transition: background-color 0.5s ease; cursor: pointer;
}
li:hover { background-color: rgba(255, 255, 255, 0.5);
}
ul ul li { font-size: 26px;
} </style> <script src="https://cdnjs.cloudflare.com/ajax/libs/prefixfree/1.0.7/prefixfree.min.js"></script>
</head>
<body>
<h1>Working agreements</h1>
<ul> <li>Wir behandeln uns mit Respekt <ul> <li>Kritik unter 4 Augen</li> <li>Andere Persönlichkeiten respektieren</li> <li>Vertrauen in die Fähigkeiten anderer</li> <li>Kein Fingerpointing</li> <li>"Credits geben" und loben</li> </ul> </li> <li>Wir arbeiten transparent <ul> <li>Top Down vermeiden</li> <li>Entscheidungsursprünge kommunizieren</li> <li>Offenes Feedback</li> </ul> </li> <li> Wir probieren Dinge aus <ul> <li>Ausprobieren statt Rumdiskutieren</li> <li>Fehler machen dürfen</li> <li>Kein "Das haben wir immer so gemacht"</li> </ul> </li> <li> Wir machen eindeutige Aussagen <ul> <li>Je Aufgabe ein Verantwortlicher</li> <li>Klare Anforderungen</li> <li>Bei Fragen bitte fragen</li> </ul> </li> <li> Wir gehen Dinge positiv an <ul> <li>Konstruktive Ideen äußern</li> <li>Positive Thinking</li> <li>Disagree and commit</li> <li>Kein "Technisch nicht möglich"</li> <li>Wir versuchen Dinge zu ermöglichen</li> </ul> </li> <li> Wir lassen uns unseren Freiraum <ul> <li>Ausreden lassen</li> <li>"Nein" sagen dürfen</li> <li>Offenheit für andere Meinungen</li> </ul> </li> <li> Wir arbeiten effizient <ul> <li>Time Box</li> <li>Focus! Energie sparen</li> <li>Mitdenken</li> </ul> </li> <li> Wir sind ordentlich <ul> <li>Wir räumen auf: Gedanken, Features, Ideen, Schreibtisch</li> <li>Arbeitsplatz sauber halten</li> </ul> </li>
</ul> <script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script>
<script src='http://ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/jquery-ui.min.js'></script> <script src="js/index.js"></script>
</body>
</html>

Working agreements - Script Codes CSS Codes

@import url(https://fonts.googleapis.com/css?family=Noto+Serif:400,400italic,700italic);
html { background: white linear-gradient(180deg, #ddeeff, rgba(0, 0, 0, 0)) no-repeat; font-family: "Noto Serif", Georgia, Arial, sans-serif; height: 100%;
}
body { overflow-y: scroll; width: 70%; height: auto; margin: 40px auto; padding: 5px 10px; border-radius: 4px; background: -webkit-linear-gradient(60deg, rgba(28, 52, 76, 0.9), transparent), -webkit-radial-gradient(91% 89%, ellipse closest-corner, rgba(27, 3, 16, 0.4), transparent 280%), -webkit-radial-gradient(left center, ellipse farthest-side, rgba(255, 197, 70, 0.8) 0%, transparent 100%), -webkit-radial-gradient(10% 90%, ellipse closest-corner, rgba(40, 125, 125, 0.8) 0%, transparent 100%), -webkit-radial-gradient(center right, ellipse cover, rgba(252, 183, 115, 0.9), transparent), -webkit-radial-gradient(10% 10%, circle farthest-side, rgba(145, 196, 108, 0.5), transparent), -webkit-linear-gradient(140deg, rgba(25, 42, 10, 0.9), transparent), -webkit-radial-gradient(rgba(242, 242, 242, 0.9), transparent); box-shadow: 0 0 16px rgba(0, 0, 0, 0.8); border: 1px solid rgba(255, 255, 255, 0.8); text-align: center;
}
h1 { color: white; cursor: pointer; text-shadow: 1px 1px 8px #373764, 1px 1px 16px rgba(55, 55, 100, 0.2); font-size: 40px;
}
ul { list-style: none; padding: 0; overflow: auto; font-size: 32px; position: relative; overflow: auto; margin: 20px;
}
ul ul { display: none; transform: all 0.3s ease;
}
li { text-align: left; font-style: italic; background-color: rgba(255, 255, 255, 0.3); border: 1px solid rgba(255, 255, 255, 0.2); position: relative; color: #222; text-shadow: 1px 2px 2px rgba(255, 255, 255, 0.5); margin: 8px 20px; padding: 4px 8px; border-radius: 4px; box-shadow: 1px 1px 4px; transition: background-color 0.5s ease; cursor: pointer;
}
li:hover { background-color: rgba(255, 255, 255, 0.5);
}
ul ul li { font-size: 26px;
}

Working agreements - Script Codes JS Codes

(function() { $(function() { var details; details = $("ul ul"); $("body > ul").on("click", "li", function() { return $(this).find("ul").slideToggle(200); }); return $("body > h1").on("click", function() { if (details.is(":visible")) { return details.slideUp(); } else { return details.slideDown(); } }); });
}).call(this);
Working agreements - Script Codes
Working agreements - Script Codes
Home Page Home
Developer Jeremias Erbs
Username badabam
Uploaded December 09, 2022
Rating 3
Size 5,333 Kb
Views 16,192
Do you need developer help for Working agreements?

Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!

Jeremias Erbs (badabam) Script Codes
Create amazing marketing copy with AI!

Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!