zotan/oeffisearch
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

header style fixes

Browse source
This commit is contained in:
Milan Pässler 2020-07-23 15:21:36 +02:00
parent 87ba60b6eb
commit 41185859f1
2 changed files with 25 additions and 11 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

22
client/js/journeysView.js
View file

@ -17,16 +17,18 @@ const journeysTemplate = (data) => html`
<a class="back icon-back" href="#/" title="${t('back')}">${t('back')}</a> <a class="back icon-back" href="#/" title="${t('back')}">${t('back')}</a>
<div class="header-content"> <div class="header-content">
<h3>${t('from')}: ${parseName(data.params.fromPoint)}</h3> <h3>${t('from')}: ${parseName(data.params.fromPoint)}</h3>
<h3>${t('to')}: ${parseName(data.params.toPoint)}</h3> <div>
<div class="mode-changers"> <h3>${t('to')}: ${parseName(data.params.toPoint)}</h3>
<a @click=${changeMode('table')} class="${dataStorage.settings.journeysViewMode !== 'canvas' ? 'active' : ''}"> <div class="mode-changers">
<div class="icon-table"></div> <a @click=${changeMode('table')} class="${dataStorage.settings.journeysViewMode !== 'canvas' ? 'active' : ''}">
<span>Table</span> <div class="icon-table"></div>
</a> <span>Table</span>
<a @click=${changeMode('canvas')} class="${dataStorage.settings.journeysViewMode === 'canvas' ? 'active' : ''}"> </a>
<div class="icon-canvas"></div> <a @click=${changeMode('canvas')} class="${dataStorage.settings.journeysViewMode === 'canvas' ? 'active' : ''}">
<span>Canvas</span> <div class="icon-canvas"></div>
</a> <span>Canvas</span>
</a>
</div>
</div> </div>
</div> </div>
<a class="back invisible" href="#/"></a> <a class="back invisible" href="#/"></a>

14
client/style.css
View file

@ -41,6 +41,12 @@ header {
flex-direction: row; flex-direction: row;
flex-wrap: wrap; flex-wrap: wrap;
} }
.header-content>div {
display: flex;
flex-direction: row;
flex-grow: 1;
flex-wrap: wrap;
}
.row { .row {
display: flex; display: flex;
@ -444,6 +450,12 @@ tbody tr:hover td {
@media (max-width: 799px) { @media (max-width: 799px) {
.back.invisible {
display: none;
}
.header-content {
flex-grow: 1;
}
.search { .search {
padding: 10px; padding: 10px;
} }
@ -938,6 +950,6 @@ form>div.history {
margin: 1em .4em; margin: 1em .4em;
} }
header h3:first-child { header h3 {
margin-right: 1.5em; margin-right: 1.5em;
} }