1131 lines
17 KiB
Stylus
1131 lines
17 KiB
Stylus
body
|
|
overflow-y scroll
|
|
|
|
[v-cloak]
|
|
display none
|
|
|
|
.menu-link
|
|
z-index unset
|
|
|
|
tt
|
|
color #000
|
|
background #eee
|
|
padding 2px
|
|
|
|
.button-success:not([disabled])
|
|
background-color #1cb841
|
|
|
|
.button-error:not([disabled])
|
|
background-color #ca3c3c
|
|
|
|
.button-warning:not([disabled])
|
|
background-color #df7514
|
|
|
|
.button-secondary:not([disabled])
|
|
background-color #42b8dd
|
|
|
|
.header, .content
|
|
padding 0
|
|
|
|
.clear
|
|
clear left
|
|
clear right
|
|
|
|
.header
|
|
height 140px
|
|
padding 0
|
|
|
|
.nav-header
|
|
padding-left 60px
|
|
display flex
|
|
|
|
.brand
|
|
display flex
|
|
flex-direction row
|
|
align-self center
|
|
white-space nowrap
|
|
|
|
img
|
|
width 300px
|
|
height 15%
|
|
|
|
.version
|
|
font-size 18pt
|
|
color #777
|
|
display flex
|
|
flex-direction column
|
|
justify-content space-evenly
|
|
border-left #777 2px solid;
|
|
margin-left 15px
|
|
padding 0px 10px
|
|
font-weight bold
|
|
|
|
.upgrade-link
|
|
margin-left 20px
|
|
font-size 16pt
|
|
align-self center
|
|
color blue
|
|
|
|
.upgrade-attention
|
|
color red
|
|
font-size 18pt
|
|
align-self center
|
|
margin-left 5px
|
|
|
|
.pi-temp-warning
|
|
align-self center
|
|
font-size 30pt
|
|
font-family Audiowide
|
|
display inline
|
|
margin 0 30px
|
|
|
|
.left
|
|
color #444
|
|
.right
|
|
color #e5aa3d
|
|
|
|
.whitespace
|
|
flex-grow 1
|
|
|
|
.video
|
|
position relative
|
|
width 174px
|
|
height 130px
|
|
border 2px solid transparent
|
|
border-radius 5px
|
|
|
|
&:hover
|
|
border-color #aaa
|
|
|
|
&.large
|
|
width 100%
|
|
margin 5px 0
|
|
height inherit
|
|
|
|
.crosshair
|
|
> *
|
|
border 1px dashed #ccc
|
|
position absolute
|
|
|
|
.vertical
|
|
height 100%
|
|
width 0
|
|
left 50%
|
|
margin-left -1px
|
|
|
|
.horizontal
|
|
height 0
|
|
width 100%
|
|
top 50%
|
|
margin-top -1px
|
|
|
|
.box
|
|
width 16px
|
|
height 16px
|
|
top 50%
|
|
left 50%
|
|
margin-top -9px
|
|
margin-left -9px
|
|
|
|
img
|
|
width 100%
|
|
height 100%
|
|
|
|
.estop
|
|
align-self center
|
|
margin 0 30px
|
|
|
|
.error
|
|
background red
|
|
|
|
.warn
|
|
background orange
|
|
|
|
.success
|
|
background green
|
|
|
|
.fa
|
|
font-size 150%
|
|
|
|
.modal-mask .fa
|
|
font-size inherit
|
|
|
|
.fa.error
|
|
background inherit
|
|
color red
|
|
|
|
.fa.warn
|
|
background inherit
|
|
color orange
|
|
|
|
.fa.success
|
|
background inherit
|
|
color green
|
|
|
|
.load-on
|
|
background-color #ccffcc
|
|
color #000
|
|
|
|
@keyframes attention
|
|
50%
|
|
opacity 0.5
|
|
|
|
.attention
|
|
background-color #f5e138
|
|
color #000
|
|
animation attention 2s step-start 0s infinite
|
|
|
|
span.unit
|
|
font-size 60%
|
|
|
|
.status
|
|
color #eee
|
|
text-align center
|
|
padding 0.125em
|
|
font-weight bold
|
|
margin-bottom 0.5em
|
|
text-transform uppercase
|
|
|
|
&.connecting
|
|
color orange
|
|
&.disconnected
|
|
color red
|
|
&.connected
|
|
color green
|
|
|
|
#overlay
|
|
position fixed
|
|
top 0
|
|
left 0
|
|
width 100%
|
|
height 100%
|
|
background-color rgba(0, 0, 0, 0.7)
|
|
z-index 2000
|
|
color white
|
|
font-weight bold
|
|
font-size 24pt
|
|
text-align center
|
|
text-transform uppercase
|
|
|
|
span
|
|
position relative
|
|
top 50%
|
|
|
|
#menu
|
|
.save
|
|
display block
|
|
margin 0.25em 0.6em
|
|
|
|
.pure-menu-heading
|
|
background inherit
|
|
padding 0
|
|
|
|
.pure-menu-link
|
|
padding 0.6em
|
|
color #fff
|
|
|
|
.pure-menu-item .pure-menu-link
|
|
padding-left 1.5em
|
|
|
|
|
|
#main
|
|
margin-left 0.5em
|
|
|
|
.content
|
|
h2
|
|
text-transform capitalize
|
|
|
|
.pure-control-group
|
|
label.units
|
|
width 6em
|
|
text-align left
|
|
|
|
textarea
|
|
width 24em
|
|
height 12em
|
|
|
|
> select, > input:not([type=checkbox])
|
|
min-width 300px
|
|
|
|
> tt
|
|
min-width 15.25em
|
|
padding 0.7em 1em
|
|
border-radius 3px
|
|
display inline-block
|
|
|
|
|
|
@keyframes blink
|
|
50%
|
|
fill #ff9d00
|
|
|
|
.estop
|
|
width 130px
|
|
transition 250ms
|
|
|
|
&.active .ring
|
|
animation blink 2s step-start 0s infinite
|
|
|
|
&:hover .button circle
|
|
fill #b72424 !important
|
|
|
|
svg
|
|
cursor pointer
|
|
|
|
.button:hover
|
|
filter brightness(120%)
|
|
|
|
.control-view
|
|
max-width 95%
|
|
|
|
table
|
|
border-collapse collapse
|
|
|
|
// Make sure buttons don't turn into circles
|
|
button
|
|
-webkit-appearance none
|
|
border-radius 0px
|
|
border-width 1px
|
|
border-color darkgrey
|
|
|
|
// The jogging buttons, etc.
|
|
.control-buttons button
|
|
font-size 150%
|
|
width 100px
|
|
height 100px
|
|
|
|
.jog-units
|
|
font-size initial
|
|
margin-left 5px
|
|
|
|
&:first-child
|
|
margin 0.5em 0
|
|
|
|
td, th
|
|
border none
|
|
|
|
.radio-toolbar
|
|
input
|
|
opacity 0
|
|
position fixed
|
|
width 0
|
|
label
|
|
display inline-block
|
|
background-color #ddd
|
|
padding 10px 20px
|
|
font-family sans-serif Arial
|
|
font-size 16px
|
|
border 2px solid #444
|
|
border-radius 4px
|
|
|
|
.axes
|
|
width 100%
|
|
|
|
.axis-x .name
|
|
color #f00
|
|
|
|
.axis-y .name
|
|
color #0f0
|
|
|
|
.axis-z .name
|
|
color #00f
|
|
|
|
.axis-a .name
|
|
color #f80
|
|
|
|
.axis-b .name
|
|
color #0ff
|
|
|
|
.axis-c .name
|
|
color #f0f
|
|
|
|
td, th
|
|
padding 2px
|
|
white-space nowrap
|
|
border 1px solid #ddd
|
|
|
|
th
|
|
text-align center
|
|
vertical-align bottom
|
|
|
|
td
|
|
text-align right
|
|
font-family Courier
|
|
|
|
.homed
|
|
background-color #ccffcc
|
|
color #000
|
|
|
|
.warn
|
|
background-color #ffffcc
|
|
|
|
.error
|
|
background-color #ffcccc
|
|
|
|
.axis
|
|
.name
|
|
text-transform capitalize
|
|
vertical-align middle
|
|
|
|
.name, .position
|
|
font-size 24pt
|
|
line-height 24pt
|
|
|
|
.position
|
|
width 99%
|
|
|
|
td.state
|
|
text-align left
|
|
|
|
.fa
|
|
margin-left 2px
|
|
margin-right 6px
|
|
|
|
.absolute, .offset
|
|
min-width 6em
|
|
|
|
td.tstate
|
|
text-align left
|
|
|
|
.fa
|
|
margin-left 2px
|
|
margin-right 6px
|
|
|
|
tr:nth-child(1) th.actions
|
|
text-align right
|
|
|
|
.jog svg
|
|
text
|
|
user-select none
|
|
font-family Sans
|
|
font-weight bold
|
|
stroke transparent
|
|
fill #444
|
|
|
|
.button
|
|
cursor pointer
|
|
stroke #4c4c4c
|
|
|
|
&:hover
|
|
stroke #e55
|
|
|
|
path
|
|
overflow visible
|
|
|
|
.house
|
|
stroke #444
|
|
fill #444
|
|
|
|
.ring
|
|
cursor pointer
|
|
overflow visible
|
|
|
|
.button
|
|
stroke transparent
|
|
|
|
&:hover
|
|
stroke #e55
|
|
|
|
text
|
|
font-size 8pt
|
|
text-anchor middle
|
|
|
|
.info
|
|
empty-cells show
|
|
width 100%
|
|
display inline-block
|
|
|
|
th, td
|
|
height 1.75em
|
|
padding 3px
|
|
text-align right
|
|
overflow hidden
|
|
text-overflow ellipsis
|
|
white-space nowrap
|
|
border 1px solid #ddd
|
|
|
|
th
|
|
min-width 5.25em
|
|
width 5.25em
|
|
|
|
td
|
|
min-width 8em
|
|
width 100%
|
|
|
|
.units
|
|
padding 0
|
|
|
|
select
|
|
width 100%
|
|
height 1.9em
|
|
background-color transparent
|
|
border 0
|
|
padding 3px
|
|
text-align right
|
|
|
|
.eta
|
|
font-size 90%
|
|
|
|
.progress
|
|
height 1.75em
|
|
|
|
label
|
|
float right
|
|
|
|
.bar
|
|
height 1.75em
|
|
background #f2ac45
|
|
|
|
.override
|
|
display none /* Hidden for now */
|
|
margin 0.5em 0
|
|
white-space nowrap
|
|
|
|
label
|
|
font-weight bold
|
|
min-width 3.5em
|
|
display inline-block
|
|
|
|
.percent
|
|
display inline-block
|
|
width 3em
|
|
|
|
input
|
|
border-radius 0
|
|
margin -0.4em 0.5em
|
|
|
|
.override:nth-of-type(1)
|
|
clear left
|
|
float left
|
|
|
|
.override:nth-of-type(2)
|
|
clear right
|
|
float right
|
|
|
|
.toolbar
|
|
clear both
|
|
padding 0 0.125em
|
|
|
|
> *
|
|
margin 0.25em 0.125em
|
|
|
|
select
|
|
max-width 11em
|
|
min-width inherit !important
|
|
|
|
.progress
|
|
display inline-block
|
|
background #fff
|
|
line-height 2em
|
|
border 1px solid #aaa
|
|
border-radius 3px
|
|
width 330px
|
|
vertical-align middle
|
|
text-align center
|
|
|
|
div
|
|
height 2em
|
|
background #f2ac45
|
|
|
|
label
|
|
margin 0 0.125em
|
|
white-space nowrap
|
|
|
|
.tabs
|
|
padding-top 10px
|
|
|
|
section
|
|
min-height 500px
|
|
overflow-x hidden
|
|
overflow-y auto
|
|
padding 0
|
|
margin 0
|
|
|
|
.path-viewer
|
|
width 100%
|
|
|
|
.path-viewer-content
|
|
height 500px
|
|
|
|
.gcode, .history
|
|
font-family courier
|
|
clear both
|
|
overflow auto
|
|
width 100%
|
|
height 450px
|
|
white-space nowrap
|
|
|
|
.clusterize-scroll
|
|
max-height 450px
|
|
|
|
&.placeholder
|
|
color #aaa
|
|
|
|
.history
|
|
padding 0.25em
|
|
|
|
.gcode ul, .history ul
|
|
margin 0
|
|
padding 0
|
|
list-style none
|
|
|
|
.gcode ul
|
|
li
|
|
line-height 15px
|
|
|
|
li:nth-child(even)
|
|
background-color #fafafa
|
|
|
|
li.highlight
|
|
background-color #eaeaea
|
|
|
|
li > b
|
|
font-weight normal
|
|
display inline-block
|
|
padding 0 0.25em
|
|
color #e5aa3d
|
|
min-width 4em
|
|
|
|
.history ul li
|
|
cursor pointer
|
|
|
|
.mdi
|
|
clear both
|
|
white-space nowrap
|
|
padding 0.125em
|
|
display flex
|
|
|
|
> *
|
|
margin 0.125em
|
|
|
|
input
|
|
flex 2
|
|
|
|
.jog
|
|
text-align center
|
|
|
|
> svg
|
|
margin 1em
|
|
|
|
.jog-settings
|
|
margin-bottom 1em
|
|
|
|
input
|
|
margin 0 0.5em
|
|
vertical-align middle
|
|
|
|
.macros-div
|
|
display flex
|
|
justify-content space-around
|
|
height 60px
|
|
margin 10px
|
|
margin-left 100px
|
|
|
|
.macros-buttons
|
|
height 60px
|
|
width 140px
|
|
font-weight normal
|
|
border-radius 10px
|
|
border 0
|
|
color #fff
|
|
|
|
.macros
|
|
width 90%
|
|
|
|
.warning-box
|
|
display flex
|
|
background-color #F3FF00
|
|
border-radius 5px
|
|
border 0
|
|
margin-bottom 10px
|
|
margin-top 10px
|
|
align-items center
|
|
justify-content center
|
|
|
|
.select-upload-gcode
|
|
display flex
|
|
flex-direction row
|
|
|
|
.tabs
|
|
margin-top 5px
|
|
|
|
.submit-macros
|
|
height 50px
|
|
width 140px
|
|
margin-top 30px
|
|
font-weight normal
|
|
background-color #add1ad
|
|
color #fff
|
|
border 0
|
|
|
|
|
|
.path-viewer
|
|
table
|
|
margin 0.25em
|
|
width 100%
|
|
|
|
.path-viewer-toolbar
|
|
> *
|
|
margin 0.25em
|
|
|
|
.tool-button
|
|
display inline-block
|
|
cursor pointer
|
|
border 2px solid transparent
|
|
border-radius 2px
|
|
text-align center
|
|
|
|
&:hover
|
|
opacity 0.7
|
|
border 2px inset #eee
|
|
|
|
&.active
|
|
border 2px inset #888
|
|
background #ddd
|
|
|
|
img
|
|
max-height 32px
|
|
vertical-align bottom
|
|
|
|
.fa
|
|
font-size 28px
|
|
display inline-block
|
|
width 32px
|
|
|
|
.path-viewer-messages
|
|
margin 0.125em 0
|
|
|
|
th, td
|
|
padding 0.125em
|
|
|
|
&.level
|
|
text-transform capitalize
|
|
|
|
.path-viewer-content
|
|
background-color #333
|
|
background linear-gradient(to bottom, #666 0%, #222 100%);
|
|
margin-bottom 0.5em
|
|
|
|
&.small
|
|
.path-viewer-content
|
|
width 340px
|
|
height 150px
|
|
float right
|
|
margin-top -88px
|
|
|
|
.console
|
|
.console-wrapper
|
|
max-height 400px
|
|
overflow-y auto
|
|
|
|
.message
|
|
white-space pre
|
|
|
|
table
|
|
width 100%
|
|
margin 0.5em 0
|
|
border-collapse collapse
|
|
|
|
td, th
|
|
border 1px solid #ddd
|
|
padding 2px
|
|
|
|
&:first-child
|
|
border-left 0
|
|
|
|
&:last-child
|
|
border-right 0
|
|
|
|
tr
|
|
> td
|
|
margin 0 0.125em
|
|
background-color #fff
|
|
|
|
tr.log-error td
|
|
color red
|
|
|
|
tr.log-warning td
|
|
color orange
|
|
|
|
tr.log-debug td
|
|
color green
|
|
|
|
.indicators
|
|
padding 1em 0
|
|
text-align center
|
|
|
|
table
|
|
display inline-block
|
|
vertical-align top
|
|
margin 0.5em
|
|
empty-cells show
|
|
border 3px solid #bbb
|
|
|
|
td, th
|
|
padding 4px
|
|
white-space nowrap
|
|
|
|
tr:nth-child(odd)
|
|
background #f7f7f7
|
|
|
|
th
|
|
text-align left
|
|
|
|
td
|
|
text-align right
|
|
|
|
&.inputs, &.outputs
|
|
td:nth-child(1), td:nth-child(5)
|
|
text-align center
|
|
|
|
th.header
|
|
height 2.5em
|
|
border-bottom 3px solid #ccc
|
|
text-align center
|
|
|
|
th.separator
|
|
background #ccc
|
|
border 1px solid #ccc
|
|
padding 1px
|
|
|
|
&.motor_fault
|
|
td, th
|
|
text-align center
|
|
min-width 1.75em
|
|
|
|
.fa-eraser
|
|
cursor pointer
|
|
|
|
&:hover
|
|
opacity 0.5
|
|
|
|
.io
|
|
&.active
|
|
color green
|
|
|
|
&.inactive
|
|
color black
|
|
|
|
&.warn
|
|
background-color transparent
|
|
color orange
|
|
|
|
tt.save
|
|
display inline-block
|
|
border-radius 2px
|
|
background #1cb841
|
|
color rgba(0, 0, 0, 0.8)
|
|
padding 0.25em
|
|
line-height initial
|
|
|
|
.modbus-program button
|
|
margin 0.25em 0
|
|
|
|
.pure-form .modbus-regs
|
|
input, select
|
|
border none
|
|
box-shadow none
|
|
border-radius 0
|
|
background transparent
|
|
padding 0 0.5em
|
|
height 1.75em
|
|
line-height 1.75em
|
|
|
|
input
|
|
text-align right
|
|
width 6em
|
|
|
|
button
|
|
margin 2px
|
|
|
|
th, td
|
|
border 1px solid #ccc
|
|
line-height 1.75em
|
|
|
|
th
|
|
padding 0.5em
|
|
|
|
&.fixed-regs td, td.reg-index, td.modbus-status
|
|
padding 0 0.5em
|
|
|
|
td.reg-index, td.reg-addr, td.reg-value
|
|
text-align right
|
|
|
|
tr:nth-child(even):not(.warn)
|
|
background-color #f3f3f3
|
|
|
|
|
|
.tabs
|
|
clear both
|
|
|
|
> input
|
|
display none
|
|
|
|
> label
|
|
display block
|
|
float left
|
|
width 6em
|
|
font-weight bold
|
|
cursor pointer
|
|
text-decoration none
|
|
text-align center
|
|
background #f6f6f6
|
|
border-top-left-radius 5px
|
|
border-top-right-radius 5px
|
|
border-top 2px solid #f6f6f6
|
|
border-left 1px solid #f6f6f6
|
|
border-right 1px solid #f6f6f6
|
|
margin-right 2px
|
|
|
|
> section
|
|
display none
|
|
clear both
|
|
|
|
> #tab1:checked ~ #content1,
|
|
> #tab2:checked ~ #content2,
|
|
> #tab3:checked ~ #content3,
|
|
> #tab4:checked ~ #content4,
|
|
> #tab5:checked ~ #content5,
|
|
> #tab6:checked ~ #content6,
|
|
> #tab7:checked ~ #content7,
|
|
> #tab8:checked ~ #content8,
|
|
> #tab9:checked ~ #content9
|
|
display block
|
|
|
|
[id^="tab"]:checked + label
|
|
background #fff
|
|
border-top 2px solid #ddd
|
|
border-left 1px solid #ddd
|
|
border-right 1px solid #ddd
|
|
border-bottom 1px solid #fff
|
|
margin-bottom -1px
|
|
|
|
.tab-content
|
|
border 1px solid #ddd
|
|
padding 0.5em
|
|
|
|
|
|
.motor.slave
|
|
.tmpl-input-axis .units::after
|
|
content "(slave motor)"
|
|
white-space nowrap
|
|
|
|
fieldset.limits, fieldset.homing, fieldset.motion .pure-control-group,
|
|
fieldset.power .pure-control-group.tmpl-input-enabled
|
|
display none
|
|
|
|
fieldset.motion .pure-control-group.tmpl-input-reverse
|
|
display inherit
|
|
|
|
|
|
.admin-general-view, .admin-network-view
|
|
h2:not(:first-of-type)
|
|
margin-top 2em
|
|
|
|
a
|
|
text-decoration none
|
|
|
|
|
|
.modal-mask
|
|
position fixed
|
|
z-index 9998
|
|
top 0
|
|
left 0
|
|
width 100%
|
|
height 100%
|
|
background-color rgba(0, 0, 0, .25)
|
|
display table
|
|
transition opacity .3s ease
|
|
|
|
.modal-wrapper
|
|
display table-cell
|
|
vertical-align middle
|
|
|
|
.modal-container
|
|
width 300px
|
|
margin 0px auto
|
|
padding 20px 30px
|
|
background-color #fff
|
|
border-radius 2px
|
|
box-shadow 0 2px 8px rgba(0, 0, 0, .33)
|
|
transition all .3s ease
|
|
font-family Helvetica, Arial, sans-serif
|
|
|
|
|
|
.modal-header
|
|
text-decoration underline
|
|
|
|
.modal-footer
|
|
text-align right
|
|
|
|
.modal-enter, .modal-leave
|
|
opacity 0
|
|
|
|
.modal-enter .modal-container
|
|
transform scale(1.1)
|
|
|
|
.modal-leave .modal-container
|
|
transform scale(0.9)
|
|
|
|
.file-upload
|
|
display none
|
|
|
|
.error-message
|
|
&.modal-mask .modal-wrapper .modal-container
|
|
width auto
|
|
max-width 800px
|
|
|
|
.modal-header h3
|
|
white-space nowrap
|
|
overflow hidden
|
|
text-overflow ellipsis
|
|
|
|
.estop
|
|
float right
|
|
transform scale(0.75)
|
|
margin-top -30px
|
|
|
|
.console
|
|
margin-bottom 1em
|
|
clear both
|
|
|
|
|
|
.wifi-confirm table
|
|
th
|
|
text-align right
|
|
|
|
th, td
|
|
padding 0 4px
|
|
|
|
|
|
.cheat-sheet
|
|
table
|
|
border-collapse collapse
|
|
margin-bottom 0.5em
|
|
|
|
*
|
|
text-align left
|
|
|
|
th, td
|
|
border 1px solid #eee
|
|
padding 4px
|
|
|
|
tr.header-row
|
|
background #eee
|
|
|
|
tr:nth-child(even)
|
|
background #f7f7f7
|
|
|
|
tr.unimplemented
|
|
background #ffff9b
|
|
|
|
tr.spacer-row
|
|
background transparent
|
|
|
|
th, td
|
|
border none
|
|
height 1em
|
|
|
|
|
|
@media only screen and (max-width 970px)
|
|
.control-view #control
|
|
.path-viewer.small .path-viewer-content
|
|
margin-top inherit
|
|
float inherit
|
|
|
|
@media only screen and (max-width 940px)
|
|
.header
|
|
height auto
|
|
|
|
.header-content > .banner
|
|
margin-left 70px
|
|
padding-top 0
|
|
float none
|
|
|
|
.control-view #control
|
|
.axes
|
|
.axis
|
|
.name, .position
|
|
font-size 18pt
|
|
line-height 18pt
|
|
|
|
.absolute, .offset
|
|
display none
|
|
|
|
> *:nth-of-type(n)
|
|
float none
|
|
clear both
|
|
width 99%
|
|
|
|
.tab_container
|
|
width 98%
|
|
|
|
.reset-variants
|
|
padding-left 40px
|
|
padding-bottom 20px
|
|
display grid
|
|
grid-template-rows repeat(4, auto)
|
|
grid-template-columns min-content auto
|
|
grid-gap 20px 10px
|
|
|
|
input[type="radio"]
|
|
width 30px
|
|
height 30px
|
|
|
|
label
|
|
font-size 16pt
|
|
align-self center
|
|
|
|
.pure-form-aligned .pure-control-group label:not(.extra)
|
|
width 12em
|
|
|
|
.pure-form-aligned .pure-control-group label.extra
|
|
width 8em
|
|
|
|
.macros-view
|
|
padding 30px
|
|
width 95%
|
|
|
|
.macros-form
|
|
padding 30px
|
|
|
|
|
|
input.input-name
|
|
width 300px
|
|
height 40px
|
|
border-top-right-radius 8px
|
|
border-bottom-right-radius 8px
|
|
border-top-left-radius 5px
|
|
border-bottom-left-radius 5px
|
|
border-width 1px
|
|
border-color #434242
|
|
padding-left 10px
|
|
margin-left 2px
|
|
|
|
.input-container
|
|
display flex
|
|
height 50px
|
|
align-items center
|
|
|
|
|
|
p.title
|
|
font-size 20px
|
|
padding-top 20px
|
|
font-weight 600
|
|
|
|
|
|
input.input-color
|
|
height 45px
|
|
width 45px
|
|
border 1px solid #fdfdfd
|
|
border-top-left-radius 8px
|
|
border-bottom-left-radius 8px
|
|
|
|
button
|
|
border-radius 8px
|
|
border-width 1px
|
|
border 0
|
|
|
|
.input-field
|
|
margin-top 10px
|
|
|