2022-02-23 21:30:26 +01:00
|
|
|
.import-srp {
|
2022-03-21 20:09:26 +01:00
|
|
|
&__container {
|
|
|
|
display: grid;
|
|
|
|
grid-template-areas:
|
2022-05-16 20:38:04 +02:00
|
|
|
'title dropdown'
|
|
|
|
'paste-tip paste-tip'
|
|
|
|
'input input'
|
|
|
|
'error error'
|
|
|
|
'too-many-words-error too-many-words-error';
|
2022-03-21 20:09:26 +01:00
|
|
|
}
|
|
|
|
|
2022-08-04 16:03:02 +02:00
|
|
|
@include screen-md-max {
|
2022-03-21 20:09:26 +01:00
|
|
|
&__container {
|
2022-03-22 01:41:53 +01:00
|
|
|
grid-template-areas:
|
2022-05-16 20:38:04 +02:00
|
|
|
'title'
|
|
|
|
'dropdown'
|
|
|
|
'paste-tip'
|
|
|
|
'input'
|
|
|
|
'error'
|
|
|
|
'too-many-words-error';
|
2022-03-21 20:09:26 +01:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2022-02-23 21:30:26 +01:00
|
|
|
&__srp-label {
|
2022-03-21 20:09:26 +01:00
|
|
|
grid-area: title;
|
2022-05-16 20:38:04 +02:00
|
|
|
text-align: center;
|
2022-03-21 20:09:26 +01:00
|
|
|
}
|
|
|
|
|
|
|
|
&__number-of-words-dropdown {
|
|
|
|
grid-area: dropdown;
|
|
|
|
}
|
|
|
|
|
|
|
|
&__paste-tip {
|
2022-05-16 20:38:04 +02:00
|
|
|
margin: 24px 0;
|
2022-03-21 20:09:26 +01:00
|
|
|
grid-area: paste-tip;
|
2022-03-22 01:41:53 +01:00
|
|
|
width: auto;
|
2022-03-21 20:09:26 +01:00
|
|
|
margin-left: auto;
|
|
|
|
margin-right: auto;
|
2022-02-23 21:30:26 +01:00
|
|
|
}
|
|
|
|
|
2022-03-21 20:09:26 +01:00
|
|
|
&__srp {
|
|
|
|
display: grid;
|
|
|
|
grid-template-columns: 1fr 1fr 1fr;
|
|
|
|
grid-area: input;
|
|
|
|
}
|
2022-02-23 21:30:26 +01:00
|
|
|
|
2022-08-04 16:03:02 +02:00
|
|
|
@include screen-md-max {
|
2022-03-21 20:09:26 +01:00
|
|
|
&__srp {
|
|
|
|
grid-template-columns: 1fr;
|
|
|
|
}
|
2022-02-23 21:30:26 +01:00
|
|
|
}
|
|
|
|
|
2022-03-21 20:09:26 +01:00
|
|
|
&__srp-word {
|
|
|
|
display: flex;
|
|
|
|
align-items: center;
|
|
|
|
margin: 8px;
|
|
|
|
}
|
|
|
|
|
|
|
|
&__srp-word-label {
|
|
|
|
width: 2em;
|
2022-02-23 21:30:26 +01:00
|
|
|
}
|
|
|
|
|
2022-03-21 20:09:26 +01:00
|
|
|
&__srp-error {
|
|
|
|
margin-top: 4px;
|
|
|
|
grid-area: error;
|
2022-02-23 21:30:26 +01:00
|
|
|
}
|
|
|
|
|
2022-03-21 20:09:26 +01:00
|
|
|
&__srp-too-many-words-error {
|
|
|
|
margin-top: 4px;
|
|
|
|
grid-area: too-many-words-error;
|
2022-02-23 21:30:26 +01:00
|
|
|
}
|
|
|
|
}
|