Overview
| Comment: | [fx] gc panel: set size and position update |
|---|---|
| Downloads: | Tarball | ZIP archive | SQL archive |
| Timelines: | family | ancestors | descendants | both | trunk | fx |
| Files: | files | file ages | folders |
| SHA3-256: |
a0ef5bac858e39e7b4ee042d703a8ea7 |
| User & Date: | olr on 2019-05-20 08:40:48 |
| Other Links: | manifest | tags |
Context
|
2019-05-20
| ||
| 12:18 | [fx] gc panel: CSS adjustements and auto-refresh adjustements check-in: e4791e17bb user: olr tags: trunk, fx | |
| 08:40 | [fx] gc panel: set size and position update check-in: a0ef5bac85 user: olr tags: trunk, fx | |
| 08:40 | [fr] ocr: set options to ocr check-in: 9f2404ab0b user: olr tags: trunk, fr | |
Changes
Modified gc_lang/fr/webext/content_scripts/panel.css from [8c125dc8b5] to [8f13a1fabe].
| ︙ | ︙ | |||
70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 |
font-weight: bold;
text-align: center;
cursor: pointer;
}
div.grammalecte_copy_button {
border-radius: 2px;
color: hsla(210, 0%, 100%, .5);
}
div.grammalecte_copy_button:hover {
background-color: hsl(210, 90%, 35%, .5);
color: hsla(210, 0%, 100%, 1);
}
div.grammalecte_move_button {
padding: 1px 5px;
border-radius: 16px;
color: hsl(180, 0%, 100%);
opacity: .5;
}
div.grammalecte_move_button_center {
padding: 1px 10px;
background: center no-repeat url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12"><circle fill="%23fff" cx="6" cy="6" r="4"/></svg>') ;
}
div.grammalecte_move_button_up {
padding: 1px 10px;
| > > > > > > > > | 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 |
font-weight: bold;
text-align: center;
cursor: pointer;
}
div.grammalecte_copy_button {
border-radius: 2px;
color: hsla(210, 0%, 100%, .5);
margin-right: 10px;
}
div.grammalecte_copy_button:hover {
background-color: hsl(210, 90%, 35%, .5);
color: hsla(210, 0%, 100%, 1);
}
div.grammalecte_move_button {
padding: 1px 5px;
border-radius: 16px;
color: hsl(180, 0%, 100%);
opacity: .5;
}
div.grammalecte_move_button_changeWidth {
padding: 3px 5px;
}
div.grammalecte_move_button_changeHeight {
padding: 3px 5px;
margin-right: 10px;
}
div.grammalecte_move_button_center {
padding: 1px 10px;
background: center no-repeat url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12"><circle fill="%23fff" cx="6" cy="6" r="4"/></svg>') ;
}
div.grammalecte_move_button_up {
padding: 1px 10px;
|
| ︙ | ︙ | |||
102 103 104 105 106 107 108 |
background: center no-repeat url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12"><path fill="%23fff" d="m 0,2 6,6 6,-6"/></svg>');
}
div.grammalecte_move_button_left {
padding: 1px 10px;
background: center no-repeat url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12"><path fill="%23fff" d="m 2,6 6,6 v -12"/></svg>');
}
div.grammalecte_move_button:hover {
| | | 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 |
background: center no-repeat url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12"><path fill="%23fff" d="m 0,2 6,6 6,-6"/></svg>');
}
div.grammalecte_move_button_left {
padding: 1px 10px;
background: center no-repeat url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12"><path fill="%23fff" d="m 2,6 6,6 v -12"/></svg>');
}
div.grammalecte_move_button:hover {
background-color: hsla(180, 80%, 50%, .2);
color: hsla(180, 0%, 100%, 1);
opacity: 1;
}
div.grammalecte_close_button {
border-radius: 0 8px 0 4px;
background-color: hsla(0, 80%, 50%, .5);
color: hsla(210, 0%, 100%, .5);
|
| ︙ | ︙ |
Modified gc_lang/fr/webext/content_scripts/panel.js from [811e4142bb] to [84014faa6e].
| ︙ | ︙ | |||
67 68 69 70 71 72 73 |
_createButtons () {
let xButtonLine = oGrammalecte.createNode("div", {className: "grammalecte_panel_commands"});
xButtonLine.appendChild(this.xWaitIcon);
if (this.sId === "grammalecte_gc_panel") {
xButtonLine.appendChild(this._createCopyButton());
}
if (this.bFlexible) {
| > > | | | 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 |
_createButtons () {
let xButtonLine = oGrammalecte.createNode("div", {className: "grammalecte_panel_commands"});
xButtonLine.appendChild(this.xWaitIcon);
if (this.sId === "grammalecte_gc_panel") {
xButtonLine.appendChild(this._createCopyButton());
}
if (this.bFlexible) {
this.xWidthButton = this._createMoveButton("changeWidth", "L", "Étendre en largeur");
this.xHeightButton = this._createMoveButton("changeHeight", "H", "Étendre en hauteur");
xButtonLine.appendChild(this.xWidthButton);
xButtonLine.appendChild(this.xHeightButton);
}
xButtonLine.appendChild(this._createMoveButton("up", " ", "Monter")); // use char ⏶ when Windows 10 be vast majority of OS (Trebuchet MS not updated on other OS)
xButtonLine.appendChild(this._createMoveButton("left", " ", "À gauche")); // use char ⏴ when Windows 10 be vast majority of OS (Trebuchet MS not updated on other OS)
xButtonLine.appendChild(this._createMoveButton("center", " ", "Centrer")); // char • can be used already
xButtonLine.appendChild(this._createMoveButton("right", " ", "À droite")); // use char ⏵ when Windows 10 be vast majority of OS (Trebuchet MS not updated on other OS)
xButtonLine.appendChild(this._createMoveButton("down", " ", "Descendre")); // use char ⏷ when Windows 10 be vast majority of OS (Trebuchet MS not updated on other OS)
this.xCloseButton = this._createCloseButton();
|
| ︙ | ︙ | |||
178 179 180 181 182 183 184 |
changeHeight () {
this.bVertStrech = !this.bVertStrech;
this.setSizeAndPosition();
}
setSizeAndPosition () {
// size
| > > > > | | | > > > | < | > | 180 181 182 183 184 185 186 187 188 189 190 191 192 193 194 195 196 197 198 199 200 201 202 203 204 205 206 |
changeHeight () {
this.bVertStrech = !this.bVertStrech;
this.setSizeAndPosition();
}
setSizeAndPosition () {
// size
if (this.xWidthButton && this.xHeightButton) {
this.xWidthButton.style.opacity = (this.bHorizStrech) ? .9 : .5;
this.xHeightButton.style.opacity = (this.bVertStrech) ? .9 : .5;
}
let nWidth = Math.min(this.nWidth, window.innerWidth-200);
let nHeight = ([4, 5, 6].includes(this.nPosition)) ? Math.min(this.nHeight, window.innerHeight-100) : Math.floor(window.innerHeight*0.45);
if (this.bFlexible) {
if (this.bHorizStrech) {
nWidth = Math.min(this.nWidth*1.33, window.innerWidth-200);
}
if (this.bVertStrech) {
nHeight = ([4, 5, 6].includes(this.nPosition)) ? (window.innerHeight-100) : Math.floor(window.innerHeight*0.67);
}
}
this.xPanel.style.width = `${nWidth}px`;
this.xPanel.style.height = `${nHeight}px`;
// position
let oPos = null;
switch (this.nPosition) {
case 1: oPos = { top:"", right:"", bottom:"-2px", left:"-2px", marginTop:"", marginLeft:"" }; break;
|
| ︙ | ︙ |