imported>=海豚= |
|
| 第1行： |
第1行： |
| | | 基于MsUpload的文件上传 |
| ul.gallery {
| |
| display: flex;
| |
| flex-wrap: wrap;
| |
| justify-content: center;
| |
| padding: 0;
| |
| }
| |
| | |
| ul.mw-gallery {
| |
| &-packed,
| |
| &-packed-hover,
| |
| &-packed-overlay {
| |
| text-align: left;
| |
| | |
| div.thumb img {
| |
| width: 100% !important; // fill empty space
| |
| height: auto;
| |
| }
| |
| | |
| li.gallerybox {
| |
| flex-grow: 1;
| |
| margin: @gallery-clutter;
| |
| | |
| div.gallerytextwrapper {
| |
| right: 0;
| |
| width: auto !important; // fill empty space
| |
| margin: 0;
| |
| background: transparent;
| |
| transition: @transition-background-quick;
| |
| }
| |
| }
| |
| }
| |
| | |
| &-packed-hover,
| |
| &-packed-overlay {
| |
| div.thumb {
| |
| /* Gallary text background */
| |
| &:after {
| |
| position: absolute;
| |
| right: 0;
| |
| bottom: 0;
| |
| left: 0;
| |
| display: block;
| |
| height: 60%;
| |
| border-radius: 0 0 @border-radius-small @border-radius-small;
| |
| content: '';
| |
| }
| |
| }
| |
| | |
| div.gallerytextwrapper {
| |
| border-radius: @border-radius-small;
| |
| }
| |
| | |
| div.gallerytext {
| |
| color: #a2a9b1; // color-base50
| |
| }
| |
| }
| |
| | |
| &-packed-hover li.gallerybox:hover,
| |
| &-packed-overlay li.gallerybox {
| |
| div.thumb:after {
| |
| background: linear-gradient( to top, #000, transparent );
| |
| }
| |
| | |
| div.gallerytextwrapper:hover {
| |
| /* Prevent overflow with long caption */
| |
| overflow: hidden;
| |
| max-height: 90%;
| |
| background: #000;
| |
| }
| |
| }
| |
| | |
| &-traditional,
| |
| &-nolines {
| |
| margin-right: -@gallery-clutter * 2;
| |
| margin-left: -@gallery-clutter * 2;
| |
| | |
| li.gallerybox {
| |
| margin: @gallery-clutter * 2;
| |
| }
| |
| }
| |
| }
| |
| | |
| li.gallerybox {
| |
| display: block;
| |
| | |
| > div {
| |
| width: 100% !important; // fill empty space
| |
| height: auto;
| |
| }
| |
| | |
| div.thumb {
| |
| overflow: hidden; // for border radius
| |
| width: 100% !important; // fill empty space
| |
| height: auto;
| |
| border-color: var( --border-color-base );
| |
| margin: 0;
| |
| background-color: var( --background-color-framed );
| |
| border-radius: @border-radius-small;
| |
| }
| |
| }
| |
| | |
| div.gallerytext {
| |
| padding: @content-margin-top / 2 0;
| |
| color: var( --color-base--subtle );
| |
| font-size: @content-caption-size;
| |
| | |
| p {
| |
| margin-top: 0;
| |
| }
| |
| | |
| a.image {
| |
| display: inline;
| |
| }
| |
| }
| |
| }
| |
