स्ट्रिंग सास

Question

सास 3.2.1

में की जगह कैसे स्ट्रिंग में पाठ के कुछ हिस्से को बदलने के लिए? उदाहरण के लिए, फीफ़ेफ़ होने के लिए रंग #fefefe को डैश # से हटा दें।

धन्यवाद!

Answer 1

सरल अस्थायी समाधान (मैक के लिए मेरे मामले में):

$ git clone -b string_functions https://github.com/chriseppstein/sass 
$ cd sass 
$ sudo rake install 

$ sudo mv /usr/bin/sass /usr/bin/sass.orig 
$ sudo ln -s /Library/Ruby/Gems/1.8/gems/sass-3.2.0.alpha.0/bin/sass /usr/bin/sass 

Answer 2

यहाँ एक समारोह है कि मैं सिर्फ इस्तेमाल किया है!

एससीएसएस-फंक्शन

/// Replace `$search` with `$replace` in `$string` 
/// @author Hugo Giraudel 
/// @param {String} $string - Initial string 
/// @param {String} $search - Substring to replace 
/// @param {String} $replace ('') - New value 
/// @return {String} - Updated string 
@function str-replace($string, $search, $replace: '') { 
    $index: str-index($string, $search); 

    @if $index { 
    @return str-slice($string, 1, $index - 1) + $replace + str-replace(str-slice($string, $index + str-length($search)), $search, $replace); 
    } 

    @return $string; 
} 

एससीएसएस-उपयोग:

.selector { 
    $string: 'The answer to life the universe and everything is 42.'; 
    content: str-replace($string, 'e', 'xoxo'); 
} 

एससीएसएस-परिणाम:

.selector { 
    content: "Thxoxo answxoxor to lifxoxo thxoxo univxoxorsxoxo and xoxovxoxorything is 42."; 
} 

Source of SCSS-example

मैं इंडेंट शैली के साथ SASS का उपयोग करता हूं, इसलिए डेटा के साथ पृष्ठभूमि में प्रतिस्थापित करने के लिए रंग परिवर्तक प्राप्त करने के लिए यह मेरा रूपांतरण है: href इनलाइन एन्कोडेड सीएसएस svg-image। # को url-encoded होने की आवश्यकता है और मैं वैश्विक रंगों का उपयोग करता हूं जिन्हें केवल एक ही स्थान पर प्रतिस्थापित करने की आवश्यकता होती है और बस बस काम करें!

एस.ए.एस.एस.-फंक्शन:

@function str-replace($string, $search, $replace: '') 
    $index: str-index($string, $search) 
    @if $index 
    @return str-slice($string, 1, $index - 1) + $replace + str-replace(str-slice($string, $index + str-length($search)), $search, $replace) 
    @return $string 

एस.ए.एस.एस.-उपयोग:

$color-blue-night: #172b47  
$icon-normal: str-replace('' + $color-blue-night, '#', '') 

या एक स्पष्ट उदाहरण

.test 
    color: str-replace('' + $color-blue-night, '#', '') 

एस.ए.एस.एस.-परिणाम के लिए:

.test { 
    color: "172b47"; }