aboutsummaryrefslogtreecommitdiff
path: root/examples/docs/src/components/Header/LanguageSelect.css
diff options
context:
space:
mode:
authorGravatar Okiki <okikio.dev@gmail.com> 2021-08-14 00:58:00 +0000
committerGravatar Fred K. Schott <fkschott@gmail.com> 2021-08-26 12:15:33 -0700
commitb7ada11ddbabe4dd2f0798e140e5b280de4d6952 (patch)
treec01ff3eee4f770fc108c19d126dce31d9cbe5e51 /examples/docs/src/components/Header/LanguageSelect.css
parent59cc62f7bd53dbcb6ad8051fa501b7b797614178 (diff)
downloadastro-b7ada11ddbabe4dd2f0798e140e5b280de4d6952.tar.gz
astro-b7ada11ddbabe4dd2f0798e140e5b280de4d6952.tar.zst
astro-b7ada11ddbabe4dd2f0798e140e5b280de4d6952.zip
WIP update examples/docs/
Diffstat (limited to 'examples/docs/src/components/Header/LanguageSelect.css')
-rw-r--r--examples/docs/src/components/Header/LanguageSelect.css47
1 files changed, 47 insertions, 0 deletions
diff --git a/examples/docs/src/components/Header/LanguageSelect.css b/examples/docs/src/components/Header/LanguageSelect.css
new file mode 100644
index 000000000..4e878714b
--- /dev/null
+++ b/examples/docs/src/components/Header/LanguageSelect.css
@@ -0,0 +1,47 @@
+.language-select {
+ flex-grow: 1;
+ width: 48px;
+ box-sizing: border-box;
+ margin: 0;
+ padding: 0.33em 0.5em;
+ overflow: visible;
+ font-weight: 500;
+ font-size: 1rem;
+ font-family: inherit;
+ line-height: inherit;
+ background-color: var(--theme-bg);
+ border-color: var(--theme-text-lighter);
+ color: var(--theme-text-light);
+ border-style: solid;
+ border-width: 1px;
+ border-radius: 0.25rem;
+ outline: 0;
+ cursor: pointer;
+ transition-timing-function: ease-out;
+ transition-duration: 0.2s;
+ transition-property: border-color, color;
+ -webkit-font-smoothing: antialiased;
+ padding-left: 30px;
+ padding-right: 1rem;
+}
+.language-select-wrapper .language-select:hover,
+.language-select-wrapper .language-select:focus {
+ color: var(--theme-text);
+ border-color: var(--theme-text-light);
+}
+.language-select-wrapper {
+ color: var(--theme-text-light);
+ position: relative;
+}
+.language-select-wrapper > svg {
+ position: absolute;
+ top: 7px;
+ left: 10px;
+ pointer-events: none;
+}
+
+@media (min-width: 50em) {
+ .language-select {
+ width: 100%;
+ }
+}