holm/egroupware
1
1
Fork 0
forked from extern/egroupware
Code Issues Pull Requests Packages Projects Releases Wiki Activity

WIP EGroupware Tutorial:

Browse Source 
- Style thumbnails inside the sidebox
This commit is contained in:
Hadi Nategh 2015-10-13 15:07:06 +00:00
parent 258846103a
commit 67e2ad0c1a
2 changed files with 65 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
etemplate/templates/default/egw_tutorial.xet
View File

@ -3,18 +3,25 @@
<!-- $Id$ -->
<overlay>
<template id="etemplate.egw_tutorial" template="" lang="" group="0" version="15.1">
<grid id="list" class="egwGridView_grid" height="200" overflow="auto">
<grid id="list" width="97%" height="200" overflow="auto">
<columns>
<column/>
</columns>
<rows>
<row >
<vbox onclick="$row_cont[onclick]" align="center" statustext="$row_cont[title]">
<description value = "$row_cont[title]" class="et2_ellipsis"/>
<image src="$row_cont[thumbnail]" height="70px"/>
<hbox background="$row_cont[thumbnail]" height="176px" width="99%" class="egw_tutorial_thumb">
<description value = "$row_cont[title]" class="egw_tutorial_title"/>
<hbox id="play" class="egw_tutorial_playBtn">
<hbox></hbox>
</hbox>
</hbox>
</vbox>
</row>
</rows>
</grid>
<styles>
</styles>
</template>
</overlay>

56
etemplate/templates/default/etemplate2.css
View File

@ -1975,4 +1975,58 @@ div.flash-click-to-play-dialog {
.et2_ellipsis {
text-overflow: ellipsis;
overflow: hidden;
}
}
/*egw tutorial styles - start*/
span.egw_tutorial_title {
color: #FFFFFF;
font-weight: bold;
text-align: left;
width: 99%;
background-color: #434343;
border: 1px solid #B3B3B3;
padding-top: 4px;
padding-left: 5px;
border-radius: 2px;
text-overflow: ellipsis;
white-space: nowrap;
overflow-x: hidden;
}
.egw_tutorial_thumb:hover [id^="egw_tutorial_"][id$="_play"].egw_tutorial_playBtn,
.egw_tutorial_thumb:hover #home-tutorial_play.egw_tutorial_playBtn{
background-color: #434343;
}
.egw_tutorial_thumb:hover [id^="egw_tutorial_"][id$="_play"].egw_tutorial_playBtn> div,
.egw_tutorial_thumb:hover #home-tutorial_play.egw_tutorial_playBtn> div{
border-left-color: white;
}
.egw_tutorial_thumb {
background-repeat: no-repeat;
background-position: -2px;
border-radius: 5px;
}
[id^="egw_tutorial_"][id$="_play"].egw_tutorial_playBtn,
#home-tutorial_play.egw_tutorial_playBtn{
display:block;
margin:20%;
border: 2px solid rgba(0,0,0,0.7);
-webkit-border-radius: 100%;
-moz-border-radius: 100%;
border-radius: 100%;
width: 40px;
height: 40px;
cursor: pointer;
}
[id^="egw_tutorial_"][id$="_play"].egw_tutorial_playBtn> div,
#home-tutorial_play.egw_tutorial_playBtn>div{
display:block;
position:relative;
top: 10px;
left: 45%;
width: 0;
height: 0;
border-top: 10px solid transparent;
border-bottom: 10px solid transparent;
border-left: 10px solid rgba(0,0,0,0.8);
}
/*egw tutorial styles - end*/