Is there a way to create a statement such as: if (CSS prop === something) then do something else

I have the following CSS properties which change the background colour of an item (let's call this item an apple):

.colour_1 {
    background-color: #677794;
    color: white;
}

.colour_2 {
    background-color: lightgreen;
}

.colour_3 {
    background-color: yellow;
}

.colour_4 {
    background-color: purple;
    color: white;
}

The following is a computed property which changes the outline colour of a different component.

highlightWhenEditing() {
    return 'highlight_when_editing';
},

This is the code which creates the card which uses the above class. It's inside of a TextField.vue component:

<v-card flat :class="`${highlightWhenEditing}`">
    <v-text-field v-model="someModel"/>
</v-card>

Here is what it looks like on the front end where each field is represented by a v-text-field:

At the moment the computed value returns highlight_when_editing which is the property:

.highlight_when_editing {
    border: 3px solid #268FCE !important;
}

However it needs to return one of the following depending on what the item's colour_... class is.

.editor_outline_colour_1 {
    border: 3px solid #677794;
    color: white;
}

.editor_outline_colour_2 {
    border: 3px solid lightgreen;
}

.editor_outline_colour_3 {
    border: 3px solid yellow;
}

.editor_outline_colour_4 {
    border: 3px solid purple;
    color: white;
}

.editor_outline_colour_5 {
    border: 3px solid peachpuff;
}

As an example, for an apple with class colour_1, then change the computed value to editor_outline_colour_1.

This is an example of how it might look in code:

highlightWhenEditing() {
if(class of apple = colour_1)
    return 'editor_outline_colour_1';
else if(class of apple = colour_2)
    return 'editor_outline_colour_2';
else if(class of apple = colour_3)
    return 'editor_outline_colour_3';
else if(class of apple = colour_4)
    return 'editor_outline_colour_4';
},

OR

for (let i = 0; i <= this.mentionsColorHighlight.length; i++) {
    let mentionsColourHighlightNumber = this.mentionsColorHighlight.slice(-1);
    return `editor_outline_colour_${mentionsColourHighlightNumber}`;
}  

mentionsColorHighlight() {
    let allColourHighlights = ['colour_1','colour_2','colour_3','colour_4','colour_5'];
    return allColourHighlights[this.arrOfObj?.filter(el => el?.type === 'flower').length % allColourHighlights.length];
},

However I'm unsure of how to write if(class of apple = colour_...)