Skip to content
Snippets Groups Projects
Commit 6636b29a authored by Janne Mareike Koschinski's avatar Janne Mareike Koschinski
Browse files

Fixed a minor issue

parent 3fb07f58
Branches
No related tags found
No related merge requests found
nav
position: sticky
top: 0
background: #333333
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2)
padding: 0 16px
ul
display: flex
max-width: 1024px
margin: 0 auto
height: 56px
align-items: center
li, li > *
color: #282828
text-decoration: none
li
display: block
line-height: 24px
&.title, &.title > *
font-size: 24px
color: #FFC107
font-weight: 700
&.spacer
flex-grow: 1
&:not(.spacer)
margin: 0 8px
&:first-child
margin-left: 0
&:last-child
margin-right: 0
&:not(.title) a
display: block
background: #FFC107
padding: 4px 16px
border-radius: 2px
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1)
&:hover, &:focus
background: #FFD54F
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2)
\ No newline at end of file
.detailpage
display: flex
flex-direction: row
align-items: start
align-self: center
margin: 32px
.sidebar
width: 250px
margin-left: 32px
.url
background: #333333
border-radius: 4px
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.4)
display: flex
flex-direction: row
#url-field
background: none
color: #fff
border: none
flex-shrink: 1
display: block
flex-grow: 1
width: 0
margin: 8px
text-overflow: ellipsis
#copy-url
display: block
background: #FFC107
padding: 4px 16px
border-radius: 2px
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1)
border: none
font-family: 'Lato', sans-serif
font-size: 10pt
line-height: 24px
margin: 8px
cursor: pointer
.actions
background: #333333
border-radius: 4px
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.4)
display: flex
flex-direction: row
margin-bottom: 8px
.delete-form, .update-form
display: flex
flex-grow: 1
input[type=submit]
display: block
background: #FFC107
padding: 4px 16px
border-radius: 2px
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1)
border: none
font-family: 'Lato', sans-serif
font-size: 10pt
line-height: 24px
margin: 8px
flex-grow: 1
cursor: pointer
&:hover, &:focus
background: #FFD54F
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2)
.detail
max-width: 640px
width: 100%
background: #333333
border-radius: 4px
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.4)
.title
line-height: 1.25
padding: 16px
vertical-align: middle
font-size: 14pt
font-weight: normal
color: #eee
background: none
border: none
width: 100%
box-sizing: border-box
&:not(.fake-input):empty
display: none
& + .image
border-top-left-radius: 4px
border-top-right-radius: 4px
.image
background: #000
display: flex
flex-direction: row
justify-content: center
.description
line-height: 1.25
padding: 16px
vertical-align: middle
font-size: 11pt
font-weight: normal
color: #eee
background: none
border: none
width: 100%
box-sizing: border-box
font-family: 'Lato', sans-serif
resize: vertical
white-space: pre-line
&:not(.fake-input):empty
display: none
.fake-input[contenteditable]:empty:before
opacity: 0.4
content: attr(placeholder)
\ No newline at end of file
.images
display: flex
max-width: 1024px
margin: 0 auto
align-items: start
flex-wrap: wrap
.image
padding: 8px
margin: 8px
position: relative
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2)
transition: all 200ms
text-decoration: none
width: 160px
background: #333333
border-radius: 2px
&:hover, &:focus
margin-top: 4px
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.4)
.image-container
display: flex
justify-content: center
align-content: center
justify-items: center
align-items: center
flex-direction: column
height: 160px
width: 160px
background: #000000
.info
display: block
z-index: 1
color: #eeeeee
line-height: 1.25
font-size: 10pt
padding-top: 12px
p
white-space: nowrap
text-overflow: ellipsis
overflow: hidden
\ No newline at end of file
.alert
padding: 16px
margin: 16px 0
box-shadow: 0 2px 4px rgba(33, 33, 33, 0.2)
text-decoration: none
border-radius: 2px
&.success
background: #DCEDC8
color: #689F38
border-color: #689F38
a
color: #33691E
&.error
background: #FFEBEE
color: #F44336
border-color: #F44336
a
color: #D32F2F
form.upload
padding: 96px 0
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2)
text-decoration: none
border-radius: 2px
text-align: center
background: #333333
.upload-label
font-size: 18pt
color: #fff
label
position: relative
display: inline-block
overflow: hidden
span.text
position: relative
display: inline-block
background: #FFC107
padding: 4px 16px
border-radius: 2px
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1)
line-height: 24px
color: #282828
cursor: pointer
z-index: 1
&:hover, &:focus
background: #FFD54F
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2)
input[type=file]
position: absolute
left: 0
right: 0
top: 0
bottom: 0
opacity: 0
input[type=submit]
display: none
&:not(.submitted)
.upload-label
display: none
.submitted
label, input
display: none
\ No newline at end of file
...@@ -19,46 +19,6 @@ body ...@@ -19,46 +19,6 @@ body
display: flex display: flex
flex-direction: column flex-direction: column
nav
position: sticky
top: 0
background: #333333
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2)
padding: 0 16px
ul
display: flex
max-width: 1024px
margin: 0 auto
height: 56px
align-items: center
li, li > *
color: #282828
text-decoration: none
li
display: block
line-height: 24px
&.title, &.title > *
font-size: 24px
color: #FFC107
font-weight: 700
&.spacer
flex-grow: 1
&:not(.spacer)
margin: 0 8px
&:first-child
margin-left: 0
&:last-child
margin-right: 0
&:not(.title) a
display: block
background: #FFC107
padding: 4px 16px
border-radius: 2px
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1)
&:hover,&:focus
background: #FFD54F
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2)
.container.centered .container.centered
flex-grow: 1 flex-grow: 1
display: flex display: flex
...@@ -69,198 +29,7 @@ nav ...@@ -69,198 +29,7 @@ nav
width: 100% width: 100%
max-width: 640px max-width: 640px
.alert @import "nav"
padding: 16px @import "page_upload"
margin: 16px 0 @import "page_image_detail"
box-shadow: 0 2px 4px rgba(33, 33, 33, 0.2) @import "page_image_list"
text-decoration: none
border-radius: 2px
&.success
background: #DCEDC8
color: #689F38
border-color: #689F38
a
color: #33691E
&.error
background: #FFEBEE
color: #F44336
border-color: #F44336
a
color: #D32F2F
form.upload
padding: 96px 0
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2)
text-decoration: none
border-radius: 2px
text-align: center
background: #333333
.upload-label
font-size: 18pt
color: #fff
label
position: relative
display: inline-block
overflow: hidden
span.text
position: relative
display: inline-block
background: #FFC107
padding: 4px 16px
border-radius: 2px
box-shadow: 0 1px 2px rgba(0,0,0,0.1)
line-height: 24px
color: #282828
cursor: pointer
z-index: 1
&:hover,&:focus
background: #FFD54F
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2)
input[type=file]
position: absolute
left: 0
right: 0
top: 0
bottom: 0
opacity: 0
input[type=submit]
display: none
&:not(.submitted)
.upload-label
display: none
.submitted
label, input
display: none
.images
display: flex
max-width: 1024px
margin: 0 auto
align-items: start
flex-wrap: wrap
.image
padding: 8px
margin: 8px
position: relative
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2)
transition: all 200ms
text-decoration: none
width: 160px
background: #333333
border-radius: 2px
&:hover,&:focus
margin-top: 4px
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.4)
.image-container
display: flex
justify-content: center
align-content: center
justify-items: center
align-items: center
flex-direction: column
height: 160px
width: 160px
background: #000000
.info
display: block
z-index: 1
color: #eeeeee
line-height: 1.25
font-size: 10pt
padding-top: 12px
p
white-space: nowrap
text-overflow: ellipsis
overflow: hidden
.detailpage
display: flex
flex-direction: row
align-items: start
align-self: center
margin: 32px
.sidebar
width: 250px
margin-left: 32px
.actions
background: #333333
border-radius: 4px
box-shadow: 0 2px 4px rgba(0,0,0,0.4)
display: flex
flex-direction: row
.delete-form, .update-form
display: flex
flex-grow: 1
input[type=submit]
display: block
background: #FFC107
padding: 4px 16px
border-radius: 2px
box-shadow: 0 1px 2px rgba(0,0,0,0.1)
border: none
font-family: 'Lato', sans-serif
font-size: 10pt
line-height: 24px
margin: 8px
flex-grow: 1
cursor: pointer
&:hover,&:focus
background: #FFD54F
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2)
.detail
max-width: 640px
width: 100%
background: #333333
border-radius: 4px
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.4)
.title
line-height: 1.25
padding: 16px
vertical-align: middle
font-size: 14pt
font-weight: normal
color: #eee
background: none
border: none
width: 100%
box-sizing: border-box
&:not(.fake-input):empty
display: none
& + .image
border-top-left-radius: 4px
border-top-right-radius: 4px
.image
background: #000
display: flex
flex-direction: row
justify-content: center
.description
line-height: 1.25
padding: 16px
vertical-align: middle
font-size: 11pt
font-weight: normal
color: #eee
background: none
border: none
width: 100%
box-sizing: border-box
font-family: 'Lato', sans-serif
resize: vertical
white-space: pre-line
&:not(.fake-input):empty
display: none
.fake-input[contenteditable]:empty:before
opacity: 0.4
content: attr(placeholder)
\ No newline at end of file
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment