From 823344c19094680e80e2b56449a243e183db8b06 Mon Sep 17 00:00:00 2001 From: Fuwn Date: Mon, 14 Dec 2020 23:21:39 -0800 Subject: :star: --- .../src/themes/default/elements/input.variables | 102 +++++++++++++++++++++ 1 file changed, 102 insertions(+) create mode 100644 semantic/src/themes/default/elements/input.variables (limited to 'semantic/src/themes/default/elements/input.variables') diff --git a/semantic/src/themes/default/elements/input.variables b/semantic/src/themes/default/elements/input.variables new file mode 100644 index 0000000..493f574 --- /dev/null +++ b/semantic/src/themes/default/elements/input.variables @@ -0,0 +1,102 @@ +/******************************* + Input +*******************************/ + +/*------------------- + Element +--------------------*/ + +@inputFont: @pageFont; +@verticalPadding: @inputVerticalPadding; +@horizontalPadding: @inputHorizontalPadding; + +@lineHeight: @inputLineHeight; +@lineHeightOffset: ((@lineHeight - 1em) / 2); + +@padding: (@verticalPadding - @lineHeightOffset) @horizontalPadding; + +@textAlign: left; +@background: @inputBackground; +@borderWidth: 1px; +@border: @borderWidth solid @borderColor; +@boxShadow: none; + +@borderRadius: @defaultBorderRadius; +@transition: + box-shadow @defaultDuration @defaultEasing, + border-color @defaultDuration @defaultEasing +; + +/*------------------- + Types +--------------------*/ + +/* Icon Input */ +@iconWidth: (@verticalPadding * 2) + @glyphWidth; +@iconOpacity: 0.5; +@iconFocusOpacity: 1; +@iconOffset: -0.5em; + +@iconDistance: 0; +@iconMargin: @iconWidth + @iconDistance; +@iconTransition: opacity 0.3s @defaultEasing; + +@transparentIconWidth: @glyphWidth; +@transparentIconMargin: 2em; + +@textareaIconHeight: 3em; +@transparentTextareaIconHeight: 1.3em; + +/* Circular Icon Input */ +@circularIconVerticalOffset: 0.35em; +@circularIconHorizontalOffset: 0.5em; + +/* Labeled Input */ +@labelCornerTop: @borderWidth; +@labelCornerRight: @borderWidth; +@labelCornerSize: @relative9px; +@labelSize: 1em; +@labelVerticalPadding: (@verticalPadding - @lineHeightOffset); + +@labeledMargin: 2.5em; +@labeledIconInputMargin: 3.25em; +@labeledIconMargin: 1.25em; + +/*------------------- + States +--------------------*/ + +/* Placeholder */ +@placeholderColor: @inputPlaceholderColor; +@placeholderFocusColor: @inputPlaceholderFocusColor; + +/* Down */ +@downBorderColor: rgba(0, 0, 0, 0.3); +@downBackground: #FAFAFA; +@downColor: @textColor; +@downBoxShadow: none; + +/* Focus */ +@focusBorderColor: @focusedFormBorderColor; +@focusBackground: @background; +@focusColor: @hoveredTextColor; +@focusBoxShadow: none; + +/* Loader */ +@invertedLoaderFillColor: rgba(0, 0, 0, 0.15); + +/*------------------- + Variations +--------------------*/ + +/* Inverted */ +@transparentInvertedPlaceholderColor: @invertedUnselectedTextColor; +@transparentInvertedColor: @white; + +@miniInputSize: @relativeMini; +@tinyInputSize: @relativeTiny; +@smallInputSize: @relativeSmall; +@largeInputSize: @relativeLarge; +@bigInputSize: @relativeBig; +@hugeInputSize: @relativeHuge; +@massiveInputSize: @relativeMassive; -- cgit v1.2.3