4
0
forked from crowetic/commerce
commerce/site/components/common/I18nWidget/I18nWidget.module.css
Catalin Pinte 6d783eae35
Footer theme switcher (#894)
* Footer theme switcher

* Remove lazy loading & change rotation animation

* Changes

* Update ThemeSwitcher.tsx

* Requested style changes

* Update ThemeSwitcher.tsx

* Fix alignment

* Update ThemeSwitcher.tsx
2022-11-30 10:07:44 -05:00

49 lines
832 B
CSS

.root {
@apply relative;
}
.button {
@apply h-10 pl-2 pr-1 rounded-md border border-accent-2 flex items-center justify-center transition-colors ease-linear;
}
.button:hover {
@apply border-accent-3 shadow-sm;
}
.button:focus {
@apply outline-none;
}
.dropdownMenu {
@apply fixed right-0 top-12 mt-2 origin-top-right outline-none bg-primary z-40 w-full h-full;
}
.item {
@apply flex cursor-pointer px-6 py-3 transition ease-in-out duration-150 text-primary leading-6 font-medium items-center;
text-transform: capitalize;
}
.item:hover {
@apply bg-accent-1;
}
.icon {
transition: transform 0.2s ease;
}
.icon.active {
transform: rotate(90deg);
}
@screen lg {
.dropdownMenu {
@apply absolute border border-accent-1 shadow-lg w-56 h-auto;
}
}
@screen md {
.closeButton {
@apply hidden;
}
}