make checkboxes bigger
This commit is contained in:
Felix Niklas
parent
1dce17f27b
commit
e647c1eb94
12 changed files with 126 additions and 45 deletions
|
|
@ -14,7 +14,7 @@
|
|||
*= require ./medium.css
|
||||
*= require ./fira-sans.css
|
||||
*= require ./svg-dimensions.css
|
||||
*= require ./zammad.css.scss
|
||||
*= require ./zammad.scss
|
||||
*
|
||||
*= require_tree ./custom/
|
||||
*
|
||||
|
|
|
|||
|
|
@ -2,8 +2,8 @@
|
|||
.icon-arrow-left { width: 7px; height: 13px; }
|
||||
.icon-arrow-right { width: 7px; height: 13px; }
|
||||
.icon-arrow-up { width: 13px; height: 7px; }
|
||||
.icon-checkbox-checked { width: 10px; height: 10px; }
|
||||
.icon-checkbox { width: 10px; height: 10px; }
|
||||
.icon-checkbox-checked { width: 11px; height: 11px; }
|
||||
.icon-checkbox { width: 11px; height: 11px; }
|
||||
.icon-checkmark { width: 16px; height: 14px; }
|
||||
.icon-clipboard { width: 16px; height: 16px; }
|
||||
.icon-clock { width: 16px; height: 16px; }
|
||||
|
|
@ -70,6 +70,9 @@
|
|||
.icon-status { width: 16px; height: 16px; }
|
||||
.icon-stopwatch { width: 77px; height: 83px; }
|
||||
.icon-switchView { width: 19px; height: 18px; }
|
||||
.icon-task-state-modified-inner-circle { width: 16px; height: 16px; }
|
||||
.icon-task-state-modified-outer-circle { width: 16px; height: 16px; }
|
||||
.icon-task-state { width: 16px; height: 16px; }
|
||||
.icon-team { width: 16px; height: 16px; }
|
||||
.icon-templates { width: 24px; height: 24px; }
|
||||
.icon-tools { width: 24px; height: 24px; }
|
||||
|
|
|
|||
|
|
@ -4,6 +4,11 @@ $ok-color: hsl(41,100%,49%);
|
|||
$bad-color: hsl(30,93%,50%);
|
||||
$superbad-color: hsl(19,90%,51%);
|
||||
|
||||
$task-state-closed-color: $supergood-color;
|
||||
$task-state-pending-color: hsl(206,7%,28%);
|
||||
$task-state-open-color: $ok-color;
|
||||
$task-state-escalating-color: $superbad-color;
|
||||
|
||||
$minWidth: 1024px;
|
||||
$sidebarWidth: 280px;
|
||||
$navigationWidth: 260px;
|
||||
|
|
@ -632,11 +637,6 @@ table {
|
|||
fill: hsl(240,1%,77%);
|
||||
}
|
||||
|
||||
.table .icon-priority {
|
||||
vertical-align: middle;
|
||||
margin-top: -3px;
|
||||
}
|
||||
|
||||
.checkbox-replacement,
|
||||
.radio-replacement {
|
||||
padding: 0;
|
||||
|
|
@ -672,8 +672,11 @@ table {
|
|||
height: 38px;
|
||||
}
|
||||
|
||||
.table .priority.icon:after {
|
||||
background: #f8f9fa;
|
||||
.table-overview tbody .icon-checkbox,
|
||||
.table-overview tbody .icon-radio,
|
||||
.table-overview tbody .icon-checkbox-checked,
|
||||
.table-overview tbody .icon-radio-checked {
|
||||
fill: transparent;
|
||||
}
|
||||
|
||||
.table .table-cell {
|
||||
|
|
@ -1932,6 +1935,11 @@ ol.tabs li {
|
|||
}
|
||||
}
|
||||
|
||||
.icon-checkbox,
|
||||
.icon-checkbox-checked {
|
||||
fill: white;
|
||||
}
|
||||
|
||||
|
||||
/*
|
||||
* removed margin of forms to not break the layout with submit buttons within <form></form> area e. g. for modal dialogs
|
||||
|
|
@ -2176,13 +2184,12 @@ footer {
|
|||
color: hsl(198,19%,72%);
|
||||
}
|
||||
|
||||
.tasks--standalone .icon-priority {
|
||||
.tasks--standalone .icon-task-state {
|
||||
margin-right: 4px;
|
||||
margin-top: 2px;
|
||||
}
|
||||
|
||||
.nav-tab {
|
||||
padding: 10px 15px 7px 0;
|
||||
padding: 11px 15px 8px 0;
|
||||
position: relative;
|
||||
color: #808080;
|
||||
display: flex;
|
||||
|
|
@ -2191,7 +2198,7 @@ footer {
|
|||
}
|
||||
|
||||
.tasks-navigation .nav-tab {
|
||||
height: 38px;
|
||||
height: 40px;
|
||||
border-bottom: 1px solid #33363e;
|
||||
}
|
||||
|
||||
|
|
@ -2229,6 +2236,7 @@ footer {
|
|||
|
||||
.nav-tab.nav-tab--search {
|
||||
height: 30px;
|
||||
padding-top: 9px;
|
||||
}
|
||||
|
||||
.nav-tab-icon {
|
||||
|
|
@ -2323,28 +2331,55 @@ footer {
|
|||
opacity: 1;
|
||||
}
|
||||
|
||||
.level-1.is-active {
|
||||
background-color: #38ae6a;
|
||||
}
|
||||
.level-1 .icon-priority,
|
||||
.level-1.icon-priority {
|
||||
fill: #38ae6a;
|
||||
.icon-task-state {
|
||||
vertical-align: middle;
|
||||
margin-top: -2px;
|
||||
}
|
||||
|
||||
.level-2.is-active {
|
||||
background-color: #f35910;
|
||||
}
|
||||
.level-2 .icon-priority,
|
||||
.level-2.icon-priority {
|
||||
fill: #f35910;
|
||||
.nav-tab-icon .icon-task-state {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.level-3.is-active {
|
||||
background-color: #faab00;
|
||||
.nav-tab.task-state-open.is-active {
|
||||
background-color: $task-state-open-color;
|
||||
}
|
||||
.level-3 .icon-priority,
|
||||
.level-3.icon-priority {
|
||||
fill: #faab00;
|
||||
.task-state-open-color {
|
||||
color: $task-state-open-color;
|
||||
}
|
||||
.icon-task-state.open {
|
||||
fill: $task-state-open-color;
|
||||
}
|
||||
|
||||
.nav-tab.task-state-closed.is-active {
|
||||
background-color: $task-state-closed-color;
|
||||
}
|
||||
.task-state-closed-color {
|
||||
color: $task-state-closed-color;
|
||||
}
|
||||
.icon-task-state.closed {
|
||||
fill: $task-state-closed-color;
|
||||
}
|
||||
|
||||
.nav-tab.task-state-escalating.is-active {
|
||||
background-color: $task-state-escalating-color;
|
||||
}
|
||||
.task-state-escalating-color {
|
||||
color: $task-state-escalating-color;
|
||||
}
|
||||
.icon-task-state.escalating {
|
||||
fill: $task-state-escalating-color;
|
||||
}
|
||||
|
||||
// pending: stays blue
|
||||
// .nav-tab.task-state-pending.is-active {
|
||||
// background-color: $task-state-pending-color;
|
||||
// }
|
||||
|
||||
.task-state-pending-color {
|
||||
color: $task-state-pending-color;
|
||||
}
|
||||
.icon-task-state.pending {
|
||||
fill: $task-state-pending-color;
|
||||
}
|
||||
|
||||
.search {
|
||||
|
|
@ -4932,7 +4967,8 @@ footer {
|
|||
margin-top: 0;
|
||||
margin-bottom: 15px;
|
||||
height: auto;
|
||||
padding-bottom: 2px;
|
||||
padding-top: 3px;
|
||||
padding-bottom: 3px;
|
||||
background: hsl(210,17%,98%);
|
||||
}
|
||||
|
||||
|
|
@ -4953,7 +4989,7 @@ footer {
|
|||
}
|
||||
|
||||
.checkbox.form-group input[type=checkbox] {
|
||||
margin-top: 3px;
|
||||
margin-top: 7px;
|
||||
vertical-align: bottom;
|
||||
}
|
||||
|
||||
Binary file not shown.
File diff suppressed because one or more lines are too long
|
Before Width: | Height: | Size: 50 KiB After Width: | Height: | Size: 51 KiB |
|
|
@ -1,12 +1,14 @@
|
|||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg width="10px" height="10px" viewBox="0 0 10 10" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
|
||||
<svg width="11px" height="11px" viewBox="0 0 11 11" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
|
||||
<!-- Generator: Sketch 3.3.3 (12072) - http://www.bohemiancoding.com/sketch -->
|
||||
<title>checkbox-checked</title>
|
||||
<desc>Created with Sketch.</desc>
|
||||
<defs></defs>
|
||||
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
|
||||
<g id="checkbox-checked" sketch:type="MSArtboardGroup" fill="#000000">
|
||||
<path d="M9,1 L9,9 L1,9 L1,1 L9,1 Z M0,0 L0,0.5 L0,9.5 L0,10 L0.5,10 L9.5,10 L10,10 L10,9.5 L10,0.5 L10,0 L9.5,0 L0.5,0 L0,0 Z M3.79999999,5.89999999 L2.09999999,4.39999999 L1.39999999,5.09999999 L4.29999999,8.59999999 C4.79999999,7.09999999 6.39999999,4.19999999 8.29999999,2.09999999 L8.09999999,1.49999999 C5.99999999,2.99999999 4.39999999,4.89999999 3.79999999,5.89999999 L3.79999999,5.89999999 L3.79999999,5.89999999 Z" sketch:type="MSShapeGroup"></path>
|
||||
<g id="checkbox-checked" sketch:type="MSArtboardGroup">
|
||||
<path d="M11,0 L0,0 L0,11 L11,11 L11,0 Z" id="Path-Copy" fill="#50E3C2" sketch:type="MSShapeGroup"></path>
|
||||
<path d="M0,0 L0,0.55 L0,10.45 L0,11 L0.55,11 L10.45,11 L11,11 L11,10.45 L11,0.55 L11,0 L10.45,0 L0.55,0 L0,0 Z M10,1 L10,10 L1,10 L1,1 L10,1 Z" id="Path" fill="#000000" sketch:type="MSShapeGroup"></path>
|
||||
<path d="M4.27323943,6.76760563 L2.23802816,4.97183098 L1.39999999,5.80985915 L4.87183098,10 C5.47042253,8.20422535 7.38591549,4.73239436 9.66056338,2.21830985 L9.42112676,1.49999999 C6.90704225,3.29577464 4.99154929,5.57042253 4.27323943,6.76760563 L4.27323943,6.76760563 L4.27323943,6.76760563 Z" id="Shape" fill="#000000" sketch:type="MSShapeGroup"></path>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 1.1 KiB After Width: | Height: | Size: 1.3 KiB |
|
|
@ -1,12 +1,13 @@
|
|||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg width="10px" height="10px" viewBox="0 0 10 10" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
|
||||
<svg width="11px" height="11px" viewBox="0 0 11 11" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
|
||||
<!-- Generator: Sketch 3.3.3 (12072) - http://www.bohemiancoding.com/sketch -->
|
||||
<title>checkbox</title>
|
||||
<desc>Created with Sketch.</desc>
|
||||
<defs></defs>
|
||||
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
|
||||
<g id="checkbox" sketch:type="MSArtboardGroup" fill-opacity="0.2" fill="#000000">
|
||||
<path d="M9,9 L1,9 L1,1 L9,1 L9,9 Z M10,0 L0,0 L0,10 L10,10 L10,0 Z" id="Shape" sketch:type="MSShapeGroup"></path>
|
||||
<g id="checkbox" sketch:type="MSArtboardGroup">
|
||||
<path d="M11,0 L0,0 L0,11 L11,11 L11,0 Z" id="Path-Copy" fill="#50E3C2" sketch:type="MSShapeGroup"></path>
|
||||
<path d="M11,0 L0,0 L0,11 L11,11 L11,0 Z M1,1 L10,1 L10,10 L1,10 L1,1 Z" id="Shape" fill="#9C9C9B" sketch:type="MSShapeGroup"></path>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 772 B After Width: | Height: | Size: 876 B |
|
|
@ -5,8 +5,10 @@
|
|||
<desc>Created with Sketch.</desc>
|
||||
<defs></defs>
|
||||
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
|
||||
<g id="radio-checked" sketch:type="MSArtboardGroup" fill="#000000">
|
||||
<path d="M11,5.5 C11,2.46243387 8.53756613,0 5.5,0 C2.46243387,0 0,2.46243387 0,5.5 C0,8.53756613 2.46243387,11 5.5,11 C8.53756613,11 11,8.53756613 11,5.5 L11,5.5 Z M0.932708535,5.51604187 C0.932708535,2.98473676 2.98473676,0.932708535 5.51604187,0.932708535 C8.04734697,0.932708535 10.0993752,2.98473676 10.0993752,5.51604187 C10.0993752,8.04734697 8.04734697,10.0993752 5.51604187,10.0993752 C2.98473676,10.0993752 0.932708535,8.04734697 0.932708535,5.51604187 L0.932708535,5.51604187 Z M5.49188096,7.33333333 C6.50440301,7.33333333 7.3252143,6.51252204 7.3252143,5.5 C7.3252143,4.48747796 6.50440301,3.66666667 5.49188096,3.66666667 C4.47935893,3.66666667 3.65854763,4.48747796 3.65854763,5.5 C3.65854763,6.51252204 4.47935893,7.33333333 5.49188096,7.33333333 L5.49188096,7.33333333 Z" sketch:type="MSShapeGroup"></path>
|
||||
<g id="radio-checked" sketch:type="MSArtboardGroup">
|
||||
<path d="M11,5.5 C11,2.46243387 8.53756613,0 5.5,0 C2.46243387,0 0,2.46243387 0,5.5 C0,8.53756613 2.46243387,11 5.5,11 C8.53756613,11 11,8.53756613 11,5.5 L11,5.5 Z" fill="#000000" sketch:type="MSShapeGroup"></path>
|
||||
<path d="M0.932708535,5.51604187 C0.932708535,2.98473676 2.98473676,0.932708535 5.51604187,0.932708535 C8.04734697,0.932708535 10.0993752,2.98473676 10.0993752,5.51604187 C10.0993752,8.04734697 8.04734697,10.0993752 5.51604187,10.0993752 C2.98473676,10.0993752 0.932708535,8.04734697 0.932708535,5.51604187 L0.932708535,5.51604187 Z" id="outer-path" fill="#FFFFFF" sketch:type="MSShapeGroup"></path>
|
||||
<path d="M5.49188096,7.33333333 C6.50440301,7.33333333 7.3252143,6.51252204 7.3252143,5.5 C7.3252143,4.48747796 6.50440301,3.66666667 5.49188096,3.66666667 C4.47935893,3.66666667 3.65854763,4.48747796 3.65854763,5.5 C3.65854763,6.51252204 4.47935893,7.33333333 5.49188096,7.33333333 L5.49188096,7.33333333 Z" id="inner-path" fill="#000000" sketch:type="MSShapeGroup"></path>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 1.4 KiB After Width: | Height: | Size: 1.6 KiB |
|
|
@ -5,8 +5,9 @@
|
|||
<desc>Created with Sketch.</desc>
|
||||
<defs></defs>
|
||||
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
|
||||
<g id="radio" sketch:type="MSArtboardGroup" fill="#CBCBCB">
|
||||
<path d="M11,5.5 C11,2.46243342 8.53756567,0 5.5,0 C2.46243342,0 0,2.46243342 0,5.5 C0,8.53756567 2.46243342,11 5.5,11 C8.53756567,11 11,8.53756567 11,5.5 L11,5.5 Z M0.932708333,5.51604167 C0.932708333,2.98473633 2.98473633,0.932708333 5.51604167,0.932708333 C8.047347,0.932708333 10.099375,2.98473633 10.099375,5.51604167 C10.099375,8.047347 8.047347,10.099375 5.51604167,10.099375 C2.98473633,10.099375 0.932708333,8.047347 0.932708333,5.51604167 L0.932708333,5.51604167 Z" sketch:type="MSShapeGroup"></path>
|
||||
<g id="radio" sketch:type="MSArtboardGroup">
|
||||
<path d="M11,5.5 C11,2.46243342 8.53756567,0 5.5,0 C2.46243342,0 0,2.46243342 0,5.5 C0,8.53756567 2.46243342,11 5.5,11 C8.53756567,11 11,8.53756567 11,5.5 L11,5.5 Z" fill="#9C9C9B" sketch:type="MSShapeGroup"></path>
|
||||
<path d="M0.932708333,5.51604167 C0.932708333,2.98473633 2.98473633,0.932708333 5.51604167,0.932708333 C8.047347,0.932708333 10.099375,2.98473633 10.099375,5.51604167 C10.099375,8.047347 8.047347,10.099375 5.51604167,10.099375 C2.98473633,10.099375 0.932708333,8.047347 0.932708333,5.51604167 L0.932708333,5.51604167 Z" id="radio-path" fill="#FFFFFF" sketch:type="MSShapeGroup"></path>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 1.1 KiB After Width: | Height: | Size: 1.2 KiB |
|
|
@ -0,0 +1,12 @@
|
|||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg width="16px" height="16px" viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
|
||||
<!-- Generator: Sketch 3.3.3 (12072) - http://www.bohemiancoding.com/sketch -->
|
||||
<title>task-state-modified-inner-circle</title>
|
||||
<desc>Created with Sketch.</desc>
|
||||
<defs></defs>
|
||||
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
|
||||
<g id="task-state-modified-inner-circle" sketch:type="MSArtboardGroup" fill="#50E3C2">
|
||||
<circle id="Oval-2" sketch:type="MSShapeGroup" cx="8" cy="8" r="3"></circle>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 763 B |
|
|
@ -0,0 +1,12 @@
|
|||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg width="16px" height="16px" viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
|
||||
<!-- Generator: Sketch 3.3.3 (12072) - http://www.bohemiancoding.com/sketch -->
|
||||
<title>task-state-modified-outer-circle</title>
|
||||
<desc>Created with Sketch.</desc>
|
||||
<defs></defs>
|
||||
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
|
||||
<g id="task-state-modified-outer-circle" sketch:type="MSArtboardGroup" fill="#50E3C2">
|
||||
<path d="M8,14 C11.3137085,14 14,11.3137085 14,8 C14,4.6862915 11.3137085,2 8,2 C4.6862915,2 2,4.6862915 2,8 C2,11.3137085 4.6862915,14 8,14 Z M8,13 C10.7614237,13 13,10.7614237 13,8 C13,5.23857625 10.7614237,3 8,3 C5.23857625,3 3,5.23857625 3,8 C3,10.7614237 5.23857625,13 8,13 Z" id="Oval-2" sketch:type="MSShapeGroup"></path>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1,015 B |
12
public/assets/images/icons/task-state.svg
Normal file
12
public/assets/images/icons/task-state.svg
Normal file
|
|
@ -0,0 +1,12 @@
|
|||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg width="16px" height="16px" viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
|
||||
<!-- Generator: Sketch 3.3.3 (12072) - http://www.bohemiancoding.com/sketch -->
|
||||
<title>task-state</title>
|
||||
<desc>Created with Sketch.</desc>
|
||||
<defs></defs>
|
||||
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
|
||||
<g id="task-state" sketch:type="MSArtboardGroup" fill="#50E3C2">
|
||||
<path d="M8,13.5 C11.0375661,13.5 13.5,11.0375661 13.5,8 C13.5,4.96243388 11.0375661,2.5 8,2.5 C4.96243388,2.5 2.5,4.96243388 2.5,8 C2.5,11.0375661 4.96243388,13.5 8,13.5 Z M8,11.125 C9.72588984,11.125 11.125,9.72588984 11.125,8 C11.125,6.27411016 9.72588984,4.875 8,4.875 C6.27411016,4.875 4.875,6.27411016 4.875,8 C4.875,9.72588984 6.27411016,11.125 8,11.125 Z" id="Oval-2" sketch:type="MSShapeGroup"></path>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1 KiB |
Loading…
Reference in a new issue