phillip/ingress-intel-total-conversion
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Bookmarks 2.8

Browse Source 
- vertical scrollbar;
- button to hide/show "x" buttons;
- bookmarks full-width in mobile (no margin-right);
- minor UI and UX fix;
This commit is contained in:
Giacinto Garcea
2014-02-02 22:28:07 +01:00
parent 6bc055491f
commit fb09a53b07
2 changed files with 124 additions and 51 deletions
Download Patch File Download Diff File Expand all files Collapse all files

165
plugins/bookmarks-css.css
View File

@ -9,13 +9,18 @@
line-height:22px;
text-indent:0;
text-decoration:none;
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
box-sizing:border-box;
}
#bookmarksBox{
display:block;
position:absolute !important;
z-index:4001;
top:100px;
left:100px;
width:231px;
}
#bookmarksBox .addForm,
#bookmarksBox #bookmarksTypeBar,
@ -25,33 +30,41 @@
color:#fff;
font-size:14px;
}
#bookmarksBox #topBar,
#bookmarksBox #topBar *{
#bookmarksBox #topBar{
height:15px !important;
}
#bookmarksBox #topBar *{
height: 14px !important;
}
#bookmarksBox #topBar *{
float:left !important;
}
#bookmarksBox .handle{
text-indent:-20px;
width:209px;
/* text-indent:-20px;*/
width:80%;
text-align:center;
color:#fff;
line-height:8px;
line-height:6px;
cursor:move;
}
#bookmarksBox #topBar .btn{
display:block;
width:19px;
width:10%;
cursor:pointer;
color:#20a8b1;
}
#bookmarksBox #topBar #bookmarksMin{
font-weight:bold;
text-align:center;
line-height:14px;
line-height:13px;
font-size:18px;
}
#bookmarksBox #topBar #bookmarksDel{
overflow:hidden;
text-indent:-999px;
background:#B42E2E;
}
#bookmarksBox #topBar #bookmarksMin:hover{
color:#ffce00;
}
@ -59,8 +72,9 @@
clear:both;
}
#bookmarksBox h5{
padding:4px 0;
width:114px;
padding:4px 0 23px;
width:50%;
height:93px !important;
text-align:center;
color:#788;
}
@ -73,9 +87,8 @@
color:#ffce00;
background:rgba(0,0,0,0);
}
#bookmarksBox #topBar .btn,
#bookmarksBox #topBar,
#bookmarksBox .addForm,
#bookmarksBox .handle,
#bookmarksBox #bookmarksTypeBar,
#bookmarksBox .bookmarkList li.bookmarksEmpty,
#bookmarksBox .bookmarkList li.bkmrk a,
@ -90,16 +103,16 @@
#bookmarksBox .addForm *{
display:block;
float:left;
padding:4px 8px 3px;
height:28px !important;
}
#bookmarksBox .addForm a{
cursor:pointer;
color:#20a8b1;
font-size:12px;
width:65px;
width:35%;
text-align:center;
line-height:20px;
padding:4px 0 3px;
padding:4px 0 23px;
}
#bookmarksBox .addForm a:hover{
background:#ffce00;
@ -109,15 +122,19 @@
#bookmarksBox .addForm input{
font-size:11px !important;
color:#ffce00;
width:81px;
line-height:11px;
height:28px;
padding:4px 8px 1px;
line-height:12px;
font-size:12px;
-webkit-box-sizing:content-box;
-moz-box-sizing:content-box;
box-sizing:content-box;
}
#bookmarksBox #bkmrk_portals .addForm input{
width:147px;
width:65%;
}
#bookmarksBox #bkmrk_maps .addForm input{
width:42%;
}
#bookmarksBox #bkmrk_maps .addForm a{
width:29%;
}
#bookmarksBox .addForm input:hover,
#bookmarksBox .addForm input:focus{
@ -125,11 +142,12 @@
background:rgba(0,0,0,.6);
}
#bookmarksBox .bookmarkList > ul{
width:231px;
clear:both;
list-style-type:none;
color:#fff;
overflow:hidden;
overflow-y:auto;
max-height:580px;
}
#bookmarksBox .sortable-placeholder{
background:rgba(8,48,78,.55);
@ -161,12 +179,12 @@
color:#eee;
}
#bookmarksBox ul .bookmarksRemoveFrom{
width:19px;
width:10%;
text-align:center;
color:#fff;
}
#bookmarksBox ul .bookmarksLink{
width:171px;
width:90%;
padding:0 10px 0 8px;
color:#ffce00;
}
@ -174,7 +192,7 @@
color:#03fe03;
}
#bookmarksBox ul .othersBookmarks .bookmarksLink{
width:190px;
width:90%;
}
#bookmarksBox ul .bookmarksLink:hover{
color:#03fe03;
@ -183,6 +201,8 @@
color:#fff;
background:#e22 !important;
}
/*---- UI border -----*/
#bookmarksBox,
#bookmarksBox *{
border-color:#20a8b1;
@ -193,29 +213,31 @@
#bookmarksBox ul .bookmarkFolder{
border-top-width:1px;
}
#bookmarksBox,
#bookmarksBox #topBar,
#bookmarksBox #bookmarksTypeBar,
#bookmarksBox .addForm,
#bookmarksBox ul .bookmarkFolder .folderLabel,
#bookmarksBox ul li.bkmrk{
#bookmarksBox ul li.bkmrk a {
border-bottom-width:1px;
}
#bookmarksBox ul .bookmarkFolder,
#bookmarksBox ul .bookmarksRemoveFrom{
#bookmarksBox ul .bookmarkFolder{
border-right-width:1px;
border-left-width:1px;
}
#bookmarksBox #topBar *,
#bookmarksBox #bookmarksTypeBar *,
#bookmarksBox .addForm *{
#bookmarksBox .addForm *,
#bookmarksBox ul li.bkmrk{
border-left-width:1px;
}
#bookmarksBox #topBar,
#bookmarksBox #bookmarksTypeBar,
#bookmarksBox .addForm{
#bookmarksBox .addForm,
#bookmarksBox ul .bookmarksRemoveFrom{
border-right-width:1px;
}
#bookmarksBox ul .othersBookmarks .bookmarksRemoveFrom,
#bookmarksBox ul .bookmarkFolder.othersBookmarks li.bkmrk,
#bookmarksBox ul .bookmarkFolder .folderLabel .bookmarksRemoveFrom{
border-left-width:0;
}
@ -272,17 +294,25 @@
}
#bookmarksBox .bookmarkList .bkmrk.ui-sortable-helper{
border-right-width:1px;
border-left-width:1px;
border-left-width:1px !important;
}
#bookmarksBox .bookmarkList ul li ul li.sortable-placeholder{
height:23px;
box-shadow:inset 0 -1px 0 #20a8b1,inset 1px 0 0 #20a8b1;
}
#bookmarksBox .bookmarkList ul li.bookmarkFolder.ui-sortable-helper,
#bookmarksBox .bookmarkList ul li.othersBookmarks ul,
#bookmarksBox .bookmarkList ul li.othersBookmarks ul li.sortable-placeholder{
box-shadow:inset 0 -1px 0 #20a8b1;
}
#bookmarksBox #topBar #bookmarksDel,
#bookmarksBox .bookmarkList .bookmarkFolder .folderLabel:hover .bookmarksRemoveFrom,
#bookmarksBox .bookmarkList .bookmarkFolder .folderLabel:hover .bookmarksAnchor{
border-bottom-width:1px;
}
/*---------*/
#bookmarksBox .bookmarkList .bookmarkFolder .folderLabel .bookmarksAnchor span,
#bookmarksBox .bookmarkList .bookmarkFolder .folderLabel > span,
#bookmarksBox .bookmarkList .bookmarkFolder .folderLabel > span > span,
@ -304,7 +334,7 @@
#bookmarksBox .bookmarkList .bookmarkFolder .folderLabel .bookmarksAnchor{
line-height:25px;
color:#fff;
width:209px;
width:90%;
}
#bookmarksBox .bookmarkList .bookmarkFolder .folderLabel .bookmarksAnchor span{
float:left;
@ -336,6 +366,7 @@
#bookmarksBox .bookmarkList .bookmarkFolder.open .folderLabel > span,
#bookmarksBox .bookmarkList .bookmarkFolder.open .folderLabel > span > span{
display:block;
display:none;
}
#bookmarksBox .bookmarkList .bookmarkFolder.open .folderLabel:hover > span > span{
border-color:transparent #036 transparent transparent;
@ -345,7 +376,7 @@
}
#bookmarksBox .bookmarkList .bookmarkFolder ul{
display:none;
margin-left:19px;
margin-left:10%;
}
#bookmarksBox .bookmarkList .bookmarkFolder.open ul{
display:block;
@ -355,6 +386,26 @@
margin-left:0;
}
/*---- Width for deleteMode -----*/
#bookmarksBox .bookmarksRemoveFrom{
display:none !important;
}
#bookmarksBox.deleteMode .bookmarksRemoveFrom{
display:block !important;
}
#bookmarksBox .bookmarkList .bookmarkFolder .folderLabel .bookmarksAnchor,
#bookmarksBox ul .bookmarksLink,
#bookmarksBox ul .othersBookmarks .bookmarksLink{
width:100% !important;
}
#bookmarksBox.deleteMode .bookmarkList .bookmarkFolder .folderLabel .bookmarksAnchor,
#bookmarksBox.deleteMode ul .bookmarksLink,
#bookmarksBox.deleteMode ul .othersBookmarks .bookmarksLink{
width:90% !important;
}
/**********************************************
MOBILE
**********************************************/
@ -380,14 +431,27 @@
box-shadow:none !important;
border-width:0 !important;
}
#bookmarksBox.mobile #topBar{
#bookmarksBox.mobile #topBar #bookmarksMin,
#bookmarksBox.mobile #topBar .handle{
display:none !important;
}
#bookmarksBox.mobile #topBar #bookmarksDel{
width:100%;
height:34px !important;
font-size:13px;
color:#fff;
font-weight:normal;
padding-top:11px;
text-indent:0;
}
#bookmarksBox.mobile #bookmarksTypeBar h5{
cursor:pointer;
text-align:center;
float:left;
width:50%;
height:auto !important;
padding:7px 0;
}
#bookmarksBox.mobile #bookmarksTypeBar h5.current{
@ -413,14 +477,15 @@
#bookmarksBox.mobile .bookmarkList li.bookmarkFolder a.bookmarksRemoveFrom,
#bookmarksBox.mobile .bookmarkList li.bkmrk a.bookmarksRemoveFrom{
box-shadow:inset 0 1px 0 #20a8b1,inset -1px 0 0 #20a8b1 !important;
width:15%;
width:10%;
background:none !important;
}
#bookmarksBox.mobile .bookmarkList li.bookmarkFolder a.bookmarksAnchor,
#bookmarksBox.mobile .bookmarkList li.bkmrk a.bookmarksLink{
text-indent:10px;
width:85%;
height:21px;
/* width:85%;*/
height:36px;
line-height:24px;
overflow:hidden;
}
#bookmarksBox.mobile .bookmarkList ul li.bookmarkFolder ul{
@ -428,7 +493,7 @@
}
#bookmarksBox.mobile .bookmarkList > ul{
border-bottom:1px solid #20a8b1 !important;
border-right:1px solid #20a8b1 !important;
/* border-right:1px solid #20a8b1 !important;*/
}
#bookmarksBox.mobile .bookmarkList .bookmarkFolder.othersBookmarks ul{
@ -440,14 +505,14 @@
}
#bookmarksBox.mobile .bookmarkList > ul{
max-height:none;
width:85% !important;
/* width:85% !important;*/
}
#bookmarksBox.mobile .bookmarkList li.bookmarkFolder .folderLabel{
box-shadow:0 1px 0 #20a8b1 !important;
}
#bookmarksBox.mobile .bookmarkList ul li.bookmarkFolder ul{
width:85% !important;
margin-left:15% !important;
width:90% !important;
margin-left:10% !important;
}
#bookmarksBox.mobile .bookmarkList ul li.bookmarkFolder.othersBookmarks ul{
width:100% !important;
@ -461,7 +526,7 @@
}
#bookmarksBox.mobile .addForm,
#bookmarksBox.mobile .addForm *{
height:35px;
height:35px !important;
padding:0;
}
#bookmarksBox.mobile .addForm a{
@ -469,14 +534,14 @@
}
#bookmarksBox.mobile .addForm a{
width:25% !important;
/* width:25% !important;*/
}
#bookmarksBox.mobile .addForm input{
width:50% !important;
/* width:50% !important;*/
text-indent:10px;
}
#bookmarksBox.mobile #bkmrk_portals .addForm input{
width:75% !important;
/* width:75% !important;*/
}
#bookmarksBox.mobile #bookmarksTypeBar h5,
#bookmarksBox.mobile .bookmarkList .addForm a{
@ -530,10 +595,10 @@
#bookmarksBox.mobile .bookmarkList .bookmarkFolder.open .folderLabel > span > span{
display:block !important;
}
/**********************************************
DIALOG BOX
**********************************************/
/*---- Auto Drawer -----*/
#bkmrksAutoDrawer,
#bkmrksAutoDrawer p,
@ -597,4 +662,4 @@
width:96%;
height:120px;
resize:vertical;
}
}