सास, वारिस चयनकर्ता

Question

मैं सास 3.4.1 और कार्यलय उपयोग कर रहा हूँ तो मेरे एससीएसएस है:

.photo-of-the-day{ 
    &--title{ 
     font-size: 16px; 
    } 
} 

और मैं .photo-of-the-day कुछ खत्म हो गया हर बार मंडराना शीर्षक के साथ हो चाहते हैं, कि इतने आम तौर पर में बहुत आम है सीएसएस:

.photo-of-the-day:hover .photo-of-the-day--title{ 
    font-size:12px 
} 

बात कार्यलय उपयोग कर रहा है यह एक ही तरीका है मैंने पाया है और थोड़े बदसूरत लग रहा है

.photo-of-the-day{ 
    &--title{ 
     font-size: 16px; 
    } 
    &:hover{ 
     background: red; 
     /* this is ugly */ 
     .photo-of-the-day--title{ 
      text-decoration: underline; 
     } 
    } 
} 

इसलिए मैं सोच रहा था कि क्या मैं .photo-of-the-day चयनकर्ता का उत्तराधिकारी हो सकता हूं और फिर पूर्ण चयनकर्ता को कॉपी करने से बचने के लिए होवर के अंदर इसका उपयोग कर सकता हूं।

आदर्श रूप में होगा कुछ की तरह:

.photo-of-the-day{ 
    &--title{ 
     font-size: 16px; 
    } 
    &:hover{ 
     background: red; 
     &&--title{ 
      text-decoration: underline; 
     } 
    } 
} 

या कुछ कार्यलय के लिए माता-पिता चयनकर्ता के वापसी के करीब है। क्या यह संभव है?

Answer 1

तुम सब कुछ घोंसले पर जोर देते हैं, तो सबसे अच्छा तुम कर सकते हो यह है:

.photo-of-the-day { 
    $root: &; 
    &--title{ 
     font-size: 16px; 
    } 
    &:hover{ 
     #{$root}--title { 
      text-decoration: underline; 
     } 
    } 
} 

Answer 2

आप इस वाक्य विन्यास का उपयोग कर सकते हैं:

.photo-of-the-day { 
    &--title { 
     font-size: 16px; 
    } 
    &:hover &--title { 
     text-decoration: underline; 
    } 
}