瀏覽代碼

gallery styling adjustments to size and extra dummy description copy

tags/0.9.0
Alej 5 年之前
父節點
當前提交
0d5ee0bdbb
共有 1 個文件被更改,包括 8 次插入8 次删除
  1. 8
    8
      vue-theme/src/components/gallery.vue

+ 8
- 8
vue-theme/src/components/gallery.vue 查看文件

5
         p {{images}}
5
         p {{images}}
6
         img(:src="Object.values(images)[selected]")
6
         img(:src="Object.values(images)[selected]")
7
         p active: {{ selected }}
7
         p active: {{ selected }}
8
-        .titledesc.t-left
9
-            h2 Title goes here: create responsive designs that fit different screen sizes
10
-            p Description goes here: London. Michaelmas term lately over, and the Lord Chancellor sitting in Lincoln's Inn Hall. Implacable November weather. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
8
+        .titledesc.t-left {{titledesc}}
9
+            h2 Title goes here: Responsive block to fit different screen sizes. Hide/Show from bottom of the screen.
10
+            p Description goes here: London. Michaelmas term lately over, and the Lord Chancellor sitting in Lincoln's Inn Hall. Implacable November weather. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Blue McRight is an inter-disciplinary artist influenced by nature, personal experience, and politics. At its core, her multi-media work focuses on water – and its lack – as an environmental issue; however her practice has expanded to address related ideas such as the body, circulatory systems, and marine science. McRight’s work is both elusive and interactive, inviting viewer engagement and contemplation. 
11
 
11
 
12
     .controls.f-row
12
     .controls.f-row
13
         button(v-if="selected > 0" @click="prev") &#x25C0prev
13
         button(v-if="selected > 0" @click="prev") &#x25C0prev
79
         left: 0
79
         left: 0
80
         width: 100%
80
         width: 100%
81
         height: 100%
81
         height: 100%
82
-        background-color: rgba(255, 0, 0, 0.8)
82
+        background-color: rgba(255, 0, 0, 0.6)
83
         z-index: 1001
83
         z-index: 1001
84
 
84
 
85
         > * /* select for all direct children  */
85
         > * /* select for all direct children  */
95
             z-index: 1100
95
             z-index: 1100
96
         figure
96
         figure
97
             img
97
             img
98
-                background-size: contain
98
+                background-size: auto
99
                 max-width: 90vw
99
                 max-width: 90vw
100
                 max-height: 80vh
100
                 max-height: 80vh
101
             .titledesc
101
             .titledesc
102
                 position: fixed
102
                 position: fixed
103
-                max-width: 80vw
103
+                max-width: 90vw
104
                 bottom: 1vh
104
                 bottom: 1vh
105
                 background-color: rgba(255, 255, 255, 0.6)
105
                 background-color: rgba(255, 255, 255, 0.6)
106
-                padding: 4px
106
+                padding: 1.0em
107
                 text-align: left
107
                 text-align: left
108
                 h2, p
108
                 h2, p
109
                     color: $cia_black
109
                     color: $cia_black
113
             button
113
             button
114
                 background-color: rgba(255, 255, 255, 0.1)
114
                 background-color: rgba(255, 255, 255, 0.1)
115
                 height: 100vh
115
                 height: 100vh
116
-                padding: 4px
116
+                padding: 1.0em
117
 </style>
117
 </style>

Loading…
取消
儲存