🐛 Use box-sizing attribute in counters

CHANGELOG.md

@@ -1,6 +1,7 @@
 ### v1.1.13 (2020-04-20)
 #### Bug fixes
 - Use `idempotent-babel-polyfill` instead of `babel-polyfill` as a workaround to [this issue](https://github.com/babel/babel-loader/issues/401).
+- Use the `box-sizing` CSS attribute to compute the real with of the counters area in `DefaultSkin`.
 
 #### Improvements
 - Full screen mode now using direct calls to the [Full Screen API](https://developer.mozilla.org/en-US/docs/Web/API/Fullscreen_API) instead of [screenfull](https://www.npmjs.com/package/screenfull).

README.md

@@ -70,7 +70,6 @@ JClic.js makes use of:
 * [JSZip](https://stuk.github.io/jszip/) to extract contents from "jclic.zip" files
 * [clipboard.js](https://github.com/lgarron/clipboard.js) to copy reports data into the user's clipboard
 * [i18next](https://github.com/i18next/i18next) to deal with messages translated into different languages
-* [screenfull.js](https://github.com/sindresorhus/screenfull.js) to allow activities play at full screen
 * [script.js](https://github.com/ded/script.js) to read JClic projects from local file systems as JSONP
 * [webfontloader](https://github.com/typekit/webfontloader) to dynamically load web fonts as needed
 * [MidiPlayerJS](https://github.com/grimmdude/MidiPlayerJS), [soundfont-player](https://github.com/danigb/soundfont-player), [audio-loader](https://github.com/audiojs/audio-loader) and [sample-player](https://github.com/danigb/sample-player) to process and play MIDI files

src/skins/DefaultSkin.js

@@ -267,7 +267,7 @@ define([
 .ID .JClicMsgBox {height:60px; -webkit-flex-grow:1; flex-grow:1; background-color:lightblue;}\
 .ID .JClicBtn {cursor:pointer; line-height:0;}\
 .ID .JClicBtn:disabled {cursor:inherit; opacity:0.3;}\
-.ID .JClicCounter {width:40px; height:20px; padding-left:20px; color:white; cursor:pointer; font-family:Roboto,Sans-serif; font-size:18px; text-align:center; background-repeat:no-repeat; background-position:left}',
+.ID .JClicCounter {width:40px; height:20px; padding-left:20px; color:white; cursor:pointer; font-family:Roboto,Sans-serif; font-size:18px; text-align:center; background-repeat:no-repeat; background-position:left; box-sizing:content-box;}',
     /**
      * Styles used in this skin, sized to half its regular size
      * @name DefaultSkin#mainCSSHalf