[ui] Make office menus consistent

Improve color consistency inside office menus and choose more pleasent
colors
dev
Joaquin 3 years ago
parent 7f6943ecee
commit 5351ca762f
Signed by: puly
GPG Key ID: 9E9299CD96C65EC6
  1. 21
      webPage/css/dist.css
  2. 2
      webPage/office/19/index.html
  3. 2
      webPage/office/21/index.html
  4. 2
      webPage/office/setKMS/about/index.html
  5. 4
      webPage/office/setKMS/customKMS/index.html
  6. 8
      webPage/office/setKMS/index.html
  7. 6
      webPage/office/ver/index.html

@ -549,10 +549,6 @@ Ensure the default browser behavior of the `hidden` attribute.
margin-right: auto;
}
.block {
display: block;
}
.inline {
display: inline;
}
@ -644,9 +640,9 @@ Ensure the default browser behavior of the `hidden` attribute.
background-color: rgb(40 63 59 / var(--tw-bg-opacity));
}
.bg-\[\#D16014\] {
.bg-\[\#E94F37\] {
--tw-bg-opacity: 1;
background-color: rgb(209 96 20 / var(--tw-bg-opacity));
background-color: rgb(233 79 55 / var(--tw-bg-opacity));
}
.bg-indigo-900 {
@ -811,6 +807,14 @@ Ensure the default browser behavior of the `hidden` attribute.
backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
}
.transition {
transition-property: color, background-color, border-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-text-decoration-color, -webkit-backdrop-filter;
transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-text-decoration-color, -webkit-backdrop-filter;
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
transition-duration: 150ms;
}
@font-face {
font-family: 'manrope';
@ -1039,11 +1043,6 @@ button:hover{
background-color: rgb(40 63 59 / var(--tw-bg-opacity));
}
.hover\:bg-mycol2:hover {
--tw-bg-opacity: 1;
background-color: rgb(22 21 36 / var(--tw-bg-opacity));
}
@media (min-width: 640px) {
.sm\:flex-nowrap {
flex-wrap: nowrap;

@ -18,7 +18,7 @@
<div class="text-center text-white">
<button type="button" class="rounded-xl w-full bg-[#283F3B] my-2 py-5 my-2 px-5 text-sm md:text-xl font-bold tracking-wide justify-center items-center font-[manrope]" id="download">Download Office from Microsoft →</button>
<button type="button" class="rounded-xl w-full bg-[#D16014] my-2 py-5 my-2 px-5 text-sm md:text-xl font-bold tracking-wide justify-center items-center font-[manrope]" id="ok">Activate Office →<p class="text-[0.5rem] md:text-xs">admin required</p></button>
<button type="button" class="rounded-xl w-full bg-[#E94F37] my-2 py-5 my-2 px-5 text-sm md:text-xl font-bold tracking-wide justify-center items-center font-[manrope]" id="ok">Activate Office →<p class="text-[0.5rem] md:text-xs">admin required</p></button>
</div>
</div>

@ -18,7 +18,7 @@
<div class="text-center text-white">
<button type="button" class="rounded-xl w-full bg-[#283F3B] my-2 py-5 my-2 px-5 text-sm md:text-xl font-bold tracking-wide justify-center items-center font-[manrope]" id="download">Download Office from Microsoft →</button>
<button type="button" class="rounded-xl w-full bg-[#D16014] my-2 py-5 my-2 px-5 text-sm md:text-xl font-bold tracking-wide justify-center items-center font-[manrope]" id="ok">Activate Office →<p class="text-[0.5rem] md:text-xs">admin required</p></button>
<button type="button" class="rounded-xl w-full bg-[#E94F37] my-2 py-5 my-2 px-5 text-sm md:text-xl font-bold tracking-wide justify-center items-center font-[manrope]" id="ok">Activate Office →<p class="text-[0.5rem] md:text-xs">admin required</p></button>
</div>
</div>

@ -26,7 +26,7 @@
<div class="text-white bold fixed bottom-4 flex flex-row flex-wrap sm:flex-nowrap items-center mx-50 justify-center ml-auto mr-auto mx-100 px-2 pt-100 text-md bg-purple md:bg-transparent">
<button type="button" class="redir outline rounded-md py-1 md:py-3 bg-mycol2 px-3 md:px-7 outline-0 outline-white hover:bg-indigo-900 mx-2" onclick="location.href = '../index.html';">
<button type="button" class="redir outline rounded-md py-1 md:py-3 bg-[#283F3B] px-3 md:px-7 outline-0 outline-white mx-2" onclick="location.href = '../index.html';">
<span class="hidden md:inline">Back</span>
</button>
</div>

@ -18,7 +18,7 @@
<div class="text-center text-white">
<input type="url" id="customKMSbox" class="text-xl rounded-xl text-black py-3 px-3 w-full" placeholder="ip/url:port (default port 1668)">
<p class="pb-10"> </p>
<button type="button" class="rounded-xl w-full bg-[#D16014] my-2 py-5 my-2 px-5 text-sm md:text-xl font-bold tracking-wide justify-center items-center font-[manrope]" id="kmsDefaultButton">install custom server</button>
<button type="button" class="rounded-xl w-full bg-[#283F3B] my-2 py-5 my-2 px-5 text-sm md:text-xl font-bold tracking-wide justify-center items-center font-[manrope]" id="kmsDefaultButton">install custom server</button>
</div>
</div>
@ -31,7 +31,7 @@
<div class="text-white bold fixed bottom-4 flex flex-row flex-wrap sm:flex-nowrap items-center mx-50 justify-center ml-auto mr-auto mx-100 px-2 pt-100 text-md bg-purple md:bg-transparent">
<button type="button" class="redir outline rounded-md py-1 md:py-3 bg-mycol2 px-3 md:px-7 outline-0 outline-white hover:bg-indigo-900 mx-2" onclick="location.href = '../index.html';">
<button type="button" class="redir outline rounded-md py-1 md:py-3 bg-[#283F3B] px-3 md:px-7 outline-0 outline-white mx-2" onclick="location.href = '../index.html';">
<span class="hidden md:inline">Back</span>
</button>
</div>

@ -19,10 +19,10 @@
<div class="text-center text-white">
<div class="kmscontainer">
<div class="windows pr-5">
<button type="button" class="rounded-xl w-full bg-[#D16014] my-2 py-5 my-2 px-5 text-sm md:text-xl font-bold tracking-wide justify-center items-center font-[manrope]" id="kmsDefaultButton">use the default server</button>
<button type="button" class="rounded-xl w-full bg-[#E94F37] my-2 py-5 my-2 px-5 text-sm md:text-xl font-bold tracking-wide justify-center items-center font-[manrope]" id="kmsDefaultButton">use the default server</button>
</div>
<div class="office pl-5">
<button type="button" class="rounded-xl w-full bg-mycol2 my-2 py-5 px-5 text-sm md:text-xl font-bold tracking-wide justify-center items-center font-[manrope]" onclick="location.href = './customKMS/index.html';">set a custom server</button>
<button type="button" class="rounded-xl w-full bg-[#283F3B] my-2 py-5 px-5 text-sm md:text-xl font-bold tracking-wide justify-center items-center font-[manrope]" onclick="location.href = './customKMS/index.html';">set a custom server</button>
</div>
</div>
@ -39,10 +39,10 @@
<div class="text-white bold fixed bottom-4 flex flex-row flex-wrap sm:flex-nowrap items-center mx-50 justify-center ml-auto mr-auto mx-100 px-2 pt-100 text-md bg-purple md:bg-transparent">
<button type="button" class="redir outline rounded-md py-1 md:py-3 bg-mycol2 px-3 md:px-7 outline-0 outline-white mx-2" onclick="location.href = '../../index.html';">
<button type="button" class="redir outline rounded-md py-1 md:py-3 bg-[#283F3B] px-3 md:px-7 outline-0 outline-white mx-2" onclick="location.href = '../../index.html';">
<span class="hidden md:inline">Back</span>
</button>
<button type="button" class="redir outline rounded-md py-1 md:py-3 bg-mycol2 px-3 md:px-7 outline-0 outline-white mx-2" onclick="location.href = './about/index.html';">
<button type="button" class="redir outline rounded-md py-1 md:py-3 bg-[#283F3B] px-3 md:px-7 outline-0 outline-white mx-2" onclick="location.href = './about/index.html';">
<span class="hidden md:inline">About e-KMS servers</span>
</button>
</div>

@ -18,10 +18,10 @@
<div class="items-center text-center justify-center text-white">
<div class="officevercontainer text-center w-full">
<div class="twentyone px-2">
<button type="button" class="rounded-xl w-full bg-mycol2 my-2 py-5 my-2 px-5 text-sm md:text-xl font-bold tracking-wide justify-center items-center font-[manrope]" onclick="location.href='../21/index.html';"><img class="w-4/5 ml-auto mr-auto pb-7" src="../../img/office21.png">Office 2021 →</button>
<button type="button" class="rounded-xl w-full bg-[#283F3B] my-2 py-5 my-2 px-5 text-sm md:text-xl font-bold tracking-wide justify-center items-center font-[manrope]" onclick="location.href='../21/index.html';"><img class="w-4/5 ml-auto mr-auto pb-7" src="../../img/office21.png">Office 2021 →</button>
</div>
<div class="nineteen px-2">
<button type="button" class="rounded-xl w-full bg-mycol2 my-2 py-5 my-2 px-5 text-sm md:text-xl font-bold tracking-wide justify-center items-center font-[manrope]" onclick="location.href='../19/index.html';"><img class="w-4/5 ml-auto mr-auto pb-7" src="../../img/office19.png">Office 2019 →</button>
<button type="button" class="rounded-xl w-full bg-[#283F3B] my-2 py-5 my-2 px-5 text-sm md:text-xl font-bold tracking-wide justify-center items-center font-[manrope]" onclick="location.href='../19/index.html';"><img class="w-4/5 ml-auto mr-auto pb-7" src="../../img/office19.png">Office 2019 →</button>
</div>
<div class="legacy px-2">
<button type="button" class="rounded-xl w-full bg-mycol2 my-2 py-5 my-2 px-5 text-sm md:text-xl font-bold tracking-wide justify-center items-center font-[manrope]" onclick="location.href='';"><img class="w-4/5 ml-auto mr-auto pb-7" src="../../img/office10.png">Legacy (unavailable)</button>
@ -41,7 +41,7 @@
<div class="text-white bold fixed bottom-4 flex flex-row flex-wrap sm:flex-nowrap items-center mx-50 justify-center ml-auto mr-auto mx-100 px-2 pt-100 text-md bg-purple md:bg-transparent">
<button type="button" class="redir outline rounded-md py-1 md:py-3 bg-mycol2 px-3 md:px-7 outline-0 outline-white hover:bg-mycol2 mx-2" onclick="location.href = '../setKMS/index.html';">
<button type="button" class="redir outline rounded-md py-1 md:py-3 bg-[#283F3B] px-3 md:px-7 outline-0 outline-white mx-2" onclick="location.href = '../setKMS/index.html';">
<span class="hidden md:inline">Back</span>
</button>
</div>

Loading…
Cancel
Save