chylex/TweetDuck
1
0
Fork 0
mirror of https://github.com/chylex/TweetDuck.git synced 2025-04-15 06:15:47 +02:00
Code

Add option for larger quote font size to edit-design & update modal layout

Browse Source
This commit is contained in:
chylex 2017-10-16 15:38:19 +02:00
parent 093ac1ac40
commit 4704197c09
3 changed files with 34 additions and 12 deletions
Resources/Plugins/edit-design
.metabrowser.jsmodal.html

2
Resources/Plugins/edit-design/.meta
View File

@ -8,7 +8,7 @@ Edit layout & design
chylex
[version]
1.1.4
1.1.5
[website]
https://tweetduck.chylex.com

9
Resources/Plugins/edit-design/browser.js
View File

@ -12,6 +12,7 @@ enabled(){
moveTweetActionsToRight: true,
themeColorTweaks: true,
revertIcons: true,
increaseQuoteTextSize: false,
smallComposeTextSize: false,
optimizeAnimations: true,
avatarRadius: 2
@ -366,6 +367,10 @@ enabled(){
this.css.insert(".tweet-actions > li:nth-child(4) { margin-right: 2px !important }");
}
if (this.config.increaseQuoteTextSize){
this.css.insert(".quoted-tweet { font-size: 1em !important }");
}
if (this.config.smallComposeTextSize){
this.css.insert(".compose-text { font-size: 12px !important; height: 120px !important }");
}
@ -510,6 +515,10 @@ enabled(){
html[data-td-font] { font-size: ${this.config.fontSize} !important }
.avatar { border-radius: ${this.config.avatarRadius}% !important }
${this.config.increaseQuoteTextSize ? `
.quoted-tweet { font-size: 1em !important }
` : ``}
${this.config.revertIcons ? `
@font-face { font-family: 'tweetdeckold'; src: url(\"https://ton.twimg.com/tweetdeck-web/web/assets/fonts/tweetdeck-regular-webfont.5f4ea87976.woff\") format(\"woff\"); font-weight: normal; font-style: normal }
.icon-reply:before{content:"\\f006";font-family:tweetdeckold}

35
Resources/Plugins/edit-design/modal.html
View File

@ -61,15 +61,13 @@
<option value="16px">Largest (16px)</option>
<option value="custom">Custom</option>
</select>
<!-- ADVANCED -->
<label class="txt-uppercase touch-larger-label">
<b>Advanced</b>
<label class="checkbox">
<input data-td-key="increaseQuoteTextSize" class="js-theme-checkbox touch-larger-label" type="checkbox">
Increase quoted tweet font size
</label>
<label class="checkbox">
<input data-td-key="optimizeAnimations" class="js-theme-checkbox touch-larger-label" type="checkbox">
Use more memory for smoother animations
<input data-td-key="smallComposeTextSize" class="js-theme-checkbox touch-larger-label" type="checkbox">
Small tweet input font size
</label>
</div>
@ -102,9 +100,15 @@
<input data-td-key="revertIcons" class="js-theme-checkbox touch-larger-label" type="checkbox">
Revert icon design
</label>
<!-- ADVANCED -->
<label class="txt-uppercase touch-larger-label">
<b>Advanced</b>
</label>
<label class="checkbox">
<input data-td-key="smallComposeTextSize" class="js-theme-checkbox touch-larger-label" type="checkbox">
Small compose tweet font size
<input data-td-key="optimizeAnimations" class="js-theme-checkbox touch-larger-label" type="checkbox">
Use more memory for smoother animations
</label>
</div>
@ -163,11 +167,12 @@
.td-modal-inner-cols .l-column {
padding: 15px 9px;
box-sizing: border-box;
width: 225px;
font-size: 0; /* fix custom font size breaking the modal layout */
}
.td-modal-inner-cols .l-column:nth-child(2) {
width: 250px;
.td-modal-inner-cols .l-column:nth-child(3) {
width: 200px;
}
.td-modal-inner-full {
@ -199,6 +204,14 @@
cursor: pointer;
}
.td-modal-content select + label.checkbox {
margin-top: 9px;
}
.td-modal-content input.js-theme-checkbox, .td-modal-content input.js-theme-radio {
margin-top: 1px;
}
/* Avatar shape */
.td-avatar-shape-container {