|
|
@@ -1,31 +1,37 @@
|
|
|
+
|
|
|
#page{
|
|
|
height: 100%;
|
|
|
+ .navbar{
|
|
|
+ width: 100%;
|
|
|
+ height: 50px;
|
|
|
+ }
|
|
|
#start{
|
|
|
width: 100%;
|
|
|
- // height: 100%;
|
|
|
- display: table;
|
|
|
- height: 90%;
|
|
|
-
|
|
|
- // display: inline-grid;
|
|
|
- // grid-template-columns: 33% 33% 33%;
|
|
|
- // grid-template-rows: auto auto;
|
|
|
- // justify-items: stretch;
|
|
|
- // align-items: stretch;
|
|
|
- // justify-content: stretch;
|
|
|
- // display: flex;
|
|
|
- // align-content: stretch;
|
|
|
- & > div {
|
|
|
- display: table-row;
|
|
|
- & > div {
|
|
|
- display: table-cell;
|
|
|
- text-align: center;
|
|
|
- outline: 1px solid black;
|
|
|
+ height: calc(100% - 50px);
|
|
|
+ display: flex;
|
|
|
+ flex-wrap: wrap;
|
|
|
+ .blocs{
|
|
|
+ width: calc(100%/3);
|
|
|
+ height: calc(100vh/2 - 25px);
|
|
|
+ overflow-y: auto;
|
|
|
+ &:nth-child(1){
|
|
|
+ background: red;
|
|
|
+ }
|
|
|
+ &:nth-child(2){
|
|
|
+ background: pink;
|
|
|
+ }
|
|
|
+ &:nth-child(3){
|
|
|
+ background: brown;
|
|
|
+ }
|
|
|
+ &:nth-child(4){
|
|
|
+ background: blue;
|
|
|
+ }
|
|
|
+ &:nth-child(5){
|
|
|
+ background: green;
|
|
|
+ }
|
|
|
+ &:nth-child(6){
|
|
|
+ background: yellow;
|
|
|
}
|
|
|
- // width: calc(100% / 3);
|
|
|
- // // height: 50%;
|
|
|
- }
|
|
|
- .ui-icon, .ui-widget-content .ui-icon{
|
|
|
- background: red;
|
|
|
}
|
|
|
}
|
|
|
}
|
