mirror of
https://github.com/naturalcrit/homebrewery.git
synced 2026-09-27 06:52:59 +00:00
use common CSS
This commit is contained in:
@@ -1,5 +1,5 @@
|
||||
/* eslint-disable max-lines */
|
||||
import './metadataEditor.less';
|
||||
import '../uiEditor.less';
|
||||
import React from 'react';
|
||||
import createReactClass from 'create-react-class';
|
||||
import _ from 'lodash';
|
||||
@@ -355,7 +355,7 @@ const MetadataEditor = createReactClass({
|
||||
},
|
||||
|
||||
render : function(){
|
||||
return <div className='metadataEditor'>
|
||||
return <div className='metadataEditor ui-editor'>
|
||||
<h1>Properties Editor</h1>
|
||||
|
||||
<div className='field title'>
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import './settingsEditor.less';
|
||||
import '../uiEditor.less';
|
||||
import React, { useState } from 'react';
|
||||
|
||||
const SettingsEditor = ({ settings, updateSettings = ()=>{} })=>{
|
||||
@@ -50,7 +50,7 @@ const SettingsEditor = ({settings, updateSettings = () => {} }) => {
|
||||
};
|
||||
|
||||
return (
|
||||
<div className='settingsEditor'>
|
||||
<div className='settingsEditor ui-editor'>
|
||||
<h1>Editor Settings</h1>
|
||||
{/*
|
||||
<div className='field title'>
|
||||
@@ -66,10 +66,11 @@ const SettingsEditor = ({settings, updateSettings = () => {} }) => {
|
||||
/>
|
||||
</div> */}
|
||||
|
||||
<div className='field title'>
|
||||
<div className='field'>
|
||||
<label htmlFor='autoCloseBrackets'>
|
||||
Automatically close brackets
|
||||
</label>
|
||||
<div className='value'>
|
||||
<input
|
||||
id='autoCloseBrackets'
|
||||
type='checkbox'
|
||||
@@ -78,11 +79,13 @@ const SettingsEditor = ({settings, updateSettings = () => {} }) => {
|
||||
onChange={(e)=>handleFieldChange('autoCloseBrackets', e)}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className='field title'>
|
||||
<div className='field'>
|
||||
<label htmlFor='showImagePreviews'>
|
||||
Show Image Previews when hovering a link
|
||||
</label>
|
||||
<div className='value'>
|
||||
<input
|
||||
id='showImagePreviews'
|
||||
type='checkbox'
|
||||
@@ -91,11 +94,13 @@ const SettingsEditor = ({settings, updateSettings = () => {} }) => {
|
||||
onChange={(e)=>handleFieldChange('showImagePreviews', e)}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className='field title'>
|
||||
<div className='field'>
|
||||
<label htmlFor='activeLineShading'>
|
||||
Background shading of active line
|
||||
</label>
|
||||
<div className='value'>
|
||||
<input
|
||||
id='activeLineShading'
|
||||
type='checkbox'
|
||||
@@ -105,8 +110,11 @@ const SettingsEditor = ({settings, updateSettings = () => {} }) => {
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className='field title'>
|
||||
</div>
|
||||
|
||||
<div className='field'>
|
||||
<label htmlFor='lineNumbers'>Show Line Numbers</label>
|
||||
<div className='value'>
|
||||
<input
|
||||
id='lineNumbers'
|
||||
type='checkbox'
|
||||
@@ -115,11 +123,13 @@ const SettingsEditor = ({settings, updateSettings = () => {} }) => {
|
||||
onChange={(e)=>handleFieldChange('lineNumbers', e)}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className='field title'>
|
||||
<div className='field'>
|
||||
<label htmlFor='fontSize'>
|
||||
Editor Font Size (in px)
|
||||
</label>
|
||||
<div className='value'>
|
||||
<input
|
||||
id='fontSize'
|
||||
type='number'
|
||||
@@ -131,6 +141,7 @@ const SettingsEditor = ({settings, updateSettings = () => {} }) => {
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
|
||||
+14
-1
@@ -5,7 +5,7 @@
|
||||
padding-left : 10px;
|
||||
}
|
||||
|
||||
.metadataEditor {
|
||||
.ui-editor {
|
||||
position : absolute;
|
||||
box-sizing : border-box;
|
||||
width : 100%;
|
||||
@@ -60,6 +60,7 @@
|
||||
& > .value {
|
||||
flex : 1 1 auto;
|
||||
width : 50px;
|
||||
justify-self: end;
|
||||
&[data-tooltip-right] { max-width : 380px; }
|
||||
&:invalid { background : #FFB9B9; }
|
||||
small {
|
||||
@@ -68,6 +69,11 @@
|
||||
font-style : italic;
|
||||
line-height : 1.4em;
|
||||
}
|
||||
|
||||
input[type='checkbox'] {
|
||||
display:block;
|
||||
margin-left:auto;
|
||||
}
|
||||
}
|
||||
input[type='text'], textarea {
|
||||
border : 1px solid gray;
|
||||
@@ -372,3 +378,10 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.settingsEditor .field {
|
||||
> label {
|
||||
width:200px;
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user