165 lines
3.0 KiB
Sass
165 lines
3.0 KiB
Sass
nav
|
|
position: fixed
|
|
left: 0
|
|
top: 0
|
|
width: 250px
|
|
height: 100%
|
|
display: flex
|
|
flex-direction: column
|
|
.sso-menu-switch
|
|
color: white
|
|
border: 1px solid white
|
|
position: absolute
|
|
right: 10px
|
|
top: 10px
|
|
font-size: 24px
|
|
padding: 5px 15px
|
|
display: none
|
|
|
|
header
|
|
background: #343434
|
|
text-align: center
|
|
padding: 20px 0
|
|
h1
|
|
margin: 0
|
|
.nav-current
|
|
background: #343434
|
|
display: flex
|
|
justify-content: space-between
|
|
align-items: center
|
|
&-item
|
|
display: flex
|
|
align-items: center
|
|
color: white
|
|
font-size: 16px
|
|
margin: 5px 8px
|
|
&.logout
|
|
font-size: 20px
|
|
&-subitem
|
|
margin-left: 5px
|
|
font-size: 12px
|
|
|
|
ul.nav-links
|
|
margin: 0
|
|
padding: 0
|
|
list-style-type: none
|
|
flex-grow: 1
|
|
border-right: 5px solid #f3f3f3
|
|
li
|
|
box-sizing: border-box
|
|
border-left: 0 solid transparent
|
|
transition: 0.2s border-left-width
|
|
a
|
|
display: block
|
|
padding: 5px 8px
|
|
text-decoration: none
|
|
text-transform: uppercase
|
|
color: #343434
|
|
&:hover
|
|
border-left: 4px solid transparent
|
|
&.active
|
|
border-left: 4px solid #f3c289
|
|
a
|
|
color: #f3c289
|
|
|
|
.nav-created-by
|
|
border-right: 5px solid #f3f3f3
|
|
box-sizing: border-box
|
|
padding: 8px
|
|
|
|
.container
|
|
position: absolute
|
|
left: 250px
|
|
right: 0
|
|
top: 0
|
|
box-sizing: border-box
|
|
padding: 10px 15px
|
|
|
|
.form-group
|
|
box-sizing: border-box
|
|
flex-basis: calc(50% - 10px)
|
|
|
|
form
|
|
font-size: 14px
|
|
display: flex
|
|
flex-wrap: wrap
|
|
justify-content: space-between
|
|
|
|
input
|
|
display: block
|
|
line-height: normal
|
|
box-sizing: border-box
|
|
height: 2.4375rem
|
|
padding: .5rem
|
|
border: 1px solid #cacaca
|
|
margin: 0 0 1rem
|
|
font-family: inherit
|
|
font-size: 1rem
|
|
color: #0a0a0a
|
|
background-color: #fefefe
|
|
box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.1)
|
|
border-radius: 0
|
|
transition: box-shadow 0.5s, border-color 0.25s ease-in-out
|
|
-webkit-appearance: none
|
|
-moz-appearance: none
|
|
&:focus
|
|
border: 1px solid #8a8a8a
|
|
background-color: #fefefe
|
|
outline: none
|
|
box-shadow: 0 0 5px #cacaca
|
|
transition: box-shadow 0.5s, border-color 0.25s ease-in-out
|
|
|
|
.sso-form-buttons
|
|
display: flex
|
|
flex-direction: row
|
|
flex-wrap: wrap
|
|
width: 100%
|
|
|
|
.sso-form-buttons-flexibile
|
|
width: auto
|
|
|
|
.sso-form-button
|
|
border: none
|
|
color: white
|
|
background: #f3c289
|
|
padding: 10px 8px
|
|
margin: 0 4px
|
|
-webkit-appearance: none
|
|
transition: 0.2s background
|
|
&:hover
|
|
background: #be9568
|
|
color: white
|
|
|
|
&:first-child
|
|
margin-left: 0
|
|
|
|
&:last-child
|
|
margin-right: 0
|
|
|
|
.sso-form-button-primary
|
|
background: #5cb85c
|
|
flex-grow: 1
|
|
&:hover
|
|
background: #499249
|
|
|
|
@media screen and (max-width: 968px)
|
|
|
|
nav
|
|
position: relative
|
|
width: 100%
|
|
height: auto
|
|
.sso-menu-switch
|
|
display: block
|
|
.nav-links
|
|
height: 0
|
|
overflow: hidden
|
|
&.nav-links-shown
|
|
height: auto
|
|
|
|
.container
|
|
position: relative
|
|
width: 100%
|
|
left: 0
|
|
|
|
.form-group
|
|
flex-basis: calc(100%) |