1nicerOli
/
timetrack
Archived
1
0
Fork 0
Code Issues 1 Pull Requests Projects 1 Releases Wiki Activity
Browse Source

redesign; menu on left;

modals-to-spa
stingl 4 years ago
parent
5ce9e2f3b3
commit
faa24e8791
2 changed files with 40 additions and 55 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 43
      css/app.css
  2. 52
      index.html

43
css/app.css
Unescape View File

@ -21,38 +21,13 @@ body {
} }
.side-button-right { .side-button-right {
/*position: fixed;*/
/*right: 30px;*/
/*height: 60px;*/
/*width: 60px;*/
font-size: 1.7em; font-size: 1.7em;
} }
.add-tracker-button { .add-tracker-button {
/*position: fixed;*/
/*left: 30px;*/
/*bottom: 30px;*/
/*height: 60px;*/
/*width: 60px;*/
font-size: 1.7em; font-size: 1.7em;
} }
.first-button {
/*bottom: 30px;*/
}
.second-button {
/*bottom: 110px;*/
}
.third-button {
/*bottom: 190px;*/
}
.navbar-brand { .navbar-brand {
width: 100%; width: 100%;
} }
@ -125,19 +100,27 @@ nav, .card {
margin-left: 5%; margin-left: 5%;
} }
#bottom-menu { #left-menu {
position: fixed; position: fixed;
bottom: 0; top: 0;
width: 100%; left: 0;
height: 100%;
width: 90px;
align-content: center; align-content: center;
background-color: #bdbdbd; background-color: #bdbdbd;
height: 90px; border-right: 1px solid grey;
border-top: 1px solid grey;
padding: 0; padding: 0;
} }
#content {
margin-left: 90px;
max-width: 85vw;
}
.bottom-menu-item { .bottom-menu-item {
width: 100%; width: 100%;
margin-bottom: 1em;
} }
.btn-switcher { .btn-switcher {

52
index.html
Unescape View File

@ -15,26 +15,27 @@
<body> <body>
<div id="root"> <div id="root">
<div class="container"> <!-- Tracker-Display -->
<div class="container" id="content">
<link rel="stylesheet" :href="'https://bootswatch.com/5/' + theme + '/bootstrap.min.css'"> <link rel="stylesheet" :href="'https://bootswatch.com/5/' + theme + '/bootstrap.min.css'">
<link rel="stylesheet" href="css/app.css"> <link rel="stylesheet" href="css/app.css">
<nav class="navbar navbar-expand-lg navbar-light bg-light"> <!-- <nav class="navbar navbar-expand-lg navbar-light bg-light">-->
<a class="navbar-brand"> <!-- <a class="navbar-brand">-->
<img :src="dashboardLogo" alt="logo" class="logo-nav float-end" v-if="dashboardLogo"/> <!-- <img :src="dashboardLogo" alt="logo" class="logo-nav float-end" v-if="dashboardLogo"/>-->
<div v-if="experimental.trackWorktime"> <!-- <div v-if="experimental.trackWorktime">-->
<template v-if="worktimeTracker.tracking"> <!-- <template v-if="worktimeTracker.tracking">-->
<i class="far fa-pause-circle"></i> <!-- <i class="far fa-pause-circle"></i>-->
<i class="far fa-stop-circle" @click="stopTracking(worktimeTracker)"></i> <!-- <i class="far fa-stop-circle" @click="stopTracking(worktimeTracker)"></i>-->
</template> <!-- </template>-->
<template v-else> <!-- <template v-else>-->
<a href="javascript:" @click="startTracking(worktimeTracker)"> <!-- <a href="javascript:" @click="startTracking(worktimeTracker)">-->
<i class="far fa-play-circle"></i> <!-- <i class="far fa-play-circle"></i>-->
</a> <!-- </a>-->
</template> <!-- </template>-->
</div> <!-- </div>-->
<h5 class="brand-title">Timetrack</h5> <!-- <h5 class="brand-title">Timetrack</h5>-->
</a> <!-- </a>-->
</nav> <!-- </nav>-->
<div class="row" v-if="!experimental.boardView || view === 'trackers'"> <div class="row" v-if="!experimental.boardView || view === 'trackers'">
<div class="col-md-12"> <div class="col-md-12">
<div class="row"> <div class="row">
@ -762,7 +763,8 @@
</div> </div>
</div> </div>
<div id="bottom-menu"> <!-- Menu section -->
<div id="left-menu">
<div class="container"> <div class="container">
<div class="row"> <div class="row">
<div class="col"> <div class="col">
@ -776,7 +778,7 @@
</ul> </ul>
</div> </div>
</div> </div>
<div class="col" v-if="tickets.length > 0"> <div class="" v-if="tickets.length > 0">
<a type="button" <a type="button"
class="btn btn-primary text-light bottom-menu-item" class="btn btn-primary text-light bottom-menu-item"
data-bs-toggle="modal" data-bs-toggle="modal"
@ -786,7 +788,7 @@
<i class="fas fa-clock"></i> <i class="fas fa-clock"></i>
</a> </a>
</div> </div>
<div class="col" v-if="archive.length > 0"> <div class="" v-if="archive.length > 0">
<a type="button" <a type="button"
class="btn btn-secondary text-dark bottom-menu-item" class="btn btn-secondary text-dark bottom-menu-item"
data-bs-toggle="modal" data-bs-toggle="modal"
@ -796,7 +798,7 @@
<i class="fas fa-archive"></i> <i class="fas fa-archive"></i>
</a> </a>
</div> </div>
<div class="col" v-if="experimental.portalSwitcher"> <div class="" v-if="experimental.portalSwitcher">
<a type="button" <a type="button"
class="btn btn-warning text-light bottom-menu-item" class="btn btn-warning text-light bottom-menu-item"
data-bs-toggle="modal" data-bs-toggle="modal"
@ -806,7 +808,7 @@
<i class="fas fa-random"></i> <i class="fas fa-random"></i>
</a> </a>
</div> </div>
<div class="col" v-if="experimental.snippetSpace"> <div class="" v-if="experimental.snippetSpace">
<a type="button" <a type="button"
class="btn btn-info text-light bottom-menu-item" class="btn btn-info text-light bottom-menu-item"
data-bs-toggle="modal" data-bs-toggle="modal"
@ -816,7 +818,7 @@
<i class="fas fa-code"></i> <i class="fas fa-code"></i>
</a> </a>
</div> </div>
<div class="col"> <div class="">
<a type="button" <a type="button"
class="btn btn-info text-light bottom-menu-item" class="btn btn-info text-light bottom-menu-item"
data-bs-toggle="modal" data-bs-toggle="modal"
@ -826,7 +828,7 @@
<i class="fas fa-history"></i> <i class="fas fa-history"></i>
</a> </a>
</div> </div>
<div class="col"> <div class="">
<a type="button" <a type="button"
class="btn btn-dark text-light bottom-menu-item" class="btn btn-dark text-light bottom-menu-item"
data-bs-toggle="modal" data-bs-toggle="modal"