🎨 🐛 :ie: Compatibilité IE 11
Johan Girod
Mael
parent
0e028cc843
commit
b4ee87daac
|
|
@ -26,7 +26,8 @@
|
|||
<body>
|
||||
<div id="js" />
|
||||
<script src="https://use.fontawesome.com/1da10bbdec.js"></script>
|
||||
<script src="https://cdn.polyfill.io/v2/polyfill.min.js?features=default,Intl.~locale.en,Intl.~locale.fr,IntersectionObserver,fetch&unknown=polyfill"></script>
|
||||
<script src="https://cdn.polyfill.io/v2/polyfill.min.js?features=default,Intl.~locale.en,Intl.~locale.fr,IntersectionObserver,fetch,Array.prototype.find,Object.values,
|
||||
Number.parseFloat&unknown=polyfill"></script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
|
|
@ -16,7 +16,7 @@
|
|||
margin: 0;
|
||||
width: inherit;
|
||||
color: inherit;
|
||||
background-color: inherit;
|
||||
background-color: transparent;
|
||||
font-size: inherit;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -111,3 +111,13 @@
|
|||
grid-column: 2 / span 2;
|
||||
border-top: solid 1px rgba(0, 0, 0, 0.7);
|
||||
}
|
||||
|
||||
/* IE11 Special */
|
||||
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
|
||||
.distribution-chart__total > * {
|
||||
margin: 8px;
|
||||
}
|
||||
.distribution-chart__total-border {
|
||||
border: none;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -161,7 +161,7 @@ let ChartItemBar = ({ styles, colour, montant, total }) => (
|
|||
backgroundColor: colour
|
||||
}}
|
||||
/>
|
||||
<div>
|
||||
<div style={{ flex: 0 }}>
|
||||
<Montant
|
||||
className="distribution-chart__amount"
|
||||
numFractionDigit={0}
|
||||
|
|
|
|||
|
|
@ -65,3 +65,26 @@
|
|||
font-size: 90%;
|
||||
margin-top: 2em;
|
||||
}
|
||||
|
||||
/* IE */
|
||||
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
|
||||
.payslip__cotisationsSection > h4:nth-child(1),
|
||||
.payslip__cotisationsSection > a,
|
||||
div.payslip__total {
|
||||
width: 50%;
|
||||
display: inline-block;
|
||||
}
|
||||
.payslip__cotisationsSection > h4:not(:nth-child(1)) {
|
||||
width: 25%;
|
||||
display: inline-block;
|
||||
}
|
||||
.payslip__container .montant {
|
||||
display: inline-block;
|
||||
width: 25%;
|
||||
text-align: right;
|
||||
}
|
||||
.payslip__salarySection > a {
|
||||
width: 75%;
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -51,6 +51,13 @@
|
|||
#targetSelection .progressCircle svg {
|
||||
width: 2em;
|
||||
}
|
||||
/* IE */
|
||||
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
|
||||
#targetSelection .progressCircle svg {
|
||||
max-height: 2.5rem;
|
||||
}
|
||||
}
|
||||
|
||||
#targetSelection .progressCircle i {
|
||||
color: #5de662;
|
||||
font-size: 220%;
|
||||
|
|
|
|||
|
|
@ -6,7 +6,6 @@
|
|||
|
||||
html {
|
||||
box-sizing: border-box;
|
||||
height: 100%;
|
||||
}
|
||||
*,
|
||||
*:before,
|
||||
|
|
@ -16,7 +15,6 @@ html {
|
|||
|
||||
body {
|
||||
margin: 0;
|
||||
height: 100%;
|
||||
}
|
||||
[hidden],
|
||||
.js-only {
|
||||
|
|
|
|||
|
|
@ -10,7 +10,7 @@ const CreateMyCompany = ({ match }: Props) => (
|
|||
<>
|
||||
<h1 className="question__title">Register a company</h1>
|
||||
<Link className="ui__ link-button" to="/my-company/find">
|
||||
My companyaa is already registered with the French Administration
|
||||
My company is already registered with the French Administration
|
||||
</Link>
|
||||
<p>
|
||||
The French business law defines more than 20 possible legal statuses to
|
||||
|
|
|
|||
|
|
@ -14,7 +14,7 @@ class Hiring extends Component<Props, {}> {
|
|||
<Animate.fromBottom>
|
||||
{!this.props.hideText && (
|
||||
<>
|
||||
<h1>Social protection: costs assssssnd benefits</h1>
|
||||
<h1>Social protection: costs and benefits</h1>
|
||||
<p>
|
||||
France has chosen to provide its citizens with a high-level social
|
||||
safety net. This mandatory system is based on solidarity and
|
||||
|
|
|
|||
|
|
@ -47,11 +47,20 @@
|
|||
opacity: 1;
|
||||
flex: 1;
|
||||
}
|
||||
/* IE */
|
||||
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
|
||||
.ui__.steps-header a.active {
|
||||
min-width: 80%;
|
||||
}
|
||||
.ui__.steps-header a {
|
||||
flex-shrink: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.ui__.steps-header .progress {
|
||||
margin-top: 0.4rem;
|
||||
height: 0.5rem;
|
||||
background: rgb(41, 117, 209, 0.2);
|
||||
background: rgba(41, 117, 209, 0.2);
|
||||
border-radius: 0.1rem;
|
||||
width: 100%;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -16,8 +16,8 @@ module.exports = {
|
|||
}
|
||||
},
|
||||
entry: {
|
||||
infrance: ['./source/sites/mycompanyinfrance.fr/entry.js'],
|
||||
embauche: ['./source/sites/embauche.gouv.fr/entry.js'],
|
||||
infrance: ['./source/sites/mycompanyinfrance.fr/entry.js']
|
||||
},
|
||||
output: {
|
||||
path: path.resolve('./dist/'),
|
||||
|
|
@ -83,13 +83,13 @@ module.exports = {
|
|||
plugins: [
|
||||
new HTMLPlugin({
|
||||
template: 'index.html',
|
||||
chunks: ['embauche'],
|
||||
filename: 'embauche.html',
|
||||
chunks: ['infrance'],
|
||||
filename: 'infrance.html'
|
||||
}),
|
||||
new HTMLPlugin({
|
||||
template: 'index.html',
|
||||
chunks: ['infrance'],
|
||||
filename: 'infrance.html'
|
||||
chunks: ['embauche'],
|
||||
filename: 'embauche.html',
|
||||
}),
|
||||
new HTMLPlugin({
|
||||
template: 'couleur.html',
|
||||
|
|
|
|||
|
|
@ -4,6 +4,7 @@ const common = require('./webpack.common.js')
|
|||
const webpackServeWaitpage = require('webpack-serve-waitpage')
|
||||
const history = require('connect-history-api-fallback')
|
||||
const convert = require('koa-connect')
|
||||
|
||||
module.exports = {
|
||||
...common,
|
||||
mode: 'development',
|
||||
|
|
|
|||
Loading…
Reference in New Issue