florian/codiki-hexagonal
1
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases Wiki Activity

Fixing Angular 21 by migrating all values by signals. (#11)
Some checks failed
Build and Deploy Java Gradle Application / build-and-deploy (push) Failing after 53s
Details

Browse Source
This commit was merged in pull request #11.
This commit is contained in:
Florian THIERRY - Takiguchi
2026-02-03 15:07:55 +01:00
parent 1ca2f872f7
commit 0cce8b2982
102 changed files with 4102 additions and 4852 deletions
Download Patch File Download Diff File Expand all files Collapse all files

244
frontend/src/app/components/header/header.component.scss
View File

@@ -1,148 +1,148 @@
$headerHeight: 3.5em;
:host {
display: flex;
flex-direction: row;
justify-content: space-between;
background-color: #3f51b5;
color: white;
position: relative;
height: $headerHeight;
box-shadow: 0 2px 5px 0 rgba(0, 0, 0, .16), 0 2px 10px 0 rgba(0, 0, 0, .12);
div {
display: flex;
flex-direction: row;
justify-content: space-between;
background-color: #3f51b5;
color: white;
justify-content: center;
position: relative;
height: $headerHeight;
box-shadow: 0 2px 5px 0 rgba(0,0,0,.16),0 2px 10px 0 rgba(0,0,0,.12);
div {
&.left {
position: absolute;
top: 0;
left: 0;
align-items: center;
gap: 1em;
padding: 0 1em;
z-index: 2;
a {
display: flex;
flex-direction: row;
justify-content: center;
position: relative;
height: $headerHeight;
align-items: center;
color: white;
text-decoration: none;
gap: .5em;
&.left {
position: absolute;
top: 0;
left: 0;
align-items: center;
gap: 1em;
padding: 0 1em;
z-index: 2;
a {
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
color: white;
text-decoration: none;
gap: .5em;
img {
$imageSize: 2em;
width: $imageSize;
height: $imageSize;
}
.title {
font-size: 1.5em;
display: none;
@media screen and (min-width: 600px) {
display: block;
}
}
}
img {
$imageSize: 2em;
width: $imageSize;
height: $imageSize;
}
&.middle {
flex: 1;
$borderRadiusValue: 10em;
position: relative;
transition: max-width .2s ease-in-out;
display: flex;
justify-content: center;
align-items: center;
z-index: 1;
app-publications-search-bar {
width: 100%;
max-width: 12em;
.title {
font-size: 1.5em;
display: none;
@media screen and (min-width: 435px) {
max-width: 16em;
}
@media screen and (min-width: 500px) {
max-width: 20em;
}
@media screen and (min-width: 700px) {
max-width: 24em;
}
@media screen and (min-width: 800px) {
max-width: 32em;
}
@media screen and (min-width: 900px) {
max-width: 38em;
}
@media screen and (min-width: 1000px) {
max-width: 45em;
}
@media screen and (min-width: 1100px) {
max-width: 50em;
}
}
}
&.right {
position: absolute;
top: 0;
right: 0;
z-index: 2;
margin-right: .5em;
a, button {
margin: .5em;
}
@media screen and (min-width: 600px) {
display: block;
}
}
}
}
&.middle {
flex: 1;
$borderRadiusValue: 10em;
position: relative;
transition: max-width .2s ease-in-out;
display: flex;
justify-content: center;
align-items: center;
z-index: 1;
app-publications-search-bar {
width: 100%;
max-width: 12em;
@media screen and (min-width: 435px) {
max-width: 16em;
}
@media screen and (min-width: 500px) {
max-width: 20em;
}
@media screen and (min-width: 700px) {
max-width: 24em;
}
@media screen and (min-width: 800px) {
max-width: 32em;
}
@media screen and (min-width: 900px) {
max-width: 38em;
}
@media screen and (min-width: 1000px) {
max-width: 45em;
}
@media screen and (min-width: 1100px) {
max-width: 50em;
}
}
}
&.right {
position: absolute;
top: 0;
right: 0;
z-index: 2;
margin-right: .5em;
a, button {
margin: .5em;
}
}
}
}
app-side-menu {
height: 100%;
height: 100%;
}
.authenticated-user-menu {
display: flex;
flex-direction: column;
padding: 0.2em 0;
a {
flex: 1;
display: flex;
flex-direction: column;
padding: 0.2em 0;
flex-direction: row;
align-items: center;
text-decoration: none;
background-color: white;
color: black;
padding: 1em;
gap: .5em;
transition: background-color .2s ease-in-out, color .2s ease-in-out;
a {
flex: 1;
display: flex;
flex-direction: row;
align-items: center;
text-decoration: none;
background-color: white;
color: black;
padding: 1em;
gap: .5em;
transition: background-color .2s ease-in-out, color .2s ease-in-out;
&:hover {
background-color: #5c6bc0;
color: white;
}
&.disconnection {
color: #D50000;
&:hover {
background-color: #E53935;
color: white;
}
}
&:hover {
background-color: #5c6bc0;
color: white;
}
}
&.disconnection {
color: #D50000;
&:hover {
background-color: #E53935;
color: white;
}
}
}
}