font-family: 'Roboto';
font-weight: 400;
font-style: normal;
- src: local('Roboto'),
- local('Roboto-Regular'),
- url('../fonts/Roboto-Regular.woff2') format('woff2'),
- url('../fonts/Roboto-Regular.woff') format('woff');
+ src:
+ local('Roboto'),
+ local('Roboto-Regular'),
+ url('../fonts/Roboto-Regular.woff2') format('woff2'),
+ url('../fonts/Roboto-Regular.woff') format('woff');
}
@font-face {
font-family: 'Roboto';
font-weight: 700;
font-style: normal;
- src: local('Roboto'),
- local('Roboto-Bold'),
- url('../fonts/Roboto-Bold.woff2') format('woff2'),
- url('../fonts/Roboto-Bold.woff') format('woff');
+ src:
+ local('Roboto'),
+ local('Roboto-Bold'),
+ url('../fonts/Roboto-Bold.woff2') format('woff2'),
+ url('../fonts/Roboto-Bold.woff') format('woff');
}
body,
}
@media screen and (max-width: 64em) {
- .header-search ,
+ .header-search,
.header-search * {
visibility: hidden;
}
}
}
+.header-alert-message {
+ text-align: center;
+}
+
// CONTENT - GENERAL
.container {
position: relative;
color: $dark-grey;
font-size: .9em;
-
a {
display: inline-block;
margin: 3px 0;
padding: 5px;
text-decoration: none;
color: $dark-grey;
+
+ &.selected {
+ background: var(--main-color);
+ color: $white;
+ }
}
input {
content: '';
}
}
+
+ .search-highlight {
+ background-color: yellow;
+ }
}
.linklist-item-buttons {
}
}
+.loading-input {
+ position: relative;
+
+ @keyframes around {
+ 0% {
+ transform: rotate(0deg);
+ }
+
+ 100% {
+ transform: rotate(360deg);
+ }
+ }
+
+ .icon-container {
+ position: absolute;
+ right: 60px;
+ top: calc(50% - 10px);
+ }
+
+ .loader {
+ position: relative;
+ height: 20px;
+ width: 20px;
+ display: inline-block;
+ animation: around 5.4s infinite;
+
+ &::after,
+ &::before {
+ content: "";
+ background: $form-input-background;
+ position: absolute;
+ display: inline-block;
+ width: 100%;
+ height: 100%;
+ border-width: 2px;
+ border-color: #333 #333 transparent transparent;
+ border-style: solid;
+ border-radius: 20px;
+ box-sizing: border-box;
+ top: 0;
+ left: 0;
+ animation: around 0.7s ease-in-out infinite;
+ }
+
+ &::after {
+ animation: around 0.7s ease-in-out 0.1s infinite;
+ background: transparent;
+ }
+ }
+}
+
// LOGIN
.login-form-container {
.remember-me {
text-align: center;
a {
+ background: $almost-white;
display: inline-block;
- margin: 0 15px;
+ padding: 5px;
text-decoration: none;
- color: $white;
- font-weight: bold;
+ color: $dark-grey;
}
}
> div {
border-radius: 10px;
- background: repeating-linear-gradient(
- -45deg,
- $almost-white,
- $almost-white 6px,
- var(--background-color) 6px,
- var(--background-color) 12px
- );
+ background:
+ repeating-linear-gradient(
+ -45deg,
+ $almost-white,
+ $almost-white 6px,
+ var(--background-color) 6px,
+ var(--background-color) 12px
+ );
width: 0%;
height: 10px;
}