bobmaster/mdp-phpbb-style
1
0
Fork 0
Code Issues Pull requests Projects Releases 3 Packages Wiki Activity

🔧 Add image gallary and adjust mdui-typo code font-family to

Browse source 
lxgw
This commit is contained in:
bobmaster 2022-11-19 13:00:27 +08:00
parent b0bee806d8
commit 5118e18ebd
Signed by: bobmaster
GPG key ID: 316B77D7914D713C
2 changed files with 63 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
template/overall_header.html
View file

@ -48,9 +48,6 @@
})(document);
</script>
<!-- ENDIF -->
<link href="{T_FONT_AWESOME_LINK}" rel="stylesheet">
<link href="{T_STYLESHEET_LINK}" rel="stylesheet">
<link href="{T_STYLESHEET_LANG_LINK}" rel="stylesheet">
<!-- MDUI CSS -->
<link
@ -60,6 +57,11 @@
crossorigin="anonymous"
/>
<link href="{T_FONT_AWESOME_LINK}" rel="stylesheet">
<link href="{T_STYLESHEET_LINK}" rel="stylesheet">
<link href="{T_STYLESHEET_LANG_LINK}" rel="stylesheet">
<!-- IF S_CONTENT_DIRECTION eq 'rtl' -->
<link href="{T_THEME_PATH}/bidi.css?assets_version={T_ASSETS_VERSION}" rel="stylesheet">
<!-- ENDIF -->

58
theme/css/mdui-custom.css
View file

@ -367,3 +367,61 @@ dl.bg-y-15-percent {
}
}
.image-gallery {
/* Mobile first */
display: flex;
flex-direction: column;
gap: 10px;
}
.image-gallery .column {
display: flex;
flex-direction: column;
gap: 10px;
}
.image-item img {
width: 100%;
border-radius: 5px;
height: 100%;
object-fit: cover;
}
@media only screen and (min-width: 768px) {
.image-gallery {
flex-direction: row;
}
}
/* overlay styles */
.image-item {
position: relative;
cursor: pointer;
}
.overlay {
position: absolute;
width: 100%;
height: 100%;
background: rgba(57, 57, 57, 0.502);
top: 0;
left: 0;
transform: scale(0);
transition: all 0.2s 0.1s ease-in-out;
color: #fff;
/* center overlay content */
display: flex;
align-items: center;
justify-content: center;
}
/* hover */
.image-item:hover .overlay {
transform: scale(1);
}
/* mdui-typo */
.mdui-typo code, .mdui-typo kbd, .mdui-typo pre, .mdui-typo pre tt, .mdui-typo samp {
font-family: 'LXGW WenKai Screen',Consolas,Courier,'Courier New',monospace;
}