right panel ok
This commit is contained in:
parent
237df22d66
commit
a192db463c
@ -1,7 +1,7 @@
|
||||
div.grid-layer
|
||||
div.grid-layer-main.containerV
|
||||
h2 New offers
|
||||
span Here you can find and post offers
|
||||
h2 Nouvelles offres
|
||||
span Tu trouveras ici des offres de missions
|
||||
sib-display#offers-list(
|
||||
data-src=`${sdn}/job-offers/`,
|
||||
data-fields='date, user-thumb, title, description, skills',
|
||||
@ -16,11 +16,11 @@ div.grid-layer
|
||||
)
|
||||
div.grid-layer-links.containerV
|
||||
sib-link(next="job-offer-create").containerH.containerCenter.action-link
|
||||
div.containerV.fix.icon-plus
|
||||
div.containerV.fix Post a new offer
|
||||
div.icon-plus
|
||||
div Poster une offre
|
||||
sib-link().containerH.containerCenter.how-link
|
||||
div.containerV.fix.icon-idea
|
||||
div.containerV.grow How To find a new offer
|
||||
div.icon-idea
|
||||
div.grow Comment trouver une offre ?
|
||||
sib-link().containerH.containerCenter.how-link
|
||||
div.containerV.fix.icon-idea
|
||||
div.containerV.grow How to set notification ?
|
||||
div.icon-idea
|
||||
div.grow Comment programmer des notifications ?
|
||||
|
@ -452,57 +452,6 @@ hdapp-available {
|
||||
}
|
||||
}
|
||||
|
||||
.right-link {
|
||||
padding: 0.5em;
|
||||
margin-bottom: 1em;
|
||||
margin-left: 1em;
|
||||
flex-basis: content;
|
||||
border-radius: 2em;
|
||||
|
||||
div[class*="icon-"] {
|
||||
margin-right: 1em;
|
||||
}
|
||||
}
|
||||
|
||||
.how-link {
|
||||
@extend .right-link;
|
||||
background-color: $color-white;
|
||||
color: $color-black;
|
||||
flex-wrap: nowrap;
|
||||
.icon-idea {
|
||||
background-color: $color-yellow-light;
|
||||
border-radius: 100%;
|
||||
flex-shrink: 0;
|
||||
flex-grow: 0;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 1.8em;
|
||||
height: 1.8em;
|
||||
//margin-right: 1em;
|
||||
}
|
||||
}
|
||||
|
||||
.action-link {
|
||||
@extend .right-link;
|
||||
background-color: $color-yellow;
|
||||
color: $color-white;
|
||||
font-weight: bold;
|
||||
text-transform: uppercase;
|
||||
|
||||
.icon-plus {
|
||||
flex-shrink: 0;
|
||||
flex-grow: 0;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
display: flex;
|
||||
|
||||
&:before {
|
||||
//font-size: 1.3em;
|
||||
}
|
||||
}
|
||||
}
|
||||
/*
|
||||
label {
|
||||
@extend h2;
|
||||
|
@ -8,6 +8,7 @@
|
||||
@import 'main';
|
||||
@import 'form';
|
||||
@import 'content';
|
||||
@import 'right-panel';
|
||||
|
||||
// @import 'members';
|
||||
@import 'header';
|
||||
|
@ -49,11 +49,11 @@ h1 {
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size: 1.04em;
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: 0.84em;
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
h4 {
|
||||
@ -276,16 +276,19 @@ sib-trigger.back {
|
||||
|
||||
.grid-layer{
|
||||
display: grid;
|
||||
grid-template-columns: [start]auto[middle]20em[end];
|
||||
grid-template-rows: [start]10em[middle]auto[end];
|
||||
font-size: 16px;
|
||||
grid-template-columns: [start]auto[middle]25%[end];
|
||||
grid-template-rows: [start]13em[middle]auto[end];
|
||||
}
|
||||
.grid-layer-main{
|
||||
background: green;
|
||||
grid-column-start: start;
|
||||
grid-column-end: end;
|
||||
grid-row-start: start;
|
||||
grid-row-end: end;
|
||||
}
|
||||
.grid-layer-links{
|
||||
background: pink;
|
||||
grid-column-start: middle;
|
||||
grid-column-end: end;
|
||||
grid-row-start: start;
|
||||
|
49
src/styles/right-panel.scss
Normal file
49
src/styles/right-panel.scss
Normal file
@ -0,0 +1,49 @@
|
||||
.right-link {
|
||||
padding: 0.5em;
|
||||
margin-bottom: 1em;
|
||||
margin-left: 5em;
|
||||
flex-basis: auto;
|
||||
border-radius: 2em;
|
||||
|
||||
div[class*="icon-"] {
|
||||
align-items: center;
|
||||
display: flex;
|
||||
flex-grow: 0;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.how-link {
|
||||
@extend .right-link;
|
||||
background-color: $color-white;
|
||||
color: $color-black;
|
||||
flex-wrap: nowrap;
|
||||
.icon-idea {
|
||||
background-color: $color-yellow-light;
|
||||
border-radius: 100%;
|
||||
justify-content: center;
|
||||
margin-right: 0.7em;
|
||||
//flex-direction: column;
|
||||
width: 1.8em;
|
||||
height: 1.8em;
|
||||
//margin-right: 1em;
|
||||
}
|
||||
}
|
||||
|
||||
.action-link {
|
||||
@extend .right-link;
|
||||
background-color: $color-yellow;
|
||||
color: $color-white;
|
||||
font-weight: bold;
|
||||
text-transform: uppercase;
|
||||
|
||||
.icon-plus {
|
||||
font-size: 20px;
|
||||
justify-content: center;
|
||||
margin: 0.3em 0.3em 0.3em 0;
|
||||
|
||||
&:before {
|
||||
//font-size: 1.3em;
|
||||
}
|
||||
}
|
||||
}
|
Loading…
Reference in New Issue
Block a user