add some styling
This commit is contained in:
parent
1b0743b0cf
commit
7ffe9ff18b
28
src/App.css
28
src/App.css
@ -5,3 +5,31 @@
|
|||||||
position: relative;
|
position: relative;
|
||||||
padding-bottom: 60px; /* height of your footer + 30px*/
|
padding-bottom: 60px; /* height of your footer + 30px*/
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.tutorial img{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
max-height: 40vH;
|
||||||
|
max-width: 100%;
|
||||||
|
margin: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tutorial blockquote{
|
||||||
|
background: #f9f9f9;
|
||||||
|
border-left: 10px solid#4EAF47;
|
||||||
|
margin: 1.5em 10px;
|
||||||
|
padding: 0.5em 10px;
|
||||||
|
quotes: "\201C""\201D""\2018""\2019";
|
||||||
|
}
|
||||||
|
blockquote:before {
|
||||||
|
color:#4EAF47;
|
||||||
|
content: open-quote;
|
||||||
|
font-size: 4em;
|
||||||
|
line-height: 0.1em;
|
||||||
|
margin-right: 0.25em;
|
||||||
|
vertical-align: -0.4em;
|
||||||
|
}
|
||||||
|
blockquote p {
|
||||||
|
display: inline;
|
||||||
|
}
|
||||||
|
@ -234,7 +234,7 @@ class Toolbox extends React.Component {
|
|||||||
<Block type="sensebox_send_to_osem" />
|
<Block type="sensebox_send_to_osem" />
|
||||||
</Category>
|
</Category>
|
||||||
<Category id="catSenseBoxOutput_LoRa" name=" LoRa" colour={getColour().sensebox}>
|
<Category id="catSenseBoxOutput_LoRa" name=" LoRa" colour={getColour().sensebox}>
|
||||||
<Category id="catSenseBoxOutput_LoRa_activation" name=" Aktiviereung" colour={getColour().sensebox}>
|
<Category id="catSenseBoxOutput_LoRa_activation" name=" Aktivierung" colour={getColour().sensebox}>
|
||||||
<Block type="sensebox_lora_initialize_otaa" />
|
<Block type="sensebox_lora_initialize_otaa" />
|
||||||
<Block type="sensebox_lora_initialize_abp" />
|
<Block type="sensebox_lora_initialize_abp" />
|
||||||
</Category>
|
</Category>
|
||||||
|
@ -20,7 +20,7 @@ class Instruction extends Component {
|
|||||||
return (
|
return (
|
||||||
<div>
|
<div>
|
||||||
<Typography variant='h4' style={{ marginBottom: '5px' }}>{step.headline}</Typography>
|
<Typography variant='h4' style={{ marginBottom: '5px' }}>{step.headline}</Typography>
|
||||||
<Typography style={isHardware ? {} : { marginBottom: '5px' }}><ReactMarkdown allowDangerousHtml skipHtml={false}>{step.text}</ReactMarkdown></Typography>
|
<Typography style={isHardware ? {} : { marginBottom: '5px' }}><ReactMarkdown className={'tutorial'} linkTarget={'_blank'} skipHtml={false}>{step.text}</ReactMarkdown></Typography>
|
||||||
{isHardware ?
|
{isHardware ?
|
||||||
<Hardware picture={step.hardware} /> : null}
|
<Hardware picture={step.hardware} /> : null}
|
||||||
{areRequirements > 0 ?
|
{areRequirements > 0 ?
|
||||||
|
File diff suppressed because one or more lines are too long
@ -4,7 +4,7 @@ let tutorials = [
|
|||||||
require('./tutorial/Wenn-DannBedingungen.json'),
|
require('./tutorial/Wenn-DannBedingungen.json'),
|
||||||
require('./tutorial/VerwendungVonVariablen.json'),
|
require('./tutorial/VerwendungVonVariablen.json'),
|
||||||
require('./tutorial/AnzeigeVonMesswertenAufDemDisplay.json'),
|
require('./tutorial/AnzeigeVonMesswertenAufDemDisplay.json'),
|
||||||
require('./tutorial/SendenVonMesswertenueberLoRa.json')
|
require('./tutorial/SendenVonMesswertenUeberLoRa.json'),
|
||||||
require('./tutorial/MesswerteAnDieOpenSenseMapSenden.json')
|
require('./tutorial/MesswerteAnDieOpenSenseMapSenden.json')
|
||||||
]
|
]
|
||||||
|
|
||||||
|
Loading…
x
Reference in New Issue
Block a user