public marks

PUBLIC MARKS from decembre with tag tutorial

This month

LINUX - TUTO - Finalement, openSUSE !

Choisissez openSUSE pour les ordinateurs portables. Cette distribution prend en charge un nombre de drivers insoupçonnés ! » J’ai donc téléchargé l’image ISO openSUSE Leap 42.3. Et banco , j’ai installé le bureau MATE, Vlc, Chromium

December 2017

FIR 57 - ARIS - SCROLLBAR - GitHub - Aris-t2/Scrollbars: Custom Scrollbars

Custom Scrollbars for Firefox 57+ : Method 1 - files for Firefox profile folder only M1 is based on this project by nuchi: M1 will stop working when Mozilla drops XBL support. From this projects method 1 : folder copy userChrome folder and userChrome.css file to PROFILENAME chrome or add code from userChrome.css file to an existing userChrome.css file. Method 2 - files for Firefox folder and to Firefox profile folder M2 is based on this project by ardiman: From this projects method 2profile folder copy userChrome folder and userChrome.js file to PROFILENAME chrome . From this projects method 2firefox folder copy defaults folder and config.js file to Firefox main directory (where the Firefox executable is). Script/startup cache must be deleted after every change! Where to fine startupCache folder? about:profiles > Local Directory > Open Folder, close Firefox and delete all files in startupCache folder. Location on WINDOWS: C:Users NAME AppDataLocalMozillaFirefoxProfiles PROFILE startupCache Location on LINUX location: home NAME .cachemozillafirefox PROFILE startupCache This is not the same profile folder custom scripts and styles are stored! More info about startup cache removal (in German): More info about startup cache removal (in English )

FIR 57 (UserCSS + about:config) - Custom CSS tweaks for Firefox 57+ - GitHub - Aris-t2/CustomCSSforFx:

'about:config' tweaks (To revert changes right-click entry and select 'reset'): - Tab audio icon browser.tabs.showAudioPlayingIcon - Insert related tab after current tab (suggestion: enable / set to 'true') browser.tabs.insertRelatedAfterCurrent - Titlebar browser.tabs.drawInTitlebar - Searchbar: open search results in new tab - Reader mode reader.parse-on-load.enabled - Geolocation (suggestion: disable / set to 'false') geo.enabled - Pocket (suggestion: disable / set to 'false') extensions.pocket.enabled - Anti fingerprinting (Caution: browser might behave in unforseen ways!) privacy.resistFingerprinting read: Fingerprinting info at Mozilla Wiki tweaks ***** Suggested ui tweaks ***** - Toolbar modes (suggestion: compact mode) Customize mode > Density > Compact / Normal / Touch - Titlebar modes (suggestion: Firefox titlebar ['application/hamburger button in titlebar' only works in Firefox titlebar]) Customize mode > Title Bar > uncheck checkbox Drag space above tabs toolbar (suggestion: disable drag space ['application/hamburger button in titlebar' works best without drag space]) Customize mode > Drag Space > uncheck checkbox Bookmarks menu button on bookmarks toolbar Customize mode > Toolbars > Bookmarks Toolbar Customize mode > move 'bookmarks menu' button to bookmark toolbars end Downloads button always visible Customize mode > downloads button > click on button and uncheck 'Auto-hide' Searchbar (suggestion: placed after location bar) Customize mode > Search(bar) > move to navigation toolbar Flexible spaces (suggestion: remove spaces after and before location bar) Customize mode > grab and drag flexible space into palette

Laboratory, a Firefox extension to generate CSP headers - YouTube

Laboratory, a Firefox extension to generate CSP headersLaboratory is an experimental Firefox extension that helps you generate a proper Content Security Policy (CSP) header for your website. Simply start recording, browse your site, and enjoy the CSP header that it produces.

October 2017

CSS + STYLUS - Stylus et les préprocesseurs CSS (en guise d’introduction) · Les intégristes

Première question : qu’est-ce qu’un préprocesseur ? Un préprocesseur est un programme qui procède à des transformations sur un code source, avant l’étape de traduction proprement dite (compilation ou interprétation). source Wikipedia. Dans le cas d’un préprocesseur CSS la syntaxe simplifiée ou enrichie en entrée est analysée et compilée en un langage que nous connaissons tous et que nous utilisons au quotidien : CSS.

WIN 10 - TIPS - Les nouvelles commandes (exécuter) de Windows 10

On peut trouver Exécuter dans le menu Démarrer traditionnel de Windows 10, par un clic sur "toutes les applications", puis choisir Windows système puis exécuter. Ou simplement par la touche Windows + R.

September 2017

DEV - Web developer guides | MDN

Web developer guides. These articles provide how-to information to help you make use of specific technologies and APIs.

August 2017

LOG - IMAGE - PLUGIN - Gmic line-art colorization - David Revoy

This is an article dedicated to the Gmic filter 'colorize', a new and next generation computer-assisted tool for colorization image filter. This filter was created by David Tschumperlé , project manager and main developer of Gmic. The filter improved a lot on this September 2014 ( and was started around spring 2013 ). I kept an eye on the filter development since the very beginning as a tester, but I got totally enthusiast about it recently ; especially when filter became interactive and more user friendly. I ) Overview 1) What kind of problems it solves : A bit of context here, the first steps of colorizing a line-art, usually with flat zone is a super long, annoying and robotic work.

July 2017

JSON - What is JSON? An Introduction and Guide for Beginners

in this JSON tutorial and guide, I’m attempting to provide a fairly comprehensive discussion of JSON, its history, and its usefulness. I’ll close with a list of some practical JSON tools that might come in handy in future projects. JSON Defined JSON stands for JavaScript Object Notation and it’s a data format. That is, it’s a way to hold bits of information, similar to a database. Although JSON originated outside the ECMAScript specification, it is now closely related to JavaScript with the spec now including a JSON object and many developers incorporating it as a quasi-subset of the language.

May 2017

CSS - RESPONSIVE - CALC - Imitating calc() Fallback or Fixed-Width Sidebar In Responsive Layout — Osvaldas Valutis (2013)

If you were attentive you should see that the line width: calc( 12.5em ) is the trick here. Why? Let’s see all these widths like in pairs – exactly what we need browsers to do. The first pair is width: 80% (content) and width: 16.666% (sidebar) that does the job in calc() incompatible browsers, which will just ignore calc(). It is the callback (backup). It means that the minority of website visitors will see narrower sidebar on narrower viewports. And that should be perfectly fine for people using older browser versions. The second: width: calc( 100% - 15em ) and width: calc( 12.5em ). This is for newer browser versions which will override the previous width definitions

April 2017

CSS - TAB - Pure CSS Tab Panel

KIS (Keep It Simple) A simple succession of headings and divs should lead users to assume - rightly - that those headings are followed by their respective section (by the content they "introduce"). This alone is enough for screen-reader users to make sense of the markup—after all, when it comes to content, this is the most common markup pattern on the Web.

CSS - TAB - Tab Panel, the right way...

The recipe for the best user experience: Start with POSH, a simple set of heading/div pairs Add ARIA (role, aria-selected, aria-hidden, aria-labelledby) and tabindex attributes using JavaScript as these would be confusing if there was no behavior attached to the widgets. Use JavaScript to also plug a class on the component according to its type (accordion or tabpanel). Style the widget using the selector inserted by the script, this way containers are not hidden if there is no script support. Use cursor to style the tabs because those behave like buttons (default), not links (pointer). In case the component is displayed as a Tab Panel, style it as an Accordion before its tabs start wrapping (to accomodate user’s font-size) or at narrow widths...... ../..

March 2017

CSS - GRID - Building a CSS Grid Overlay | CSS-Tricks

Let's take a look at what it takes to build a grid overlay with CSS. It will be responsive, easily customizable and make heavy use of CSS variables (known more accurately as "CSS custom properties"). If you aren't familiar with custom properties, I'd highly recommend reading What is the difference between CSS variables and preprocessor variables? and watching Lea Verou's enlighting talk on using them. This grid overlay that we're building will consider a developer tool, as in, a tool just for us, not really our users. So, let's not worry too much about browser support (If you do care, check out caniuse… data on custom properties). While it's impossible to preprocess custom properties to behave exactly the same as native support, if you use them just like you would preprocessor variables, tools like the postCSS plugin cssnext can transform them into CSS compliant with older browsers.

CSS - TRICK - FLOAT - html - Div collapse after float css - Stack Overflow

Add any overflow value other than visible to your container: div#nav { overflow:auto; } Then add width to restore the width : div#nav { width: 100%; overflow:auto; }

February 2017

BRICO - VIDEO - RECUP MOTEUR - 11. How To Wire Most Motors To Build Shop Tools, Blower motor, Washing machine, and DC to name a few - YouTube

1 janv. 2017 : I show how to wire several different types of motors and explain some of the important components. 1. AC single phase 1/4 Blower Motor (brush-less) induction motor 2. AC single phase Washing machine motor (1/2 hp and 3/4 hp) induction motor (brush-less) 3. AC single phase 3 hp (brush-less) induction motor 4. DC permanent Magnet Treadmill motor 5. AC Motor with brushes universal motors

DO IT YOURSELEF - Comment fabriquer une caméra thermique DIY - Korben

Si vous voulez vous la jouer Predator avec une caméra thermique, il va falloir casquer. Ou alors vous pouvez l'assembler vous-même en suivant le tuto de la DIY-Thermocam qui permet en utilisant le capteur infrarouge FLIR Lepton et quelques composants électroniques de filmer une image thermique de qualité pour environ 400 euros.

GITHUB - TUTORIEL FR - Tres clair et fourni - GitHub Pour les Nuls : Pas de Panique, Lancez-Vous ! (Première Partie) - Sur la route de l'IndieWeb

Nous sommes en 2013 et pas moyen d’y échapper : vous devrez apprendre comment utiliser GitHub. Pourquoi ? Parce que c’est un réseau social qui change drastiquement notre façon de travailler. Ayant démarré sous forme de plateforme collaborative pour développeurs, GitHub est désormais le plus grand espace de stockage de travaux collaboratifs dans le monde. Que vous soyez intéressé(e) pour participer à ce cerveau global ou tout simplement pour partir à la recherche de cet énorme réservoir de connaissances, vous vous devez d’y être.

January 2017

December 2016

WIN10 - TWEAK - How To Enable Paths Longer Than 260 Characters In Windows 10

If you’re running Windows 10 Pro, you will be tweaking the group policy editor. If you’re running Windows 10 Home, you will be editing the Windows registry. First, check the build number to make sure you’re running build number 1607 or above.

DISQUE DUR - REPARATION / SAUVEGARDE - Réaliser l'image d'un disque dur avec Testdisk - Korben

Testdisk pour réaliser une copie bit par bit du disque dur, soit 1,5 To. Cette copie sera un clone identique du disque, cela veut dire que vous pourrez récupérer dessus tous les fichiers même ceux qui ont été effacés par inadvertance. Pour cela, il faut donc télécharger Testdisk ici qui a la particularité de fonctionner sur tous les OS (Linux, macOS et Windows).

GIF - REFERENCES - Web / Authoring / Graphics / Animation | WebReference

Web / Authoring / Graphics / Animation 6 Animations can provide anything from a touch of creativity to a full-blown moving platform to your work. We also have listings of animation software. WebReference Articles

CSS - TUTORIEL - SASS - Les préprocesseurs CSS, c’est senSass ! - Alsacreations

Un préprocesseur CSS est un outil (ou programme) permettant de générer dynamiquement des fichiers CSS. L’objectif est d’améliorer l’écriture de ces fichiers, en apportant plus de flexibilité au développeur web (source : Wikipedia). Les préprocesseurs CSS les plus couramment employés sont aujourd’hui Sass, LESS (dont nous avons déjà parlé), PostCSS et Stylus.

October 2016

PODCAST - TUTO - RSS & Podcast - Korben

Sommaire: Lire des flux RSS et/ou des Podcasts, Créer son flux RSS et/ou des Podcasts pour soi, Créer son flux RSS et/ou des Podcasts pour son site web