diff --git a/myriad/static/style.css b/myriad/static/style.css index de147bb..c566772 100644 --- a/myriad/static/style.css +++ b/myriad/static/style.css @@ -42,35 +42,6 @@ form textarea{ -#main{ - background-color: rgb(255, 255, 255, 0); - border-radius: 5px; - width: 60%; - margin:auto; - padding:20px; - display:flex; - margin-top:20px; -} -#nav{ - margin-right:20px; - flex:20%; - height:fit-content; - position:sticky; - position: -webkit-sticky; -} -.navitem{ - display:block; -} - -.container{ - background-color:#e6f7ff; - border-color:#99dfff; - border-style:solid; - border-width:2px; - flex: 80%; - padding: 10px; - border-radius:5px; -} .profile{ margin:15px; @@ -104,7 +75,7 @@ form textarea{ } .manage_images_2{ clear:both; - width:600px; + width:500px; } .manage_icons_3{ display:block; @@ -240,14 +211,70 @@ form textarea{ +#mobile-nav{ + display:none; + background-color:#e6f7ff; + border-color:#99dfff; + border-style:solid; + border-width:2px; + border-radius:5px; +} +#main{ + background-color: rgb(255, 255, 255, 0); + border-radius: 5px; + width: 60%; + margin:auto; + padding:20px; + display:flex; + margin-top:20px; +} +#nav{ + margin-right:20px; + flex:20%; + height:fit-content; + position:sticky; + position: -webkit-sticky; +} +.navitem{ + display:block; +} +.container{ + background-color:#e6f7ff; + border-color:#99dfff; + border-style:solid; + border-width:2px; + border-radius:5px; + flex: 80%; + padding: 10px; +} -@media (max-width: 1000px) { +.mobile{ + display:none; +} + +@media (max-width: 1000px) +{ #main{ width:90%; } #nav{ display:none; } + .mobile{ + display:inline; + } + #mobile-nav + { + display:inline-block; + top:0; + position:absolute; + padding:10px; + margin-left:20px; + margin-top:10px; + } + .container{ + margin:20px; + } } diff --git a/myriad/static/themes/christmas.css b/myriad/static/themes/christmas.css index 89e6883..b66c6d1 100644 --- a/myriad/static/themes/christmas.css +++ b/myriad/static/themes/christmas.css @@ -37,7 +37,7 @@ body.christmas{ background: linear-gradient(90deg, #5abf72 0%, #da1414 50%, #bf8282 100%); scrollbar-color:#da1414 #f49191; } -.christmas .container{ +.christmas .container, .christmas #mobile-nav{ background-color:#fac9c9; border-color:#da1414; } \ No newline at end of file diff --git a/myriad/static/themes/dark-blue.css b/myriad/static/themes/dark-blue.css index a85d2a6..6578833 100644 --- a/myriad/static/themes/dark-blue.css +++ b/myriad/static/themes/dark-blue.css @@ -37,7 +37,7 @@ body.dark-blue{ background: linear-gradient(90deg, #4685fb 0%, #142bda 50%, #0e1598 100%); scrollbar-color:#a414da #d991f4; } -.dark-blue .container{ +.dark-blue .container, .dark-blue #mobile-nav{ background-color:#c9cffa; border-color:#142bda; } \ No newline at end of file diff --git a/myriad/static/themes/dark-green.css b/myriad/static/themes/dark-green.css index 9eeb250..0bc073f 100644 --- a/myriad/static/themes/dark-green.css +++ b/myriad/static/themes/dark-green.css @@ -37,7 +37,7 @@ body.dark-green{ background: linear-gradient(90deg, #6dad9e 0%, #41da86 50%, #36b78c 100%); scrollbar-color:#5ed3a2 #a8d0c5; } -.dark-green .container{ +.dark-green .container, .dark-green #mobile-nav{ background-color:#c9fae8; border-color:#59d7af; } \ No newline at end of file diff --git a/myriad/static/themes/dark.css b/myriad/static/themes/dark.css index 1c80d74..b1190af 100644 --- a/myriad/static/themes/dark.css +++ b/myriad/static/themes/dark.css @@ -40,7 +40,7 @@ body.dark{ background: linear-gradient(90deg, #1B1F23 0%, #1B1F23 50%, #1B1F23 100%); scrollbar-color:#292F35 #373b3e; } -.dark .container{ +.dark .container, .dark #mobile-nav{ background-color:#1B1F23; border-color:black; } \ No newline at end of file diff --git a/myriad/static/themes/default.css b/myriad/static/themes/default.css index 60adbbf..ac99e6b 100644 --- a/myriad/static/themes/default.css +++ b/myriad/static/themes/default.css @@ -37,4 +37,8 @@ background: #00b7ff; background: linear-gradient(90deg, #00b7ff 0%, #57c785 50%, #eddd53 100%); scrollbar-color:#008bcc #b3e7ff; +} +.default .container, .default #mobile-nav{ + background-color:#e6f7ff; + border-color:#99dfff; } \ No newline at end of file diff --git a/myriad/static/themes/green.css b/myriad/static/themes/green.css index dd4ebaf..aef80bf 100644 --- a/myriad/static/themes/green.css +++ b/myriad/static/themes/green.css @@ -37,7 +37,7 @@ body.green{ background: linear-gradient(90deg, #67e2ab 0%, #14da8b 50%, #0e986a 100%); scrollbar-color:#14da88 #91f4d8; } -.green .container{ +.green .container, .green #mobile-nav{ background-color:#c9fae8; border-color:#14da9b; } \ No newline at end of file diff --git a/myriad/static/themes/pink-lighter.css b/myriad/static/themes/pink-lighter.css index f5acbd3..c04e62b 100644 --- a/myriad/static/themes/pink-lighter.css +++ b/myriad/static/themes/pink-lighter.css @@ -38,7 +38,7 @@ body.pink-lighter{ background: linear-gradient(90deg, #f5c2ea 0%, #e89dfb 50%, #f6959c 100%); scrollbar-color:#a414da #d991f4; } -.pink-lighter .container{ +.pink-lighter .container, .pink-lighter #mobile-nav{ background-color:#fac9f6; border-color:#da14c6; } \ No newline at end of file diff --git a/myriad/static/themes/pink.css b/myriad/static/themes/pink.css index f39acec..a9c8cdc 100644 --- a/myriad/static/themes/pink.css +++ b/myriad/static/themes/pink.css @@ -37,7 +37,7 @@ body.pink{ background: linear-gradient(90deg, #f8a1e5 0%, #d55ff3 50%, #f5c35e 100%); scrollbar-color:#a414da #d991f4; } -.pink .container{ +.pink .container, .pink #mobile-nav{ background-color:#fac9f6; border-color:#da14c6; } \ No newline at end of file diff --git a/myriad/static/themes/purple.css b/myriad/static/themes/purple.css index 99f69b8..315c3b5 100644 --- a/myriad/static/themes/purple.css +++ b/myriad/static/themes/purple.css @@ -38,7 +38,7 @@ body.purple{ background: linear-gradient(90deg, #fb46c0 0%, #a414da 50%, #720e98 100%); scrollbar-color:#a414da #d991f4; } -.purple .container{ +.purple .container, .purple #mobile-nav{ background-color:#ecc9fa; border-color:#a414da; } \ No newline at end of file diff --git a/myriad/static/themes/red.css b/myriad/static/themes/red.css index 1bf283f..dba7190 100644 --- a/myriad/static/themes/red.css +++ b/myriad/static/themes/red.css @@ -37,7 +37,7 @@ body.red{ background: linear-gradient(90deg, #fb4646 0%, #da1414 50%, #980e0e 100%); scrollbar-color:#da1414 #f49191; } -.red .container{ +.red .container, .red #mobile-nav{ background-color:#fac9c9; border-color:#da1414; } \ No newline at end of file diff --git a/myriad/templates/base.html b/myriad/templates/base.html index d2d422f..cd55b55 100644 --- a/myriad/templates/base.html +++ b/myriad/templates/base.html @@ -8,6 +8,9 @@ {% endfor %} + + +