1002
1003
1004
1005
1006
1007
1008
|
}
> article.post {
margin: 0.1in 0.2in;
margin-left: 0.4in;
}
}
}
|
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
|
1002
1003
1004
1005
1006
1007
1008
1009
1010
1011
1012
1013
1014
1015
1016
1017
1018
1019
1020
1021
1022
1023
1024
1025
1026
1027
1028
1029
1030
1031
1032
1033
1034
1035
1036
1037
1038
1039
1040
1041
1042
1043
1044
1045
1046
1047
1048
1049
1050
1051
1052
1053
1054
1055
1056
1057
1058
1059
1060
1061
1062
1063
1064
1065
1066
1067
1068
1069
1070
|
}
> article.post {
margin: 0.1in 0.2in;
margin-left: 0.4in;
}
}
}
.media.manager main, .media.gallery {
display: grid;
grid-template-columns: 2in 1fr;
grid-template-rows: max-content 1fr;
menu {
@extend %navmenu;
}
.gallery, .dir {
background: tone(-55%,-0.5);
border: 1px solid tone(-60%);
padding: 0.2in;
display: flex;
flex-wrap: wrap;
}
.gallery {
grid-row: 1/2; grid-column: 2/3;
margin-left: 0.1in;
flex-flow: row;
> a[href].thumb {
display: block;
width: 1.5in;
padding: 0.1in;
height: max-content;
> img {
width: 1.5in; height: 1.5in;
}
> .caption {
text-align: center;
font-size: 80%;
}
}
}
.dir {
grid-row: 2/3; grid-column: 1/3;
margin-top: 0.1in;
flex-flow: column;
flex-grow: 1;
> a[href].file {
padding: 0.1in 0.15in;
text-decoration: none;
height: max-content;
background-image: url(/s/file.webp); //TODO different icons for different mime types
background-repeat: no-repeat;
background-position: left;
padding-left: 0.4in;
> .label {
text-decoration: underline;
}
> .mime {
font-style: italic;
opacity: 60%;
margin-left: 0.5ex;
}
}
}
}
.media.upload form {
padding: 0.1in 0.2in;
@extend %box;
}
|