header.scss 1.0 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859
  1. ;#header{
  2. position: fixed;
  3. .language-selector{
  4. display: flex;
  5. position: fixed;
  6. width: 100px;
  7. left: 50%;
  8. margin-left: -100px;
  9. li{
  10. margin-right: 20px;
  11. }
  12. }
  13. .navigation{
  14. li{
  15. position: fixed;
  16. text-align: center;
  17. &:first-child{
  18. display: none;
  19. }
  20. &:nth-child(2){
  21. bottom: 0;
  22. width: 50%;
  23. }
  24. &:nth-child(3){
  25. top: 0;
  26. width: 50%;
  27. }
  28. &:nth-child(4){
  29. bottom: 0;
  30. width: 50%;
  31. right: 0;
  32. }
  33. &:nth-child(5){
  34. transform: rotate(90deg);
  35. // right: 50%;
  36. top: 50%;
  37. width: 100%;
  38. right: -50%;
  39. margin-right: 22px;
  40. }
  41. &:nth-child(6){
  42. transform: rotate(-90deg);
  43. top: 50%;
  44. width: 100%;
  45. left: -50%;
  46. margin-left: 22px;
  47. }
  48. &:nth-child(7){
  49. top: 0;
  50. right: 0;
  51. width: 50%;
  52. }
  53. a{
  54. position: relative;
  55. margin: auto;
  56. }
  57. }
  58. }
  59. }