arno/lychee
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Updated to basicContext v3.3

Browse Source
This commit is contained in:
Tobias Reich 2015-07-09 16:00:37 +02:00
parent a2b5e48f6d
commit c928c09f8f
5 changed files with 113 additions and 87 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/package.json
View File

@ -10,7 +10,7 @@
"url": "https://github.com/electerious/Lychee.git" "url": "https://github.com/electerious/Lychee.git"
}, },
"devDependencies": { "devDependencies": {
"basiccontext": "^3.2.1", "basiccontext": "^3.3.0",
"basicmodal": "^3.1.1", "basicmodal": "^3.1.1",
"gulp": "^3.9.0", "gulp": "^3.9.0",
"gulp-autoprefixer": "2.3.1", "gulp-autoprefixer": "2.3.1",

54
src/styles/_basicContext.custom.scss Normal file
View File

@ -0,0 +1,54 @@
// Default Theme ----------------------------------------------------- //
.basicContext {
padding: 5px 0 6px;
background: linear-gradient(to bottom, #333, #252525);
box-shadow: 0 1px 4px black(.2), inset 0 1px 0 white(.05);
border-radius: 5px;
border: 1px solid black(.7);
border-bottom: 1px solid black(.8);
&__item {
margin-bottom: 2px;
font-size: 14px;
text-shadow: $shadowLight;
&--separator {
margin: 4px 0;
height: 2px;
background: black(.2);
border-bottom: 1px solid white(.06);
}
&--disabled {
opacity: .5;
}
&:last-child {
margin-bottom: 0;
}
}
&__data {
min-width: auto;
padding: 6px 25px 7px 12px;
color: white(1);
transition: none;
cursor: default;
}
&__item:not(.basicContext__item--disabled):hover &__data {
background: linear-gradient(to bottom, $colorBlue, darken($colorBlue, 5%));
}
&__item:not(.basicContext__item--disabled):active &__data {
background: linear-gradient(to bottom, darken($colorBlue, 10%), darken($colorBlue, 15%));
}
&__icon {
margin-right: 10px;
width: 12px;
text-align: center;
}
}

56
src/styles/_basicContext.extended.scss Normal file
View File

@ -0,0 +1,56 @@
/**
* @copyright 2015 by Tobias Reich
*/
/* Context ------------------------------------------------*/
.basicContext {
&__data .cover {
position: absolute;
background-color: #222;
border-radius: 2px;
box-shadow: 0 0 0 1px black(.5);
}
&__data .title {
display: inline-block;
margin: 0 0 3px 26px;
}
&__data .iconic {
display: inline-block;
margin: 0 10px 0 1px;
width: 11px;
height: 10px;
fill: white(1);
}
&__data .iconic.ionicons {
margin: 0 8px -2px 0;
width: 14px;
height: 14px;
}
/* Link ------------------------------------------------*/
&__data input#link {
margin: -2px 0;
padding: 5px 7px 6px;
width: 100%;
background: #333;
color: #fff;
box-shadow: 0px 1px 0px white(.05);
border: 1px solid black(.4);
border-radius: 3px;
outline: none;
}
/* No Hover ------------------------------------------------*/
&__item.noHover &__data {
padding-right: 12px;
}
&__item.noHover:hover &__data {
background: none;
}
}

85
src/styles/_contextmenu.scss
View File

@ -1,85 +0,0 @@
/**
* @copyright 2015 by Tobias Reich
*/
/* Context ------------------------------------------------*/
.basicContext {
padding: 5px 0 6px;
background: linear-gradient(to bottom, #333, #252525);
border: 1px solid black(.7);
border-bottom: 1px solid black(.8);
border-radius: 5px;
box-shadow: 0 1px 4px black(.2), inset 0 1px 0 white(.05);
/* Item ------------------------------------------------*/
tr {
margin-bottom: 2px;
color: white(.9);
font-size: 14px;
text-shadow: $shadowLight;
&.separator {
background: black(.2);
border-bottom: 1px solid white(.06);
}
}
tr td {
padding: 6px 25px 7px 12px;
min-width: auto;
color: white(1);
border-radius: 0;
transition: none;
cursor: default;
&:hover { background: linear-gradient(to bottom, $colorBlue, darken($colorBlue, 5%)); }
&:active { background: linear-gradient(to bottom, darken($colorBlue, 10%), darken($colorBlue, 15%)); }
}
tr td .cover {
background-color: #222;
border-radius: 2px;
box-shadow: 0 0 0 1px black(.5);
position: absolute;
}
tr td .title {
display: inline-block;
margin: 0 0 3px 26px;
}
tr td .iconic {
display: inline-block;
margin: 0 10px 0 1px;
width: 11px;
height: 10px;
fill: white(1);
}
tr td .iconic.ionicons {
margin: 0 8px -2px 0;
width: 14px;
height: 14px;
}
/* Link ------------------------------------------------*/
input#link {
width: 100%;
margin: -2px 0 -1px -2px;
padding: 5px 7px 6px 7px;
background: #333;
color: #fff;
border: 1px solid black(.4);
box-shadow: 0px 1px 0px white(.05);
outline: none;
border-radius: 3px;
}
/* No Hover ------------------------------------------------*/
tr.noHover td:hover {
background: none;
}
}

3
src/styles/main.scss
View File

@ -48,7 +48,8 @@ input {
@import 'animations'; @import 'animations';
@import 'content'; @import 'content';
@import 'contextmenu'; @import 'basicContext.custom';
@import 'basicContext.extended';
@import 'header'; @import 'header';
@import 'imageview'; @import 'imageview';
@import 'sidebar'; @import 'sidebar';