extern/nightTab
1
0
Fork 0
mirror of https://github.com/zombieFox/nightTab.git synced 2025-01-24 14:59:10 +01:00
Code Issues Packages Projects Releases Wiki Activity

[feature] add theme font light, regular and bold controls

Browse Source
This commit is contained in:
zombieFox 2020-01-08 11:45:27 -07:00
parent cff0ebad36
commit d906c4ad8c
3 changed files with 119 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
src/index.html
View File

@ -1375,6 +1375,17 @@
<div class="control-theme-font-display-weight-count form-group-text form-group-item-medium form-group-radius-left"></div> <div class="control-theme-font-display-weight-count form-group-text form-group-item-medium form-group-radius-left"></div>
</div> </div>
</div> </div>
<div class="form-inline">
<div class="button-wrap">
<button class="control-theme-font-display-light button mb-0" tabindex="-1">Light</button>
</div>
<div class="button-wrap">
<button class="control-theme-font-display-regular button mb-0" tabindex="-1">Regular</button>
</div>
<div class="button-wrap">
<button class="control-theme-font-display-bold button mb-0" tabindex="-1">Bold</button>
</div>
</div>
<p class="control-theme-font-display-helper form-helper small">Not all fonts support all weights. Refer to the Google Font page to see which are available.</p> <p class="control-theme-font-display-helper form-helper small">Not all fonts support all weights. Refer to the Google Font page to see which are available.</p>
<hr> <hr>
<div class="input-wrap"> <div class="input-wrap">
@ -1409,6 +1420,17 @@
<div class="control-theme-font-ui-weight-count form-group-text form-group-item-medium form-group-radius-left"></div> <div class="control-theme-font-ui-weight-count form-group-text form-group-item-medium form-group-radius-left"></div>
</div> </div>
</div> </div>
<div class="form-inline">
<div class="button-wrap">
<button class="control-theme-font-ui-light button mb-0" tabindex="-1">Light</button>
</div>
<div class="button-wrap">
<button class="control-theme-font-ui-regular button mb-0" tabindex="-1">Regular</button>
</div>
<div class="button-wrap">
<button class="control-theme-font-ui-bold button mb-0" tabindex="-1">Bold</button>
</div>
</div>
<p class="control-theme-font-ui-helper form-helper small">Not all fonts support all weights. Refer to the Google Font page to see which are available.</p> <p class="control-theme-font-ui-helper form-helper small">Not all fonts support all weights. Refer to the Google Font page to see which are available.</p>
<hr> <hr>
<div class="input-wrap"> <div class="input-wrap">

48
src/js/control.js
View File

@ -2586,6 +2586,30 @@ var control = (function() {
theme.render.font.display.weight(); theme.render.font.display.weight();
render.range.count(this); render.range.count(this);
} }
}, {
element: helper.e(".control-theme-font-display-light"),
type: "button",
func: function() {
theme.mod.font.display.light();
theme.render.font.display.weight();
render.update();
}
}, {
element: helper.e(".control-theme-font-display-regular"),
type: "button",
func: function() {
theme.mod.font.display.regular();
theme.render.font.display.weight();
render.update();
}
}, {
element: helper.e(".control-theme-font-display-bold"),
type: "button",
func: function() {
theme.mod.font.display.bold();
theme.render.font.display.weight();
render.update();
}
}, { }, {
element: helper.e(".control-theme-font-display-weight-style-default"), element: helper.e(".control-theme-font-display-weight-style-default"),
type: "button", type: "button",
@ -2644,6 +2668,30 @@ var control = (function() {
theme.render.font.ui.weight(); theme.render.font.ui.weight();
render.range.count(this); render.range.count(this);
} }
}, {
element: helper.e(".control-theme-font-ui-light"),
type: "button",
func: function() {
theme.mod.font.ui.light();
theme.render.font.ui.weight();
render.update();
}
}, {
element: helper.e(".control-theme-font-ui-regular"),
type: "button",
func: function() {
theme.mod.font.ui.regular();
theme.render.font.ui.weight();
render.update();
}
}, {
element: helper.e(".control-theme-font-ui-bold"),
type: "button",
func: function() {
theme.mod.font.ui.bold();
theme.render.font.ui.weight();
render.update();
}
}, { }, {
element: helper.e(".control-theme-font-ui-weight-style-default"), element: helper.e(".control-theme-font-ui-weight-style-default"),
type: "button", type: "button",

49
src/js/theme.js
View File

@ -1106,6 +1106,55 @@ var theme = (function() {
} }
}; };
mod.font = {
display: {
light: function() {
helper.setObject({
object: state.get.current(),
path: "theme.font.display.weight",
newValue: 300
});
},
regular: function() {
helper.setObject({
object: state.get.current(),
path: "theme.font.display.weight",
newValue: 400
});
},
bold: function() {
helper.setObject({
object: state.get.current(),
path: "theme.font.display.weight",
newValue: 700
});
}
},
ui: {
light: function() {
helper.setObject({
object: state.get.current(),
path: "theme.font.ui.weight",
newValue: 300
});
},
regular: function() {
helper.setObject({
object: state.get.current(),
path: "theme.font.ui.weight",
newValue: 400
});
},
bold: function() {
helper.setObject({
object: state.get.current(),
path: "theme.font.ui.weight",
newValue: 700
});
}
}
};
var render = {}; var render = {};
render.style = { render.style = {