1
0
mirror of https://github.com/chinchang/web-maker.git synced 2025-07-27 08:40:10 +02:00

port font, default image, modalclose focus etc

This commit is contained in:
Kushagra Gour
2018-06-10 15:46:58 +05:30
parent 6c7b587ede
commit 8b6f39349b
10 changed files with 86 additions and 70 deletions

BIN
webmaker/src/FiraCode.ttf Normal file

Binary file not shown.

BIN
webmaker/src/FixedSys.ttf Normal file

Binary file not shown.

BIN
webmaker/src/Inconsolata.ttf Executable file

Binary file not shown.

BIN
webmaker/src/Monoid.ttf Normal file

Binary file not shown.

View File

@@ -1,4 +1,6 @@
import { h, Component } from 'preact'; import { h, Component } from 'preact';
const DEFAULT_PROFILE_IMG =
"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='#ccc' d='M12,19.2C9.5,19.2 7.29,17.92 6,16C6.03,14 10,12.9 12,12.9C14,12.9 17.97,14 18,16C16.71,17.92 14.5,19.2 12,19.2M12,5A3,3 0 0,1 15,8A3,3 0 0,1 12,11A3,3 0 0,1 9,8A3,3 0 0,1 12,5M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12C22,6.47 17.5,2 12,2Z' /%3E%3C/svg%3E";
export default class Header extends Component { export default class Header extends Component {
render() { render() {

View File

@@ -21,6 +21,10 @@ export default class Modal extends Component {
document.body.classList[this.props.show ? 'add' : 'remove']( document.body.classList[this.props.show ? 'add' : 'remove'](
'overlay-visible' 'overlay-visible'
); );
if (this.props.show) {
this.overlayEl.querySelector('.js-modal__close-btn').focus();
}
} }
render() { render() {
if (!this.props.show) return null; if (!this.props.show) return null;

View File

@@ -1,5 +1,8 @@
import { h, Component } from 'preact'; import { h, Component } from 'preact';
const DEFAULT_PROFILE_IMG =
"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='#ccc' d='M12,19.2C9.5,19.2 7.29,17.92 6,16C6.03,14 10,12.9 12,12.9C14,12.9 17.97,14 18,16C16.71,17.92 14.5,19.2 12,19.2M12,5A3,3 0 0,1 15,8A3,3 0 0,1 12,11A3,3 0 0,1 9,8A3,3 0 0,1 12,5M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12C22,6.47 17.5,2 12,2Z' /%3E%3C/svg%3E";
export default class Profile extends Component { export default class Profile extends Component {
render() { render() {
return ( return (

View File

@@ -159,6 +159,7 @@ export default class Settings extends Component {
<option disabled="disabled">----</option> <option disabled="disabled">----</option>
<option value="other">Other font from system</option> <option value="other">Other font from system</option>
</select> </select>
{this.props.prefs.editorFont === 'other' && (
<input <input
id="customEditorFontInput" id="customEditorFontInput"
type="text" type="text"
@@ -167,6 +168,7 @@ export default class Settings extends Component {
data-setting="editorCustomFont" data-setting="editorCustomFont"
onChange={this.updateSetting.bind(this)} onChange={this.updateSetting.bind(this)}
/> />
)}
</label> </label>
<label class="line"> <label class="line">
Font Size{' '} Font Size{' '}

View File

@@ -417,6 +417,8 @@ export default class App extends Component {
}); });
} }
componentDidMount() { componentDidMount() {
document.body.style.height = `${window.innerHeight}px`;
// Editor keyboard shortucuts // Editor keyboard shortucuts
window.addEventListener('keydown', event => { window.addEventListener('keydown', event => {
// TODO: refactor common listener code // TODO: refactor common listener code
@@ -958,9 +960,9 @@ export default class App extends Component {
settingsBtnClickHandler={() => settingsBtnClickHandler={() =>
this.setState({ isSettingsModalOpen: true }) this.setState({ isSettingsModalOpen: true })
} }
notificationsBtnClickHandler={() => notificationsBtnClickHandler={this.notificationsBtnClickHandler.bind(
this.setState({ notificationsBtnClickHandler: true }) this
} )}
supportDeveloperBtnClickHandler={this.supportDeveloperBtnClickHandler.bind( supportDeveloperBtnClickHandler={this.supportDeveloperBtnClickHandler.bind(
this this
)} )}

View File

@@ -1,5 +1,6 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<title>Web Maker</title> <title>Web Maker</title>
@@ -58,8 +59,8 @@
<style id="fontStyleTemplate" type="template"> <style id="fontStyleTemplate" type="template">
@font-face { font-family: 'fontname'; font-style: normal; font-weight: 400; src: url(fontname.ttf) format('truetype'); unicode-range: @font-face { font-family: 'fontname'; font-style: normal; font-weight: 400; src: url(fontname.ttf) format('truetype'); unicode-range:
U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF,
U+F000; } .Codemirror pre { font-family: 'fontname', monospace; } U+EFFD, U+F000; } .CodeMirror pre { font-family: 'fontname', monospace; }
</style> </style>
<style type="text/css" id="fontStyleTag"> <style type="text/css" id="fontStyleTag">
@font-face { @font-face {
@@ -70,7 +71,7 @@
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
} }
.Codemirror pre { .CodeMirror pre {
font-family: 'FiraCode', monospace; font-family: 'FiraCode', monospace;
} }
@@ -90,7 +91,9 @@
<script defer src="<%= htmlWebpackPlugin.files.chunks['bundle'].entry %>"></script> <script defer src="<%= htmlWebpackPlugin.files.chunks['bundle'].entry %>"></script>
<script> <script>
window.fetch || document.write('<script src="<%= htmlWebpackPlugin.files.chunks["polyfills"].entry %>"><\/script>') window.fetch || document.write('<script src="<%= htmlWebpackPlugin.files.chunks["polyfills"].entry %>"><\/script>')
</script> </script>
</body> </body>
</html> </html>