Appwrite/appwrite
1
0
Fork 0
mirror of https://github.com/appwrite/appwrite.git synced 2026-05-26 13:51:13 +00:00
Code Issues Packages Projects Releases Wiki Activity

-- Create preview-box.less styles

Browse Source 
- Being used inside /views/console/storage/index.phtml
This commit is contained in:
Elad Shechter
2022-02-11 09:11:13 +00:00
parent 9618b03c85
commit ee1dccfae0
3 changed files with 29 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/views/console/storage/index.phtml
+6
View File
@@ -138,6 +138,12 @@ $fileLimitHuman = $this->getParam('fileLimitHuman', 0);
<div class="margin-bottom-small">File Preview</div>
<div class="margin-bottom-small">
<div class="preview-box">
<div class="preview-box-image">
<span class="IMAGE-OR-ICON">@</span>
</div>
<span class="preview-box-text">Preview not available</span>
</div>
<img src="" class="file-preview" data-ls-attrs="src={{env.ENDPOINT}}/v1/storage/files/{{file.$id}}/preview?width=350&height=250&project={{router.params.project}}&mode=admin" loading="lazy" width="225" height="160" />
</div>
public/styles/comps/preview-box.less
+21
View File
@@ -0,0 +1,21 @@
.preview-box {
display: grid;
place-content: center;
padding: 40px;
background: var(--config-color-background-fade);
border: 1px dashed var(--config-color-background-dark);
border-radius: 8px;
&-image {
display: grid;
place-content: center;
width: 40px;
height: 40px;
margin-inline: auto;
background-color: var(--config-color-background-focus);
border-radius: 50%;
}
&-text{
margin-top: 16px;
color: var(--config-color-fade);
}
}
public/styles/default.less
+2 -1
View File
@@ -33,6 +33,7 @@ img[src=""] {
@import "comps/modal";
@import "comps/scroll";
@import "comps/tabs";
@import "comps/preview-box";
html {
padding: 0;
@@ -54,4 +55,4 @@ ul {
margin: 0;
list-style: none;
}
}
}