Skip to content
GitLab
Commit d2c0c132 authored by ransome1's avatar ransome1
Browse files

More GUI fine grinding

parent f9a78db7
Expand all Hide whitespace changes
Inline Side-by-side
package.json
View file @ d2c0c132
{
"name": "sleek",
"productName": "sleek",
"version": "1.0.7",
"version": "1.0.8",
"description": "Todo app based on todo.txt for Linux, Windows and MacOS, free and open-source",
"synopsis": "Todo app based on todo.txt for Linux, Windows and MacOS, free and open-source",
"category": "ProjectManagement",
......@@ -92,9 +92,9 @@
"artifactName": "${productName}-${version}-${arch}.${ext}"
},
"scripts": {
"build:windows": "electron-builder -w --publish never",
"build:macos": "electron-builder -m --publish never",
"build:linux": "electron-builder -l --publish never",
"build:windows": "yarn build:css && yarn build:pegjs && electron-builder -w --publish never",
"build:macos": "yarn build:css && yarn build:pegjs && electron-builder -m --publish never",
"build:linux": "yarn build:css && yarn build:pegjs && electron-builder -l --publish never",
"build:appx": "electron-builder -w appx --publish never",
"build:pacman": "electron-builder -l pacman --publish never",
"build:appimage": "yarn build:css && yarn build:pegjs && electron-builder -l AppImage --publish never",
......
src/css/style.css
View file @ d2c0c132
......@@ -674,6 +674,9 @@ nav ul:nth-child(2) {
.contentContainer {
height: 80%;
}
.contentContainer p {
padding: 0 10%;
}
#recurrencePicker {
position: relative;
......@@ -905,23 +908,25 @@ nav ul:nth-child(2) {
display: block;
}
#todoTable {
width: 100%;
min-width: 30em;
float: left;
display: none;
padding: 0 2.5em 1.5em 2.5em;
}
#todoTable #resultStats {
#resultStats {
width: 100%;
display: none;
text-align: center;
padding: 0;
white-space: nowrap;
}
#todoTable #resultStats.is-active {
#resultStats.is-active {
display: block;
}
#todoTable {
width: 100%;
min-width: 30em;
float: left;
display: none;
padding: 0 2.5em 1.5em 2.5em;
}
#todoTable #todoTableContainer {
width: 100%;
float: left;
......@@ -1226,13 +1231,6 @@ nav ul:nth-child(2) {
display: block;
}
#modalPrompt {
z-index: 60;
}
#modalPrompt .modal-content {
width: 20em;
}
#sortByContainer {
width: auto;
float: none;
......@@ -1311,11 +1309,13 @@ nav ul:nth-child(2) {
overflow-x: hidden;
}
.contexts .button {
.contexts .button,
.contexts .button:hover {
background: #c5ede3;
color: #1e6251;
}
.contexts .button span.tag {
.contexts .button span.tag,
.contexts .button:hover span.tag {
color: white;
background: #2a8971;
}
......@@ -1324,11 +1324,13 @@ nav ul:nth-child(2) {
color: white;
}
.projects .button {
.projects .button,
.projects .button:hover {
background: #f1d6f1;
color: #6f266f;
}
.projects .button span.tag {
.projects .button span.tag,
.projects .button:hover span.tag {
color: white;
background: #953395;
}
......@@ -1337,7 +1339,8 @@ nav ul:nth-child(2) {
color: white;
}
.priority .button {
.priority .button,
.priority .button:hover {
font-size: 1.2em;
font-family: FreeSansBold;
background: #ccc;
......@@ -1345,7 +1348,8 @@ nav ul:nth-child(2) {
padding: 0.25em 0.7em;
height: auto;
}
.priority .button span.tag {
.priority .button span.tag,
.priority .button:hover span.tag {
color: inherit;
}
.priority .button:hover {
......@@ -1466,6 +1470,13 @@ nav ul:nth-child(2) {
border-radius: 50%;
}
#modalPrompt {
z-index: 60;
}
#modalPrompt .modal-content {
width: 20em;
}
.modal .card-header-title {
font-family: "FreeSansBold";
padding: 1em 1.5em 0 1.5em;
......@@ -1574,23 +1585,6 @@ nav ul:nth-child(2) {
margin-bottom: 0;
}
.datepicker {
z-index: 60;
}
.datepicker .datepicker-cell.today.focused:not(.selected),
.datepicker .datepicker-cell.today:not(.selected) {
background: #f5f5f5 !important;
}
.datepicker .datepicker-footer {
background: none;
}
.datepicker .datepicker-footer .datepicker-controls .button {
font-size: 1em;
background: none;
border-color: transparent;
color: #3273dc;
}
#messages {
width: 25em;
position: fixed;
......@@ -1789,6 +1783,20 @@ body.compact #autoCompleteContainer h4 {
.datepicker {
display: none;
z-index: 60;
}
.datepicker .datepicker-cell.today.focused:not(.selected),
.datepicker .datepicker-cell.today:not(.selected) {
background: #f5f5f5 !important;
}
.datepicker .datepicker-footer {
background: none;
}
.datepicker .datepicker-footer .datepicker-controls .button {
font-size: 1em;
background: none;
border-color: transparent;
color: #3273dc;
}
.datepicker.active {
......
src/css/style.css.map
View file @ d2c0c132
This diff is collapsed.
src/index.html
View file @ d2c0c132
......@@ -196,11 +196,11 @@
</div>
</section>
<section id="todoTable" tabindex="-1">
<div id="resultStats">
<span class="tag"></span>
</div>
<div id="resultStats" class="column">
<span class="tag"></span>
</div>
<section id="todoTable" tabindex="-1">
<div id="todoTableContainer"></div>
......
src/js/filterlang.mjs 0 → 100644
View file @ d2c0c132
This diff is collapsed.
src/scss/compact.scss 0 → 100644
View file @ d2c0c132
// ####################################
// COMPACT
// ####################################
@mixin compact() {
table tr td {
padding: 0.25em 1.5em 0.25em 0 !important
}
#sortByContainer li {
padding: 0.25em 0.5em;
}
#todoTableSearchContainer {
padding: 1em;
.column {
padding: 0;
.icon.is-left {
top: 0;
left: 0;
}
}
}
#todoTable {
padding: 0 1.5em 1.5em 1.5em;
.group:first-child {
margin-top: 0;
}
.todo {
.cell {
padding: .25em 0;
.text {
margin: 0;
}
}
.cell.itemDueDate {
.tags {
top: -1.9em;
right: -1.9em;
}
i.fa-sort-down {
right: .2em;
bottom: 1.7em;
color: inherit;
}
}
}
}
nav ul {
width: 3.5em;
li {
width: 3.5em;
height: 3.5em;
line-height: 3.5em;
}
}
#autoCompleteContainer,
.drawer {
padding: 1.5em;
.is-4 {
font-size: 1.1em;
}
.priority {
.button {
font-size: 1em;
}
}
.button {
font-size: 0.9em;
margin: 0 0.3em 0.3em 0!important;
padding: 0.25em 0.6em;
.tag {
width: auto;
height: auto;
padding: 0 .5em;
min-width: 1.5em;
min-height: 1.5em;
font-size: .9em;
}
}
}
#autoCompleteContainer {
padding: 1em;
h4 {
margin-top: 0;
}
}
}
@media screen and (max-width: 992px),
screen and (max-height: 650px) {
@include compact;
}
body.compact {
@include compact;
}
src/scss/datepicker.scss
View file @ d2c0c132
.datepicker {
display: none; }
display: none;
z-index: 60;
.datepicker-cell.today.focused:not(.selected),
.datepicker-cell.today:not(.selected) {
background: $almost-white !important;
}
.datepicker-footer {
background: none;
.datepicker-controls .button {
font-size: 1em;
background: none;
border-color: transparent;
color: $has-text-link;
}
}
}
.datepicker.active {
display: block; }
......
src/scss/style.scss
View file @ d2c0c132
......@@ -262,6 +262,9 @@ nav {
.contentContainer {
height: 80%;
p {
padding: 0 10%;
}
}
#recurrencePicker {
position: relative;
......@@ -408,9 +411,6 @@ nav {
padding: 0;
margin: 0 0 1.5em 0;
}
// table {
// margin-bottom: 2em;
// }
table tr td:nth-child(odd) {
width: auto;
vertical-align: middle;
......@@ -492,22 +492,22 @@ nav {
#todoTableSearchContainer.is-active {
display: block;
}
#resultStats {
width: 100%;
display: none;
text-align: center;
padding: 0;
white-space: nowrap;
}
#resultStats.is-active {
display: block;
}
#todoTable {
width: 100%;
min-width: 30em;
float: left;
display: none;
padding: 0 2.5em 1.5em 2.5em;
#resultStats {
width: 100%;
display: none;
text-align: center;
padding: 0;
white-space: nowrap;
}
#resultStats.is-active {
display: block;
}
#todoTableContainer {
width: 100%;
float: left;
......@@ -731,14 +731,6 @@ nav {
width: auto;
float: left;
margin: .5em .5em .5em 0;
// input,
// input::placeholder,
// select,
// select::placeholder {
// background: none !important;
// border: none;
// color: $has-text-link !important;
// }
}
.message {
display: none;
......@@ -814,13 +806,6 @@ nav {
#filterContext.is-active {
display: block;
}
#modalPrompt {
z-index: 60;
.modal-content {
width: 20em;
}
}
#sortByContainer {
width: auto;
float: none;
......@@ -846,32 +831,7 @@ nav {
li.drag-sort-active {
border-left: 0.2em solid $has-text-link;
}
// li:last-child {
// border: none;
// }
}
// .drag-box,
// .drag-box.tag,
// .drag-box:hover {
// cursor: grab;
// text-align: left;
// margin: 0 0 0.25em 0;
// padding: 0.4em 1em 0.5em 1em;
// white-space: nowrap;
// border-bottom: 1px solid $mid-grey;
// i {
// margin-right: 1em;
// color: $has-text-link;
// }
// }
// .drag-box-dragging,
// .drag-helper {
// list-style: none;
// cursor: grab;
// border: none!important;
// }
}
.contentContainer {
width: 100%;
height: 90%;
......@@ -921,7 +881,8 @@ nav {
}
}
.contexts {
.button {
.button,
.button:hover {
background: $sleek-contexts-button;
color: darken($sleek-contexts-button, 60%);
span.tag {
......@@ -935,7 +896,8 @@ nav {
}
}
.projects {
.button {
.button,
.button:hover {
background: $sleek-projects-button;
color: darken($sleek-projects-button, 60%);
span.tag {
......@@ -949,7 +911,8 @@ nav {
}
}
.priority {
.button {
.button,
.button:hover {
font-size: 1.2em;
font-family: FreeSansBold;
background: $mid-grey;
......@@ -1016,6 +979,11 @@ nav {
}
}
}
// ####################################
// TOGGLE
// ####################################
.toggle {
margin: 0;
text-align: center;
......@@ -1077,6 +1045,18 @@ nav {
}
}
}
// ####################################
// MODAL
// ####################################
#modalPrompt {
z-index: 60;
.modal-content {
width: 20em;
}
}
.modal {
.card-header-title {
font-family: "FreeSansBold";
......@@ -1131,16 +1111,6 @@ nav {
ul li a {
text-decoration: underline;
}
// table tr td:nth-child(odd) {
// width: auto;
// vertical-align: middle;
// }
// table tr td:nth-child(even) {
// width: auto;
// text-align: center;
// padding-right: 0 !important;
// }
table.settings {
tr {
td {
......@@ -1202,22 +1172,11 @@ nav {
}
}
}
.datepicker {
z-index: 60;
.datepicker-cell.today.focused:not(.selected),
.datepicker-cell.today:not(.selected) {
background: $almost-white !important;
}
.datepicker-footer {
background: none;
.datepicker-controls .button {
font-size: 1em;
background: none;
border-color: transparent;
color: $has-text-link;
}
}
}
// ####################################
// MESSAGES
// ####################################
#messages {
width: 25em;
position: fixed;
......@@ -1248,96 +1207,7 @@ nav {
background-color: $has-text-danger;
}
}
@mixin compact() {
table tr td {
padding: 0.25em 1.5em 0.25em 0 !important
}
#sortByContainer li {
padding: 0.25em 0.5em;
}
#todoTableSearchContainer {
padding: 1em;
.column {
padding: 0;
.icon.is-left {
top: 0;
left: 0;
}
}
}
#todoTable {
padding: 0 1.5em 1.5em 1.5em;
.group:first-child {
margin-top: 0;
}
.todo {
.cell {
padding: .25em 0;
.text {
margin: 0;
}
}
.cell.itemDueDate {
.tags {
top: -1.9em;
right: -1.9em;
}
i.fa-sort-down {
right: .2em;
bottom: 1.7em;
color: inherit;
}
}
}
}
nav ul {
width: 3.5em;
li {
width: 3.5em;
height: 3.5em;
line-height: 3.5em;
}
}
#autoCompleteContainer,
.drawer {
padding: 1.5em;
.is-4 {
font-size: 1.1em;
}
.priority {
.button {
font-size: 1em;
}
}
.button {
font-size: 0.9em;
margin: 0 0.3em 0.3em 0!important;
padding: 0.25em 0.6em;
.tag {
width: auto;
height: auto;
padding: 0 .5em;
min-width: 1.5em;
min-height: 1.5em;
font-size: .9em;
}
}
}
#autoCompleteContainer {
padding: 1em;
h4 {
margin-top: 0;
}
}
}
@media screen and (max-width: 992px),
screen and (max-height: 650px) {
@include compact;
}
body.compact {
@include compact;
}
@import "compact.scss";
@import "datepicker.scss";
@import "../../node_modules/bulma/bulma.sass";
Supports Markdown