mirrors/shlink-web-client
1
0
Fork 0
mirror of https://github.com/shlinkio/shlink-web-client.git synced 2025-01-10 18:27:25 +03:00
Code Issues Projects Releases Packages Wiki Activity

Fixed home page styles for bootstrap 5

Browse source
This commit is contained in:
Alejandro Celaya 2022-03-06 10:38:26 +01:00
parent d8e4a4b891
commit 56313e5db8
3 changed files with 14 additions and 12 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
src/common/Home.scss
View file

@ -1,6 +1,10 @@
@import '../utils/base';
@import '../utils/mixins/vertical-align';
$mainCardWidth: 720px;
$totalColumns: 12;
$logoColumns: 5;
.home {
position: relative;
padding-top: 15px;
@ -21,12 +25,12 @@
.home__logo {
@include vertical-align();
width: calc(100% - 3rem);
width: calc(#{$mainCardWidth / $totalColumns * $logoColumns} - 3rem);
}
.home__main-card {
margin: 0 auto;
max-width: 720px;
max-width: $mainCardWidth;
@media (min-width: $mdMin) {
@include vertical-align();

4
src/servers/ServersListGroup.scss
View file

@ -17,6 +17,10 @@
padding: .75rem 2.5rem .75rem 1rem;
}
.servers-list__server-item:not(:hover) {
color: $mainColor;
}
.servers-list__server-item:hover {
background-color: var(--secondary-color);
}

14
src/utils/theme/index.ts
View file

@ -12,14 +12,8 @@ export const PRIMARY_DARK_COLOR = '#161b22';
export type Theme = 'dark' | 'light';
export const changeThemeInMarkup = (theme: Theme) => {
const html = document.getElementsByTagName('html');
export const changeThemeInMarkup = (theme: Theme) =>
document.getElementsByTagName('html')?.[0]?.setAttribute('data-theme', theme);
html?.[0]?.setAttribute('data-theme', theme);
};
export const isDarkThemeEnabled = (): boolean => {
const html = document.getElementsByTagName('html');
return html?.[0]?.getAttribute('data-theme') === 'dark';
};
export const isDarkThemeEnabled = (): boolean =>
document.getElementsByTagName('html')?.[0]?.getAttribute('data-theme') === 'dark';