RPJosh
/
memories
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Completely get rid of padding on mobile

cache
Varun Patil 2022-10-12 12:30:54 -07:00
parent d477f76cf5
commit a337cb97ed
4 changed files with 15 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
src/App.vue
View File

@ -115,7 +115,13 @@ export default class App extends Mixins(GlobalMixin, UserConfig) {
} }
@media (max-width: 768px) { @media (max-width: 768px) {
.outer { padding: 0px; } .outer {
padding: 0px;
// Get rid of padding on img-outer (1px on mobile)
margin-left: -1px;
width: calc(100% + 3px); // 1px extra here because ... reasons
}
} }
</style> </style>

6
src/components/Folder.vue
View File

@ -176,9 +176,9 @@ export default class Folder extends Mixins(GlobalMixin) {
z-index: 3; z-index: 3;
line-height: 0; line-height: 0;
position: absolute; position: absolute;
height: calc(100% - 4px); height: 100%; width: 100%;
width: calc(100% - 4px); padding: 2px;
top: 2px; left: 2px; @media (max-width: 768px) { padding: 1px; }
> .img-outer { > .img-outer {
background-color: var(--color-background-dark); background-color: var(--color-background-dark);

2
src/components/Photo.vue
View File

@ -260,6 +260,8 @@ export default class Photo extends Mixins(GlobalMixin) {
/* Actual image */ /* Actual image */
div.img-outer { div.img-outer {
padding: 2px; padding: 2px;
@media (max-width: 768px) { padding: 1px; }
transition: transform 0.1s ease; transition: transform 0.1s ease;
background-clip: content-box, padding-box; background-clip: content-box, padding-box;
background-color: var(--color-background-dark); background-color: var(--color-background-dark);

6
src/components/Tag.vue
View File

@ -209,9 +209,9 @@ export default class Tag extends Mixins(GlobalMixin) {
z-index: 3; z-index: 3;
line-height: 0; line-height: 0;
position: absolute; position: absolute;
height: calc(100% - 4px); height: 100%; width: 100%;
width: calc(100% - 4px); padding: 2px;
top: 2px; left: 2px; @media (max-width: 768px) { padding: 1px; }
> .img-outer { > .img-outer {
background-color: var(--color-background-dark); background-color: var(--color-background-dark);