Skip to content

Instantly share code, notes, and snippets.

🤓
Reading your blog posts

Šime Vidas simevidas

🤓
Reading your blog posts
Block or report user

Report or block simevidas

Hide content and notifications from this user.

Learn more about blocking users

Contact Support about this user’s behavior.

Learn more about reporting abuse

Report abuse
View GitHub Profile
View web-dev-emoji.md

📃 HTML

💈 CSS

🤖 JavaScript

♿️ accessibility

🔒 security

🏇 performance

🕵️‍♂️ privacy

✒️ typography

🔑 authentication

🛠 tooling

View foo.css
.foo {
color: red !important;
}
View variable-fonts.css
x:root {
--color-primary: #37187c;
--color-secondary: #262A4C;
--color-contrast: #ff4929;
--color-text: #020521;
--color-light: #fff;
--color-background: hsl(187, 54%, 90%);
--line-height: 2.2rem;
View bemit-cheat-sheet.md

BEM with namespaces cheat sheet

  • o-, Object
    • abstrct; may be used in any number of (unrelated) places across the project
    • modifications have knock-on effects in a lot of other unrelated places
    • for “abstracting out the repetitive, shared, and purely structural aspects of a UI into reusable objects”
    • layout, wrappers, containers and other “skeletal aspects” of UI components
  • c-, Component
    • a concrete, implementation-specific piece of UI
    • modifications are detectable in the context you’re currently looking at
@simevidas
simevidas / finished-polyfill.js
Last active Jul 14, 2019 — forked from AdaRoseCannon/Finished polyfill.js
Animation.prototype.finished polyfill
View finished-polyfill.js
// only polyfill .finished in browsers that already support animate()
if (document.body.animate) {
// Chrome does not seem to expose the Animation constructor globally
if (typeof Animation === 'undefined') {
window.Animation = document.body.animate({}).constructor;
}
if (Animation.prototype.finished === undefined) {
Object.defineProperty(Animation.prototype, 'finished', {
View code.html
<div class="form-group">
<label for="subject">Kategorie*</label>
<select class="form-control" id="subject">
<option value="" selected="">-- Wähle eine Kategorie --</option>
<option value="1">Produktfrage</option>
<option value="2">Kaufanfrage</option>
<option value="3">Angebotsanfrage</option>
<option value="4">Allgemeine Frage</option>
</select>
</div>
View punctuation.md
Two words Hyphenated One word
half brother half-life halftime
half sister half-truth halfback
half note half-moon halftone
You can’t perform that action at this time.