mirror of
https://github.com/lospec/pixel-editor.git
synced 2023-08-10 21:12:51 +03:00
a52fc647e3
Moved tool size buttons on the right, started lasso tool
109 lines
1.7 KiB
SCSS
109 lines
1.7 KiB
SCSS
|
|
#tools-menu {
|
|
left: 0;
|
|
width: 48px;
|
|
list-style-type: none;
|
|
top: 48px;
|
|
bottom: 0;
|
|
padding: 0;
|
|
margin: 0;
|
|
background-color: $basecolor;
|
|
box-sizing: border-box;
|
|
position: fixed;
|
|
z-index: 1120;
|
|
}
|
|
|
|
#tools-menu li {
|
|
position: relative;
|
|
}
|
|
|
|
#tools-menu li button:first-child {
|
|
text-align: center;
|
|
border: none;
|
|
background: none;
|
|
width: 100%;
|
|
padding: 0;
|
|
cursor: pointer;
|
|
height: 48px;
|
|
z-index:0;
|
|
}
|
|
|
|
#tools-menu li button path {
|
|
fill: $baseicon;
|
|
}
|
|
|
|
#tools-menu li:hover button:first-child path {
|
|
fill: $basehovericon;
|
|
}
|
|
|
|
|
|
#tools-menu li.selected {
|
|
background: $baseselected !important;
|
|
}
|
|
|
|
#tools-menu li.selected button:first-child path {
|
|
fill: $baseselectedicon;
|
|
}
|
|
|
|
.tools-menu-sub-button {
|
|
text-align: center;
|
|
border: none;
|
|
background: none;
|
|
cursor: pointer;
|
|
width: 22px !important;
|
|
height:24px !important;
|
|
display: inline-block;
|
|
line-height: 0;
|
|
overflow: hidden;
|
|
position: relative;
|
|
|
|
path {
|
|
fill: $baseselectedicon !important;
|
|
}
|
|
&:hover {
|
|
background: $baseselectedhover !important;
|
|
path {
|
|
fill: $baseselectediconhover !important;
|
|
}
|
|
}
|
|
}
|
|
|
|
#tools-menu .size-buttons {
|
|
position:absolute;
|
|
display: none;
|
|
height:48px;
|
|
left:8px;
|
|
z-index:-1;
|
|
background-color: $basecolor !important;
|
|
}
|
|
|
|
#tools-menu .size-buttons button {
|
|
text-align: center;
|
|
border: none;
|
|
padding: 0;
|
|
position: relative;
|
|
height:24px;
|
|
background-color: $baseselected !important;
|
|
cursor: pointer;
|
|
display:inline-block;
|
|
line-height: 0;
|
|
overflow: hidden;
|
|
width:22px;
|
|
}
|
|
|
|
#tools-menu .size-buttons button:hover {
|
|
background:$baseselected !important;
|
|
}
|
|
|
|
#tools-menu .size-buttons button:active {
|
|
background:$basehovericon !important;
|
|
}
|
|
|
|
#tools-menu li.selected .size-buttons {
|
|
display:inline-block;
|
|
}
|
|
|
|
|
|
#tools-menu li:hover {
|
|
background: $basehover;
|
|
} |