extends ./_layout.jade

block body
    - var logoImgUrl = "https://placeholdit.imgix.net/~text?txtsize=38&txt=Pegasi+B&w=400&h=370";
    section.Section
        .Grid.Grid--middle
            .Grid-column.Grid-column--shrink
                h1 logo
            .Grid-column
                ul.menu.align-right
                    li
                        a link 1
                    li
                        a link 1
        .Grid.Grid--full
            .Grid-column.text-center
                h1 logoshop
                p Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
                +btn(href="#") order
            
    section.Section      
        .Grid
            .Grid-column
                .ButtonGroup
                    .Button 123
                    .Button 456
                    .Button 789
        .Grid
            for i in [1,2,3,4,5,6,7,8]
                .Grid-column.u-small-12.u-medium-4.u-large-3
                    a.Thumbnail(data-toggle="exampleModal22")
                        img(src=logoImgUrl)
            .Grid-column.u-small-12.text-center
                +btn-spinner(href='#').--transparent.is-loading load more
            
    //- .Grid.Grid--full.Grid--middle
    section.Section
        .Grid.Grid--full.Grid--middle.Grid--noGap
            .Cover
                +carousel()
                .Cover-item
                    .Grid
                        .Grid-column.u-small-12.u-medium-8.u-large-4
                            h1.u-colorWhite header
                            p.u-colorWhite Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
                            +btn() заказать
                        
    section.Section
        .Grid
            for i in [1,2,3]
                .Grid-column.u-small-12.u-medium-4
                    img(src="https://placeholdit.imgix.net/~text?txtsize=38&txt=Pegasi+B&w=200&h=200")
                    h4 name
                    p Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
                    
                    
block modals
    #exampleModal22.Modal.full(data-reveal)
        .Grid.Grid--center
            .Grid-column.u-small-12.u-medium-6
                img(src="https://placeholdit.imgix.net/~text?txtsize=38&txt=Logo+B&w=950&h=400")

            .Grid-column.u-small-12
                hr
            .Grid-column.u-small-12.u-medium-7
                .Grid
                    fieldset.Grid-column.u-small-6
                        legend Шрифт
                        input(type="radio",name="font",value='font1',id="font1")
                        label(for='font1') шрифт 1                        
                        br
                        input(type="radio",name="font",value='font2',id="font2")
                        label(for='font2') шрифт 2                      
                        br
                        input(type="radio",name="font",value='font3',id="font3")
                        label(for='font3') шрифт 2
                    fieldset.Grid-column.u-small-6
                        legend Color
                        input(type="radio",name="color",value='color1',id="color1")
                        label(for='color1') шрифт 1                        
                        br
                        input(type="radio",name="color",value='color2',id="color2")
                        label(for='color2') шрифт 2                      
                        br
                        input(type="radio",name="color",value='color3',id="color3")
                        label(for='color3') шрифт 2
            .Grid-column.u-small-12
                hr
            .Grid-column.u-small-12.u-medium-7.text-center
                h4 Оформить заказ
                .input-group
                    span.input-group-label Имя
                    input.input-group-field(type="text")               
                .input-group
                    span.input-group-label Имя
                    input.input-group-field(type="text")
                button.Button отправить
                
        button.ButtonClose(data-close aria-label="Close reveal" type="button")
            span(aria-hidden="true") ×